lism-css 0.8.3 → 0.8.4

package/bin/script-build-css.js

@@ -1,6 +1,6 @@
 import buildCSS from './build-css.js';
 import buildConfig from './build-config.js';
-import { CONFIG } from '../config/index.js';
+import { CONFIG } from '../config/index.ts';
 
 await buildConfig(CONFIG);
 await buildCSS();

package/config/default-config.ts

@@ -0,0 +1,9 @@
+import TOKENS from './defaults/tokens';
+import PROPS from './defaults/props';
+import STATES from './defaults/states';
+
+export default {
+	tokens: TOKENS,
+	props: PROPS,
+	states: STATES,
+} as const;

package/config/defaults/{props.js → props.ts}

@@ -15,9 +15,9 @@
  * important: 1 → !important を付けて最終的に出力する
  */
 
-const PLACE_PRESETS = ['start', 'center', 'end'];
-const PLACE_UTILS = { 'flex-s': 'flex-start', 'flex-e': 'flex-end' };
-const PLACE_SHORTHANDS = { s: 'start', e: 'end', c: 'center', fs: 'flex-s', fe: 'flex-e' };
+const PLACE_PRESETS = ['start', 'center', 'end'] as const;
+const PLACE_UTILS = { 'flex-s': 'flex-start', 'flex-e': 'flex-end' } as const;
+const PLACE_SHORTHANDS = { s: 'start', e: 'end', c: 'center', fs: 'flex-s', fe: 'flex-e' } as const;
 
 export default {
 	f: { prop: 'font', presets: ['inherit'] },
@@ -364,4 +364,4 @@ export default {
 	float: { prop: 'float', presets: ['left', 'right'] },
 	clear: { prop: 'clear', presets: ['both'] },
 	isolation: { prop: 'isolation', presets: ['isolate'] },
-};
+} as const;

package/config/defaults/{states.js → states.ts}

