@health-samurai/react-components 0.0.0-alpha.5 → 0.0.0-alpha.7

package/dist/src/components/code-editor.stories.js

@@ -1,4 +1,6 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from "react";
+import { Input } from "../shadcn/components/ui/input.js";
 import { CodeEditor } from "./code-editor/index.js";
 const meta = {
     title: "Component/Editor",
@@ -36,5 +38,254 @@ export const Default = {
             })
         })
 };
+function parse(query) {
+    let hi = 0;
+    let lo = 0;
+    const res = {
+        method: "",
+        methodTrivia: "",
+        path: "",
+        pathTrivia: "",
+        headers: [],
+        headersTrivia: ""
+    };
+    // Note that we iterate by code units, but it doesn't change correctness.
+    // method
+    for(hi = 0; hi < query.length; ++hi){
+        const c = query[hi];
+        if (c === " " || c === "\t" || c === "\n") {
+            break;
+        }
+    }
+    res.method = query.substring(lo, hi);
+    lo = hi;
+    if (lo >= query.length) {
+        return res;
+    }
+    // method trivia
+    for(hi = lo; hi < query.length; ++hi){
+        const c = query[hi];
+        if (!(c === " " || c === "\t")) {
+            break;
+        }
+    }
+    res.methodTrivia = query.substring(lo, hi);
+    lo = hi;
+    if (lo >= query.length) {
+        return res;
+    }
+    // path
+    for(hi = lo; hi < query.length; ++hi){
+        const c = query[hi];
+        if (c === "\n") {
+            break;
+        }
+    }
+    res.path = query.substring(lo, hi);
+    lo = hi;
+    if (lo >= query.length) {
+        return res;
+    }
+    // path trivia
+    if (query[hi] === "\n") {
+        hi += 1;
+        res.pathTrivia = query.substring(lo, hi);
+    }
+    lo = hi;
+    if (lo >= query.length) {
+        return res;
+    }
+    // headers
+    let header = {
+        name: "",
+        nameTrivia: "",
+        value: "",
+        valueTrivia: ""
+    };
+    let headerReady = false;
+    // SAFETY: don't decrease hi inside this loop.
+    for(hi = lo; hi < query.length; ++hi){
+        if (headerReady) {
+            res.headers.push(header);
+        }
+        header = {
+            name: "",
+            nameTrivia: "",
+            value: "",
+            valueTrivia: ""
+        };
+        headerReady = false;
+        if (query[hi] === "\n") {
+            break;
+        }
+        // header name
+        for(lo = hi; hi <= query.length; ++hi){
+            const c = query[hi];
+            if (c === " " || c === "\t" || c === "\n" || c === ":") {
+                break;
+            }
+        }
+        headerReady = true;
+        header.name = query.substring(lo, hi);
+        lo = hi;
+        if (lo >= query.length) {
+            break;
+        }
+        // header name trivia
+        let colonFound = false;
+        for(lo = hi; hi <= query.length; ++hi){
+            const c = query[hi];
+            if (c === ":" && !colonFound) {
+                colonFound = true;
+            } else if (!(c === " " || c === "\t")) {
+                break;
+            }
+        }
+        header.nameTrivia = query.substring(lo, hi);
+        lo = hi;
+        if (lo >= query.length) {
+            break;
+        }
+        // header value
+        for(hi = lo; hi < query.length; ++hi){
+            const c = query[hi];
+            if (c === "\n") {
+                break;
+            }
+        }
+        header.value = query.substring(lo, hi);
+        lo = hi;
+        if (lo >= query.length) {
+            break;
+        }
+        // header value trivia
+        if (query[hi] === "\n") {
+            header.valueTrivia = query.substring(lo, hi + 1);
+        }
+        lo = hi + 1;
+        if (lo >= query.length) {
+            break;
+        }
+    }
+    if (headerReady) {
+        res.headers.push(header);
+    }
+    if (query[hi] === "\n") {
+        res.headersTrivia = query.substring(lo, hi + 1);
+    }
+    return res;
+}
+const MethodInput = /*#__PURE__*/ React.memo(function MethodInput({ method, onMethodChange }) {
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "flex justify-center items-baseline",
+        children: [
+            "Method:",
+            /*#__PURE__*/ _jsx(Input, {
+                type: "text",
+                className: "inline",
+                value: method,
+                onChange: onMethodChange
+            })
+        ]
+    });
+});
+const PathInput = /*#__PURE__*/ React.memo(function PathInput({ path, onPathChange }) {
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "flex justify-center items-baseline",
+        children: [
+            "Path: ",
+            /*#__PURE__*/ _jsx(Input, {
+                type: "text",
+                className: "inline",
+                value: path,
+                onChange: onPathChange
+            })
+        ]
+    });
+});
+function ComplexComp() {
+    const [rawQuery, setRawQuery] = React.useState("");
+    const parsed = React.useMemo(()=>parse(rawQuery), [
+        rawQuery
+    ]);
+    const parsedRef = React.useRef(parsed);
+    React.useEffect(()=>{
+        parsedRef.current = parsed;
+    }, [
+        parsed
+    ]);
+    const method = React.useMemo(()=>parsed.method, [
+        parsed.method
+    ]);
+    const path = React.useMemo(()=>parsed.path, [
+        parsed.path
+    ]);
+    const viewRef = React.useRef(null);
+    const onMethodChange = React.useCallback((ev)=>{
+        let newVal = ev.target.value;
+        if (newVal.indexOf(" ") !== -1) {
+            newVal = newVal.replaceAll(" ", "").replaceAll("\t", "");
+        }
+        const view = viewRef.current;
+        if (view === null) {
+            return null;
+        }
+        const from = 0;
+        const to = parsedRef.current.method.length;
+        view.dispatch({
+            changes: {
+                from: from,
+                to: to,
+                insert: newVal
+            }
+        });
+    }, []);
+    const onPathChange = React.useCallback((ev)=>{
+        const newVal = ev.target.value;
+        const view = viewRef.current;
+        if (view === null) {
+            return null;
+        }
+        const from = parsedRef.current.method.length + parsedRef.current.methodTrivia.length;
+        const to = from + parsedRef.current.path.length;
+        console.log(from, to);
+        view.dispatch({
+            changes: {
+                from: from,
+                to: to,
+                insert: newVal
+            }
+        });
+    }, []);
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(MethodInput, {
+                method: method,
+                onMethodChange: onMethodChange
+            }),
+            /*#__PURE__*/ _jsx(PathInput, {
+                path: path,
+                onPathChange: onPathChange
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                className: "h-[500px] w-[500px] border-black border-2",
+                children: /*#__PURE__*/ _jsx(CodeEditor, {
+                    mode: "http",
+                    onUpdate: (update)=>{
+                        if (update.docChanged) {
+                            setRawQuery(update.state.doc.toString());
+                        }
+                    },
+                    viewCallback: (view)=>{
+                        viewRef.current = view;
+                    }
+                })
+            })
+        ]
+    });
+}
+export const Complex = {
+    render: ()=>ComplexComp()
+};
 
 //# sourceMappingURL=code-editor.stories.js.map

