@apipass/design-system 5.4.0 → 5.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/lib/embedded-styles.js +2 -2
- package/dist/lib/style.css +1 -1
- package/dist/lib/ui/components/DataTable/DataTable.cjs +1 -1
- package/dist/lib/ui/components/DataTable/DataTable.cjs.map +1 -1
- package/dist/lib/ui/components/DataTable/DataTable.js +76 -75
- package/dist/lib/ui/components/DataTable/DataTable.js.map +1 -1
- package/dist/lib/ui/layout/Flex/Flex.cjs +1 -1
- package/dist/lib/ui/layout/Flex/Flex.cjs.map +1 -1
- package/dist/lib/ui/layout/Flex/Flex.js +12 -12
- package/dist/lib/ui/layout/Flex/Flex.js.map +1 -1
- package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.cjs +1 -1
- package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.cjs.map +1 -1
- package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.js +1 -1
- package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.js.map +1 -1
- package/dist/lib/ui/primitives/NavigationPill/NavigationPill.cjs +1 -1
- package/dist/lib/ui/primitives/NavigationPill/NavigationPill.cjs.map +1 -1
- package/dist/lib/ui/primitives/NavigationPill/NavigationPill.js +21 -17
- package/dist/lib/ui/primitives/NavigationPill/NavigationPill.js.map +1 -1
- package/dist/lib/ui/primitives/Search/Search.cjs +1 -1
- package/dist/lib/ui/primitives/Search/Search.cjs.map +1 -1
- package/dist/lib/ui/primitives/Search/Search.js +22 -49
- package/dist/lib/ui/primitives/Search/Search.js.map +1 -1
- package/dist/lib/ui/primitives/Table/Table.cjs +1 -1
- package/dist/lib/ui/primitives/Table/Table.cjs.map +1 -1
- package/dist/lib/ui/primitives/Table/Table.js +88 -66
- package/dist/lib/ui/primitives/Table/Table.js.map +1 -1
- package/dist/types/ui/components/DataTable/DataTable.d.ts +11 -3
- package/dist/types/ui/primitives/NavigationPill/NavigationPill.d.ts +5 -2
- package/dist/types/ui/primitives/Table/Table.d.ts +10 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"json-code-mirror.cjs","sources":["../../../../../src/ui/primitives/JsonViewer/json-code-mirror.ts"],"sourcesContent":["import { EditorView } from \"@codemirror/view\";\nimport { json } from \"@codemirror/lang-json\";\nimport { foldGutter, HighlightStyle, syntaxHighlighting } from \"@codemirror/language\";\nimport { tags as t } from \"@lezer/highlight\";\n\nexport const jsonHighlightStyle = HighlightStyle.define([\n { tag: t.propertyName, color: \"var(--json-viewer-color-key)\" },\n { tag: t.string, color: \"var(--json-viewer-color-string)\", fontWeight: 600 },\n { tag: [t.number, t.bool, t.null], color: \"var(--json-viewer-color-scalar)\" },\n { tag: [t.separator, t.squareBracket, t.brace], color: \"var(--json-viewer-color-punctuation)\" },\n]);\n\nexport const jsonEditorTheme = EditorView.theme({\n \"&\": { backgroundColor: \"transparent\", color: \"var(--json-viewer-color-punctuation)\", fontSize: \"13px\" },\n \"&.cm-focused\": { outline: \"none\" },\n \".cm-content\": { fontFamily: \"var(--sds-typography-family-mono)\", padding: \"
|
|
1
|
+
{"version":3,"file":"json-code-mirror.cjs","sources":["../../../../../src/ui/primitives/JsonViewer/json-code-mirror.ts"],"sourcesContent":["import { EditorView } from \"@codemirror/view\";\nimport { json } from \"@codemirror/lang-json\";\nimport { foldGutter, HighlightStyle, syntaxHighlighting } from \"@codemirror/language\";\nimport { tags as t } from \"@lezer/highlight\";\n\nexport const jsonHighlightStyle = HighlightStyle.define([\n { tag: t.propertyName, color: \"var(--json-viewer-color-key)\" },\n { tag: t.string, color: \"var(--json-viewer-color-string)\", fontWeight: 600 },\n { tag: [t.number, t.bool, t.null], color: \"var(--json-viewer-color-scalar)\" },\n { tag: [t.separator, t.squareBracket, t.brace], color: \"var(--json-viewer-color-punctuation)\" },\n]);\n\nexport const jsonEditorTheme = EditorView.theme({\n \"&\": { backgroundColor: \"transparent\", color: \"var(--json-viewer-color-punctuation)\", fontSize: \"13px\" },\n \"&.cm-focused\": { outline: \"none\" },\n \".cm-content\": { fontFamily: \"var(--sds-typography-family-mono)\", padding: \"8px 124px 12px 4px\" },\n \".cm-gutters\": {\n backgroundColor: \"transparent\",\n border: \"none\",\n color: \"var(--json-viewer-color-caret)\",\n paddingLeft: \"5px\",\n },\n \".cm-scroller\": { overflow: \"auto\" },\n});\n\nexport const jsonEditorExtensions = [json(), foldGutter(), syntaxHighlighting(jsonHighlightStyle)];\n\nexport function serializeJson(value: unknown): string {\n try {\n return JSON.stringify(value, null, 2) ?? \"null\";\n } catch {\n return String(value);\n }\n}\n\nexport function toCssSize(size: string | number): string {\n return typeof size === \"number\" ? `${size}px` : size;\n}\n\n/**\n * Finds the fold range of every direct child (depth 1) of the root object/array\n * by scanning the text itself for matching brackets. This mirrors what\n * CodeMirror's `foldable()` would compute, but doesn't depend on the lezer\n * parser having finished tokenizing the document — which for a multi-MB\n * document is not guaranteed synchronously at mount time.\n */\nexport function computeFirstLevelFoldRanges(text: string): { from: number; to: number }[] {\n const ranges: { from: number; to: number }[] = [];\n const n = text.length;\n let i = 0;\n while (i < n && text[i] !== \"{\" && text[i] !== \"[\") i++;\n if (i >= n) return ranges;\n\n let depth = 0;\n let inString = false;\n let pendingStart = -1;\n for (; i < n; i++) {\n const ch = text[i];\n if (inString) {\n if (ch === \"\\\\\") i++;\n else if (ch === '\"') inString = false;\n continue;\n }\n if (ch === '\"') {\n inString = true;\n continue;\n }\n if (ch === \"{\" || ch === \"[\") {\n depth++;\n if (depth === 2) pendingStart = i + 1;\n continue;\n }\n if (ch === \"}\" || ch === \"]\") {\n if (depth === 2 && pendingStart !== -1) {\n ranges.push({ from: pendingStart, to: i });\n pendingStart = -1;\n }\n depth--;\n }\n }\n return ranges;\n}\n"],"names":["jsonHighlightStyle","HighlightStyle","t","jsonEditorTheme","EditorView","jsonEditorExtensions","json","foldGutter","syntaxHighlighting","serializeJson","value","toCssSize","size","computeFirstLevelFoldRanges","text","ranges","n","i","depth","inString","pendingStart","ch"],"mappings":"uNAKaA,EAAqBC,EAAAA,eAAe,OAAO,CACtD,CAAE,IAAKC,EAAAA,KAAE,aAAc,MAAO,8BAAA,EAC9B,CAAE,IAAKA,EAAAA,KAAE,OAAQ,MAAO,kCAAmC,WAAY,GAAA,EACvE,CAAE,IAAK,CAACA,OAAE,OAAQA,EAAAA,KAAE,KAAMA,EAAAA,KAAE,IAAI,EAAG,MAAO,iCAAA,EAC1C,CAAE,IAAK,CAACA,EAAAA,KAAE,UAAWA,EAAAA,KAAE,cAAeA,OAAE,KAAK,EAAG,MAAO,sCAAA,CACzD,CAAC,EAEYC,EAAkBC,EAAAA,WAAW,MAAM,CAC9C,IAAK,CAAE,gBAAiB,cAAe,MAAO,uCAAwC,SAAU,MAAA,EAChG,eAAgB,CAAE,QAAS,MAAA,EAC3B,cAAe,CAAE,WAAY,oCAAqC,QAAS,oBAAA,EAC3E,cAAe,CACb,gBAAiB,cACjB,OAAQ,OACR,MAAO,iCACP,YAAa,KAAA,EAEf,eAAgB,CAAE,SAAU,MAAA,CAC9B,CAAC,EAEYC,EAAuB,CAACC,EAAAA,KAAA,EAAQC,EAAAA,aAAcC,EAAAA,mBAAmBR,CAAkB,CAAC,EAE1F,SAASS,EAAcC,EAAwB,CACpD,GAAI,CACF,OAAO,KAAK,UAAUA,EAAO,KAAM,CAAC,GAAK,MAC3C,MAAQ,CACN,OAAO,OAAOA,CAAK,CACrB,CACF,CAEO,SAASC,EAAUC,EAA+B,CACvD,OAAO,OAAOA,GAAS,SAAW,GAAGA,CAAI,KAAOA,CAClD,CASO,SAASC,EAA4BC,EAA8C,CACxF,MAAMC,EAAyC,CAAA,EACzCC,EAAIF,EAAK,OACf,IAAIG,EAAI,EACR,KAAOA,EAAID,GAAKF,EAAKG,CAAC,IAAM,KAAOH,EAAKG,CAAC,IAAM,KAAKA,IACpD,GAAIA,GAAKD,EAAG,OAAOD,EAEnB,IAAIG,EAAQ,EACRC,EAAW,GACXC,EAAe,GACnB,KAAOH,EAAID,EAAGC,IAAK,CACjB,MAAMI,EAAKP,EAAKG,CAAC,EACjB,GAAIE,EAAU,CACRE,IAAO,KAAMJ,IACRI,IAAO,MAAKF,EAAW,IAChC,QACF,CACA,GAAIE,IAAO,IAAK,CACdF,EAAW,GACX,QACF,CACA,GAAIE,IAAO,KAAOA,IAAO,IAAK,CAC5BH,IACIA,IAAU,IAAGE,EAAeH,EAAI,GACpC,QACF,EACII,IAAO,KAAOA,IAAO,OACnBH,IAAU,GAAKE,IAAiB,KAClCL,EAAO,KAAK,CAAE,KAAMK,EAAc,GAAIH,EAAG,EACzCG,EAAe,IAEjBF,IAEJ,CACA,OAAOH,CACT"}
|
|
@@ -10,7 +10,7 @@ const m = p.define([
|
|
|
10
10
|
]), j = s.theme({
|
|
11
11
|
"&": { backgroundColor: "transparent", color: "var(--json-viewer-color-punctuation)", fontSize: "13px" },
|
|
12
12
|
"&.cm-focused": { outline: "none" },
|
|
13
|
-
".cm-content": { fontFamily: "var(--sds-typography-family-mono)", padding: "
|
|
13
|
+
".cm-content": { fontFamily: "var(--sds-typography-family-mono)", padding: "8px 124px 12px 4px" },
|
|
14
14
|
".cm-gutters": {
|
|
15
15
|
backgroundColor: "transparent",
|
|
16
16
|
border: "none",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"json-code-mirror.js","sources":["../../../../../src/ui/primitives/JsonViewer/json-code-mirror.ts"],"sourcesContent":["import { EditorView } from \"@codemirror/view\";\nimport { json } from \"@codemirror/lang-json\";\nimport { foldGutter, HighlightStyle, syntaxHighlighting } from \"@codemirror/language\";\nimport { tags as t } from \"@lezer/highlight\";\n\nexport const jsonHighlightStyle = HighlightStyle.define([\n { tag: t.propertyName, color: \"var(--json-viewer-color-key)\" },\n { tag: t.string, color: \"var(--json-viewer-color-string)\", fontWeight: 600 },\n { tag: [t.number, t.bool, t.null], color: \"var(--json-viewer-color-scalar)\" },\n { tag: [t.separator, t.squareBracket, t.brace], color: \"var(--json-viewer-color-punctuation)\" },\n]);\n\nexport const jsonEditorTheme = EditorView.theme({\n \"&\": { backgroundColor: \"transparent\", color: \"var(--json-viewer-color-punctuation)\", fontSize: \"13px\" },\n \"&.cm-focused\": { outline: \"none\" },\n \".cm-content\": { fontFamily: \"var(--sds-typography-family-mono)\", padding: \"
|
|
1
|
+
{"version":3,"file":"json-code-mirror.js","sources":["../../../../../src/ui/primitives/JsonViewer/json-code-mirror.ts"],"sourcesContent":["import { EditorView } from \"@codemirror/view\";\nimport { json } from \"@codemirror/lang-json\";\nimport { foldGutter, HighlightStyle, syntaxHighlighting } from \"@codemirror/language\";\nimport { tags as t } from \"@lezer/highlight\";\n\nexport const jsonHighlightStyle = HighlightStyle.define([\n { tag: t.propertyName, color: \"var(--json-viewer-color-key)\" },\n { tag: t.string, color: \"var(--json-viewer-color-string)\", fontWeight: 600 },\n { tag: [t.number, t.bool, t.null], color: \"var(--json-viewer-color-scalar)\" },\n { tag: [t.separator, t.squareBracket, t.brace], color: \"var(--json-viewer-color-punctuation)\" },\n]);\n\nexport const jsonEditorTheme = EditorView.theme({\n \"&\": { backgroundColor: \"transparent\", color: \"var(--json-viewer-color-punctuation)\", fontSize: \"13px\" },\n \"&.cm-focused\": { outline: \"none\" },\n \".cm-content\": { fontFamily: \"var(--sds-typography-family-mono)\", padding: \"8px 124px 12px 4px\" },\n \".cm-gutters\": {\n backgroundColor: \"transparent\",\n border: \"none\",\n color: \"var(--json-viewer-color-caret)\",\n paddingLeft: \"5px\",\n },\n \".cm-scroller\": { overflow: \"auto\" },\n});\n\nexport const jsonEditorExtensions = [json(), foldGutter(), syntaxHighlighting(jsonHighlightStyle)];\n\nexport function serializeJson(value: unknown): string {\n try {\n return JSON.stringify(value, null, 2) ?? \"null\";\n } catch {\n return String(value);\n }\n}\n\nexport function toCssSize(size: string | number): string {\n return typeof size === \"number\" ? `${size}px` : size;\n}\n\n/**\n * Finds the fold range of every direct child (depth 1) of the root object/array\n * by scanning the text itself for matching brackets. This mirrors what\n * CodeMirror's `foldable()` would compute, but doesn't depend on the lezer\n * parser having finished tokenizing the document — which for a multi-MB\n * document is not guaranteed synchronously at mount time.\n */\nexport function computeFirstLevelFoldRanges(text: string): { from: number; to: number }[] {\n const ranges: { from: number; to: number }[] = [];\n const n = text.length;\n let i = 0;\n while (i < n && text[i] !== \"{\" && text[i] !== \"[\") i++;\n if (i >= n) return ranges;\n\n let depth = 0;\n let inString = false;\n let pendingStart = -1;\n for (; i < n; i++) {\n const ch = text[i];\n if (inString) {\n if (ch === \"\\\\\") i++;\n else if (ch === '\"') inString = false;\n continue;\n }\n if (ch === '\"') {\n inString = true;\n continue;\n }\n if (ch === \"{\" || ch === \"[\") {\n depth++;\n if (depth === 2) pendingStart = i + 1;\n continue;\n }\n if (ch === \"}\" || ch === \"]\") {\n if (depth === 2 && pendingStart !== -1) {\n ranges.push({ from: pendingStart, to: i });\n pendingStart = -1;\n }\n depth--;\n }\n }\n return ranges;\n}\n"],"names":["jsonHighlightStyle","HighlightStyle","t","jsonEditorTheme","EditorView","jsonEditorExtensions","json","foldGutter","syntaxHighlighting","serializeJson","value","toCssSize","size","computeFirstLevelFoldRanges","text","ranges","n","i","depth","inString","pendingStart","ch"],"mappings":";;;;AAKO,MAAMA,IAAqBC,EAAe,OAAO;AAAA,EACtD,EAAE,KAAKC,EAAE,cAAc,OAAO,+BAAA;AAAA,EAC9B,EAAE,KAAKA,EAAE,QAAQ,OAAO,mCAAmC,YAAY,IAAA;AAAA,EACvE,EAAE,KAAK,CAACA,EAAE,QAAQA,EAAE,MAAMA,EAAE,IAAI,GAAG,OAAO,kCAAA;AAAA,EAC1C,EAAE,KAAK,CAACA,EAAE,WAAWA,EAAE,eAAeA,EAAE,KAAK,GAAG,OAAO,uCAAA;AACzD,CAAC,GAEYC,IAAkBC,EAAW,MAAM;AAAA,EAC9C,KAAK,EAAE,iBAAiB,eAAe,OAAO,wCAAwC,UAAU,OAAA;AAAA,EAChG,gBAAgB,EAAE,SAAS,OAAA;AAAA,EAC3B,eAAe,EAAE,YAAY,qCAAqC,SAAS,qBAAA;AAAA,EAC3E,eAAe;AAAA,IACb,iBAAiB;AAAA,IACjB,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,aAAa;AAAA,EAAA;AAAA,EAEf,gBAAgB,EAAE,UAAU,OAAA;AAC9B,CAAC,GAEYC,IAAuB,CAACC,EAAA,GAAQC,KAAcC,EAAmBR,CAAkB,CAAC;AAE1F,SAASS,EAAcC,GAAwB;AACpD,MAAI;AACF,WAAO,KAAK,UAAUA,GAAO,MAAM,CAAC,KAAK;AAAA,EAC3C,QAAQ;AACN,WAAO,OAAOA,CAAK;AAAA,EACrB;AACF;AAEO,SAASC,EAAUC,GAA+B;AACvD,SAAO,OAAOA,KAAS,WAAW,GAAGA,CAAI,OAAOA;AAClD;AASO,SAASC,EAA4BC,GAA8C;AACxF,QAAMC,IAAyC,CAAA,GACzCC,IAAIF,EAAK;AACf,MAAIG,IAAI;AACR,SAAOA,IAAID,KAAKF,EAAKG,CAAC,MAAM,OAAOH,EAAKG,CAAC,MAAM,MAAK,CAAAA;AACpD,MAAIA,KAAKD,EAAG,QAAOD;AAEnB,MAAIG,IAAQ,GACRC,IAAW,IACXC,IAAe;AACnB,SAAOH,IAAID,GAAGC,KAAK;AACjB,UAAMI,IAAKP,EAAKG,CAAC;AACjB,QAAIE,GAAU;AACZ,MAAIE,MAAO,OAAMJ,MACRI,MAAO,QAAKF,IAAW;AAChC;AAAA,IACF;AACA,QAAIE,MAAO,KAAK;AACd,MAAAF,IAAW;AACX;AAAA,IACF;AACA,QAAIE,MAAO,OAAOA,MAAO,KAAK;AAC5B,MAAAH,KACIA,MAAU,MAAGE,IAAeH,IAAI;AACpC;AAAA,IACF;AACA,KAAII,MAAO,OAAOA,MAAO,SACnBH,MAAU,KAAKE,MAAiB,OAClCL,EAAO,KAAK,EAAE,MAAMK,GAAc,IAAIH,GAAG,GACzCG,IAAe,KAEjBF;AAAA,EAEJ;AACA,SAAOH;AACT;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),n=require("../../../vendor/clsx/dist/clsx.cjs"),t=require("react-aria-components");;/* empty css */function
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),n=require("../../../vendor/clsx/dist/clsx.cjs"),t=require("react-aria-components");;/* empty css */function o({className:i,...a}){const s=n.clsx(i,"navigation-pill");return l.jsx(t.Tab,{className:s,...a})}function c({className:i,...a}){const s=n.clsx(i,"navigation-pill-list");return l.jsx(t.TabList,{className:s,...a})}function r({className:i,...a}){const s=n.clsx(i,"navigation-pill-panel");return l.jsx(t.TabPanel,{className:s,...a})}function u({className:i,shape:a="pill",...s}){const e=n.clsx(i,"navigation-pills",`navigation-pills-shape-${a}`);return l.jsx(t.Tabs,{className:e,...s})}exports.NavigationPill=o;exports.NavigationPillList=c;exports.NavigationPillPanel=r;exports.NavigationPills=u;
|
|
2
2
|
//# sourceMappingURL=NavigationPill.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationPill.cjs","sources":["../../../../../src/ui/primitives/NavigationPill/NavigationPill.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport {\n Tab as RACTab,\n TabList as RACTabList,\n TabPanel as RACTabPanel,\n Tabs as RACTabs,\n type TabListProps as RACTabListProps,\n type TabPanelProps as RACTabPanelProps,\n type TabProps as RACTabProps,\n type TabsProps as RACTabsProps,\n} from \"react-aria-components\";\nimport \"./navigationPill.css\";\n\nexport type NavigationPillProps = RACTabProps;\nexport function NavigationPill({ className, ...props }: NavigationPillProps) {\n const classNames = clsx(className, \"navigation-pill\");\n return <RACTab className={classNames} {...props} />;\n}\n\nexport type NavigationPillListProps<T> = RACTabListProps<T>;\nexport function NavigationPillList<T extends object>({\n className,\n ...props\n}: NavigationPillListProps<T>) {\n const classNames = clsx(className, \"navigation-pill-list\");\n return <RACTabList className={classNames} {...props} />;\n}\n\nexport type NavigationPillPanelProps = RACTabPanelProps;\nexport function NavigationPillPanel({\n className,\n ...props\n}: NavigationPillPanelProps) {\n const classNames = clsx(className, \"navigation-pill-panel\");\n return <RACTabPanel className={classNames} {...props} />;\n}\n\nexport type NavigationPillsProps = RACTabsProps;\nexport function NavigationPills({
|
|
1
|
+
{"version":3,"file":"NavigationPill.cjs","sources":["../../../../../src/ui/primitives/NavigationPill/NavigationPill.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport {\n Tab as RACTab,\n TabList as RACTabList,\n TabPanel as RACTabPanel,\n Tabs as RACTabs,\n type TabListProps as RACTabListProps,\n type TabPanelProps as RACTabPanelProps,\n type TabProps as RACTabProps,\n type TabsProps as RACTabsProps,\n} from \"react-aria-components\";\nimport \"./navigationPill.css\";\n\nexport type NavigationPillProps = RACTabProps;\nexport function NavigationPill({ className, ...props }: NavigationPillProps) {\n const classNames = clsx(className, \"navigation-pill\");\n return <RACTab className={classNames} {...props} />;\n}\n\nexport type NavigationPillListProps<T> = RACTabListProps<T>;\nexport function NavigationPillList<T extends object>({\n className,\n ...props\n}: NavigationPillListProps<T>) {\n const classNames = clsx(className, \"navigation-pill-list\");\n return <RACTabList className={classNames} {...props} />;\n}\n\nexport type NavigationPillPanelProps = RACTabPanelProps;\nexport function NavigationPillPanel({\n className,\n ...props\n}: NavigationPillPanelProps) {\n const classNames = clsx(className, \"navigation-pill-panel\");\n return <RACTabPanel className={classNames} {...props} />;\n}\n\nexport type NavigationPillShape = \"pill\" | \"rounded\";\n\nexport type NavigationPillsProps = RACTabsProps & {\n shape?: NavigationPillShape;\n};\nexport function NavigationPills({\n className,\n shape = \"pill\",\n ...props\n}: NavigationPillsProps) {\n const classNames = clsx(className, \"navigation-pills\", `navigation-pills-shape-${shape}`);\n return <RACTabs className={classNames} {...props} />;\n}\n"],"names":["NavigationPill","className","props","classNames","clsx","jsx","RACTab","NavigationPillList","RACTabList","NavigationPillPanel","RACTabPanel","NavigationPills","shape","RACTabs"],"mappings":"4OAcO,SAASA,EAAe,CAAE,UAAAC,EAAW,GAAGC,GAA8B,CAC3E,MAAMC,EAAaC,EAAAA,KAAKH,EAAW,iBAAiB,EACpD,OAAOI,EAAAA,IAACC,EAAAA,IAAA,CAAO,UAAWH,EAAa,GAAGD,EAAO,CACnD,CAGO,SAASK,EAAqC,CACnD,UAAAN,EACA,GAAGC,CACL,EAA+B,CAC7B,MAAMC,EAAaC,EAAAA,KAAKH,EAAW,sBAAsB,EACzD,OAAOI,EAAAA,IAACG,EAAAA,QAAA,CAAW,UAAWL,EAAa,GAAGD,EAAO,CACvD,CAGO,SAASO,EAAoB,CAClC,UAAAR,EACA,GAAGC,CACL,EAA6B,CAC3B,MAAMC,EAAaC,EAAAA,KAAKH,EAAW,uBAAuB,EAC1D,OAAOI,EAAAA,IAACK,EAAAA,SAAA,CAAY,UAAWP,EAAa,GAAGD,EAAO,CACxD,CAOO,SAASS,EAAgB,CAC9B,UAAAV,EACA,MAAAW,EAAQ,OACR,GAAGV,CACL,EAAyB,CACvB,MAAMC,EAAaC,EAAAA,KAAKH,EAAW,mBAAoB,0BAA0BW,CAAK,EAAE,EACxF,OAAOP,EAAAA,IAACQ,EAAAA,KAAA,CAAQ,UAAWV,EAAa,GAAGD,EAAO,CACpD"}
|
|
@@ -1,33 +1,37 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { clsx as
|
|
3
|
-
import { Tab as
|
|
1
|
+
import { jsx as l } from "react/jsx-runtime";
|
|
2
|
+
import { clsx as n } from "../../../vendor/clsx/dist/clsx.js";
|
|
3
|
+
import { Tab as o, TabList as c, TabPanel as e, Tabs as r } from "react-aria-components";
|
|
4
4
|
/* empty css */
|
|
5
|
-
function
|
|
6
|
-
const s =
|
|
7
|
-
return /* @__PURE__ */
|
|
5
|
+
function v({ className: a, ...i }) {
|
|
6
|
+
const s = n(a, "navigation-pill");
|
|
7
|
+
return /* @__PURE__ */ l(o, { className: s, ...i });
|
|
8
8
|
}
|
|
9
9
|
function u({
|
|
10
10
|
className: a,
|
|
11
11
|
...i
|
|
12
12
|
}) {
|
|
13
|
-
const s =
|
|
14
|
-
return /* @__PURE__ */
|
|
13
|
+
const s = n(a, "navigation-pill-list");
|
|
14
|
+
return /* @__PURE__ */ l(c, { className: s, ...i });
|
|
15
15
|
}
|
|
16
|
-
function
|
|
16
|
+
function f({
|
|
17
17
|
className: a,
|
|
18
18
|
...i
|
|
19
19
|
}) {
|
|
20
|
-
const s =
|
|
21
|
-
return /* @__PURE__ */
|
|
20
|
+
const s = n(a, "navigation-pill-panel");
|
|
21
|
+
return /* @__PURE__ */ l(e, { className: s, ...i });
|
|
22
22
|
}
|
|
23
|
-
function
|
|
24
|
-
|
|
25
|
-
|
|
23
|
+
function P({
|
|
24
|
+
className: a,
|
|
25
|
+
shape: i = "pill",
|
|
26
|
+
...s
|
|
27
|
+
}) {
|
|
28
|
+
const t = n(a, "navigation-pills", `navigation-pills-shape-${i}`);
|
|
29
|
+
return /* @__PURE__ */ l(r, { className: t, ...s });
|
|
26
30
|
}
|
|
27
31
|
export {
|
|
28
|
-
|
|
32
|
+
v as NavigationPill,
|
|
29
33
|
u as NavigationPillList,
|
|
30
|
-
|
|
31
|
-
|
|
34
|
+
f as NavigationPillPanel,
|
|
35
|
+
P as NavigationPills
|
|
32
36
|
};
|
|
33
37
|
//# sourceMappingURL=NavigationPill.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationPill.js","sources":["../../../../../src/ui/primitives/NavigationPill/NavigationPill.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport {\n Tab as RACTab,\n TabList as RACTabList,\n TabPanel as RACTabPanel,\n Tabs as RACTabs,\n type TabListProps as RACTabListProps,\n type TabPanelProps as RACTabPanelProps,\n type TabProps as RACTabProps,\n type TabsProps as RACTabsProps,\n} from \"react-aria-components\";\nimport \"./navigationPill.css\";\n\nexport type NavigationPillProps = RACTabProps;\nexport function NavigationPill({ className, ...props }: NavigationPillProps) {\n const classNames = clsx(className, \"navigation-pill\");\n return <RACTab className={classNames} {...props} />;\n}\n\nexport type NavigationPillListProps<T> = RACTabListProps<T>;\nexport function NavigationPillList<T extends object>({\n className,\n ...props\n}: NavigationPillListProps<T>) {\n const classNames = clsx(className, \"navigation-pill-list\");\n return <RACTabList className={classNames} {...props} />;\n}\n\nexport type NavigationPillPanelProps = RACTabPanelProps;\nexport function NavigationPillPanel({\n className,\n ...props\n}: NavigationPillPanelProps) {\n const classNames = clsx(className, \"navigation-pill-panel\");\n return <RACTabPanel className={classNames} {...props} />;\n}\n\nexport type NavigationPillsProps = RACTabsProps;\nexport function NavigationPills({
|
|
1
|
+
{"version":3,"file":"NavigationPill.js","sources":["../../../../../src/ui/primitives/NavigationPill/NavigationPill.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport {\n Tab as RACTab,\n TabList as RACTabList,\n TabPanel as RACTabPanel,\n Tabs as RACTabs,\n type TabListProps as RACTabListProps,\n type TabPanelProps as RACTabPanelProps,\n type TabProps as RACTabProps,\n type TabsProps as RACTabsProps,\n} from \"react-aria-components\";\nimport \"./navigationPill.css\";\n\nexport type NavigationPillProps = RACTabProps;\nexport function NavigationPill({ className, ...props }: NavigationPillProps) {\n const classNames = clsx(className, \"navigation-pill\");\n return <RACTab className={classNames} {...props} />;\n}\n\nexport type NavigationPillListProps<T> = RACTabListProps<T>;\nexport function NavigationPillList<T extends object>({\n className,\n ...props\n}: NavigationPillListProps<T>) {\n const classNames = clsx(className, \"navigation-pill-list\");\n return <RACTabList className={classNames} {...props} />;\n}\n\nexport type NavigationPillPanelProps = RACTabPanelProps;\nexport function NavigationPillPanel({\n className,\n ...props\n}: NavigationPillPanelProps) {\n const classNames = clsx(className, \"navigation-pill-panel\");\n return <RACTabPanel className={classNames} {...props} />;\n}\n\nexport type NavigationPillShape = \"pill\" | \"rounded\";\n\nexport type NavigationPillsProps = RACTabsProps & {\n shape?: NavigationPillShape;\n};\nexport function NavigationPills({\n className,\n shape = \"pill\",\n ...props\n}: NavigationPillsProps) {\n const classNames = clsx(className, \"navigation-pills\", `navigation-pills-shape-${shape}`);\n return <RACTabs className={classNames} {...props} />;\n}\n"],"names":["NavigationPill","className","props","classNames","clsx","jsx","RACTab","NavigationPillList","RACTabList","NavigationPillPanel","RACTabPanel","NavigationPills","shape","RACTabs"],"mappings":";;;;AAcO,SAASA,EAAe,EAAE,WAAAC,GAAW,GAAGC,KAA8B;AAC3E,QAAMC,IAAaC,EAAKH,GAAW,iBAAiB;AACpD,SAAO,gBAAAI,EAACC,GAAA,EAAO,WAAWH,GAAa,GAAGD,GAAO;AACnD;AAGO,SAASK,EAAqC;AAAA,EACnD,WAAAN;AAAA,EACA,GAAGC;AACL,GAA+B;AAC7B,QAAMC,IAAaC,EAAKH,GAAW,sBAAsB;AACzD,SAAO,gBAAAI,EAACG,GAAA,EAAW,WAAWL,GAAa,GAAGD,GAAO;AACvD;AAGO,SAASO,EAAoB;AAAA,EAClC,WAAAR;AAAA,EACA,GAAGC;AACL,GAA6B;AAC3B,QAAMC,IAAaC,EAAKH,GAAW,uBAAuB;AAC1D,SAAO,gBAAAI,EAACK,GAAA,EAAY,WAAWP,GAAa,GAAGD,GAAO;AACxD;AAOO,SAASS,EAAgB;AAAA,EAC9B,WAAAV;AAAA,EACA,OAAAW,IAAQ;AAAA,EACR,GAAGV;AACL,GAAyB;AACvB,QAAMC,IAAaC,EAAKH,GAAW,oBAAoB,0BAA0BW,CAAK,EAAE;AACxF,SAAO,gBAAAP,EAACQ,GAAA,EAAQ,WAAWV,GAAa,GAAGD,GAAO;AACpD;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),m=require("../../../vendor/clsx/dist/clsx.cjs"),a=require("react"),s=require("react-aria-components");;/* empty css */const q=require("../../hooks/useOverlayPortal.cjs"),j=require("../Fieldset/Fieldset.cjs"),S=require("../Input/Input.cjs"),i=require("../ListBox/ListBox.cjs"),v=a.forwardRef(function({className:u,results:t,onSearch:n,...o},l){const[h,x]=a.useState(""),c=e=>{x(e),n&&n(e)},p=m.clsx(u,"search-input-container"),d=q.useOverlayPortalContainer();return r.jsxs(s.ComboBox,{className:p,children:[r.jsx(j.Label,{hidden:!0,children:o["aria-label"]||"Search"}),r.jsx(S.Input,{type:"search",className:"search-input",value:h,onInput:e=>c(e.currentTarget.value),ref:l,...o}),r.jsx(s.Popover,{UNSTABLE_portalContainer:d,children:r.jsx(i.ListBox,{children:t==null?void 0:t.map(e=>r.jsx(i.ListBoxItem,{onAction:()=>c(e),children:e},e))})})]})});exports.Search=v;
|
|
2
2
|
//# sourceMappingURL=Search.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Search.cjs","sources":["../../../../../src/ui/primitives/Search/Search.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport {
|
|
1
|
+
{"version":3,"file":"Search.cjs","sources":["../../../../../src/ui/primitives/Search/Search.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { Input, Label, ListBox, ListBoxItem } from \"primitives\";\nimport React, { useState } from \"react\";\nimport {\n ComboBox as RACComboBox,\n Popover as RACPopover,\n type InputProps as RACInputProps,\n} from \"react-aria-components\";\nimport \"./search.css\";\n\nexport type SearchProps = Omit<RACInputProps, \"results\"> & {\n results?: string[];\n onSearch?: (search: string) => void;\n};\n\nexport const Search = React.forwardRef(function Search(\n { className, results, onSearch, ...props }: SearchProps,\n ref: React.ForwardedRef<HTMLInputElement>,\n) {\n const [searchTerm, setSearchTerm] = useState(\"\");\n\n const onInputInput = (search: string) => {\n setSearchTerm(search);\n if (onSearch) {\n onSearch(search);\n }\n };\n\n const classNames = clsx(className, \"search-input-container\");\n // Sem container explícito o dropdown faz portal no document.body — fora da\n // shadow root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n\n return (\n <RACComboBox className={classNames}>\n <Label hidden>{props[\"aria-label\"] || \"Search\"}</Label>\n <Input\n type=\"search\"\n className=\"search-input\"\n value={searchTerm}\n onInput={(e) => onInputInput(e.currentTarget.value)}\n ref={ref}\n {...props}\n />\n <RACPopover UNSTABLE_portalContainer={portalContainer}>\n <ListBox>\n {results?.map((a) => (\n <ListBoxItem key={a} onAction={() => onInputInput(a)}>\n {a}\n </ListBoxItem>\n ))}\n </ListBox>\n </RACPopover>\n </RACComboBox>\n );\n});\n"],"names":["Search","React","className","results","onSearch","props","ref","searchTerm","setSearchTerm","useState","onInputInput","search","classNames","clsx","portalContainer","useOverlayPortalContainer","jsxs","RACComboBox","jsx","Label","Input","RACPopover","ListBox","a","ListBoxItem"],"mappings":"qZAgBaA,EAASC,EAAM,WAAW,SACrC,CAAE,UAAAC,EAAW,QAAAC,EAAS,SAAAC,EAAU,GAAGC,CAAA,EACnCC,EACA,CACA,KAAM,CAACC,EAAYC,CAAa,EAAIC,EAAAA,SAAS,EAAE,EAEzCC,EAAgBC,GAAmB,CACvCH,EAAcG,CAAM,EAChBP,GACFA,EAASO,CAAM,CAEnB,EAEMC,EAAaC,EAAAA,KAAKX,EAAW,wBAAwB,EAGrDY,EAAkBC,EAAAA,0BAAA,EAExB,OACEC,EAAAA,KAACC,EAAAA,SAAA,CAAY,UAAWL,EACtB,SAAA,CAAAM,MAACC,EAAAA,OAAM,OAAM,GAAE,SAAAd,EAAM,YAAY,GAAK,SAAS,EAC/Ca,EAAAA,IAACE,EAAAA,MAAA,CACC,KAAK,SACL,UAAU,eACV,MAAOb,EACP,QAAU,GAAMG,EAAa,EAAE,cAAc,KAAK,EAClD,IAAAJ,EACC,GAAGD,CAAA,CAAA,EAENa,EAAAA,IAACG,EAAAA,SAAW,yBAA0BP,EACpC,eAACQ,EAAAA,QAAA,CACE,SAAAnB,GAAA,YAAAA,EAAS,IAAKoB,SACZC,cAAA,CAAoB,SAAU,IAAMd,EAAaa,CAAC,EAChD,SAAAA,CAAA,EADeA,CAElB,EACD,CACH,CAAA,CACF,CAAA,EACF,CAEJ,CAAC"}
|
|
@@ -1,60 +1,33 @@
|
|
|
1
|
-
import { jsxs as f, jsx as
|
|
2
|
-
import { clsx as
|
|
3
|
-
import
|
|
4
|
-
import { ComboBox as
|
|
1
|
+
import { jsxs as f, jsx as o } from "react/jsx-runtime";
|
|
2
|
+
import { clsx as h } from "../../../vendor/clsx/dist/clsx.js";
|
|
3
|
+
import u, { useState as d } from "react";
|
|
4
|
+
import { ComboBox as x, Popover as I } from "react-aria-components";
|
|
5
5
|
/* empty css */
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
/* @__PURE__ */ e(L, { hidden: !0, children: i["aria-label"] || "Search" }),
|
|
19
|
-
/* @__PURE__ */ e(
|
|
20
|
-
P,
|
|
6
|
+
import { useOverlayPortalContainer as S } from "../../hooks/useOverlayPortal.js";
|
|
7
|
+
import { Label as v } from "../Fieldset/Fieldset.js";
|
|
8
|
+
import { Input as B } from "../Input/Input.js";
|
|
9
|
+
import { ListBox as C, ListBoxItem as L } from "../ListBox/ListBox.js";
|
|
10
|
+
const E = u.forwardRef(function({ className: i, results: t, onSearch: e, ...n }, c) {
|
|
11
|
+
const [m, p] = d(""), a = (r) => {
|
|
12
|
+
p(r), e && e(r);
|
|
13
|
+
}, s = h(i, "search-input-container"), l = S();
|
|
14
|
+
return /* @__PURE__ */ f(x, { className: s, children: [
|
|
15
|
+
/* @__PURE__ */ o(v, { hidden: !0, children: n["aria-label"] || "Search" }),
|
|
16
|
+
/* @__PURE__ */ o(
|
|
17
|
+
B,
|
|
21
18
|
{
|
|
22
19
|
type: "search",
|
|
23
20
|
className: "search-input",
|
|
24
|
-
value:
|
|
25
|
-
onInput: (r) =>
|
|
26
|
-
ref:
|
|
27
|
-
|
|
28
|
-
},
|
|
29
|
-
...i
|
|
21
|
+
value: m,
|
|
22
|
+
onInput: (r) => a(r.currentTarget.value),
|
|
23
|
+
ref: c,
|
|
24
|
+
...n
|
|
30
25
|
}
|
|
31
26
|
),
|
|
32
|
-
/* @__PURE__ */
|
|
33
|
-
m,
|
|
34
|
-
{
|
|
35
|
-
"aria-label": "Clear search",
|
|
36
|
-
onPress: () => n(""),
|
|
37
|
-
size: "small",
|
|
38
|
-
variant: "subtle",
|
|
39
|
-
children: /* @__PURE__ */ e(S, {})
|
|
40
|
-
}
|
|
41
|
-
) : /* @__PURE__ */ e(
|
|
42
|
-
m,
|
|
43
|
-
{
|
|
44
|
-
"aria-label": "Clear search",
|
|
45
|
-
onPress: () => {
|
|
46
|
-
var r;
|
|
47
|
-
return (r = t == null ? void 0 : t.current) == null ? void 0 : r.focus();
|
|
48
|
-
},
|
|
49
|
-
size: "small",
|
|
50
|
-
variant: "subtle",
|
|
51
|
-
children: /* @__PURE__ */ e(B, {})
|
|
52
|
-
}
|
|
53
|
-
) }),
|
|
54
|
-
/* @__PURE__ */ e(C, { UNSTABLE_portalContainer: u, children: /* @__PURE__ */ e(T, { children: a == null ? void 0 : a.map((r) => /* @__PURE__ */ e(y, { onAction: () => n(r), children: r }, r)) }) })
|
|
27
|
+
/* @__PURE__ */ o(I, { UNSTABLE_portalContainer: l, children: /* @__PURE__ */ o(C, { children: t == null ? void 0 : t.map((r) => /* @__PURE__ */ o(L, { onAction: () => a(r), children: r }, r)) }) })
|
|
55
28
|
] });
|
|
56
29
|
});
|
|
57
30
|
export {
|
|
58
|
-
|
|
31
|
+
E as Search
|
|
59
32
|
};
|
|
60
33
|
//# sourceMappingURL=Search.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Search.js","sources":["../../../../../src/ui/primitives/Search/Search.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport {
|
|
1
|
+
{"version":3,"file":"Search.js","sources":["../../../../../src/ui/primitives/Search/Search.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { Input, Label, ListBox, ListBoxItem } from \"primitives\";\nimport React, { useState } from \"react\";\nimport {\n ComboBox as RACComboBox,\n Popover as RACPopover,\n type InputProps as RACInputProps,\n} from \"react-aria-components\";\nimport \"./search.css\";\n\nexport type SearchProps = Omit<RACInputProps, \"results\"> & {\n results?: string[];\n onSearch?: (search: string) => void;\n};\n\nexport const Search = React.forwardRef(function Search(\n { className, results, onSearch, ...props }: SearchProps,\n ref: React.ForwardedRef<HTMLInputElement>,\n) {\n const [searchTerm, setSearchTerm] = useState(\"\");\n\n const onInputInput = (search: string) => {\n setSearchTerm(search);\n if (onSearch) {\n onSearch(search);\n }\n };\n\n const classNames = clsx(className, \"search-input-container\");\n // Sem container explícito o dropdown faz portal no document.body — fora da\n // shadow root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n\n return (\n <RACComboBox className={classNames}>\n <Label hidden>{props[\"aria-label\"] || \"Search\"}</Label>\n <Input\n type=\"search\"\n className=\"search-input\"\n value={searchTerm}\n onInput={(e) => onInputInput(e.currentTarget.value)}\n ref={ref}\n {...props}\n />\n <RACPopover UNSTABLE_portalContainer={portalContainer}>\n <ListBox>\n {results?.map((a) => (\n <ListBoxItem key={a} onAction={() => onInputInput(a)}>\n {a}\n </ListBoxItem>\n ))}\n </ListBox>\n </RACPopover>\n </RACComboBox>\n );\n});\n"],"names":["Search","React","className","results","onSearch","props","ref","searchTerm","setSearchTerm","useState","onInputInput","search","classNames","clsx","portalContainer","useOverlayPortalContainer","jsxs","RACComboBox","jsx","Label","Input","e","RACPopover","ListBox","a","ListBoxItem"],"mappings":";;;;;;;;;AAgBO,MAAMA,IAASC,EAAM,WAAW,SACrC,EAAE,WAAAC,GAAW,SAAAC,GAAS,UAAAC,GAAU,GAAGC,EAAA,GACnCC,GACA;AACA,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAS,EAAE,GAEzCC,IAAe,CAACC,MAAmB;AACvC,IAAAH,EAAcG,CAAM,GAChBP,KACFA,EAASO,CAAM;AAAA,EAEnB,GAEMC,IAAaC,EAAKX,GAAW,wBAAwB,GAGrDY,IAAkBC,EAAA;AAExB,SACE,gBAAAC,EAACC,GAAA,EAAY,WAAWL,GACtB,UAAA;AAAA,IAAA,gBAAAM,EAACC,KAAM,QAAM,IAAE,UAAAd,EAAM,YAAY,KAAK,UAAS;AAAA,IAC/C,gBAAAa;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,OAAOb;AAAA,QACP,SAAS,CAACc,MAAMX,EAAaW,EAAE,cAAc,KAAK;AAAA,QAClD,KAAAf;AAAA,QACC,GAAGD;AAAA,MAAA;AAAA,IAAA;AAAA,IAEN,gBAAAa,EAACI,KAAW,0BAA0BR,GACpC,4BAACS,GAAA,EACE,UAAApB,KAAA,gBAAAA,EAAS,IAAI,CAACqB,wBACZC,GAAA,EAAoB,UAAU,MAAMf,EAAac,CAAC,GAChD,UAAAA,EAAA,GADeA,CAElB,GACD,CACH,EAAA,CACF;AAAA,EAAA,GACF;AAEJ,CAAC;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("../../../vendor/clsx/dist/clsx.cjs"),m=require("react"),n=require("react-aria-components");;/* empty css */const g=require("../../icons/IconChevronDown.cjs"),f=require("../../icons/IconChevronUp.cjs"),j=require("../Checkbox/Checkbox.cjs"),p=require("../Radio/Radio.cjs"),h=m.createContext("checkbox");function v(s){const l=Number(s);return`${s}`.trim()!==""&&Number.isFinite(l)?`${l}px`:`${s}`}function y({bleed:s=!1,dense:l=!1,grid:t=!1,striped:o=!1,selectionType:i="checkbox",maxHeight:a,className:d,...r}){const b=a!==void 0,C=c.clsx(d,"table-container",s&&"table-container-bleed",b&&"table-container-scrollable"),N=b?{"--table-max-height":v(a)}:void 0,T=c.clsx("sds-table",s&&"table-bleed",l&&"table-dense",t&&"table-grid",o&&"sds-table-striped");return e.jsx("div",{className:C,style:N,children:e.jsx(h.Provider,{value:i,children:e.jsx(n.Table,{className:T,...r})})})}function x({align:s="start",className:l,...t}){const o=c.clsx(l,"table-column",`table-align-${s}`);return e.jsx(n.Column,{className:o,...t,children:({allowsSorting:i,sortDirection:a})=>e.jsx("div",{className:c.clsx("table-column-inner"),children:e.jsxs(e.Fragment,{children:[t.children,i&&e.jsx("span",{"aria-hidden":"true",className:c.clsx("sort-indicator",!a&&"sort-indicator-unsorted"),children:a==="descending"?e.jsx(g.IconChevronDown,{}):e.jsx(f.IconChevronUp,{})})]})})})}function k({className:s,...l}){return e.jsx(n.TableBody,{...l})}function q({className:s,columns:l,children:t,...o}){const{selectionBehavior:i,selectionMode:a,allowsDragging:d}=n.useTableOptions(),r=m.useContext(h),b=c.clsx(s,"table-head");return e.jsxs(n.TableHeader,{className:b,...o,children:[d&&e.jsx(x,{}),i==="toggle"&&e.jsx(x,{className:c.clsx("table-selection-col",r==="radio"&&"table-selection-col--radio"),children:a==="multiple"&&e.jsx(n.Checkbox,{slot:"selection",className:"table-selection-checkbox",children:e.jsx(j.Checkbox,{})})}),e.jsx(n.Collection,{items:l,children:t})]})}function w({id:s,columns:l,children:t,className:o,...i}){const{selectionBehavior:a,allowsDragging:d}=n.useTableOptions(),r=m.useContext(h),b=c.clsx(o,"table-row");return e.jsxs(n.Row,{id:s,...i,className:b,children:[d&&e.jsx(u,{children:e.jsx(n.Button,{slot:"drag",children:"≡"})}),a==="toggle"&&e.jsx(u,{className:c.clsx("table-selection-cell",r==="radio"&&"table-selection-cell--radio"),children:e.jsx(n.Checkbox,{slot:"selection",className:"table-selection-checkbox",children:r==="radio"?e.jsx(p.Radio,{}):e.jsx(j.Checkbox,{})})}),e.jsx(n.Collection,{items:l,children:t})]})}function u({align:s="start",className:l,...t}){const o=c.clsx(l,"table-cell",`table-align-${s}`);return e.jsx(n.Cell,{className:o,...t})}exports.Table=y;exports.TableBody=k;exports.TableCell=u;exports.TableColumn=x;exports.TableHead=q;exports.TableRow=w;
|
|
2
2
|
//# sourceMappingURL=Table.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.cjs","sources":["../../../../../src/ui/primitives/Table/Table.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { IconChevronDown, IconChevronUp } from \"icons\";\nimport type { CSSProperties } from \"react\";\nimport { Checkbox } from \"primitives\";\nimport {\n Button as RACButton,\n Cell as RACCell,\n Checkbox as RACSelectionCheckbox,\n Collection as RACCollection,\n Column as RACColumn,\n Row as RACRow,\n Table as RACTable,\n TableBody as RACTableBody,\n TableHeader as RACTableHeader,\n useTableOptions,\n type CellProps as RACCellProps,\n type ColumnProps as RACColumnProps,\n type RowProps as RACRowProps,\n type TableBodyProps as RACTableBodyProps,\n type TableHeaderProps as RACTableHeaderProps,\n type TableProps as RACTableProps,\n} from \"react-aria-components\";\nimport \"./table.css\";\n\ntype TableAlign = \"start\" | \"center\" | \"right\";\n\nfunction toCssLength(value: number | string): string {\n const numericValue = Number(value);\n const isUnitlessNumber =\n `${value}`.trim() !== \"\" && Number.isFinite(numericValue);\n return isUnitlessNumber ? `${numericValue}px` : `${value}`;\n}\n\nexport type TableProps = RACTableProps & {\n bleed?: boolean;\n dense?: boolean;\n grid?: boolean;\n striped?: boolean;\n maxHeight?: number | string;\n};\nexport function Table({\n bleed = false,\n dense = false,\n grid = false,\n striped = false,\n maxHeight,\n className,\n ...props\n}: TableProps) {\n const scrollsVertically = maxHeight !== undefined;\n const containerClassNames = clsx(\n className,\n \"table-container\",\n bleed && \"table-container-bleed\",\n scrollsVertically && \"table-container-scrollable\",\n );\n const containerStyle = scrollsVertically\n ? ({ \"--table-max-height\": toCssLength(maxHeight) } as CSSProperties)\n : undefined;\n const tableClassNames = clsx(\n \"sds-table\",\n bleed && \"table-bleed\",\n dense && \"table-dense\",\n grid && \"table-grid\",\n striped && \"sds-table-striped\",\n );\n return (\n <div className={containerClassNames} style={containerStyle}>\n <RACTable className={tableClassNames} {...props} />\n </div>\n );\n}\n\nexport type TableColumnProps = RACColumnProps & {\n align?: TableAlign;\n};\nexport function TableColumn({\n align = \"start\",\n className,\n ...props\n}: TableColumnProps) {\n const classNames = clsx(className, \"table-column\", `table-align-${align}`);\n return (\n <RACColumn className={classNames} {...props}>\n {({ allowsSorting, sortDirection }) => (\n <div className={clsx(\"table-column-inner\")}>\n <>\n {props.children}\n {allowsSorting && (\n <span\n aria-hidden=\"true\"\n className={clsx(\n \"sort-indicator\",\n !sortDirection && \"sort-indicator-unsorted\",\n )}\n >\n {sortDirection === \"descending\" ? (\n <IconChevronDown />\n ) : (\n <IconChevronUp />\n )}\n </span>\n )}\n </>\n </div>\n )}\n </RACColumn>\n );\n}\n\nexport type TableBodyProps<T> = RACTableBodyProps<T>;\nexport function TableBody<T extends object>({\n className,\n ...props\n}: TableBodyProps<T>) {\n return <RACTableBody {...props} />;\n}\n\nexport type TableHeadProps<T> = RACTableHeaderProps<T>;\nexport function TableHead<T extends object>({\n className,\n columns,\n children,\n ...props\n}: TableHeadProps<T>) {\n const { selectionBehavior, selectionMode, allowsDragging } =\n useTableOptions();\n const classNames = clsx(className, \"table-head\");\n return (\n <RACTableHeader className={classNames} {...props}>\n {/* Add extra columns for drag and drop and selection. */}\n {allowsDragging && <TableColumn />}\n {selectionBehavior === \"toggle\" && (\n <TableColumn className=\"table-selection-col\">\n {selectionMode === \"multiple\" && (\n <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n <Checkbox />\n </RACSelectionCheckbox>\n )}\n </TableColumn>\n )}\n <RACCollection items={columns}>{children}</RACCollection>\n </RACTableHeader>\n );\n}\n\nexport type TableRowProps<T> = RACRowProps<T>;\nexport function TableRow<T extends object>({\n id,\n columns,\n children,\n className,\n ...otherProps\n}: TableRowProps<T>) {\n const { selectionBehavior, allowsDragging } = useTableOptions();\n const classNames = clsx(className, \"table-row\");\n return (\n <RACRow id={id} {...otherProps} className={classNames}>\n {allowsDragging && (\n <TableCell>\n <RACButton slot=\"drag\">≡</RACButton>\n </TableCell>\n )}\n {selectionBehavior === \"toggle\" && (\n <TableCell className=\"table-selection-cell\">\n <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n <Checkbox />\n </RACSelectionCheckbox>\n </TableCell>\n )}\n <RACCollection items={columns}>{children}</RACCollection>\n </RACRow>\n );\n}\n\nexport type TableCellProps = RACCellProps & { align?: TableAlign };\nexport function TableCell({\n align = \"start\",\n className,\n ...props\n}: TableCellProps) {\n const classNames = clsx(className, \"table-cell\", `table-align-${align}`);\n return <RACCell className={classNames} {...props} />;\n}\n"],"names":["toCssLength","value","numericValue","Table","bleed","dense","grid","striped","maxHeight","className","props","scrollsVertically","containerClassNames","clsx","containerStyle","tableClassNames","jsx","RACTable","TableColumn","align","classNames","RACColumn","allowsSorting","sortDirection","jsxs","Fragment","IconChevronDown","IconChevronUp","TableBody","RACTableBody","TableHead","columns","children","selectionBehavior","selectionMode","allowsDragging","useTableOptions","RACTableHeader","RACSelectionCheckbox","Checkbox","RACCollection","TableRow","id","otherProps","RACRow","TableCell","RACButton","RACCell"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Table.cjs","sources":["../../../../../src/ui/primitives/Table/Table.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { IconChevronDown, IconChevronUp } from \"icons\";\nimport { Checkbox, Radio } from \"primitives\";\nimport { createContext, useContext, type CSSProperties } from \"react\";\nimport {\n Button as RACButton,\n Cell as RACCell,\n Checkbox as RACSelectionCheckbox,\n Collection as RACCollection,\n Column as RACColumn,\n Row as RACRow,\n Table as RACTable,\n TableBody as RACTableBody,\n TableHeader as RACTableHeader,\n useTableOptions,\n type CellProps as RACCellProps,\n type ColumnProps as RACColumnProps,\n type RowProps as RACRowProps,\n type TableBodyProps as RACTableBodyProps,\n type TableHeaderProps as RACTableHeaderProps,\n type TableProps as RACTableProps,\n} from \"react-aria-components\";\nimport \"./table.css\";\n\ntype TableAlign = \"start\" | \"center\" | \"right\";\n\n/**\n * Visual style of the built-in selection control rendered in the selection\n * column (header \"select all\" + per-row toggle). \"radio\" is for\n * `selectionMode=\"single\"` tables where a round, single-choice control reads\n * better than a checkbox — the header never renders a control either way\n * (there is no \"select all\" for a single choice).\n */\ntype SelectionType = \"checkbox\" | \"radio\";\nconst SelectionTypeContext = createContext<SelectionType>(\"checkbox\");\n\nfunction toCssLength(value: number | string): string {\n const numericValue = Number(value);\n const isUnitlessNumber =\n `${value}`.trim() !== \"\" && Number.isFinite(numericValue);\n return isUnitlessNumber ? `${numericValue}px` : `${value}`;\n}\n\nexport type TableProps = RACTableProps & {\n bleed?: boolean;\n dense?: boolean;\n grid?: boolean;\n striped?: boolean;\n selectionType?: SelectionType;\n maxHeight?: number | string;\n};\nexport function Table({\n bleed = false,\n dense = false,\n grid = false,\n striped = false,\n selectionType = \"checkbox\",\n maxHeight,\n className,\n ...props\n}: TableProps) {\n const scrollsVertically = maxHeight !== undefined;\n const containerClassNames = clsx(\n className,\n \"table-container\",\n bleed && \"table-container-bleed\",\n scrollsVertically && \"table-container-scrollable\",\n );\n const containerStyle = scrollsVertically\n ? ({ \"--table-max-height\": toCssLength(maxHeight) } as CSSProperties)\n : undefined;\n const tableClassNames = clsx(\n \"sds-table\",\n bleed && \"table-bleed\",\n dense && \"table-dense\",\n grid && \"table-grid\",\n striped && \"sds-table-striped\",\n );\n return (\n <div className={containerClassNames} style={containerStyle}>\n <SelectionTypeContext.Provider value={selectionType}>\n <RACTable className={tableClassNames} {...props} />\n </SelectionTypeContext.Provider>\n </div>\n );\n}\n\nexport type TableColumnProps = RACColumnProps & {\n align?: TableAlign;\n};\nexport function TableColumn({\n align = \"start\",\n className,\n ...props\n}: TableColumnProps) {\n const classNames = clsx(className, \"table-column\", `table-align-${align}`);\n return (\n <RACColumn className={classNames} {...props}>\n {({ allowsSorting, sortDirection }) => (\n <div className={clsx(\"table-column-inner\")}>\n <>\n {props.children}\n {allowsSorting && (\n <span\n aria-hidden=\"true\"\n className={clsx(\n \"sort-indicator\",\n !sortDirection && \"sort-indicator-unsorted\",\n )}\n >\n {sortDirection === \"descending\" ? (\n <IconChevronDown />\n ) : (\n <IconChevronUp />\n )}\n </span>\n )}\n </>\n </div>\n )}\n </RACColumn>\n );\n}\n\nexport type TableBodyProps<T> = RACTableBodyProps<T>;\nexport function TableBody<T extends object>({\n className,\n ...props\n}: TableBodyProps<T>) {\n return <RACTableBody {...props} />;\n}\n\nexport type TableHeadProps<T> = RACTableHeaderProps<T>;\nexport function TableHead<T extends object>({\n className,\n columns,\n children,\n ...props\n}: TableHeadProps<T>) {\n const { selectionBehavior, selectionMode, allowsDragging } =\n useTableOptions();\n const selectionType = useContext(SelectionTypeContext);\n const classNames = clsx(className, \"table-head\");\n return (\n <RACTableHeader className={classNames} {...props}>\n {/* Add extra columns for drag and drop and selection. */}\n {allowsDragging && <TableColumn />}\n {selectionBehavior === \"toggle\" && (\n <TableColumn\n className={clsx(\n \"table-selection-col\",\n selectionType === \"radio\" && \"table-selection-col--radio\",\n )}\n >\n {selectionMode === \"multiple\" && (\n <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n <Checkbox />\n </RACSelectionCheckbox>\n )}\n </TableColumn>\n )}\n <RACCollection items={columns}>{children}</RACCollection>\n </RACTableHeader>\n );\n}\n\nexport type TableRowProps<T> = RACRowProps<T>;\nexport function TableRow<T extends object>({\n id,\n columns,\n children,\n className,\n ...otherProps\n}: TableRowProps<T>) {\n const { selectionBehavior, allowsDragging } = useTableOptions();\n const selectionType = useContext(SelectionTypeContext);\n const classNames = clsx(className, \"table-row\");\n return (\n <RACRow id={id} {...otherProps} className={classNames}>\n {allowsDragging && (\n <TableCell>\n <RACButton slot=\"drag\">≡</RACButton>\n </TableCell>\n )}\n {selectionBehavior === \"toggle\" && (\n <TableCell\n className={clsx(\n \"table-selection-cell\",\n selectionType === \"radio\" && \"table-selection-cell--radio\",\n )}\n >\n <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n {selectionType === \"radio\" ? <Radio /> : <Checkbox />}\n </RACSelectionCheckbox>\n </TableCell>\n )}\n <RACCollection items={columns}>{children}</RACCollection>\n </RACRow>\n );\n}\n\nexport type TableCellProps = RACCellProps & { align?: TableAlign };\nexport function TableCell({\n align = \"start\",\n className,\n ...props\n}: TableCellProps) {\n const classNames = clsx(className, \"table-cell\", `table-align-${align}`);\n return <RACCell className={classNames} {...props} />;\n}\n"],"names":["SelectionTypeContext","createContext","toCssLength","value","numericValue","Table","bleed","dense","grid","striped","selectionType","maxHeight","className","props","scrollsVertically","containerClassNames","clsx","containerStyle","tableClassNames","RACTable","TableColumn","align","classNames","RACColumn","allowsSorting","sortDirection","jsx","jsxs","Fragment","IconChevronDown","IconChevronUp","TableBody","RACTableBody","TableHead","columns","children","selectionBehavior","selectionMode","allowsDragging","useTableOptions","useContext","RACTableHeader","RACSelectionCheckbox","Checkbox","RACCollection","TableRow","id","otherProps","RACRow","TableCell","RACButton","Radio","RACCell"],"mappings":"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"}
|
|
@@ -1,105 +1,127 @@
|
|
|
1
|
-
import { jsx as e, jsxs as
|
|
2
|
-
import { clsx as
|
|
3
|
-
import {
|
|
1
|
+
import { jsx as e, jsxs as b, Fragment as v } from "react/jsx-runtime";
|
|
2
|
+
import { clsx as a } from "../../../vendor/clsx/dist/clsx.js";
|
|
3
|
+
import { createContext as $, useContext as N } from "react";
|
|
4
|
+
import { Table as k, Column as w, TableBody as B, useTableOptions as f, TableHeader as R, Checkbox as g, Collection as p, Row as U, Button as j, Cell as D } from "react-aria-components";
|
|
4
5
|
/* empty css */
|
|
5
|
-
import { IconChevronDown as
|
|
6
|
-
import { IconChevronUp as
|
|
7
|
-
import { Checkbox as
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
import { IconChevronDown as F } from "../../icons/IconChevronDown.js";
|
|
7
|
+
import { IconChevronUp as I } from "../../icons/IconChevronUp.js";
|
|
8
|
+
import { Checkbox as C } from "../Checkbox/Checkbox.js";
|
|
9
|
+
import { Radio as S } from "../Radio/Radio.js";
|
|
10
|
+
const d = $("checkbox");
|
|
11
|
+
function V(l) {
|
|
12
|
+
const t = Number(l);
|
|
13
|
+
return `${l}`.trim() !== "" && Number.isFinite(t) ? `${t}px` : `${l}`;
|
|
11
14
|
}
|
|
12
|
-
function
|
|
15
|
+
function G({
|
|
13
16
|
bleed: l = !1,
|
|
14
|
-
dense:
|
|
15
|
-
grid:
|
|
16
|
-
striped:
|
|
17
|
+
dense: t = !1,
|
|
18
|
+
grid: s = !1,
|
|
19
|
+
striped: o = !1,
|
|
20
|
+
selectionType: c = "checkbox",
|
|
17
21
|
maxHeight: n,
|
|
18
|
-
className:
|
|
19
|
-
...
|
|
22
|
+
className: m,
|
|
23
|
+
...i
|
|
20
24
|
}) {
|
|
21
|
-
const
|
|
22
|
-
|
|
25
|
+
const r = n !== void 0, x = a(
|
|
26
|
+
m,
|
|
23
27
|
"table-container",
|
|
24
28
|
l && "table-container-bleed",
|
|
25
|
-
|
|
26
|
-
),
|
|
29
|
+
r && "table-container-scrollable"
|
|
30
|
+
), T = r ? { "--table-max-height": V(n) } : void 0, y = a(
|
|
27
31
|
"sds-table",
|
|
28
32
|
l && "table-bleed",
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
33
|
+
t && "table-dense",
|
|
34
|
+
s && "table-grid",
|
|
35
|
+
o && "sds-table-striped"
|
|
32
36
|
);
|
|
33
|
-
return /* @__PURE__ */ e("div", { className:
|
|
37
|
+
return /* @__PURE__ */ e("div", { className: x, style: T, children: /* @__PURE__ */ e(d.Provider, { value: c, children: /* @__PURE__ */ e(k, { className: y, ...i }) }) });
|
|
34
38
|
}
|
|
35
|
-
function
|
|
39
|
+
function h({
|
|
36
40
|
align: l = "start",
|
|
37
|
-
className:
|
|
38
|
-
...
|
|
41
|
+
className: t,
|
|
42
|
+
...s
|
|
39
43
|
}) {
|
|
40
|
-
const
|
|
41
|
-
return /* @__PURE__ */ e(
|
|
42
|
-
|
|
43
|
-
|
|
44
|
+
const o = a(t, "table-column", `table-align-${l}`);
|
|
45
|
+
return /* @__PURE__ */ e(w, { className: o, ...s, children: ({ allowsSorting: c, sortDirection: n }) => /* @__PURE__ */ e("div", { className: a("table-column-inner"), children: /* @__PURE__ */ b(v, { children: [
|
|
46
|
+
s.children,
|
|
47
|
+
c && /* @__PURE__ */ e(
|
|
44
48
|
"span",
|
|
45
49
|
{
|
|
46
50
|
"aria-hidden": "true",
|
|
47
|
-
className:
|
|
51
|
+
className: a(
|
|
48
52
|
"sort-indicator",
|
|
49
|
-
!
|
|
53
|
+
!n && "sort-indicator-unsorted"
|
|
50
54
|
),
|
|
51
|
-
children:
|
|
55
|
+
children: n === "descending" ? /* @__PURE__ */ e(F, {}) : /* @__PURE__ */ e(I, {})
|
|
52
56
|
}
|
|
53
57
|
)
|
|
54
58
|
] }) }) });
|
|
55
59
|
}
|
|
56
|
-
function
|
|
60
|
+
function J({
|
|
57
61
|
className: l,
|
|
58
|
-
...
|
|
62
|
+
...t
|
|
59
63
|
}) {
|
|
60
|
-
return /* @__PURE__ */ e(
|
|
64
|
+
return /* @__PURE__ */ e(B, { ...t });
|
|
61
65
|
}
|
|
62
|
-
function
|
|
66
|
+
function K({
|
|
63
67
|
className: l,
|
|
64
|
-
columns:
|
|
65
|
-
children:
|
|
66
|
-
...
|
|
68
|
+
columns: t,
|
|
69
|
+
children: s,
|
|
70
|
+
...o
|
|
67
71
|
}) {
|
|
68
|
-
const { selectionBehavior:
|
|
69
|
-
return /* @__PURE__ */
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
72
|
+
const { selectionBehavior: c, selectionMode: n, allowsDragging: m } = f(), i = N(d), r = a(l, "table-head");
|
|
73
|
+
return /* @__PURE__ */ b(R, { className: r, ...o, children: [
|
|
74
|
+
m && /* @__PURE__ */ e(h, {}),
|
|
75
|
+
c === "toggle" && /* @__PURE__ */ e(
|
|
76
|
+
h,
|
|
77
|
+
{
|
|
78
|
+
className: a(
|
|
79
|
+
"table-selection-col",
|
|
80
|
+
i === "radio" && "table-selection-col--radio"
|
|
81
|
+
),
|
|
82
|
+
children: n === "multiple" && /* @__PURE__ */ e(g, { slot: "selection", className: "table-selection-checkbox", children: /* @__PURE__ */ e(C, {}) })
|
|
83
|
+
}
|
|
84
|
+
),
|
|
85
|
+
/* @__PURE__ */ e(p, { items: t, children: s })
|
|
73
86
|
] });
|
|
74
87
|
}
|
|
75
|
-
function
|
|
88
|
+
function Q({
|
|
76
89
|
id: l,
|
|
77
|
-
columns:
|
|
78
|
-
children:
|
|
79
|
-
className:
|
|
80
|
-
...
|
|
90
|
+
columns: t,
|
|
91
|
+
children: s,
|
|
92
|
+
className: o,
|
|
93
|
+
...c
|
|
81
94
|
}) {
|
|
82
|
-
const { selectionBehavior:
|
|
83
|
-
return /* @__PURE__ */
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
95
|
+
const { selectionBehavior: n, allowsDragging: m } = f(), i = N(d), r = a(o, "table-row");
|
|
96
|
+
return /* @__PURE__ */ b(U, { id: l, ...c, className: r, children: [
|
|
97
|
+
m && /* @__PURE__ */ e(u, { children: /* @__PURE__ */ e(j, { slot: "drag", children: "≡" }) }),
|
|
98
|
+
n === "toggle" && /* @__PURE__ */ e(
|
|
99
|
+
u,
|
|
100
|
+
{
|
|
101
|
+
className: a(
|
|
102
|
+
"table-selection-cell",
|
|
103
|
+
i === "radio" && "table-selection-cell--radio"
|
|
104
|
+
),
|
|
105
|
+
children: /* @__PURE__ */ e(g, { slot: "selection", className: "table-selection-checkbox", children: i === "radio" ? /* @__PURE__ */ e(S, {}) : /* @__PURE__ */ e(C, {}) })
|
|
106
|
+
}
|
|
107
|
+
),
|
|
108
|
+
/* @__PURE__ */ e(p, { items: t, children: s })
|
|
87
109
|
] });
|
|
88
110
|
}
|
|
89
|
-
function
|
|
111
|
+
function u({
|
|
90
112
|
align: l = "start",
|
|
91
|
-
className:
|
|
92
|
-
...
|
|
113
|
+
className: t,
|
|
114
|
+
...s
|
|
93
115
|
}) {
|
|
94
|
-
const
|
|
95
|
-
return /* @__PURE__ */ e(
|
|
116
|
+
const o = a(t, "table-cell", `table-align-${l}`);
|
|
117
|
+
return /* @__PURE__ */ e(D, { className: o, ...s });
|
|
96
118
|
}
|
|
97
119
|
export {
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
120
|
+
G as Table,
|
|
121
|
+
J as TableBody,
|
|
122
|
+
u as TableCell,
|
|
123
|
+
h as TableColumn,
|
|
124
|
+
K as TableHead,
|
|
125
|
+
Q as TableRow
|
|
104
126
|
};
|
|
105
127
|
//# sourceMappingURL=Table.js.map
|