@optimum-intelligence/opti-ui 0.0.0-stage → 0.3.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/LICENSE +23 -0
- package/README.md +244 -2
- package/dist/components/accordion/Accordion.d.ts +17 -0
- package/dist/components/accordion/Accordion.js +204 -0
- package/dist/components/accordion/Accordion.js.map +1 -0
- package/dist/components/alert/Alert.d.ts +18 -0
- package/dist/components/alert/Alert.js +164 -0
- package/dist/components/alert/Alert.js.map +1 -0
- package/dist/components/app-shell/AppShell.d.ts +97 -0
- package/dist/components/app-shell/AppShell.js +689 -0
- package/dist/components/app-shell/AppShell.js.map +1 -0
- package/dist/components/avatar/Avatar.d.ts +21 -0
- package/dist/components/avatar/Avatar.js +190 -0
- package/dist/components/avatar/Avatar.js.map +1 -0
- package/dist/components/badge/Badge.d.ts +16 -0
- package/dist/components/badge/Badge.js +94 -0
- package/dist/components/badge/Badge.js.map +1 -0
- package/dist/components/breadcrumbs/Breadcrumbs.d.ts +18 -0
- package/dist/components/breadcrumbs/Breadcrumbs.js +154 -0
- package/dist/components/breadcrumbs/Breadcrumbs.js.map +1 -0
- package/dist/components/button/Button.d.ts +23 -0
- package/dist/components/button/Button.js +159 -0
- package/dist/components/button/Button.js.map +1 -0
- package/dist/components/calendar/Calendar.d.ts +59 -0
- package/dist/components/calendar/Calendar.js +709 -0
- package/dist/components/calendar/Calendar.js.map +1 -0
- package/dist/components/calendar/date-utils.d.ts +32 -0
- package/dist/components/calendar/date-utils.js +112 -0
- package/dist/components/calendar/date-utils.js.map +1 -0
- package/dist/components/card/Card.d.ts +42 -0
- package/dist/components/card/Card.js +82 -0
- package/dist/components/card/Card.js.map +1 -0
- package/dist/components/choice/Choice.d.ts +32 -0
- package/dist/components/choice/Choice.js +371 -0
- package/dist/components/choice/Choice.js.map +1 -0
- package/dist/components/collapsible/Collapsible.d.ts +15 -0
- package/dist/components/collapsible/Collapsible.js +155 -0
- package/dist/components/collapsible/Collapsible.js.map +1 -0
- package/dist/components/combobox/Combobox.d.ts +68 -0
- package/dist/components/combobox/Combobox.js +752 -0
- package/dist/components/combobox/Combobox.js.map +1 -0
- package/dist/components/command-palette/CommandPalette.d.ts +52 -0
- package/dist/components/command-palette/CommandPalette.js +328 -0
- package/dist/components/command-palette/CommandPalette.js.map +1 -0
- package/dist/components/data-table/DataTable.d.ts +73 -0
- package/dist/components/data-table/DataTable.js +478 -0
- package/dist/components/data-table/DataTable.js.map +1 -0
- package/dist/components/data-table/DataTableContent.d.ts +35 -0
- package/dist/components/data-table/DataTableContent.js +550 -0
- package/dist/components/data-table/DataTableContent.js.map +1 -0
- package/dist/components/data-table/DataTableFilters.d.ts +15 -0
- package/dist/components/data-table/DataTableFilters.js +284 -0
- package/dist/components/data-table/DataTableFilters.js.map +1 -0
- package/dist/components/data-table/DataTableRow.d.ts +33 -0
- package/dist/components/data-table/DataTableRow.js +552 -0
- package/dist/components/data-table/DataTableRow.js.map +1 -0
- package/dist/components/data-table/context.d.ts +5 -0
- package/dist/components/data-table/context.js +14 -0
- package/dist/components/data-table/context.js.map +1 -0
- package/dist/components/data-table/layout.d.ts +60 -0
- package/dist/components/data-table/layout.js +272 -0
- package/dist/components/data-table/layout.js.map +1 -0
- package/dist/components/data-table/types.d.ts +319 -0
- package/dist/components/data-table/useDataTable.d.ts +9 -0
- package/dist/components/data-table/useDataTable.js +666 -0
- package/dist/components/data-table/useDataTable.js.map +1 -0
- package/dist/components/date-picker/DatePicker.d.ts +50 -0
- package/dist/components/date-picker/DatePicker.js +485 -0
- package/dist/components/date-picker/DatePicker.js.map +1 -0
- package/dist/components/date-picker/DateRangePicker.d.ts +39 -0
- package/dist/components/date-picker/DateRangePicker.js +339 -0
- package/dist/components/date-picker/DateRangePicker.js.map +1 -0
- package/dist/components/date-picker/PickerField.d.ts +38 -0
- package/dist/components/date-picker/PickerField.js +238 -0
- package/dist/components/date-picker/PickerField.js.map +1 -0
- package/dist/components/dialog/Dialog.d.ts +70 -0
- package/dist/components/dialog/Dialog.js +354 -0
- package/dist/components/dialog/Dialog.js.map +1 -0
- package/dist/components/drawer/Drawer.d.ts +39 -0
- package/dist/components/drawer/Drawer.js +225 -0
- package/dist/components/drawer/Drawer.js.map +1 -0
- package/dist/components/empty-state/EmptyState.d.ts +12 -0
- package/dist/components/empty-state/EmptyState.js +116 -0
- package/dist/components/empty-state/EmptyState.js.map +1 -0
- package/dist/components/field/Field.d.ts +36 -0
- package/dist/components/field/Field.js +337 -0
- package/dist/components/field/Field.js.map +1 -0
- package/dist/components/file-upload/FileUpload.d.ts +91 -0
- package/dist/components/file-upload/FileUpload.js +714 -0
- package/dist/components/file-upload/FileUpload.js.map +1 -0
- package/dist/components/input/Input.d.ts +49 -0
- package/dist/components/input/Input.js +538 -0
- package/dist/components/input/Input.js.map +1 -0
- package/dist/components/link/Link.d.ts +17 -0
- package/dist/components/link/Link.js +91 -0
- package/dist/components/link/Link.js.map +1 -0
- package/dist/components/menu/Menu.d.ts +79 -0
- package/dist/components/menu/Menu.js +615 -0
- package/dist/components/menu/Menu.js.map +1 -0
- package/dist/components/number-field/NumberField.d.ts +16 -0
- package/dist/components/number-field/NumberField.js +188 -0
- package/dist/components/number-field/NumberField.js.map +1 -0
- package/dist/components/pagination/Pagination.d.ts +34 -0
- package/dist/components/pagination/Pagination.js +244 -0
- package/dist/components/pagination/Pagination.js.map +1 -0
- package/dist/components/popover/Popover.d.ts +22 -0
- package/dist/components/popover/Popover.js +186 -0
- package/dist/components/popover/Popover.js.map +1 -0
- package/dist/components/preview-card/PreviewCard.d.ts +20 -0
- package/dist/components/preview-card/PreviewCard.js +114 -0
- package/dist/components/preview-card/PreviewCard.js.map +1 -0
- package/dist/components/progress/Progress.d.ts +20 -0
- package/dist/components/progress/Progress.js +169 -0
- package/dist/components/progress/Progress.js.map +1 -0
- package/dist/components/scroll-area/ScrollArea.d.ts +8 -0
- package/dist/components/scroll-area/ScrollArea.js +112 -0
- package/dist/components/scroll-area/ScrollArea.js.map +1 -0
- package/dist/components/search-input/SearchInput.d.ts +14 -0
- package/dist/components/search-input/SearchInput.js +114 -0
- package/dist/components/search-input/SearchInput.js.map +1 -0
- package/dist/components/select/Select.d.ts +66 -0
- package/dist/components/select/Select.js +601 -0
- package/dist/components/select/Select.js.map +1 -0
- package/dist/components/separator/Separator.d.ts +4 -0
- package/dist/components/separator/Separator.js +46 -0
- package/dist/components/separator/Separator.js.map +1 -0
- package/dist/components/skeleton/Skeleton.d.ts +16 -0
- package/dist/components/skeleton/Skeleton.js +135 -0
- package/dist/components/skeleton/Skeleton.js.map +1 -0
- package/dist/components/slider/Slider.d.ts +11 -0
- package/dist/components/slider/Slider.js +107 -0
- package/dist/components/slider/Slider.js.map +1 -0
- package/dist/components/spinner/Spinner.d.ts +9 -0
- package/dist/components/spinner/Spinner.js +78 -0
- package/dist/components/spinner/Spinner.js.map +1 -0
- package/dist/components/stack/Stack.d.ts +23 -0
- package/dist/components/stack/Stack.js +79 -0
- package/dist/components/stack/Stack.js.map +1 -0
- package/dist/components/stat-card/StatCard.d.ts +22 -0
- package/dist/components/stat-card/StatCard.js +153 -0
- package/dist/components/stat-card/StatCard.js.map +1 -0
- package/dist/components/stepper/Stepper.d.ts +30 -0
- package/dist/components/stepper/Stepper.js +131 -0
- package/dist/components/stepper/Stepper.js.map +1 -0
- package/dist/components/table/Table.d.ts +53 -0
- package/dist/components/table/Table.js +221 -0
- package/dist/components/table/Table.js.map +1 -0
- package/dist/components/tabs/Tabs.d.ts +19 -0
- package/dist/components/tabs/Tabs.js +183 -0
- package/dist/components/tabs/Tabs.js.map +1 -0
- package/dist/components/tag/Tag.d.ts +22 -0
- package/dist/components/tag/Tag.js +121 -0
- package/dist/components/tag/Tag.js.map +1 -0
- package/dist/components/toast/Toast.d.ts +34 -0
- package/dist/components/toast/Toast.js +187 -0
- package/dist/components/toast/Toast.js.map +1 -0
- package/dist/components/toggle/Toggle.d.ts +31 -0
- package/dist/components/toggle/Toggle.js +197 -0
- package/dist/components/toggle/Toggle.js.map +1 -0
- package/dist/components/toolbar/Toolbar.d.ts +21 -0
- package/dist/components/toolbar/Toolbar.js +239 -0
- package/dist/components/toolbar/Toolbar.js.map +1 -0
- package/dist/components/tooltip/Tooltip.d.ts +33 -0
- package/dist/components/tooltip/Tooltip.js +182 -0
- package/dist/components/tooltip/Tooltip.js.map +1 -0
- package/dist/components/typography/Typography.d.ts +32 -0
- package/dist/components/typography/Typography.js +183 -0
- package/dist/components/typography/Typography.js.map +1 -0
- package/dist/fonts.css +3 -0
- package/dist/icons/index.d.ts +133 -0
- package/dist/icons/index.js +182 -0
- package/dist/icons/index.js.map +1 -0
- package/dist/index.d.ts +55 -0
- package/dist/index.js +58 -0
- package/dist/opti-ui.css +5692 -0
- package/dist/theme/ThemeProvider.d.ts +22 -0
- package/dist/theme/ThemeProvider.js +115 -0
- package/dist/theme/ThemeProvider.js.map +1 -0
- package/dist/theme/index.d.ts +2 -0
- package/dist/utils/cx.d.ts +10 -0
- package/dist/utils/cx.js +18 -0
- package/dist/utils/cx.js.map +1 -0
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/portal.d.ts +8 -0
- package/dist/utils/portal.js +16 -0
- package/dist/utils/portal.js.map +1 -0
- package/dist/utils/primitive.d.ts +13 -0
- package/dist/utils/primitive.js +61 -0
- package/dist/utils/primitive.js.map +1 -0
- package/dist/utils/search.d.ts +4 -0
- package/dist/utils/search.js +15 -0
- package/dist/utils/search.js.map +1 -0
- package/package.json +71 -4
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
/** Token names without the `--oui-` prefix, e.g. `color-accent` or `radius-card`. */
|
|
3
|
+
export type ThemeTokenName = `color-${string}` | `font-${string}` | `radius-${string}` | `shadow-${string}` | `control-${string}` | `duration-${string}` | `ease${string}` | `z-${string}` | `focus-${string}` | `${string}-radius` | `${string}-height`;
|
|
4
|
+
/** A partial set of token overrides. Values are any valid CSS value. */
|
|
5
|
+
export type Theme = Partial<Record<ThemeTokenName, string>>;
|
|
6
|
+
export type ColorMode = 'light' | 'dark';
|
|
7
|
+
/** Converts a theme object into CSS custom properties for a `style` prop. */
|
|
8
|
+
export declare function themeToStyle(theme: Theme | undefined): React.CSSProperties;
|
|
9
|
+
/** Builds a theme from a base, applying overrides on top. */
|
|
10
|
+
export declare function createTheme(...themes: Theme[]): Theme;
|
|
11
|
+
export interface ThemeProviderProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
12
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
13
|
+
/** Token overrides applied to this subtree. */
|
|
14
|
+
theme?: Theme;
|
|
15
|
+
/** Color mode for this subtree. */
|
|
16
|
+
mode?: ColorMode;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* Scopes a theme to its children. Popups opened inside are portalled into the
|
|
20
|
+
* provider so they pick up the same tokens.
|
|
21
|
+
*/
|
|
22
|
+
export declare function ThemeProvider({ theme, mode, className, style, children, ref, ...props }: ThemeProviderProps): React.JSX.Element;
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { PortalContainerContext } from "../utils/portal.js";
|
|
3
|
+
import { cx } from "../utils/cx.js";
|
|
4
|
+
import { c } from "react/compiler-runtime";
|
|
5
|
+
import * as React from "react";
|
|
6
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
|
+
//#region src/theme/ThemeProvider.tsx
|
|
8
|
+
/** Converts a theme object into CSS custom properties for a `style` prop. */
|
|
9
|
+
function themeToStyle(theme) {
|
|
10
|
+
const style = {};
|
|
11
|
+
if (!theme) return style;
|
|
12
|
+
for (const [name, value] of Object.entries(theme)) if (value != null && value !== "") style[`--oui-${name}`] = value;
|
|
13
|
+
return style;
|
|
14
|
+
}
|
|
15
|
+
/** Builds a theme from a base, applying overrides on top. */
|
|
16
|
+
function createTheme(...themes) {
|
|
17
|
+
return Object.assign({}, ...themes);
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Scopes a theme to its children. Popups opened inside are portalled into the
|
|
21
|
+
* provider so they pick up the same tokens.
|
|
22
|
+
*/
|
|
23
|
+
function ThemeProvider(t0) {
|
|
24
|
+
const $ = c(26);
|
|
25
|
+
let children;
|
|
26
|
+
let className;
|
|
27
|
+
let mode;
|
|
28
|
+
let props;
|
|
29
|
+
let ref;
|
|
30
|
+
let style;
|
|
31
|
+
let theme;
|
|
32
|
+
if ($[0] !== t0) {
|
|
33
|
+
({theme, mode, className, style, children, ref, ...props} = t0);
|
|
34
|
+
$[0] = t0;
|
|
35
|
+
$[1] = children;
|
|
36
|
+
$[2] = className;
|
|
37
|
+
$[3] = mode;
|
|
38
|
+
$[4] = props;
|
|
39
|
+
$[5] = ref;
|
|
40
|
+
$[6] = style;
|
|
41
|
+
$[7] = theme;
|
|
42
|
+
} else {
|
|
43
|
+
children = $[1];
|
|
44
|
+
className = $[2];
|
|
45
|
+
mode = $[3];
|
|
46
|
+
props = $[4];
|
|
47
|
+
ref = $[5];
|
|
48
|
+
style = $[6];
|
|
49
|
+
theme = $[7];
|
|
50
|
+
}
|
|
51
|
+
const [container, setContainer] = React.useState(null);
|
|
52
|
+
let t1;
|
|
53
|
+
if ($[8] !== className) {
|
|
54
|
+
t1 = cx("oui-theme", className);
|
|
55
|
+
$[8] = className;
|
|
56
|
+
$[9] = t1;
|
|
57
|
+
} else t1 = $[9];
|
|
58
|
+
let t2;
|
|
59
|
+
if ($[10] !== theme) {
|
|
60
|
+
t2 = themeToStyle(theme);
|
|
61
|
+
$[10] = theme;
|
|
62
|
+
$[11] = t2;
|
|
63
|
+
} else t2 = $[11];
|
|
64
|
+
let t3;
|
|
65
|
+
if ($[12] !== style || $[13] !== t2) {
|
|
66
|
+
t3 = {
|
|
67
|
+
...t2,
|
|
68
|
+
...style
|
|
69
|
+
};
|
|
70
|
+
$[12] = style;
|
|
71
|
+
$[13] = t2;
|
|
72
|
+
$[14] = t3;
|
|
73
|
+
} else t3 = $[14];
|
|
74
|
+
let t4;
|
|
75
|
+
if ($[15] !== children || $[16] !== container) {
|
|
76
|
+
t4 = /* @__PURE__ */ jsx(PortalContainerContext, {
|
|
77
|
+
value: container,
|
|
78
|
+
children
|
|
79
|
+
});
|
|
80
|
+
$[15] = children;
|
|
81
|
+
$[16] = container;
|
|
82
|
+
$[17] = t4;
|
|
83
|
+
} else t4 = $[17];
|
|
84
|
+
let t5;
|
|
85
|
+
if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
|
|
86
|
+
t5 = /* @__PURE__ */ jsx("div", {
|
|
87
|
+
className: "oui-theme__portal",
|
|
88
|
+
ref: setContainer
|
|
89
|
+
});
|
|
90
|
+
$[18] = t5;
|
|
91
|
+
} else t5 = $[18];
|
|
92
|
+
let t6;
|
|
93
|
+
if ($[19] !== mode || $[20] !== props || $[21] !== ref || $[22] !== t1 || $[23] !== t3 || $[24] !== t4) {
|
|
94
|
+
t6 = /* @__PURE__ */ jsxs("div", {
|
|
95
|
+
ref,
|
|
96
|
+
className: t1,
|
|
97
|
+
"data-oui-theme": mode,
|
|
98
|
+
style: t3,
|
|
99
|
+
...props,
|
|
100
|
+
children: [t4, t5]
|
|
101
|
+
});
|
|
102
|
+
$[19] = mode;
|
|
103
|
+
$[20] = props;
|
|
104
|
+
$[21] = ref;
|
|
105
|
+
$[22] = t1;
|
|
106
|
+
$[23] = t3;
|
|
107
|
+
$[24] = t4;
|
|
108
|
+
$[25] = t6;
|
|
109
|
+
} else t6 = $[25];
|
|
110
|
+
return t6;
|
|
111
|
+
}
|
|
112
|
+
//#endregion
|
|
113
|
+
export { ThemeProvider, createTheme, themeToStyle };
|
|
114
|
+
|
|
115
|
+
//# sourceMappingURL=ThemeProvider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ThemeProvider.js","names":["React","PortalContainerContext","cx","ThemeTokenName","Theme","Partial","Record","ColorMode","themeToStyle","theme","CSSProperties","style","name","value","Object","entries","createTheme","themes","assign","ThemeProviderProps","HTMLAttributes","HTMLDivElement","ref","Ref","mode","ThemeProvider","t0","$","_c","children","className","props","container","setContainer","useState","t1","t2","t3","t4","t5","Symbol","for","t6","_c"],"sources":["../../src/theme/ThemeProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { PortalContainerContext } from '../utils/portal';\nimport { cx } from '../utils/cx';\n\n/** Token names without the `--oui-` prefix, e.g. `color-accent` or `radius-card`. */\nexport type ThemeTokenName =\n | `color-${string}`\n | `font-${string}`\n | `radius-${string}`\n | `shadow-${string}`\n | `control-${string}`\n | `duration-${string}`\n | `ease${string}`\n | `z-${string}`\n | `focus-${string}`\n | `${string}-radius`\n | `${string}-height`;\n\n/** A partial set of token overrides. Values are any valid CSS value. */\nexport type Theme = Partial<Record<ThemeTokenName, string>>;\n\nexport type ColorMode = 'light' | 'dark';\n\n/** Converts a theme object into CSS custom properties for a `style` prop. */\nexport function themeToStyle(theme: Theme | undefined): React.CSSProperties {\n const style: Record<string, string> = {};\n if (!theme) return style;\n for (const [name, value] of Object.entries(theme)) {\n if (value != null && value !== '') style[`--oui-${name}`] = value;\n }\n return style as React.CSSProperties;\n}\n\n/** Builds a theme from a base, applying overrides on top. */\nexport function createTheme(...themes: Theme[]): Theme {\n return Object.assign({}, ...themes);\n}\n\nexport interface ThemeProviderProps extends React.HTMLAttributes<HTMLDivElement> {\n ref?: React.Ref<HTMLDivElement>;\n /** Token overrides applied to this subtree. */\n theme?: Theme;\n /** Color mode for this subtree. */\n mode?: ColorMode;\n}\n\n/**\n * Scopes a theme to its children. Popups opened inside are portalled into the\n * provider so they pick up the same tokens.\n */\nexport function ThemeProvider({ theme, mode, className, style, children, ref, ...props }: ThemeProviderProps) {\n const [container, setContainer] = React.useState<HTMLDivElement | null>(null);\n return (\n <div\n ref={ref}\n className={cx('oui-theme', className)}\n data-oui-theme={mode}\n style={{ ...themeToStyle(theme), ...style }}\n {...props}\n >\n <PortalContainerContext value={container}>{children}</PortalContainerContext>\n <div className=\"oui-theme__portal\" ref={setContainer} />\n </div>\n );\n}\n"],"mappings":";;;;;;;;AAwBA,SAAgBQ,aAAaC,OAA+C;CAC1E,MAAME,QAAgC,CAAC;CACvC,IAAI,CAACF,OAAO,OAAOE;CACnB,KAAK,MAAM,CAACC,MAAMC,UAAUC,OAAOC,QAAQN,KAAK,GAC9C,IAAII,SAAS,QAAQA,UAAU,IAAIF,MAAM,SAASC,UAAUC;CAE9D,OAAOF;AACT;;AAGA,SAAgBK,YAAY,GAAGC,QAAwB;CACrD,OAAOH,OAAOI,OAAO,CAAC,GAAG,GAAGD,MAAM;AACpC;;;;;AAcA,SAAOQ,cAAAC,IAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAN;CAAA,IAAAO;CAAA,IAAAT;CAAA,IAAAX;CAAA,IAAAF;CAAA,IAAAkB,EAAA,OAAAD,IAAA;EAAuB,CAAA,CAAAjB,OAAAe,MAAAM,WAAAnB,OAAAkB,UAAAP,KAAA,GAAAS,SAAAL;EAA8EC,EAAA,KAAAD;EAAAC,EAAA,KAAAE;EAAAF,EAAA,KAAAG;EAAAH,EAAA,KAAAH;EAAAG,EAAA,KAAAI;EAAAJ,EAAA,KAAAL;EAAAK,EAAA,KAAAhB;EAAAgB,EAAA,KAAAlB;CAAA,OAAA;EAAAoB,WAAAF,EAAA;EAAAG,YAAAH,EAAA;EAAAH,OAAAG,EAAA;EAAAI,QAAAJ,EAAA;EAAAL,MAAAK,EAAA;EAAAhB,QAAAgB,EAAA;EAAAlB,QAAAkB,EAAA;CAAA;CAC1G,MAAA,CAAAK,WAAAC,gBAAkCjC,MAAKkC,SAAiC,IAAI;CAAE,IAAAC;CAAA,IAAAR,EAAA,OAAAG,WAAA;EAI/DK,KAAAjC,GAAG,aAAa4B,SAAS;EAACH,EAAA,KAAAG;EAAAH,EAAA,KAAAQ;CAAA,OAAAA,KAAAR,EAAA;CAAA,IAAAS;CAAA,IAAAT,EAAA,QAAAlB,OAAA;EAEzB2B,KAAA5B,aAAaC,KAAK;EAACkB,EAAA,MAAAlB;EAAAkB,EAAA,MAAAS;CAAA,OAAAA,KAAAT,EAAA;CAAA,IAAAU;CAAA,IAAAV,EAAA,QAAAhB,SAAAgB,EAAA,QAAAS,IAAA;EAAxBC,KAAA;GAAA,GAAKD;GAAmB,GAAKzB;EAAM;EAACgB,EAAA,MAAAhB;EAAAgB,EAAA,MAAAS;EAAAT,EAAA,MAAAU;CAAA,OAAAA,KAAAV,EAAA;CAAA,IAAAW;CAAA,IAAAX,EAAA,QAAAE,YAAAF,EAAA,QAAAK,WAAA;EAG3CM,KAAA,oBAAC,wBAAD;GAA+BN,OAAAA;GAAYH;EAApB,CAAA;EAAsDF,EAAA,MAAAE;EAAAF,EAAA,MAAAK;EAAAL,EAAA,MAAAW;CAAA,OAAAA,KAAAX,EAAA;CAAA,IAAAY;CAAA,IAAAZ,EAAA,QAAAa,OAAAC,IAAA,2BAAA,GAAA;EAC7EF,KAAA,oBAAA,OAAA;GAAe,WAAA;GAAyBN,KAAAA;EAAY,CAAA;EAAIN,EAAA,MAAAY;CAAA,OAAAA,KAAAZ,EAAA;CAAA,IAAAe;CAAA,IAAAf,EAAA,QAAAH,QAAAG,EAAA,QAAAI,SAAAJ,EAAA,QAAAL,OAAAK,EAAA,QAAAQ,MAAAR,EAAA,QAAAU,MAAAV,EAAA,QAAAW,IAAA;EAR1DI,KAAA,qBAAA,OAAA;GACOpB;GACM,WAAAa;GACKX,kBAAAA;GACT,OAAAa;GAAoC,GACvCN;GALN,UAAA,CAOEO,IACAC,EACI;;EAAAZ,EAAA,MAAAH;EAAAG,EAAA,MAAAI;EAAAJ,EAAA,MAAAL;EAAAK,EAAA,MAAAQ;EAAAR,EAAA,MAAAU;EAAAV,EAAA,MAAAW;EAAAX,EAAA,MAAAe;CAAA,OAAAA,KAAAf,EAAA;CAAA,OATNe;AASM"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export type ClassValue = string | false | null | undefined;
|
|
2
|
+
/** Joins truthy class names. */
|
|
3
|
+
export declare function cx(...classes: ClassValue[]): string;
|
|
4
|
+
type StateClassName<State> = string | ((state: State) => string | undefined) | undefined;
|
|
5
|
+
/**
|
|
6
|
+
* Prepends a library class to a Base UI `className` prop, preserving the
|
|
7
|
+
* function form so consumers can still derive classes from component state.
|
|
8
|
+
*/
|
|
9
|
+
export declare function withClass<State>(base: string, className: StateClassName<State>): string | ((state: State) => string);
|
|
10
|
+
export {};
|
package/dist/utils/cx.js
ADDED
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
//#region src/utils/cx.ts
|
|
3
|
+
/** Joins truthy class names. */
|
|
4
|
+
function cx(...classes) {
|
|
5
|
+
return classes.filter(Boolean).join(" ");
|
|
6
|
+
}
|
|
7
|
+
/**
|
|
8
|
+
* Prepends a library class to a Base UI `className` prop, preserving the
|
|
9
|
+
* function form so consumers can still derive classes from component state.
|
|
10
|
+
*/
|
|
11
|
+
function withClass(base, className) {
|
|
12
|
+
if (typeof className === "function") return (state) => cx(base, className(state));
|
|
13
|
+
return cx(base, className);
|
|
14
|
+
}
|
|
15
|
+
//#endregion
|
|
16
|
+
export { cx, withClass };
|
|
17
|
+
|
|
18
|
+
//# sourceMappingURL=cx.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cx.js","names":["ClassValue","cx","classes","filter","Boolean","join","StateClassName","state","State","withClass","base","className"],"sources":["../../src/utils/cx.ts"],"sourcesContent":["export type ClassValue = string | false | null | undefined;\n\n/** Joins truthy class names. */\nexport function cx(...classes: ClassValue[]): string {\n return classes.filter(Boolean).join(' ');\n}\n\ntype StateClassName<State> = string | ((state: State) => string | undefined) | undefined;\n\n/**\n * Prepends a library class to a Base UI `className` prop, preserving the\n * function form so consumers can still derive classes from component state.\n */\nexport function withClass<State>(\n base: string,\n className: StateClassName<State>,\n): string | ((state: State) => string) {\n if (typeof className === 'function') {\n return (state: State) => cx(base, className(state));\n }\n return cx(base, className);\n}\n"],"mappings":";;;AAGA,SAAgBC,GAAG,GAAGC,SAA+B;CACnD,OAAOA,QAAQC,OAAOC,OAAO,CAAC,CAACC,KAAK,GAAG;AACzC;;;;;AAQA,SAAgBI,UACdC,MACAC,WACqC;CACrC,IAAI,OAAOA,cAAc,YACvB,QAAQJ,UAAiBN,GAAGS,MAAMC,UAAUJ,KAAK,CAAC;CAEpD,OAAON,GAAGS,MAAMC,SAAS;AAC3B"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Popups (menus, selects, dialogs…) are portalled. When a ThemeProvider scopes
|
|
4
|
+
* a theme to part of the page, popups must render inside that scope so they
|
|
5
|
+
* inherit its tokens — this context carries the container element.
|
|
6
|
+
*/
|
|
7
|
+
export declare const PortalContainerContext: React.Context<HTMLElement | null>;
|
|
8
|
+
export declare function usePortalContainer(): HTMLElement | undefined;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
//#region src/utils/portal.tsx
|
|
4
|
+
/**
|
|
5
|
+
* Popups (menus, selects, dialogs…) are portalled. When a ThemeProvider scopes
|
|
6
|
+
* a theme to part of the page, popups must render inside that scope so they
|
|
7
|
+
* inherit its tokens — this context carries the container element.
|
|
8
|
+
*/
|
|
9
|
+
var PortalContainerContext = React.createContext(null);
|
|
10
|
+
function usePortalContainer() {
|
|
11
|
+
return React.useContext(PortalContainerContext) ?? void 0;
|
|
12
|
+
}
|
|
13
|
+
//#endregion
|
|
14
|
+
export { PortalContainerContext, usePortalContainer };
|
|
15
|
+
|
|
16
|
+
//# sourceMappingURL=portal.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"portal.js","names":["React","PortalContainerContext","createContext","HTMLElement","usePortalContainer","useContext","undefined"],"sources":["../../src/utils/portal.tsx"],"sourcesContent":["import * as React from 'react';\n\n/**\n * Popups (menus, selects, dialogs…) are portalled. When a ThemeProvider scopes\n * a theme to part of the page, popups must render inside that scope so they\n * inherit its tokens — this context carries the container element.\n */\nexport const PortalContainerContext = React.createContext<HTMLElement | null>(null);\n\nexport function usePortalContainer(): HTMLElement | undefined {\n return React.useContext(PortalContainerContext) ?? undefined;\n}\n"],"mappings":";;;;;;;;AAOA,IAAaC,yBAAyBD,MAAME,cAAkC,IAAI;AAElF,SAAOE,qBAAA;CAAA,OACEJ,MAAKK,WAAYJ,sBAAmC,KAApDK,KAAAA;AAAqD"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { useRender } from '@base-ui/react/use-render';
|
|
3
|
+
type Tag = keyof React.JSX.IntrinsicElements;
|
|
4
|
+
export type PrimitiveProps<T extends Tag> = useRender.ComponentProps<T>;
|
|
5
|
+
/**
|
|
6
|
+
* Creates a styled element that supports `className`, `style` and Base UI's
|
|
7
|
+
* `render` prop for swapping the underlying element (e.g. a router link).
|
|
8
|
+
*/
|
|
9
|
+
export declare function createPrimitive<T extends Tag>(tag: T, baseClass: string, displayName: string): {
|
|
10
|
+
(props: PrimitiveProps<T>): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
|
|
11
|
+
displayName: string;
|
|
12
|
+
};
|
|
13
|
+
export {};
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { c } from "react/compiler-runtime";
|
|
3
|
+
import { useRender } from "@base-ui/react/use-render";
|
|
4
|
+
import { mergeProps } from "@base-ui/react/merge-props";
|
|
5
|
+
//#region src/utils/primitive.tsx
|
|
6
|
+
/**
|
|
7
|
+
* Creates a styled element that supports `className`, `style` and Base UI's
|
|
8
|
+
* `render` prop for swapping the underlying element (e.g. a router link).
|
|
9
|
+
*/
|
|
10
|
+
function createPrimitive(tag, baseClass, displayName) {
|
|
11
|
+
function Primitive(props) {
|
|
12
|
+
const $ = c(11);
|
|
13
|
+
const t0 = props;
|
|
14
|
+
let t1;
|
|
15
|
+
let t2;
|
|
16
|
+
let t3;
|
|
17
|
+
let t4;
|
|
18
|
+
let t5;
|
|
19
|
+
if ($[0] !== t0) {
|
|
20
|
+
const { render, ref, ...rest } = t0;
|
|
21
|
+
t5 = useRender;
|
|
22
|
+
t1 = tag;
|
|
23
|
+
t2 = render;
|
|
24
|
+
t3 = ref;
|
|
25
|
+
t4 = mergeProps({ className: baseClass }, rest);
|
|
26
|
+
$[0] = t0;
|
|
27
|
+
$[1] = t1;
|
|
28
|
+
$[2] = t2;
|
|
29
|
+
$[3] = t3;
|
|
30
|
+
$[4] = t4;
|
|
31
|
+
$[5] = t5;
|
|
32
|
+
} else {
|
|
33
|
+
t1 = $[1];
|
|
34
|
+
t2 = $[2];
|
|
35
|
+
t3 = $[3];
|
|
36
|
+
t4 = $[4];
|
|
37
|
+
t5 = $[5];
|
|
38
|
+
}
|
|
39
|
+
let t6;
|
|
40
|
+
if ($[6] !== t1 || $[7] !== t2 || $[8] !== t3 || $[9] !== t4) {
|
|
41
|
+
t6 = {
|
|
42
|
+
defaultTagName: t1,
|
|
43
|
+
render: t2,
|
|
44
|
+
ref: t3,
|
|
45
|
+
props: t4
|
|
46
|
+
};
|
|
47
|
+
$[6] = t1;
|
|
48
|
+
$[7] = t2;
|
|
49
|
+
$[8] = t3;
|
|
50
|
+
$[9] = t4;
|
|
51
|
+
$[10] = t6;
|
|
52
|
+
} else t6 = $[10];
|
|
53
|
+
return t5(t6);
|
|
54
|
+
}
|
|
55
|
+
Primitive.displayName = displayName;
|
|
56
|
+
return Primitive;
|
|
57
|
+
}
|
|
58
|
+
//#endregion
|
|
59
|
+
export { createPrimitive };
|
|
60
|
+
|
|
61
|
+
//# sourceMappingURL=primitive.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"primitive.js","names":["React","useRender","mergeProps","Tag","JSX","IntrinsicElements","PrimitiveProps","ComponentProps","T","createPrimitive","tag","baseClass","displayName","Primitive","props","$","_c","t0","t1","t2","t3","t4","t5","render","ref","rest","className","t6","defaultTagName","_c"],"sources":["../../src/utils/primitive.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useRender } from '@base-ui/react/use-render';\nimport { mergeProps } from '@base-ui/react/merge-props';\n\ntype Tag = keyof React.JSX.IntrinsicElements;\n\nexport type PrimitiveProps<T extends Tag> = useRender.ComponentProps<T>;\n\n/**\n * Creates a styled element that supports `className`, `style` and Base UI's\n * `render` prop for swapping the underlying element (e.g. a router link).\n */\nexport function createPrimitive<T extends Tag>(tag: T, baseClass: string, displayName: string) {\n function Primitive(props: PrimitiveProps<T>) {\n const { render, ref, ...rest } = props as PrimitiveProps<'div'>;\n return useRender({\n defaultTagName: tag,\n render,\n ref,\n props: mergeProps<'div'>({ className: baseClass }, rest as React.ComponentProps<'div'>),\n });\n }\n Primitive.displayName = displayName;\n return Primitive;\n}\n"],"mappings":";;;;;;;;;AAYA,SAAgBS,gBAA+BC,KAAQC,WAAmBC,aAAqB;CAC7F,SAAAC,UAAAC,OAAA;EAAA,MAAAC,IAAAC,EAAA,EAAA;EACmC,MAAAC,KAAAH;EAA8B,IAAAI;EAAA,IAAAC;EAAA,IAAAC;EAAA,IAAAC;EAAA,IAAAC;EAAA,IAAAP,EAAA,OAAAE,IAAA;GAA/D,MAAA,EAAAM,QAAAC,KAAA,GAAAC,SAAiCR;GAC1BhB,KAAAA;GACWS,KAAAA;GAChBa,KAAAA;GACAC,KAAAA;GACOH,KAAAnB,WAAkB,EAAAwB,WAAaf,UAAU,GAAGc,IAAmC;GAACV,EAAA,KAAAE;GAAAF,EAAA,KAAAG;GAAAH,EAAA,KAAAI;GAAAJ,EAAA,KAAAK;GAAAL,EAAA,KAAAM;GAAAN,EAAA,KAAAO;EAAA,OAAA;GAAAJ,KAAAH,EAAA;GAAAI,KAAAJ,EAAA;GAAAK,KAAAL,EAAA;GAAAM,KAAAN,EAAA;GAAAO,KAAAP,EAAA;EAAA;EAAA,IAAAY;EAAA,IAAAZ,EAAA,OAAAG,MAAAH,EAAA,OAAAI,MAAAJ,EAAA,OAAAK,MAAAL,EAAA,OAAAM,IAAA;GAJxEM,KAAA;IAAAC,gBACClB;IAAGa,QACnBA;IAAMC,KACNA;IAAGV,OACIO;GACT;GAACN,EAAA,KAAAG;GAAAH,EAAA,KAAAI;GAAAJ,EAAA,KAAAK;GAAAL,EAAA,KAAAM;GAAAN,EAAA,MAAAY;EAAA,OAAAA,KAAAZ,EAAA;EAAA,OALMd,GAAU0B,EAKhB;CAAC;CAEJd,UAAUD,cAAcA;CACxB,OAAOC;AACT"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/** Lower-cases and strips diacritics, so "gyor" matches "Győr". */
|
|
2
|
+
export declare function normalizeText(value: unknown): string;
|
|
3
|
+
/** True when every whitespace-separated term of `query` occurs in `text`. An empty query matches. */
|
|
4
|
+
export declare function matchesQuery(text: unknown, query: string): boolean;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
//#region src/utils/search.ts
|
|
3
|
+
/** Lower-cases and strips diacritics, so "gyor" matches "Győr". */
|
|
4
|
+
function normalizeText(value) {
|
|
5
|
+
return String(value ?? "").normalize("NFD").replace(/[̀-ͯ]/g, "").toLowerCase();
|
|
6
|
+
}
|
|
7
|
+
/** True when every whitespace-separated term of `query` occurs in `text`. An empty query matches. */
|
|
8
|
+
function matchesQuery(text, query) {
|
|
9
|
+
const haystack = normalizeText(text);
|
|
10
|
+
return normalizeText(query).split(/\s+/).filter(Boolean).every((term) => haystack.includes(term));
|
|
11
|
+
}
|
|
12
|
+
//#endregion
|
|
13
|
+
export { matchesQuery, normalizeText };
|
|
14
|
+
|
|
15
|
+
//# sourceMappingURL=search.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search.js","names":["normalizeText","value","String","normalize","replace","toLowerCase","matchesQuery","text","query","haystack","split","filter","Boolean","every","term","includes"],"sources":["../../src/utils/search.ts"],"sourcesContent":["/** Lower-cases and strips diacritics, so \"gyor\" matches \"Győr\". */\nexport function normalizeText(value: unknown): string {\n return String(value ?? '')\n .normalize('NFD')\n .replace(/[̀-ͯ]/g, '')\n .toLowerCase();\n}\n\n/** True when every whitespace-separated term of `query` occurs in `text`. An empty query matches. */\nexport function matchesQuery(text: unknown, query: string): boolean {\n const haystack = normalizeText(text);\n return normalizeText(query)\n .split(/\\s+/)\n .filter(Boolean)\n .every((term) => haystack.includes(term));\n}\n"],"mappings":";;;AACA,SAAgBA,cAAcC,OAAwB;CACpD,OAAOC,OAAOD,SAAS,EAAE,CAAC,CACvBE,UAAU,KAAK,CAAC,CAChBC,QAAQ,UAAU,EAAE,CAAC,CACrBC,YAAY;AACjB;;AAGA,SAAgBC,aAAaC,MAAeC,OAAwB;CAClE,MAAMC,WAAWT,cAAcO,IAAI;CACnC,OAAOP,cAAcQ,KAAK,CAAC,CACxBE,MAAM,KAAK,CAAC,CACZC,OAAOC,OAAO,CAAC,CACfC,OAAOC,SAASL,SAASM,SAASD,IAAI,CAAC;AAC5C"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,73 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@optimum-intelligence/opti-ui",
|
|
3
|
-
"version": "0.
|
|
4
|
-
"
|
|
5
|
-
"
|
|
6
|
-
|
|
3
|
+
"version": "0.3.0",
|
|
4
|
+
"description": "Optimum's customizable React component library, built on Base UI.",
|
|
5
|
+
"license": "SEE LICENSE IN LICENSE",
|
|
6
|
+
"author": "Optimum Intelligence",
|
|
7
|
+
"repository": {
|
|
8
|
+
"type": "git",
|
|
9
|
+
"url": "git+https://github.com/Optimum-Intelligence/opti-ui-library.git"
|
|
10
|
+
},
|
|
11
|
+
"homepage": "https://github.com/Optimum-Intelligence/opti-ui-library#readme",
|
|
12
|
+
"bugs": {
|
|
13
|
+
"url": "https://github.com/Optimum-Intelligence/opti-ui-library/issues"
|
|
14
|
+
},
|
|
15
|
+
"keywords": [
|
|
16
|
+
"react",
|
|
17
|
+
"ui",
|
|
18
|
+
"components",
|
|
19
|
+
"design-system",
|
|
20
|
+
"base-ui"
|
|
21
|
+
],
|
|
22
|
+
"type": "module",
|
|
23
|
+
"files": [
|
|
24
|
+
"dist"
|
|
25
|
+
],
|
|
26
|
+
"main": "./dist/index.js",
|
|
27
|
+
"types": "./dist/index.d.ts",
|
|
28
|
+
"exports": {
|
|
29
|
+
".": {
|
|
30
|
+
"types": "./dist/index.d.ts",
|
|
31
|
+
"import": "./dist/index.js"
|
|
32
|
+
},
|
|
33
|
+
"./styles.css": "./dist/opti-ui.css",
|
|
34
|
+
"./fonts.css": "./dist/fonts.css"
|
|
35
|
+
},
|
|
36
|
+
"sideEffects": [
|
|
37
|
+
"**/*.css"
|
|
38
|
+
],
|
|
39
|
+
"scripts": {
|
|
40
|
+
"dev": "vite --host 127.0.0.1",
|
|
41
|
+
"typecheck": "tsc --noEmit",
|
|
42
|
+
"build": "npm run typecheck && vite build && tsc -p tsconfig.build.json",
|
|
43
|
+
"build:showcase": "vite build --mode showcase",
|
|
44
|
+
"test": "npm run build && node --test tests/",
|
|
45
|
+
"prepack": "npm run build"
|
|
46
|
+
},
|
|
47
|
+
"peerDependencies": {
|
|
48
|
+
"react": "^19.0.0",
|
|
49
|
+
"react-dom": "^19.0.0"
|
|
50
|
+
},
|
|
51
|
+
"dependencies": {
|
|
52
|
+
"@base-ui/react": "~1.8.0"
|
|
53
|
+
},
|
|
54
|
+
"devDependencies": {
|
|
55
|
+
"@babel/core": "^7.29.7",
|
|
56
|
+
"@rolldown/plugin-babel": "^0.2.4",
|
|
57
|
+
"@types/babel__core": "^7.20.5",
|
|
58
|
+
"@types/node": "^24.19.2",
|
|
59
|
+
"@types/react": "^19.3.0",
|
|
60
|
+
"@types/react-dom": "^19.3.0",
|
|
61
|
+
"@vitejs/plugin-react": "^6.1.2",
|
|
62
|
+
"babel-plugin-react-compiler": "^1.0.0",
|
|
63
|
+
"lucide-react": "^1.54.0",
|
|
64
|
+
"react": "^19.3.0",
|
|
65
|
+
"react-dom": "^19.3.0",
|
|
66
|
+
"sass": "^1.105.1",
|
|
67
|
+
"typescript": "^7.0.2",
|
|
68
|
+
"vite": "^8.3.4"
|
|
69
|
+
},
|
|
70
|
+
"publishConfig": {
|
|
71
|
+
"access": "public"
|
|
72
|
+
}
|
|
73
|
+
}
|