package/dist/src/components/code-editor.stories.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/code-editor.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react-vite\";\nimport { CodeEditor } from \"./code-editor\";\n\nconst meta: Meta<typeof CodeEditor> = {\n\ttitle: \"Component/Editor\",\n\tcomponent: CodeEditor,\n\tparameters: {\n\t\tlayout: \"centered\",\n\t},\n\ttags: [\"autodocs\"],\n};\n\nexport default meta;\ntype Story = StoryObj<typeof CodeEditor>;\n\nexport const Default: Story = {\n\targs: {\n\t\tdefaultValue: JSON.stringify(\n\t\t\t{\n\t\t\t\tresourceType: \"Patient\",\n\t\t\t\tmeta: { versionId: 10 },\n\t\t\t\tgender: \"male\",\n\t\t\t\tname: [{ family: \"Doe\", given: [\"John\"] }],\n\t\t\t},\n\t\t\tnull,\n\t\t\t2,\n\t\t),\n\t},\n\trender: () => (\n\t\t<div className=\"h-[500px] w-[500px]\">\n\t\t\t<CodeEditor mode=\"http\" />\n\t\t</div>\n\t),\n};\n"],"names":["CodeEditor","meta","title","component","parameters","layout","tags","Default","args","defaultValue","JSON","stringify","resourceType","versionId","gender","name","family","given","render","div","className","mode"],"mappings":";AACA,SAASA,UAAU,QAAQ,yBAAgB;AAE3C,MAAMC,OAAgC;IACrCC,OAAO;IACPC,WAAWH;IACXI,YAAY;QACXC,QAAQ;IACT;IACAC,MAAM;QAAC;KAAW;AACnB;AAEA,eAAeL,KAAK;AAGpB,OAAO,MAAMM,UAAiB;IAC7BC,MAAM;QACLC,cAAcC,KAAKC,SAAS,CAC3B;YACCC,cAAc;YACdX,MAAM;gBAAEY,WAAW;YAAG;YACtBC,QAAQ;YACRC,MAAM;gBAAC;oBAAEC,QAAQ;oBAAOC,OAAO;wBAAC;qBAAO;gBAAC;aAAE;QAC3C,GACA,MACA;IAEF;IACAC,QAAQ,kBACP,KAACC;YAAIC,WAAU;sBACd,cAAA,KAACpB;gBAAWqB,MAAK;;;AAGpB,EAAE"}
+{"version":3,"sources":["../../../src/components/code-editor.stories.tsx"],"sourcesContent":["import type { EditorView } from \"@codemirror/view\";\nimport type { Meta, StoryObj } from \"@storybook/react-vite\";\nimport React from \"react\";\nimport { Input } from \"#shadcn/components/ui/input.js\";\nimport { CodeEditor } from \"./code-editor\";\n\nconst meta: Meta<typeof CodeEditor> = {\n\ttitle: \"Component/Editor\",\n\tcomponent: CodeEditor,\n\tparameters: {\n\t\tlayout: \"centered\",\n\t},\n\ttags: [\"autodocs\"],\n};\n\nexport default meta;\ntype Story = StoryObj<typeof CodeEditor>;\n\nexport const Default: Story = {\n\targs: {\n\t\tdefaultValue: JSON.stringify(\n\t\t\t{\n\t\t\t\tresourceType: \"Patient\",\n\t\t\t\tmeta: { versionId: 10 },\n\t\t\t\tgender: \"male\",\n\t\t\t\tname: [{ family: \"Doe\", given: [\"John\"] }],\n\t\t\t},\n\t\t\tnull,\n\t\t\t2,\n\t\t),\n\t},\n\trender: () => (\n\t\t<div className=\"h-[500px] w-[500px]\">\n\t\t\t<CodeEditor mode=\"http\" />\n\t\t</div>\n\t),\n};\n\ntype ParsedHeader = {\n\tname: string;\n\tnameTrivia: string;\n\tvalue: string;\n\tvalueTrivia: string;\n};\n\ntype Parsed = {\n\tmethod: string;\n\tmethodTrivia: string;\n\tpath: string;\n\tpathTrivia: string;\n\theaders: ParsedHeader[];\n\theadersTrivia: string;\n};\n\nfunction parse(query: string): Parsed {\n\tlet hi = 0;\n\tlet lo = 0;\n\tconst res: Parsed = {\n\t\tmethod: \"\",\n\t\tmethodTrivia: \"\",\n\t\tpath: \"\",\n\t\tpathTrivia: \"\",\n\t\theaders: [],\n\t\theadersTrivia: \"\",\n\t};\n\n\t// Note that we iterate by code units, but it doesn't change correctness.\n\t// method\n\tfor (hi = 0; hi < query.length; ++hi) {\n\t\tconst c = query[hi];\n\t\tif (c === \" \" || c === \"\\t\" || c === \"\\n\") {\n\t\t\tbreak;\n\t\t}\n\t}\n\tres.method = query.substring(lo, hi);\n\tlo = hi;\n\tif (lo >= query.length) {\n\t\treturn res;\n\t}\n\n\t// method trivia\n\tfor (hi = lo; hi < query.length; ++hi) {\n\t\tconst c = query[hi];\n\t\tif (!(c === \" \" || c === \"\\t\")) {\n\t\t\tbreak;\n\t\t}\n\t}\n\tres.methodTrivia = query.substring(lo, hi);\n\tlo = hi;\n\tif (lo >= query.length) {\n\t\treturn res;\n\t}\n\n\t// path\n\tfor (hi = lo; hi < query.length; ++hi) {\n\t\tconst c = query[hi];\n\t\tif (c === \"\\n\") {\n\t\t\tbreak;\n\t\t}\n\t}\n\tres.path = query.substring(lo, hi);\n\tlo = hi;\n\tif (lo >= query.length) {\n\t\treturn res;\n\t}\n\n\t// path trivia\n\tif (query[hi] === \"\\n\") {\n\t\thi += 1;\n\t\tres.pathTrivia = query.substring(lo, hi);\n\t}\n\tlo = hi;\n\tif (lo >= query.length) {\n\t\treturn res;\n\t}\n\n\t// headers\n\tlet header: ParsedHeader = {\n\t\tname: \"\",\n\t\tnameTrivia: \"\",\n\t\tvalue: \"\",\n\t\tvalueTrivia: \"\",\n\t};\n\tlet headerReady = false;\n\t// SAFETY: don't decrease hi inside this loop.\n\tfor (hi = lo; hi < query.length; ++hi) {\n\t\tif (headerReady) {\n\t\t\tres.headers.push(header);\n\t\t}\n\t\theader = { name: \"\", nameTrivia: \"\", value: \"\", valueTrivia: \"\" };\n\t\theaderReady = false;\n\n\t\tif (query[hi] === \"\\n\") {\n\t\t\t// end of headers\n\t\t\tbreak;\n\t\t}\n\n\t\t// header name\n\t\tfor (lo = hi; hi <= query.length; ++hi) {\n\t\t\tconst c = query[hi];\n\t\t\tif (c === \" \" || c === \"\\t\" || c === \"\\n\" || c === \":\") {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t\theaderReady = true;\n\t\theader.name = query.substring(lo, hi);\n\t\tlo = hi;\n\t\tif (lo >= query.length) {\n\t\t\tbreak;\n\t\t}\n\n\t\t// header name trivia\n\t\tlet colonFound = false;\n\t\tfor (lo = hi; hi <= query.length; ++hi) {\n\t\t\tconst c = query[hi];\n\t\t\tif (c === \":\" && !colonFound) {\n\t\t\t\tcolonFound = true;\n\t\t\t} else if (!(c === \" \" || c === \"\\t\")) {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t\theader.nameTrivia = query.substring(lo, hi);\n\t\tlo = hi;\n\t\tif (lo >= query.length) {\n\t\t\tbreak;\n\t\t}\n\n\t\t// header value\n\t\tfor (hi = lo; hi < query.length; ++hi) {\n\t\t\tconst c = query[hi];\n\t\t\tif (c === \"\\n\") {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t\theader.value = query.substring(lo, hi);\n\t\tlo = hi;\n\t\tif (lo >= query.length) {\n\t\t\tbreak;\n\t\t}\n\n\t\t// header value trivia\n\t\tif (query[hi] === \"\\n\") {\n\t\t\theader.valueTrivia = query.substring(lo, hi + 1);\n\t\t}\n\t\tlo = hi + 1;\n\t\tif (lo >= query.length) {\n\t\t\tbreak;\n\t\t}\n\t}\n\tif (headerReady) {\n\t\tres.headers.push(header);\n\t}\n\n\tif (query[hi] === \"\\n\") {\n\t\tres.headersTrivia = query.substring(lo, hi + 1);\n\t}\n\n\treturn res;\n}\n\nconst MethodInput = React.memo(function MethodInput({\n\tmethod,\n\tonMethodChange,\n}: {\n\tmethod: string;\n\tonMethodChange: (ev: React.ChangeEvent<HTMLInputElement>) => void;\n}) {\n\treturn (\n\t\t<div className=\"flex justify-center items-baseline\">\n\t\t\tMethod:\n\t\t\t<Input\n\t\t\t\ttype=\"text\"\n\t\t\t\tclassName=\"inline\"\n\t\t\t\tvalue={method}\n\t\t\t\tonChange={onMethodChange}\n\t\t\t/>\n\t\t</div>\n\t);\n});\n\nconst PathInput = React.memo(function PathInput({\n\tpath,\n\tonPathChange,\n}: {\n\tpath: string;\n\tonPathChange: (ev: React.ChangeEvent<HTMLInputElement>) => void;\n}) {\n\treturn (\n\t\t<div className=\"flex justify-center items-baseline\">\n\t\t\t{\"Path: \"}\n\t\t\t<Input\n\t\t\t\ttype=\"text\"\n\t\t\t\tclassName=\"inline\"\n\t\t\t\tvalue={path}\n\t\t\t\tonChange={onPathChange}\n\t\t\t/>\n\t\t</div>\n\t);\n});\n\nfunction ComplexComp() {\n\tconst [rawQuery, setRawQuery] = React.useState(\"\");\n\tconst parsed = React.useMemo(() => parse(rawQuery), [rawQuery]);\n\tconst parsedRef = React.useRef(parsed);\n\tReact.useEffect(() => {\n\t\tparsedRef.current = parsed;\n\t}, [parsed]);\n\tconst method = React.useMemo(() => parsed.method, [parsed.method]);\n\tconst path = React.useMemo(() => parsed.path, [parsed.path]);\n\n\tconst viewRef = React.useRef<EditorView | null>(null);\n\n\tconst onMethodChange = React.useCallback(\n\t\t(ev: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\tlet newVal = ev.target.value;\n\n\t\t\tif (newVal.indexOf(\" \") !== -1) {\n\t\t\t\tnewVal = newVal.replaceAll(\" \", \"\").replaceAll(\"\\t\", \"\");\n\t\t\t}\n\n\t\t\tconst view = viewRef.current;\n\t\t\tif (view === null) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst from = 0;\n\t\t\tconst to = parsedRef.current.method.length;\n\n\t\t\tview.dispatch({\n\t\t\t\tchanges: {\n\t\t\t\t\tfrom: from,\n\t\t\t\t\tto: to,\n\t\t\t\t\tinsert: newVal,\n\t\t\t\t},\n\t\t\t});\n\t\t},\n\t\t[],\n\t);\n\n\tconst onPathChange = React.useCallback(\n\t\t(ev: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\tconst newVal = ev.target.value;\n\n\t\t\tconst view = viewRef.current;\n\t\t\tif (view === null) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst from =\n\t\t\t\tparsedRef.current.method.length + parsedRef.current.methodTrivia.length;\n\t\t\tconst to = from + parsedRef.current.path.length;\n\t\t\tconsole.log(from, to);\n\n\t\t\tview.dispatch({\n\t\t\t\tchanges: {\n\t\t\t\t\tfrom: from,\n\t\t\t\t\tto: to,\n\t\t\t\t\tinsert: newVal,\n\t\t\t\t},\n\t\t\t});\n\t\t},\n\t\t[],\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t<MethodInput method={method} onMethodChange={onMethodChange} />\n\t\t\t<PathInput path={path} onPathChange={onPathChange} />\n\t\t\t<div className=\"h-[500px] w-[500px] border-black border-2\">\n\t\t\t\t<CodeEditor\n\t\t\t\t\tmode=\"http\"\n\t\t\t\t\tonUpdate={(update) => {\n\t\t\t\t\t\tif (update.docChanged) {\n\t\t\t\t\t\t\tsetRawQuery(update.state.doc.toString());\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t\tviewCallback={(view) => {\n\t\t\t\t\t\tviewRef.current = view;\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport const Complex: Story = {\n\trender: () => ComplexComp(),\n};\n"],"names":["React","Input","CodeEditor","meta","title","component","parameters","layout","tags","Default","args","defaultValue","JSON","stringify","resourceType","versionId","gender","name","family","given","render","div","className","mode","parse","query","hi","lo","res","method","methodTrivia","path","pathTrivia","headers","headersTrivia","length","c","substring","header","nameTrivia","value","valueTrivia","headerReady","push","colonFound","MethodInput","memo","onMethodChange","type","onChange","PathInput","onPathChange","ComplexComp","rawQuery","setRawQuery","useState","parsed","useMemo","parsedRef","useRef","useEffect","current","viewRef","useCallback","ev","newVal","target","indexOf","replaceAll","view","from","to","dispatch","changes","insert","console","log","onUpdate","update","docChanged","state","doc","toString","viewCallback","Complex"],"mappings":"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"}

