archived/supMDX-components
1
0
Fork 0
Code Issues Pull requests Activity

init

Browse source
This commit is contained in:
sup39 2023-02-17 02:58:28 +09:00
commit 6867a06fc5
17 changed files with 2934 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.gitignore vendored Normal file
View file

@ -0,0 +1 @@
node_modules/

21
LICENSE Normal file
View file

@ -0,0 +1,21 @@
MIT License
Copyright (c) 2023 sup39
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

2
README.md Normal file
View file

@ -0,0 +1,2 @@
# supMDX-components
MDX utilitiy components for supMDX

6
dist/heading.d.ts vendored Normal file
View file

@ -0,0 +1,6 @@
import React from 'react';
declare const hx: readonly ["h1", "h2", "h3", "h4", "h5", "h6"];
export declare const anchoredHx: {
[k: string]: ({ children, id, ...props }: React.ComponentProps<(typeof hx)[number]>) => JSX.Element;
};
export {};

6
dist/index.d.ts vendored Normal file
View file

@ -0,0 +1,6 @@
/// <reference types="react" />
export * from './heading';
export * from './tag';
export declare const components: {
[x: string]: ({ children, id, ...props }: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>) => JSX.Element;
};

110
dist/index.esm.js vendored Normal file
View file

@ -0,0 +1,110 @@
import React from 'react';
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */
var __assign = function() {
__assign = Object.assign || function __assign(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
function __rest(s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
}
var hx = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
var anchoredHx = Object.fromEntries(hx.map(function (H) { return [
H,
function (_a) {
var children = _a.children, id = _a.id, props = __rest(_a, ["children", "id"]);
return (React.createElement(H, __assign({}, __assign({ id: id }, props)),
id && React.createElement("a", { className: "anchor", href: '#' + encodeURIComponent(id) }),
children));
},
]; }));
var AttrProxyHandler = {
get: function (_a, modifier) {
var _b;
var tagName = _a.tagName, attrs = _a.attrs;
var extra;
if (typeof modifier === 'symbol') {
extra = {};
}
else if (modifier.startsWith('#')) {
// #id
extra = { id: modifier.slice(1) };
}
else if (modifier.includes('=')) {
// attr=value
var idx = modifier.indexOf('=');
extra = (_b = {}, _b[modifier.slice(0, idx)] = modifier.slice(idx + 1), _b);
}
else {
// .class
extra = { class: attrs.class ? attrs.class + ' ' + modifier : modifier };
}
// apply
return new Proxy(Object.assign(function () { }, { tagName: tagName, attrs: __assign(__assign({}, attrs), extra) }), AttrProxyHandler);
},
apply: function (_a, thisArg, args) {
var tagName = _a.tagName, _b = _a.attrs, className = _b.class, htmlFor = _b.for, style = _b.style, attrs = __rest(_b, ["class", "for", "style"]);
var s = args[0], argv = args.slice(1);
var children = s instanceof Array ?
s[0] + argv.map(function (e, i) { return "".concat(e).concat(s[i + 1]); }).join('') : s;
return React.createElement(tagName, __assign(__assign({ className: className, htmlFor: htmlFor }, (style == null ? {} : {
style: Object.fromEntries(style.split(';').flatMap(function (line) {
var idx = line.indexOf(':');
if (idx < 0)
return [];
var key0 = line.slice(0, idx);
var value = line.slice(idx + 1);
// kebab-case to camelCase
var ktoks = key0.split('-');
var key = ktoks[0] + ktoks.slice(1).map(function (s) { return s[0].toUpperCase() + s.slice(1); }).join('');
return [[key, value]];
})),
})), attrs), children);
},
};
var TagProxyHandler = {
get: function (self, arg) {
var tagName = arg.toString();
return new Proxy(Object.assign(function () { }, { tagName: tagName, attrs: {} }), AttrProxyHandler);
},
};
var T = new Proxy({}, TagProxyHandler);
var S = T.span;
var C = T.code;
var tags = { T: T, S: S, C: C };
var components = __assign({}, anchoredHx);
export { AttrProxyHandler, C, S, T, TagProxyHandler, anchoredHx, components, tags };
//# sourceMappingURL=index.esm.js.map

1
dist/index.esm.js.map vendored Normal file
View file

File diff suppressed because one or more lines are too long

119
dist/index.js vendored Normal file
View file

@ -0,0 +1,119 @@
'use strict';
var React = require('react');
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */
var __assign = function() {
__assign = Object.assign || function __assign(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
function __rest(s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
}
var hx = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
var anchoredHx = Object.fromEntries(hx.map(function (H) { return [
H,
function (_a) {
var children = _a.children, id = _a.id, props = __rest(_a, ["children", "id"]);
return (React.createElement(H, __assign({}, __assign({ id: id }, props)),
id && React.createElement("a", { className: "anchor", href: '#' + encodeURIComponent(id) }),
children));
},
]; }));
var AttrProxyHandler = {
get: function (_a, modifier) {
var _b;
var tagName = _a.tagName, attrs = _a.attrs;
var extra;
if (typeof modifier === 'symbol') {
extra = {};
}
else if (modifier.startsWith('#')) {
// #id
extra = { id: modifier.slice(1) };
}
else if (modifier.includes('=')) {
// attr=value
var idx = modifier.indexOf('=');
extra = (_b = {}, _b[modifier.slice(0, idx)] = modifier.slice(idx + 1), _b);
}
else {
// .class
extra = { class: attrs.class ? attrs.class + ' ' + modifier : modifier };
}
// apply
return new Proxy(Object.assign(function () { }, { tagName: tagName, attrs: __assign(__assign({}, attrs), extra) }), AttrProxyHandler);
},
apply: function (_a, thisArg, args) {
var tagName = _a.tagName, _b = _a.attrs, className = _b.class, htmlFor = _b.for, style = _b.style, attrs = __rest(_b, ["class", "for", "style"]);
var s = args[0], argv = args.slice(1);
var children = s instanceof Array ?
s[0] + argv.map(function (e, i) { return "".concat(e).concat(s[i + 1]); }).join('') : s;
return React.createElement(tagName, __assign(__assign({ className: className, htmlFor: htmlFor }, (style == null ? {} : {
style: Object.fromEntries(style.split(';').flatMap(function (line) {
var idx = line.indexOf(':');
if (idx < 0)
return [];
var key0 = line.slice(0, idx);
var value = line.slice(idx + 1);
// kebab-case to camelCase
var ktoks = key0.split('-');
var key = ktoks[0] + ktoks.slice(1).map(function (s) { return s[0].toUpperCase() + s.slice(1); }).join('');
return [[key, value]];
})),
})), attrs), children);
},
};
var TagProxyHandler = {
get: function (self, arg) {
var tagName = arg.toString();
return new Proxy(Object.assign(function () { }, { tagName: tagName, attrs: {} }), AttrProxyHandler);
},
};
var T = new Proxy({}, TagProxyHandler);
var S = T.span;
var C = T.code;
var tags = { T: T, S: S, C: C };
var components = __assign({}, anchoredHx);
exports.AttrProxyHandler = AttrProxyHandler;
exports.C = C;
exports.S = S;
exports.T = T;
exports.TagProxyHandler = TagProxyHandler;
exports.anchoredHx = anchoredHx;
exports.components = components;
exports.tags = tags;
//# sourceMappingURL=index.js.map

1
dist/index.js.map vendored Normal file
View file

File diff suppressed because one or more lines are too long

20
dist/tag.d.ts vendored Normal file
View file

@ -0,0 +1,20 @@
import React from 'react';
export type TagFactory = {
[modifier: string]: TagFactory;
(children: React.ReactNode): JSX.Element;
(s: TemplateStringsArray, ...argv: any[]): JSX.Element;
};
export type TagInfo = {
tagName: string;
attrs: Record<string, string>;
};
export declare const AttrProxyHandler: ProxyHandler<TagInfo>;
export declare const TagProxyHandler: ProxyHandler<Record<string, TagFactory>>;
export declare const T: Record<string, TagFactory>;
export declare const S: TagFactory;
export declare const C: TagFactory;
export declare const tags: {
T: Record<string, TagFactory>;
S: TagFactory;
C: TagFactory;
};

48
package.json Normal file
View file

@ -0,0 +1,48 @@
{
"name": "@sup39/mdx-components",
"version": "0.1.0",
"author": "sup39 <dev@sup39.dev>",
"repository": "github.com:sup39/supMDX-components",
"description": "MDX utilitiy components for supMDX",
"license": "MIT",
"main": "dist/index.js",
"module": "dist/index.esm.js",
"files": [
"dist/*"
],
"scripts": {
"build": "rollup -c",
"lint": "eslint --ext .ts --ext .tsx src/",
"pre-commit:add": "git add -u"
},
"eslintConfig": {
"env": {
"es6": true
},
"extends": [
"@sup39/typescript"
]
},
"devDependencies": {
"@babel/core": "^7.20.12",
"@babel/preset-env": "^7.20.2",
"@babel/preset-react": "^7.18.6",
"@rollup/plugin-babel": "^6.0.3",
"@rollup/plugin-node-resolve": "^15.0.1",
"@rollup/plugin-typescript": "^11.0.0",
"@sup39/eslint-config-typescript": "^0.1.5",
"@types/react": "^18.0.28",
"eslint": "^8.34.0",
"pre-commit": "^1.2.2",
"rollup": "^3.15.0",
"typescript": "^4.9.5"
},
"pre-commit": [
"lint",
"build",
"pre-commit:add"
],
"peerDependencies": {
"react": "^18"
}
}

32
rollup.config.mjs Normal file
View file

@ -0,0 +1,32 @@
import typescript from '@rollup/plugin-typescript';
import babel from '@rollup/plugin-babel';
import resolve from '@rollup/plugin-node-resolve';
export default {
input: 'src/index.tsx',
output: [
{
file: 'dist/index.js',
format: 'cjs',
sourcemap: true,
},
{
file: 'dist/index.esm.js',
format: 'esm',
sourcemap: true,
},
],
plugins: [
resolve(),
typescript(),
babel({
babelHelpers: 'bundled',
presets: [
['@babel/preset-env', {targets: {node: 'current'}}],
'@babel/preset-react',
],
exclude: 'node_modules/**',
}),
],
external: ['react', 'react-dom'],
};

12
src/heading.tsx Normal file
View file

@ -0,0 +1,12 @@
import React from 'react';
const hx = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] as const;
export const anchoredHx = Object.fromEntries(hx.map(H => [
H,
({children, id, ...props}: React.ComponentProps<(typeof hx)[number]>) => (
<H {...{id, ...props}}>
{id && <a className="anchor" href={'#'+encodeURIComponent(id)} />}
{children}
</H>
),
]));

5
src/index.tsx Normal file
View file

@ -0,0 +1,5 @@
export * from './heading';
export * from './tag';
import {anchoredHx} from './heading';
export const components = {...anchoredHx};

79
src/tag.tsx Normal file
View file

@ -0,0 +1,79 @@
import React from 'react';
export type TagFactory = {
[modifier: string]: TagFactory
(children: React.ReactNode): JSX.Element
(s: TemplateStringsArray, ...argv: any[]): JSX.Element
};
export type TagInfo = {
tagName: string
attrs: Record<string, string>
};
export const AttrProxyHandler: ProxyHandler<TagInfo> = {
get({tagName, attrs}, modifier) {
let extra: TagInfo['attrs'];
if (typeof modifier === 'symbol') {
extra = {};
} else if (modifier.startsWith('#')) {
// #id
extra = {id: modifier.slice(1)};
} else if (modifier.includes('=')) {
// attr=value
const idx = modifier.indexOf('=');
extra = {[modifier.slice(0, idx)]: modifier.slice(idx+1)};
} else {
// .class
extra = {class: attrs.class ? attrs.class+' '+modifier : modifier};
}
// apply
return new Proxy(
Object.assign(()=>{}, {tagName, attrs: {...attrs, ...extra}}),
AttrProxyHandler,
);
},
apply({
tagName,
attrs: {class: className, for: htmlFor, style, ...attrs},
}, thisArg, args) {
const [s, ...argv] = args;
const children = s instanceof Array ?
s[0]+argv.map((e, i) => `${e}${s[i+1]}`).join('') : s;
return React.createElement(
tagName,
{
className,
htmlFor,
...(style == null ? {} : {
style: Object.fromEntries(style.split(';').flatMap(line => {
const idx = line.indexOf(':');
if (idx < 0) return [];
const key0 = line.slice(0, idx);
const value = line.slice(idx+1);
// kebab-case to camelCase
const ktoks = key0.split('-');
const key = ktoks[0] + ktoks.slice(1).map(s => s[0].toUpperCase()+s.slice(1)).join('');
return [[key, value]];
})),
}),
...attrs,
},
children,
);
},
};
export const TagProxyHandler: ProxyHandler<Record<string, TagFactory>> = {
get(self, arg) {
const tagName = arg.toString();
return new Proxy(
Object.assign(()=>{}, {tagName, attrs: {}}),
AttrProxyHandler,
);
},
};
export const T = new Proxy({}, TagProxyHandler);
export const S = T.span;
export const C = T.code;
export const tags = {T, S, C};

26
tsconfig.json Normal file
View file

@ -0,0 +1,26 @@
{
"compilerOptions": {
"target": "es5",
"module": "es6",
"outDir": "dist",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"skipLibCheck": true,
"strict": true,
"declaration": true,
"moduleResolution": "node",
"esModuleInterop": true,
"sourceMap": true,
"jsx": "react"
},
"include": [
"src/*.ts",
"src/*.tsx"
],
"exclude": [
"node_modules"
]
}

2445
yarn.lock Normal file
View file

File diff suppressed because it is too large Load diff