@@ -25,7 +25,7 @@ export default {
 	setMask: {
 		// 'set-mask',
 		className: 'set-mask',
-		setStyles: (propVal) => {
+		setStyles: (propVal: string) => {
 			// minify化
 			// propVal = minifyHtml(propVal);
 			let imgUrl = propVal;
@@ -40,4 +40,4 @@ export default {
 	setPlain: 'set-plain',
 	// setRevert: 'set-revert',
 	setInnerRs: 'set-innerRs',
-};
+} as const;

package/config/defaults/{tokens.js → tokens.ts}

@@ -24,4 +24,4 @@ export default {
 	},
 	writing: ['vertical'],
 	flow: ['s', 'l'],
-};
+} as const;

package/config/helper/{getSvgUrl.js → getSvgUrl.ts}

@@ -1,9 +1,7 @@
-// import minifyHtml from './minifyHtml.js';
-
 /**
  * svgをcssの image url に変換
  */
-const getSvgUrl = (svg, encode = '') => {
+const getSvgUrl = (svg: string, encode = '') => {
 	if (!svg) return '';
 
 	// minify化

package/config/helper/{minifyHtml.js → minifyHtml.ts}

@@ -1,7 +1,7 @@
 /**
  * html文字列をminify
  */
-const minifyHtml = (html) => {
+const minifyHtml = (html:string) => {
 	if (!html) return '';
 
 	// 改行先に削除

package/config/helper.test.ts

@@ -0,0 +1,238 @@
+import { describe, test, expect } from 'vitest';
+import { objDeepMerge, arrayConvertToSet } from './helper.js';
+
+describe('objDeepMerge', () => {
+	test('基本的なマージが正しく動作する', () => {
+		const origin = { a: 1, b: 2 };
+		const source = { b: 3, c: 4 };
+		const result = objDeepMerge(origin, source);
+		expect(result).toEqual({ a: 1, b: 3, c: 4 });
+	});
+
+	test('ネストしたオブジェクトを深くマージする', () => {
+		const origin = { a: { b: 1, c: 2 }, d: 3 };
+		const source = { a: { b: 10, e: 5 }, f: 6 };
+		const result = objDeepMerge(origin, source);
+		expect(result).toEqual({ a: { b: 10, c: 2, e: 5 }, d: 3, f: 6 });
+	});
+
+	test('深くネストしたオブジェクトを正しくマージする', () => {
+		const origin = { a: { b: { c: 1 } } };
+		const source = { a: { b: { d: 2 } } };
+		const result = objDeepMerge(origin, source);
+		expect(result).toEqual({ a: { b: { c: 1, d: 2 } } });
+	});
+
+	test('originが空オブジェクトの場合、sourceをそのまま返す', () => {
+		const origin = {};
+		const source = { a: 1, b: 2 };
+		const result = objDeepMerge(origin, source);
+		expect(result).toEqual({ a: 1, b: 2 });
+	});
+
+	test('sourceが空オブジェクトの場合、originをそのまま返す', () => {
+		const origin = { a: 1, b: 2 };
+		const source = {};
+		const result = objDeepMerge(origin, source);
+		expect(result).toEqual({ a: 1, b: 2 });
+	});
+
+	test('originに存在しないキーが追加される', () => {
+		const origin = { a: 1 };
+		const source = { b: 2, c: 3 };
+		const result = objDeepMerge(origin, source);
+		expect(result).toEqual({ a: 1, b: 2, c: 3 });
+	});
+
+	test('値がオブジェクトから配列に上書きされる', () => {
+		const origin = { a: { b: 1 } };
+		const source = { a: [1, 2, 3] };
+		const result = objDeepMerge(origin, source);
+		expect(result).toEqual({ a: [1, 2, 3] });
+	});
+
+	test('値が配列からオブジェクトに上書きされる', () => {
+		const origin = { a: [1, 2, 3] };
+		const source = { a: { b: 1 } };
+		const result = objDeepMerge(origin, source);
+		expect(result).toEqual({ a: { b: 1 } });
+	});
+
+	test('値がプリミティブ型の場合、sourceの値で上書きされる', () => {
+		const origin = { a: 1, b: 'hello' };
+		const source = { a: 2, b: 'world' };
+		const result = objDeepMerge(origin, source);
+		expect(result).toEqual({ a: 2, b: 'world' });
+	});
+
+	test('originValueがnullまたはundefinedの場合、sourceValueを追加する', () => {
+		const origin = { a: null, b: undefined };
+		const source = { a: 1, b: 2, c: 3 };
+		const result = objDeepMerge(origin, source);
+		expect(result).toEqual({ a: 1, b: 2, c: 3 });
+	});
+
+	test('元のオブジェクトが変更されないことを確認', () => {
+		const origin = { a: 1, b: { c: 2 } };
+		const source = { b: { d: 3 } };
+		const result = objDeepMerge(origin, source);
+		expect(origin).toEqual({ a: 1, b: { c: 2 } });
+		expect(result).toEqual({ a: 1, b: { c: 2, d: 3 } });
+	});
+
+	test('複雑なネスト構造のマージ', () => {
+		const origin = {
+			level1: {
+				level2: {
+					a: 1,
+					b: 2,
+				},
+				c: 3,
+			},
+			d: 4,
+		};
+		const source = {
+			level1: {
+				level2: {
+					b: 20,
+					e: 5,
+				},
+				f: 6,
+			},
+			g: 7,
+		};
+		const result = objDeepMerge(origin, source);
+		expect(result).toEqual({
+			level1: {
+				level2: {
+					a: 1,
+					b: 20,
+					e: 5,
+				},
+				c: 3,
+				f: 6,
+			},
+			d: 4,
+			g: 7,
+		});
+	});
+});
+describe('arrayConvertToSet', () => {
+	test('配列をSetに変換する', () => {
+		const input = [1, 2, 3];
+		const result = arrayConvertToSet(input);
+		expect(result).toBeInstanceOf(Set);
+		expect(result).toEqual(new Set([1, 2, 3]));
+	});
+
+	test('重複した要素を持つ配列をSetに変換する', () => {
+		const input = [1, 2, 2, 3, 3, 3];
+		const result = arrayConvertToSet(input);
+		expect(result).toEqual(new Set([1, 2, 3]));
+	});
+
+	test('オブジェクト内の配列をSetに変換する', () => {
+		const input = { a: [1, 2, 3], b: [4, 5, 6] };
+		const result = arrayConvertToSet(input);
+		expect(result.a).toEqual(new Set([1, 2, 3]));
+		expect(result.b).toEqual(new Set([4, 5, 6]));
+	});
+
+	test('ネストしたオブジェクト内の配列をSetに変換する', () => {
+		const input = {
+			level1: {
+				level2: {
+					arr: [1, 2, 3],
+				},
+			},
+		};
+		const result = arrayConvertToSet(input);
+		expect(result.level1.level2.arr).toEqual(new Set([1, 2, 3]));
+	});
+
+	test('配列とオブジェクトが混在する場合', () => {
+		const input = {
+			a: [1, 2, 3],
+			b: {
+				c: [4, 5, 6],
+				d: 'string',
+			},
+			e: 100,
+		};
+		const result = arrayConvertToSet(input);
+		expect(result.a).toEqual(new Set([1, 2, 3]));
+		expect(result.b.c).toEqual(new Set([4, 5, 6]));
+		expect(result.b.d).toBe('string');
+		expect(result.e).toBe(100);
+	});
+
+	test('プリミティブ値はそのまま返す', () => {
+		expect(arrayConvertToSet(1)).toBe(1);
+		expect(arrayConvertToSet('string')).toBe('string');
+		expect(arrayConvertToSet(true)).toBe(true);
+		expect(arrayConvertToSet(null)).toBe(null);
+		expect(arrayConvertToSet(undefined)).toBe(undefined);
+	});
+
+	test('空配列をSetに変換する', () => {
+		const input: never[] = [];
+		const result = arrayConvertToSet(input);
+		expect(result).toEqual(new Set());
+	});
+
+	test('空オブジェクトをそのまま返す', () => {
+		const input = {};
+		const result = arrayConvertToSet(input);
+		expect(result).toEqual({});
+	});
+
+	test('深くネストしたオブジェクトと配列の変換', () => {
+		const input = {
+			a: {
+				b: {
+					c: [1, 2, 3],
+					d: {
+						e: [4, 5, 6],
+					},
+				},
+			},
+		};
+		const result = arrayConvertToSet(input);
+		expect(result.a.b.c).toEqual(new Set([1, 2, 3]));
+		expect(result.a.b.d.e).toEqual(new Set([4, 5, 6]));
+	});
+
+	test('配列内にオブジェクトがある場合（配列自体がSetになる）', () => {
+		const obj = { value: 1 };
+		const input = [obj, 2, 3];
+		const result = arrayConvertToSet(input);
+		expect(result).toEqual(new Set([obj, 2, 3]));
+	});
+
+	test('元のオブジェクトが変更されないことを確認', () => {
+		const input = { a: [1, 2, 3] };
+		const result = arrayConvertToSet(input);
+		expect(Array.isArray(input.a)).toBe(true);
+		expect(result.a).toBeInstanceOf(Set);
+	});
+
+	test('複数階層のオブジェクトと配列が混在するケース', () => {
+		const input = {
+			colors: ['red', 'blue', 'green'],
+			sizes: {
+				small: [1, 2, 3],
+				large: [10, 20, 30],
+			},
+			config: {
+				enabled: true,
+				tags: ['tag1', 'tag2'],
+			},
+		};
+		const result = arrayConvertToSet(input);
+		expect(result.colors).toEqual(new Set(['red', 'blue', 'green']));
+		expect(result.sizes.small).toEqual(new Set([1, 2, 3]));
+		expect(result.sizes.large).toEqual(new Set([10, 20, 30]));
+		expect(result.config.enabled).toBe(true);
+		expect(result.config.tags).toEqual(new Set(['tag1', 'tag2']));
+	});
+});

package/config/helper.ts

@@ -0,0 +1,79 @@
+type PlainObject = Record<string, unknown>;
+
+function isObj(value: unknown): value is PlainObject {
+	return value !== null && typeof value === 'object' && !Array.isArray(value);
+}
+
+type DeepMergeResult<T, U> = T extends PlainObject
+	? U extends PlainObject
+		? {
+				[K in keyof T | keyof U]: K extends keyof U
+					? K extends keyof T
+						? DeepMergeResult<T[K], U[K]>
+						: U[K]
+					: K extends keyof T
+						? T[K]
+						: never;
+			}
+		: T
+	: U extends PlainObject
+		? U
+		: T;
+
+/**
+ * 深いマージを行う関数
+ * @param origin - マージ先となる元オブジェクト
+ * @param source - マージするソース（このデータに更新される）
+ * @returns マージされたオブジェクト
+ */
+export function objDeepMerge<T extends Record<string, unknown>, U extends Record<string, unknown>>(origin: T, source: U): DeepMergeResult<T, U> {
+	const result = { ...origin } as Record<string, unknown>;
+
+	for (const key in source) {
+		if (Object.hasOwn(source, key)) {
+			const originValue = result[key];
+			const sourceValue = (source as Record<string, unknown>)[key];
+
+			if (!originValue) {
+				// origin側に存在しない新たなキーの場合はそのまま追加する
+				result[key] = sourceValue;
+			} else if (isObj(sourceValue) && isObj(originValue)) {
+				// どちらもオブジェクトの場合は再帰的にマージ
+				result[key] = objDeepMerge(originValue, sourceValue);
+			} else {
+				// どちらかのデータがobjectではない場合、そのまま上書き
+				result[key] = sourceValue;
+			}
+		}
+	}
+
+	return result as DeepMergeResult<T, U>;
+}
+
+type DeepArrayToSet<T> = T extends unknown[] ? Set<T[number]> : T extends PlainObject ? { [K in keyof T]: DeepArrayToSet<T[K]> } : T;
+
+/**
+ * オブジェクト内の配列を再帰的にSetに変換する関数
+ * @param obj - 変換対象のオブジェクト
+ * @returns 変換されたオブジェクト
+ */
+export function arrayConvertToSet<T>(obj: T): DeepArrayToSet<T> {
+	// 配列の場合はSetに変換
+	if (Array.isArray(obj)) {
+		return new Set(obj) as DeepArrayToSet<T>;
+	}
+
+	// オブジェクトの場合は再帰的に処理
+	if (isObj(obj)) {
+		const result: Record<string, unknown> = {};
+		for (const key in obj) {
+			if (Object.hasOwn(obj, key)) {
+				result[key] = arrayConvertToSet(obj[key]);
+			}
+		}
+		return result as DeepArrayToSet<T>;
+	}
+
+	// その他の値はそのまま返す
+	return obj as DeepArrayToSet<T>;
+}

package/config/{index.js → index.ts}

@@ -1,6 +1,11 @@
-import defaultConfig from './default-config.js';
+import defaultConfig from './default-config';
 import userConfig from 'lism-css/config.js'; // ユーザーが上書きできる
-import { objDeepMerge, arrayConvertToSet } from './helper.js';
+import { objDeepMerge, arrayConvertToSet } from './helper';
+
+interface Window {
+	_LISM_CSS_CONFIG_: Partial<typeof defaultConfig>;
+}
+declare const window: Window;
 
 // ビルド時の設定をマージ
 let mergedConfig = objDeepMerge(defaultConfig, userConfig);
@@ -14,10 +19,18 @@ export const CONFIG = mergedConfig;
 
 const { tokens, props, states } = CONFIG;
 
+const tokensWithColor = {
+	color: [...tokens.c.values, ...tokens.palette.values],
+	...tokens,
+} as const;
+
 // 配列を Set化.
-export const TOKENS = arrayConvertToSet(structuredClone(tokens));
+export const TOKENS = arrayConvertToSet(structuredClone(tokensWithColor));
 export const PROPS = arrayConvertToSet(structuredClone(props));
+
+// STATES は objDeepMerge の型推論により literal types が保持される
 export const STATES = states;
 
 // ブレイクポイント
-export const BREAK_POINTS = ['sm', 'md', 'lg', 'xl'];
+export const BREAK_POINTS = ['sm', 'md', 'lg', 'xl'] as const;
+export const BREAK_POINTS_ALL = ['base', ...BREAK_POINTS] as const;

package/config/tsconfig.json

@@ -0,0 +1,18 @@
+{
+	"extends": "../tsconfig.json",
+	"compilerOptions": {
+		"declaration": true,
+		"declarationMap": false,
+		"declarationDir": "../dist/config",
+		"emitDeclarationOnly": true,
+		"outDir": "../dist/config",
+		"rootDir": ".",
+		"composite": false,
+		"baseUrl": "..",
+		"paths": {
+			"lism-css/config.js": ["./config.js"]
+		}
+	},
+	"include": ["./**/*.ts"],
+	"exclude": ["**/*.test.ts"]
+}

package/config.d.ts

@@ -0,0 +1,2 @@
+declare const _default: {};
+export default _default;

package/config.js

@@ -1,2 +1,2 @@
 // ユーザーのプロジェクトファイルから上書きできる設定
-export default {};
+export default /** @type {const} */ ({});

package/dist/components/Box/Box.d.ts

@@ -1 +1,4 @@
-export default function Box(props: any): import("react").JSX.Element;
+import { ElementType } from 'react';
+import { LayoutComponentProps } from '../Lism';
+import { BoxProps } from '../../lib/types/LayoutProps';
+export default function Box<T extends ElementType = 'div'>(props: LayoutComponentProps<T, BoxProps>): import("react").JSX.Element;

package/dist/components/Box/index.d.ts

@@ -1 +1 @@
-export { default as Box } from './Box.jsx';
+export { default as Box } from './Box';

package/dist/components/Center/Center.d.ts

@@ -1 +1,4 @@
-export default function Center(props: any): import("react").JSX.Element;
+import { ElementType } from 'react';
+import { LayoutComponentProps } from '../Lism';
+import { CenterProps } from '../../lib/types/LayoutProps';
+export default function Center<T extends ElementType = 'div'>(props: LayoutComponentProps<T, CenterProps>): import("react").JSX.Element;

package/dist/components/Center/index.d.ts

@@ -1 +1 @@
-export { default as Center } from './Center.jsx';
+export { default as Center } from './Center';

package/dist/components/Cluster/Cluster.d.ts

@@ -1 +1,4 @@
-export default function Flex(props: any): import("react").JSX.Element;
+import { ElementType } from 'react';
+import { LayoutComponentProps } from '../Lism';
+import { ClusterProps } from '../../lib/types/LayoutProps';
+export default function Cluster<T extends ElementType = 'div'>(props: LayoutComponentProps<T, ClusterProps>): import("react").JSX.Element;

package/dist/components/Cluster/index.js

@@ -1,8 +1,8 @@
 import { jsx as t } from "react/jsx-runtime";
 import o from "../Lism/index.js";
-function u(r) {
+function m(r) {
   return /* @__PURE__ */ t(o, { layout: "cluster", ...r });
 }
 export {
-  u as default
+  m as default
 };

package/dist/components/Columns/Columns.d.ts

@@ -1 +1,4 @@
-export default function Columns(props: any): import("react").JSX.Element;
+import { ElementType } from 'react';
+import { LayoutComponentProps } from '../Lism';
+import { ColumnsProps } from '../../lib/types/LayoutProps';
+export default function Columns<T extends ElementType = 'div'>(props: LayoutComponentProps<T, ColumnsProps>): import("react").JSX.Element;

package/dist/components/Container/Container.d.ts

@@ -1,4 +1,6 @@
-export default function Container({ size, ...props }: {
-    [x: string]: any;
-    size: any;
-}): import("react").JSX.Element;
+import { LismComponentProps } from '../Lism';
+type ContainerProps = LismComponentProps & {
+    size?: LismComponentProps['isWrapper'];
+};
+export default function Container({ size, ...props }: ContainerProps): import("react").JSX.Element;
+export {};

package/dist/components/Dummy/Dummy.d.ts

@@ -1,8 +1,10 @@
-export default function Dummy({ tag, pre, length, lang, offset, ...props }: {
-    [x: string]: any;
-    tag?: string | undefined;
-    pre?: string | undefined;
-    length?: string | undefined;
-    lang?: string | undefined;
-    offset?: number | undefined;
-}): import("react").JSX.Element;
+import { ElementType } from 'react';
+import { LismComponentProps } from '../Lism';
+type DummyProps<T extends ElementType = 'p'> = LismComponentProps<T> & {
+    pre?: string;
+    length?: string;
+    lang?: 'ja' | 'en' | 'ar';
+    offset?: number;
+};
+export default function Dummy<T extends ElementType = 'p'>({ pre, length, lang, offset, ...props }: DummyProps<T>): import("react").JSX.Element;
+export {};

package/dist/components/Dummy/getContent.d.ts

@@ -1,7 +1,13 @@
-export default function getContent({ tag, pre, length, lang, offset }: {
-    tag?: string | undefined;
-    pre?: string | undefined;
-    length?: string | undefined;
-    lang?: string | undefined;
-    offset?: number | undefined;
-}): any;
+import { ElementType } from 'react';
+import { default as TEXTS } from './texts';
+type Lang = keyof typeof TEXTS;
+type Length = string;
+interface GetContentOptions {
+    tag?: ElementType;
+    pre?: string;
+    length?: Length;
+    lang?: Lang;
+    offset?: number;
+}
+export default function getContent({ tag, pre, length, lang, offset }: GetContentOptions): string;
+export {};

package/dist/components/Dummy/getContent.js

@@ -1,9 +1,10 @@
-import s from "./texts.js";
-const o = (e) => e.split(/([,.、。])/).filter((i) => i !== "").reduce((i, r, n, l) => (n % 2 === 0 && i.push(r + (l[n + 1] || "")), i), []);
-function c({ tag: e = "p", pre: i = "", length: r = "m", lang: n = "en", offset: l = 0 }) {
-  let t = s[n][r] || "";
-  return e === "ul" || e === "ol" ? (t = o(t).map((u) => `<li>${u.trim()}</li>`).join(""), i && (t = `<li>${i}</li>` + t)) : (l && (t = o(t).slice(l).join("").trim(), t = t.charAt(0).toUpperCase() + t.slice(1)), i && (t = i + t)), t;
+import c from "./texts.js";
+const u = (n) => n.split(/([,.、。])/).filter((i) => i !== "").reduce((i, o, e, l) => (e % 2 === 0 && i.push(o + (l[e + 1] || "")), i), []);
+function m({ tag: n = "p", pre: i = "", length: o = "m", lang: e = "en", offset: l = 0 }) {
+  const r = c[e];
+  let t = (r == null ? void 0 : r[o]) || "";
+  return n === "ul" || n === "ol" ? (t = u(t).map((s) => `<li>${s.trim()}</li>`).join(""), i && (t = `<li>${i}</li>` + t)) : (l && (t = u(t).slice(l).join("").trim(), t = t.charAt(0).toUpperCase() + t.slice(1)), i && (t = i + t)), t;
 }
 export {
-  c as default
+  m as default
 };

package/dist/components/Dummy/index.js

@@ -1,12 +1,13 @@
 import { jsx as n } from "react/jsx-runtime";
-import u from "./getContent.js";
+import s from "./getContent.js";
 import e from "../Lism/index.js";
-function h({ tag: t = "p", pre: r = "", length: i = "m", lang: o = "en", offset: s = 0, ...m }) {
-  if (t === "img")
-    return /* @__PURE__ */ n(e, { tag: "img", src: "https://cdn.lism-css.com/dummy-image.jpg", width: "600", height: "400", alt: "", ...m });
-  const c = u({ tag: t, pre: r, lang: o, length: i, offset: s });
-  return /* @__PURE__ */ n(e, { tag: t, ...m, dangerouslySetInnerHTML: { __html: c } });
+function d({ pre: i = "", length: a = "m", lang: o = "en", offset: r = 0, ...t }) {
+  const m = t.as || t.tag || "p";
+  if (m === "img")
+    return /* @__PURE__ */ n(e, { as: "img", src: "https://cdn.lism-css.com/dummy-image.jpg", width: 600, height: 400, alt: "", ...t });
+  const g = s({ tag: m, pre: i, lang: o, length: a, offset: r });
+  return /* @__PURE__ */ n(e, { ...t, dangerouslySetInnerHTML: { __html: g } });
 }
 export {
-  h as default
+  d as default
 };

package/dist/components/Flex/Flex.d.ts

@@ -1 +1,4 @@
-export default function Flex(props: any): import("react").JSX.Element;
+import { ElementType } from 'react';
+import { LayoutComponentProps } from '../Lism';
+import { FlexProps } from '../../lib/types/LayoutProps';
+export default function Flex<T extends ElementType = 'div'>(props: LayoutComponentProps<T, FlexProps>): import("react").JSX.Element;

package/dist/components/Flow/Flow.d.ts

@@ -1 +1,4 @@
-export default function Flow(props: any): import("react").JSX.Element;
+import { ElementType } from 'react';
+import { LayoutComponentProps } from '../Lism';
+import { FlowLayoutProps } from '../../lib/types/LayoutProps';
+export default function Flow<T extends ElementType = 'div'>(props: LayoutComponentProps<T, FlowLayoutProps>): import("react").JSX.Element;

package/dist/components/Flow/index.d.ts

@@ -1 +1 @@
-export { default as Flow } from './Flow.jsx';
+export { default as Flow } from './Flow';

package/dist/components/FluidCols/FluidCols.d.ts

@@ -1 +1,4 @@
-export default function FluidCols(props: any): import("react").JSX.Element;
+import { ElementType } from 'react';
+import { LayoutComponentProps } from '../Lism';
+import { FluidColsProps } from '../../lib/types/LayoutProps';
+export default function FluidCols<T extends ElementType = 'div'>(props: LayoutComponentProps<T, FluidColsProps>): import("react").JSX.Element;

package/dist/components/Frame/Frame.d.ts

@@ -1 +1,4 @@
-export default function Frame(props: any): import("react").JSX.Element;
+import { ElementType } from 'react';
+import { LayoutComponentProps } from '../Lism';
+import { FrameProps } from '../../lib/types/LayoutProps';
+export default function Frame<T extends ElementType = 'div'>(props: LayoutComponentProps<T, FrameProps>): import("react").JSX.Element;

package/dist/components/Grid/Grid.d.ts

@@ -1 +1,4 @@
-export default function Grid(props: any): import("react").JSX.Element;
+import { ElementType } from 'react';
+import { LayoutComponentProps } from '../Lism';
+import { GridLayoutProps } from '../../lib/types/LayoutProps';
+export default function Grid<T extends ElementType = 'div'>(props: LayoutComponentProps<T, GridLayoutProps>): import("react").JSX.Element;