package/dist/src/components/copy-icon.d.ts

@@ -1,6 +1,10 @@
 interface CopyIconProps {
     text: string;
+    showTooltip?: boolean;
+    tooltipText?: string;
+    showToast?: boolean;
+    onCopy?: (text: string) => void;
 }
-declare function CopyIcon({ text }: CopyIconProps): import("react/jsx-runtime").JSX.Element;
+declare function CopyIcon({ text, showTooltip, tooltipText, showToast, onCopy, ...props }: CopyIconProps): import("react/jsx-runtime").JSX.Element;
 export { CopyIcon };
 //# sourceMappingURL=copy-icon.d.ts.map

package/dist/src/components/copy-icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"copy-icon.d.ts","sourceRoot":"","sources":["../../../src/components/copy-icon.tsx"],"names":[],"mappings":"AAGA,UAAU,aAAa;IACtB,IAAI,EAAE,MAAM,CAAC;CACb;AAED,iBAAS,QAAQ,CAAC,EAAE,IAAI,EAAE,EAAE,aAAa,2CAoBxC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"copy-icon.d.ts","sourceRoot":"","sources":["../../../src/components/copy-icon.tsx"],"names":[],"mappings":"AASA,UAAU,aAAa;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAChC;AAED,iBAAS,QAAQ,CAAC,EACjB,IAAI,EACJ,WAAkB,EAClB,WAAoB,EACpB,SAAgB,EAChB,MAAM,EACN,GAAG,KAAK,EACR,EAAE,aAAa,2CAyDf;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}

package/dist/src/components/copy-icon.js

@@ -1,12 +1,33 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Check, Copy } from "lucide-react";
 import * as React from "react";
-function CopyIcon({ text }) {
+import { toast } from "sonner";
+import { Tooltip, TooltipContent, TooltipTrigger } from "../shadcn/components/ui/tooltip.js";
+function CopyIcon({ text, showTooltip = true, tooltipText = "Copy", showToast = true, onCopy, ...props }) {
     const [isActive, setIsActive] = React.useState(false);
     async function handleClick() {
         try {
             await navigator.clipboard.writeText(text);
             setIsActive(true);
+            if (showToast) {
+                const truncatedText = text.length > 30 ? `${text.slice(0, 30)}...` : text;
+                toast(/*#__PURE__*/ _jsxs("div", {
+                    className: "flex flex-col gap-1",
+                    children: [
+                        /*#__PURE__*/ _jsx("span", {
+                            className: "typo-body",
+                            children: "Successfully copied"
+                        }),
+                        /*#__PURE__*/ _jsx("span", {
+                            className: "typo-code text-text-secondary",
+                            children: truncatedText
+                        })
+                    ]
+                }), {
+                    duration: 2000
+                });
+            }
+            onCopy?.(text);
             setTimeout(()=>{
                 setIsActive(false);
             }, 1000);
@@ -14,7 +35,8 @@ function CopyIcon({ text }) {
             console.error("Failed to copy to clipboard:", error);
         }
     }
-    return /*#__PURE__*/ _jsx("button", {
+    const button = /*#__PURE__*/ _jsx("button", {
+        ...props,
         type: "button",
         onClick: handleClick,
         style: {
@@ -22,6 +44,22 @@ function CopyIcon({ text }) {
         },
         children: isActive ? /*#__PURE__*/ _jsx(Check, {}) : /*#__PURE__*/ _jsx(Copy, {})
     });
+    if (!showTooltip) {
+        return button;
+    }
+    return /*#__PURE__*/ _jsxs(Tooltip, {
+        children: [
+            /*#__PURE__*/ _jsx(TooltipTrigger, {
+                asChild: true,
+                children: button
+            }),
+            /*#__PURE__*/ _jsx(TooltipContent, {
+                children: /*#__PURE__*/ _jsx("p", {
+                    children: tooltipText
+                })
+            })
+        ]
+    });
 }
 export { CopyIcon };
 

package/dist/src/components/copy-icon.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/copy-icon.tsx"],"sourcesContent":["import { Check, Copy } from \"lucide-react\";\nimport * as React from \"react\";\n\ninterface CopyIconProps {\n\ttext: string;\n}\n\nfunction CopyIcon({ text }: CopyIconProps) {\n\tconst [isActive, setIsActive] = React.useState(false);\n\n\tasync function handleClick() {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(text);\n\t\t\tsetIsActive(true);\n\t\t\tsetTimeout(() => {\n\t\t\t\tsetIsActive(false);\n\t\t\t}, 1000);\n\t\t} catch (error) {\n\t\t\tconsole.error(\"Failed to copy to clipboard:\", error);\n\t\t}\n\t}\n\n\treturn (\n\t\t<button type=\"button\" onClick={handleClick} style={{ cursor: \"pointer\" }}>\n\t\t\t{isActive ? <Check /> : <Copy />}\n\t\t</button>\n\t);\n}\n\nexport { CopyIcon };\n"],"names":["Check","Copy","React","CopyIcon","text","isActive","setIsActive","useState","handleClick","navigator","clipboard","writeText","setTimeout","error","console","button","type","onClick","style","cursor"],"mappings":";AAAA,SAASA,KAAK,EAAEC,IAAI,QAAQ,eAAe;AAC3C,YAAYC,WAAW,QAAQ;AAM/B,SAASC,SAAS,EAAEC,IAAI,EAAiB;IACxC,MAAM,CAACC,UAAUC,YAAY,GAAGJ,MAAMK,QAAQ,CAAC;IAE/C,eAAeC;QACd,IAAI;YACH,MAAMC,UAAUC,SAAS,CAACC,SAAS,CAACP;YACpCE,YAAY;YACZM,WAAW;gBACVN,YAAY;YACb,GAAG;QACJ,EAAE,OAAOO,OAAO;YACfC,QAAQD,KAAK,CAAC,gCAAgCA;QAC/C;IACD;IAEA,qBACC,KAACE;QAAOC,MAAK;QAASC,SAAST;QAAaU,OAAO;YAAEC,QAAQ;QAAU;kBACrEd,yBAAW,KAACL,2BAAW,KAACC;;AAG5B;AAEA,SAASE,QAAQ,GAAG"}
+{"version":3,"sources":["../../../src/components/copy-icon.tsx"],"sourcesContent":["import { Check, Copy } from \"lucide-react\";\nimport * as React from \"react\";\nimport { toast } from \"sonner\";\nimport {\n\tTooltip,\n\tTooltipContent,\n\tTooltipTrigger,\n} from \"#shadcn/components/ui/tooltip\";\n\ninterface CopyIconProps {\n\ttext: string;\n\tshowTooltip?: boolean;\n\ttooltipText?: string;\n\tshowToast?: boolean;\n\tonCopy?: (text: string) => void;\n}\n\nfunction CopyIcon({\n\ttext,\n\tshowTooltip = true,\n\ttooltipText = \"Copy\",\n\tshowToast = true,\n\tonCopy,\n\t...props\n}: CopyIconProps) {\n\tconst [isActive, setIsActive] = React.useState(false);\n\n\tasync function handleClick() {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(text);\n\t\t\tsetIsActive(true);\n\n\t\t\tif (showToast) {\n\t\t\t\tconst truncatedText =\n\t\t\t\t\ttext.length > 30 ? `${text.slice(0, 30)}...` : text;\n\t\t\t\ttoast(\n\t\t\t\t\t<div className=\"flex flex-col gap-1\">\n\t\t\t\t\t\t<span className=\"typo-body\">Successfully copied</span>\n\t\t\t\t\t\t<span className=\"typo-code text-text-secondary\">\n\t\t\t\t\t\t\t{truncatedText}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</div>,\n\t\t\t\t\t{\n\t\t\t\t\t\tduration: 2000,\n\t\t\t\t\t},\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tonCopy?.(text);\n\n\t\t\tsetTimeout(() => {\n\t\t\t\tsetIsActive(false);\n\t\t\t}, 1000);\n\t\t} catch (error) {\n\t\t\tconsole.error(\"Failed to copy to clipboard:\", error);\n\t\t}\n\t}\n\n\tconst button = (\n\t\t<button\n\t\t\t{...props}\n\t\t\ttype=\"button\"\n\t\t\tonClick={handleClick}\n\t\t\tstyle={{ cursor: \"pointer\" }}\n\t\t>\n\t\t\t{isActive ? <Check /> : <Copy />}\n\t\t</button>\n\t);\n\n\tif (!showTooltip) {\n\t\treturn button;\n\t}\n\n\treturn (\n\t\t<Tooltip>\n\t\t\t<TooltipTrigger asChild>{button}</TooltipTrigger>\n\t\t\t<TooltipContent>\n\t\t\t\t<p>{tooltipText}</p>\n\t\t\t</TooltipContent>\n\t\t</Tooltip>\n\t);\n}\n\nexport { CopyIcon };\n"],"names":["Check","Copy","React","toast","Tooltip","TooltipContent","TooltipTrigger","CopyIcon","text","showTooltip","tooltipText","showToast","onCopy","props","isActive","setIsActive","useState","handleClick","navigator","clipboard","writeText","truncatedText","length","slice","div","className","span","duration","setTimeout","error","console","button","type","onClick","style","cursor","asChild","p"],"mappings":";AAAA,SAASA,KAAK,EAAEC,IAAI,QAAQ,eAAe;AAC3C,YAAYC,WAAW,QAAQ;AAC/B,SAASC,KAAK,QAAQ,SAAS;AAC/B,SACCC,OAAO,EACPC,cAAc,EACdC,cAAc,QACR,qCAAgC;AAUvC,SAASC,SAAS,EACjBC,IAAI,EACJC,cAAc,IAAI,EAClBC,cAAc,MAAM,EACpBC,YAAY,IAAI,EAChBC,MAAM,EACN,GAAGC,OACY;IACf,MAAM,CAACC,UAAUC,YAAY,GAAGb,MAAMc,QAAQ,CAAC;IAE/C,eAAeC;QACd,IAAI;YACH,MAAMC,UAAUC,SAAS,CAACC,SAAS,CAACZ;YACpCO,YAAY;YAEZ,IAAIJ,WAAW;gBACd,MAAMU,gBACLb,KAAKc,MAAM,GAAG,KAAK,GAAGd,KAAKe,KAAK,CAAC,GAAG,IAAI,GAAG,CAAC,GAAGf;gBAChDL,oBACC,MAACqB;oBAAIC,WAAU;;sCACd,KAACC;4BAAKD,WAAU;sCAAY;;sCAC5B,KAACC;4BAAKD,WAAU;sCACdJ;;;oBAGH;oBACCM,UAAU;gBACX;YAEF;YAEAf,SAASJ;YAEToB,WAAW;gBACVb,YAAY;YACb,GAAG;QACJ,EAAE,OAAOc,OAAO;YACfC,QAAQD,KAAK,CAAC,gCAAgCA;QAC/C;IACD;IAEA,MAAME,uBACL,KAACA;QACC,GAAGlB,KAAK;QACTmB,MAAK;QACLC,SAAShB;QACTiB,OAAO;YAAEC,QAAQ;QAAU;kBAE1BrB,yBAAW,KAACd,2BAAW,KAACC;;IAI3B,IAAI,CAACQ,aAAa;QACjB,OAAOsB;IACR;IAEA,qBACC,MAAC3B;;0BACA,KAACE;gBAAe8B,OAAO;0BAAEL;;0BACzB,KAAC1B;0BACA,cAAA,KAACgC;8BAAG3B;;;;;AAIR;AAEA,SAASH,QAAQ,GAAG"}

package/dist/src/components/data-table.d.ts

@@ -0,0 +1,9 @@
+import { type ColumnDef } from "@tanstack/react-table";
+export interface DataTableProps<TData, TValue> {
+    columns: ColumnDef<TData, TValue>[];
+    data: TData[];
+    stickyHeader?: boolean;
+}
+export declare function DataTable<TData, TValue>({ columns, data, stickyHeader, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
+export type { ColumnDef };
+//# sourceMappingURL=data-table.d.ts.map

package/dist/src/components/data-table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../../src/components/data-table.tsx"],"names":[],"mappings":"AAEA,OAAO,EACN,KAAK,SAAS,EAId,MAAM,uBAAuB,CAAC;AAW/B,MAAM,WAAW,cAAc,CAAC,KAAK,EAAE,MAAM;IAC5C,OAAO,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,EAAE,CAAC;IACpC,IAAI,EAAE,KAAK,EAAE,CAAC;IACd,YAAY,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,EACxC,OAAO,EACP,IAAI,EACJ,YAAoB,GACpB,EAAE,cAAc,CAAC,KAAK,EAAE,MAAM,CAAC,2CAyF/B;AAED,YAAY,EAAE,SAAS,EAAE,CAAC"}

package/dist/src/components/data-table.js

@@ -0,0 +1,66 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { flexRender, getCoreRowModel, useReactTable } from "@tanstack/react-table";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../shadcn/components/ui/table.js";
+export function DataTable({ columns, data, stickyHeader = false }) {
+    "use no memo";
+    const table = useReactTable({
+        data,
+        columns,
+        getCoreRowModel: getCoreRowModel(),
+        columnResizeMode: "onChange",
+        enableColumnResizing: true
+    });
+    return /*#__PURE__*/ _jsx("div", {
+        className: "overflow-hidden w-full h-full",
+        children: /*#__PURE__*/ _jsxs(Table, {
+            className: "relative border-spacing-0 border-separate w-full",
+            children: [
+                /*#__PURE__*/ _jsx(TableHeader, {
+                    children: table.getHeaderGroups().map((headerGroup)=>/*#__PURE__*/ _jsx(TableRow, {
+                            children: headerGroup.headers.map((header)=>{
+                                return /*#__PURE__*/ _jsxs(TableHead, {
+                                    className: `relative group border ${stickyHeader ? "sticky top-0 z-10 bg-bg-secondary text-elements-assistive" : ""}`,
+                                    style: {
+                                        width: header.column.getIndex() === headerGroup.headers.length - 1 ? "w-full" : header.getSize()
+                                    },
+                                    children: [
+                                        header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext()),
+                                        header.column.getCanResize() && /*#__PURE__*/ _jsx("div", {
+                                            onMouseDown: header.getResizeHandler(),
+                                            onTouchStart: header.getResizeHandler(),
+                                            className: `hidden group-hover:block absolute top-0 right-0 h-full w-1 bg-border-secondary cursor-col-resize hover:bg-border-secondary`,
+                                            style: {
+                                                userSelect: "none",
+                                                touchAction: "none"
+                                            }
+                                        })
+                                    ]
+                                }, header.id);
+                            })
+                        }, headerGroup.id))
+                }),
+                /*#__PURE__*/ _jsx(TableBody, {
+                    children: table.getRowModel().rows?.length ? table.getRowModel().rows.map((row)=>/*#__PURE__*/ _jsx(TableRow, {
+                            "data-state": row.getIsSelected() && "selected",
+                            children: row.getVisibleCells().map((cell)=>/*#__PURE__*/ _jsx(TableCell, {
+                                    className: "border",
+                                    style: {
+                                        width: cell.column.getIndex() === row.getVisibleCells().length - 1 ? "w-full" : cell.column.getSize()
+                                    },
+                                    children: flexRender(cell.column.columnDef.cell, cell.getContext())
+                                }, cell.id))
+                        }, row.id)) : /*#__PURE__*/ _jsx(TableRow, {
+                        children: /*#__PURE__*/ _jsx(TableCell, {
+                            colSpan: columns.length,
+                            className: "h-24 text-center",
+                            children: "No results."
+                        })
+                    })
+                })
+            ]
+        })
+    });
+}
+
+//# sourceMappingURL=data-table.js.map

package/dist/src/components/data-table.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/data-table.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n\ttype ColumnDef,\n\tflexRender,\n\tgetCoreRowModel,\n\tuseReactTable,\n} from \"@tanstack/react-table\";\n\nimport {\n\tTable,\n\tTableBody,\n\tTableCell,\n\tTableHead,\n\tTableHeader,\n\tTableRow,\n} from \"../shadcn/components/ui/table\";\n\nexport interface DataTableProps<TData, TValue> {\n\tcolumns: ColumnDef<TData, TValue>[];\n\tdata: TData[];\n\tstickyHeader?: boolean;\n}\n\nexport function DataTable<TData, TValue>({\n\tcolumns,\n\tdata,\n\tstickyHeader = false,\n}: DataTableProps<TData, TValue>) {\n\t\"use no memo\";\n\tconst table = useReactTable({\n\t\tdata,\n\t\tcolumns,\n\t\tgetCoreRowModel: getCoreRowModel(),\n\t\tcolumnResizeMode: \"onChange\",\n\t\tenableColumnResizing: true,\n\t});\n\n\treturn (\n\t\t<div className=\"overflow-hidden w-full h-full\">\n\t\t\t<Table className=\"relative border-spacing-0 border-separate w-full\">\n\t\t\t\t<TableHeader>\n\t\t\t\t\t{table.getHeaderGroups().map((headerGroup) => (\n\t\t\t\t\t\t<TableRow key={headerGroup.id}>\n\t\t\t\t\t\t\t{headerGroup.headers.map((header) => {\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<TableHead\n\t\t\t\t\t\t\t\t\t\tkey={header.id}\n\t\t\t\t\t\t\t\t\t\tclassName={`relative group border ${stickyHeader ? \"sticky top-0 z-10 bg-bg-secondary text-elements-assistive\" : \"\"}`}\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\theader.column.getIndex() ===\n\t\t\t\t\t\t\t\t\t\t\t\theaderGroup.headers.length - 1\n\t\t\t\t\t\t\t\t\t\t\t\t\t? \"w-full\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t: header.getSize(),\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{header.isPlaceholder\n\t\t\t\t\t\t\t\t\t\t\t? null\n\t\t\t\t\t\t\t\t\t\t\t: flexRender(\n\t\t\t\t\t\t\t\t\t\t\t\t\theader.column.columnDef.header,\n\t\t\t\t\t\t\t\t\t\t\t\t\theader.getContext(),\n\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t{header.column.getCanResize() && (\n\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t{...{\n\t\t\t\t\t\t\t\t\t\t\t\t\tonMouseDown: header.getResizeHandler(),\n\t\t\t\t\t\t\t\t\t\t\t\t\tonTouchStart: header.getResizeHandler(),\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName: `hidden group-hover:block absolute top-0 right-0 h-full w-1 bg-border-secondary cursor-col-resize hover:bg-border-secondary`,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tuserSelect: \"none\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttouchAction: \"none\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</TableHead>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</TableRow>\n\t\t\t\t\t))}\n\t\t\t\t</TableHeader>\n\t\t\t\t<TableBody>\n\t\t\t\t\t{table.getRowModel().rows?.length ? (\n\t\t\t\t\t\ttable.getRowModel().rows.map((row) => (\n\t\t\t\t\t\t\t<TableRow\n\t\t\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\t\t\tdata-state={row.getIsSelected() && \"selected\"}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{row.getVisibleCells().map((cell) => (\n\t\t\t\t\t\t\t\t\t<TableCell\n\t\t\t\t\t\t\t\t\t\tclassName=\"border\"\n\t\t\t\t\t\t\t\t\t\tkey={cell.id}\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\tcell.column.getIndex() ===\n\t\t\t\t\t\t\t\t\t\t\t\trow.getVisibleCells().length - 1\n\t\t\t\t\t\t\t\t\t\t\t\t\t? \"w-full\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t: cell.column.getSize(),\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{flexRender(cell.column.columnDef.cell, cell.getContext())}\n\t\t\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</TableRow>\n\t\t\t\t\t\t))\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<TableRow>\n\t\t\t\t\t\t\t<TableCell colSpan={columns.length} className=\"h-24 text-center\">\n\t\t\t\t\t\t\t\tNo results.\n\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t</TableRow>\n\t\t\t\t\t)}\n\t\t\t\t</TableBody>\n\t\t\t</Table>\n\t\t</div>\n\t);\n}\n\nexport type { ColumnDef };\n"],"names":["flexRender","getCoreRowModel","useReactTable","Table","TableBody","TableCell","TableHead","TableHeader","TableRow","DataTable","columns","data","stickyHeader","table","columnResizeMode","enableColumnResizing","div","className","getHeaderGroups","map","headerGroup","headers","header","style","width","column","getIndex","length","getSize","isPlaceholder","columnDef","getContext","getCanResize","onMouseDown","getResizeHandler","onTouchStart","userSelect","touchAction","id","getRowModel","rows","row","data-state","getIsSelected","getVisibleCells","cell","colSpan"],"mappings":"AAAA;;AAEA,SAECA,UAAU,EACVC,eAAe,EACfC,aAAa,QACP,wBAAwB;AAE/B,SACCC,KAAK,EACLC,SAAS,EACTC,SAAS,EACTC,SAAS,EACTC,WAAW,EACXC,QAAQ,QACF,mCAAgC;AAQvC,OAAO,SAASC,UAAyB,EACxCC,OAAO,EACPC,IAAI,EACJC,eAAe,KAAK,EACW;IAC/B;IACA,MAAMC,QAAQX,cAAc;QAC3BS;QACAD;QACAT,iBAAiBA;QACjBa,kBAAkB;QAClBC,sBAAsB;IACvB;IAEA,qBACC,KAACC;QAAIC,WAAU;kBACd,cAAA,MAACd;YAAMc,WAAU;;8BAChB,KAACV;8BACCM,MAAMK,eAAe,GAAGC,GAAG,CAAC,CAACC,4BAC7B,KAACZ;sCACCY,YAAYC,OAAO,CAACF,GAAG,CAAC,CAACG;gCACzB,qBACC,MAAChB;oCAEAW,WAAW,CAAC,sBAAsB,EAAEL,eAAe,8DAA8D,IAAI;oCACrHW,OAAO;wCACNC,OACCF,OAAOG,MAAM,CAACC,QAAQ,OACtBN,YAAYC,OAAO,CAACM,MAAM,GAAG,IAC1B,WACAL,OAAOM,OAAO;oCACnB;;wCAECN,OAAOO,aAAa,GAClB,OACA7B,WACAsB,OAAOG,MAAM,CAACK,SAAS,CAACR,MAAM,EAC9BA,OAAOS,UAAU;wCAEnBT,OAAOG,MAAM,CAACO,YAAY,oBAC1B,KAAChB;4CAECiB,aAAaX,OAAOY,gBAAgB;4CACpCC,cAAcb,OAAOY,gBAAgB;4CACrCjB,WAAW,CAAC,0HAA0H,CAAC;4CACvIM,OAAO;gDACNa,YAAY;gDACZC,aAAa;4CACd;;;mCAzBEf,OAAOgB,EAAE;4BA+BjB;2BAnCclB,YAAYkB,EAAE;;8BAuC/B,KAAClC;8BACCS,MAAM0B,WAAW,GAAGC,IAAI,EAAEb,SAC1Bd,MAAM0B,WAAW,GAAGC,IAAI,CAACrB,GAAG,CAAC,CAACsB,oBAC7B,KAACjC;4BAEAkC,cAAYD,IAAIE,aAAa,MAAM;sCAElCF,IAAIG,eAAe,GAAGzB,GAAG,CAAC,CAAC0B,qBAC3B,KAACxC;oCACAY,WAAU;oCAEVM,OAAO;wCACNC,OACCqB,KAAKpB,MAAM,CAACC,QAAQ,OACpBe,IAAIG,eAAe,GAAGjB,MAAM,GAAG,IAC5B,WACAkB,KAAKpB,MAAM,CAACG,OAAO;oCACxB;8CAEC5B,WAAW6C,KAAKpB,MAAM,CAACK,SAAS,CAACe,IAAI,EAAEA,KAAKd,UAAU;mCATlDc,KAAKP,EAAE;2BANTG,IAAIH,EAAE,mBAqBb,KAAC9B;kCACA,cAAA,KAACH;4BAAUyC,SAASpC,QAAQiB,MAAM;4BAAEV,WAAU;sCAAmB;;;;;;;AASxE"}

package/dist/src/components/data-table.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { DataTable } from "./data-table";
+declare const meta: Meta<typeof DataTable>;
+export default meta;
+type Story = StoryObj<typeof DataTable>;
+export declare const Default: Story;
+//# sourceMappingURL=data-table.stories.d.ts.map

package/dist/src/components/data-table.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table.stories.d.ts","sourceRoot":"","sources":["../../../src/components/data-table.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,SAAS,EAAuB,MAAM,cAAc,CAAC;AAE9D,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CAIhC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,SAAS,CAAC,CAAC;AASxC,eAAO,MAAM,OAAO,EAAE,KAqErB,CAAC"}