@techsio/ui-kit 0.46.0 → 0.48.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/internal/molecules/vertical-navigation.context.js +15 -0
- package/dist/internal/molecules/vertical-navigation.styles.js +68 -0
- package/dist/molecules/vertical-navigation.js +228 -0
- package/dist/organisms/data-table.js +51 -46
- package/dist/src/internal/molecules/vertical-navigation.context.d.ts +25 -0
- package/dist/src/internal/molecules/vertical-navigation.context.d.ts.map +1 -0
- package/dist/src/internal/molecules/vertical-navigation.styles.d.ts +143 -0
- package/dist/src/internal/molecules/vertical-navigation.styles.d.ts.map +1 -0
- package/dist/src/molecules/vertical-navigation.d.ts +44 -0
- package/dist/src/molecules/vertical-navigation.d.ts.map +1 -0
- package/dist/src/organisms/data-table.d.ts.map +1 -1
- package/dist/src/types/zag.d.ts +1 -0
- package/dist/src/types/zag.d.ts.map +1 -1
- package/dist/stories/changelog/changelog.stories.d.ts.map +1 -1
- package/dist/stories/molecules/vertical-navigation.stories.d.ts +75 -0
- package/dist/stories/molecules/vertical-navigation.stories.d.ts.map +1 -0
- package/dist/test/vertical-navigation.behavior.spec.d.ts +2 -0
- package/dist/test/vertical-navigation.behavior.spec.d.ts.map +1 -0
- package/dist/test/vertical-navigation.playwright.config.d.ts +4 -0
- package/dist/test/vertical-navigation.playwright.config.d.ts.map +1 -0
- package/package.json +2 -1
- package/src/tokens/components/components.css +1 -0
- package/src/tokens/components/molecules/_vertical-navigation.css +155 -0
- package/src/tokens/components/organisms/_data-table.css +30 -7
- package/src/tokens/components/organisms/_table.css +0 -17
- package/src/tokens/figma/akros/variables.css +438 -0
- package/src/tokens/figma/brand-overrides.css +1 -1
- package/src/tokens/figma/business/variables.css +2 -2
- package/src/tokens/figma/dark/variables.css +39 -1
- package/src/tokens/figma/light/variables.css +431 -6
- package/src/tokens/figma/neo/variables.css +2 -2
- package/src/tokens/figma/neo-dark/variables.css +1 -1
- package/src/tokens/figma/variables.css +430 -5
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
export declare const verticalNavigationStyles: import("tailwind-variants").TVReturnType<{
|
|
2
|
+
variant: {
|
|
3
|
+
primary: {};
|
|
4
|
+
secondary: {};
|
|
5
|
+
};
|
|
6
|
+
size: {
|
|
7
|
+
sm: {
|
|
8
|
+
root: string;
|
|
9
|
+
link: string;
|
|
10
|
+
trigger: string;
|
|
11
|
+
indicator: string;
|
|
12
|
+
groupLabel: string;
|
|
13
|
+
};
|
|
14
|
+
md: {
|
|
15
|
+
root: string;
|
|
16
|
+
link: string;
|
|
17
|
+
trigger: string;
|
|
18
|
+
indicator: string;
|
|
19
|
+
groupLabel: string;
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
tone: {
|
|
23
|
+
plain: {
|
|
24
|
+
content: string;
|
|
25
|
+
group: string;
|
|
26
|
+
};
|
|
27
|
+
subtle: {
|
|
28
|
+
content: string;
|
|
29
|
+
group: string;
|
|
30
|
+
};
|
|
31
|
+
accent: {
|
|
32
|
+
content: string;
|
|
33
|
+
group: string;
|
|
34
|
+
};
|
|
35
|
+
};
|
|
36
|
+
}, {
|
|
37
|
+
root: string;
|
|
38
|
+
list: string;
|
|
39
|
+
item: string;
|
|
40
|
+
row: string;
|
|
41
|
+
link: string;
|
|
42
|
+
trigger: string;
|
|
43
|
+
indicator: string;
|
|
44
|
+
content: string;
|
|
45
|
+
group: string;
|
|
46
|
+
groupLabel: string;
|
|
47
|
+
separator: string;
|
|
48
|
+
}, undefined, {
|
|
49
|
+
variant: {
|
|
50
|
+
primary: {};
|
|
51
|
+
secondary: {};
|
|
52
|
+
};
|
|
53
|
+
size: {
|
|
54
|
+
sm: {
|
|
55
|
+
root: string;
|
|
56
|
+
link: string;
|
|
57
|
+
trigger: string;
|
|
58
|
+
indicator: string;
|
|
59
|
+
groupLabel: string;
|
|
60
|
+
};
|
|
61
|
+
md: {
|
|
62
|
+
root: string;
|
|
63
|
+
link: string;
|
|
64
|
+
trigger: string;
|
|
65
|
+
indicator: string;
|
|
66
|
+
groupLabel: string;
|
|
67
|
+
};
|
|
68
|
+
};
|
|
69
|
+
tone: {
|
|
70
|
+
plain: {
|
|
71
|
+
content: string;
|
|
72
|
+
group: string;
|
|
73
|
+
};
|
|
74
|
+
subtle: {
|
|
75
|
+
content: string;
|
|
76
|
+
group: string;
|
|
77
|
+
};
|
|
78
|
+
accent: {
|
|
79
|
+
content: string;
|
|
80
|
+
group: string;
|
|
81
|
+
};
|
|
82
|
+
};
|
|
83
|
+
}, {
|
|
84
|
+
root: string;
|
|
85
|
+
list: string;
|
|
86
|
+
item: string;
|
|
87
|
+
row: string;
|
|
88
|
+
link: string;
|
|
89
|
+
trigger: string;
|
|
90
|
+
indicator: string;
|
|
91
|
+
content: string;
|
|
92
|
+
group: string;
|
|
93
|
+
groupLabel: string;
|
|
94
|
+
separator: string;
|
|
95
|
+
}, import("tailwind-variants").TVReturnType<{
|
|
96
|
+
variant: {
|
|
97
|
+
primary: {};
|
|
98
|
+
secondary: {};
|
|
99
|
+
};
|
|
100
|
+
size: {
|
|
101
|
+
sm: {
|
|
102
|
+
root: string;
|
|
103
|
+
link: string;
|
|
104
|
+
trigger: string;
|
|
105
|
+
indicator: string;
|
|
106
|
+
groupLabel: string;
|
|
107
|
+
};
|
|
108
|
+
md: {
|
|
109
|
+
root: string;
|
|
110
|
+
link: string;
|
|
111
|
+
trigger: string;
|
|
112
|
+
indicator: string;
|
|
113
|
+
groupLabel: string;
|
|
114
|
+
};
|
|
115
|
+
};
|
|
116
|
+
tone: {
|
|
117
|
+
plain: {
|
|
118
|
+
content: string;
|
|
119
|
+
group: string;
|
|
120
|
+
};
|
|
121
|
+
subtle: {
|
|
122
|
+
content: string;
|
|
123
|
+
group: string;
|
|
124
|
+
};
|
|
125
|
+
accent: {
|
|
126
|
+
content: string;
|
|
127
|
+
group: string;
|
|
128
|
+
};
|
|
129
|
+
};
|
|
130
|
+
}, {
|
|
131
|
+
root: string;
|
|
132
|
+
list: string;
|
|
133
|
+
item: string;
|
|
134
|
+
row: string;
|
|
135
|
+
link: string;
|
|
136
|
+
trigger: string;
|
|
137
|
+
indicator: string;
|
|
138
|
+
content: string;
|
|
139
|
+
group: string;
|
|
140
|
+
groupLabel: string;
|
|
141
|
+
separator: string;
|
|
142
|
+
}, undefined, unknown, unknown, undefined>>;
|
|
143
|
+
//# sourceMappingURL=vertical-navigation.styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vertical-navigation.styles.d.ts","sourceRoot":"","sources":["../../../../src/internal/molecules/vertical-navigation.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,wBAAwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAyEnC,CAAA"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import * as collapsible from "@zag-js/collapsible";
|
|
2
|
+
import { type ComponentProps, type ElementType } from "react";
|
|
3
|
+
import { Button } from "../atoms/button.js";
|
|
4
|
+
import { type LinkButtonProps } from "../atoms/link-button.js";
|
|
5
|
+
import { type VerticalNavigationSize, type VerticalNavigationTone, type VerticalNavigationVariant } from "../internal/molecules/vertical-navigation.context.js";
|
|
6
|
+
export type { VerticalNavigationSize, VerticalNavigationTone, VerticalNavigationVariant, } from "../internal/molecules/vertical-navigation.context.js";
|
|
7
|
+
export type VerticalNavigationProps = Omit<ComponentProps<"nav">, "dir"> & {
|
|
8
|
+
size?: VerticalNavigationSize;
|
|
9
|
+
dir?: "ltr" | "rtl";
|
|
10
|
+
/** Maximum cumulative indent; the semantic nesting is never flattened. */
|
|
11
|
+
maxIndentDepth?: number;
|
|
12
|
+
};
|
|
13
|
+
export declare function VerticalNavigation({ size, maxIndentDepth, dir, className, children, ...props }: VerticalNavigationProps): import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
export declare namespace VerticalNavigation {
|
|
15
|
+
var Root: typeof VerticalNavigation;
|
|
16
|
+
var List: ({ children, className, ...props }: ComponentProps<"ul">) => import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
var Item: ({ className, ...props }: ComponentProps<"li">) => import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
var Row: ({ className, ...props }: ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
|
|
19
|
+
var Link: <T extends ElementType = "a">({ current, className, ...props }: VerticalNavigationLinkProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
var Branch: ({ id, open, defaultOpen, onOpenChange, disabled, getRootNode, containsCurrent, children, className, ...props }: VerticalNavigationBranchProps) => import("react/jsx-runtime").JSX.Element;
|
|
21
|
+
var BranchTrigger: ({ className, disabled, ...props }: VerticalNavigationBranchTriggerProps) => import("react/jsx-runtime").JSX.Element;
|
|
22
|
+
var BranchIndicator: ({ className, ...props }: ComponentProps<"span">) => import("react/jsx-runtime").JSX.Element;
|
|
23
|
+
var BranchContent: ({ tone, variant, indent, showGuide, className, ...props }: VerticalNavigationBranchContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
24
|
+
var Group: ({ tone, variant, className, ...props }: ComponentProps<"div"> & {
|
|
25
|
+
tone?: VerticalNavigationTone;
|
|
26
|
+
variant?: VerticalNavigationVariant;
|
|
27
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
28
|
+
var GroupLabel: ({ className, ...props }: ComponentProps<"h2">) => import("react/jsx-runtime").JSX.Element;
|
|
29
|
+
var Separator: ({ className, ...props }: ComponentProps<"hr">) => import("react/jsx-runtime").JSX.Element;
|
|
30
|
+
}
|
|
31
|
+
export type VerticalNavigationLinkProps<T extends ElementType = "a"> = Omit<LinkButtonProps<T>, "size" | "theme" | "variant" | "block" | "uppercase"> & {
|
|
32
|
+
current?: boolean;
|
|
33
|
+
};
|
|
34
|
+
export type VerticalNavigationBranchProps = Omit<ComponentProps<"li">, "onChange" | "dir"> & Pick<collapsible.Props, "open" | "defaultOpen" | "onOpenChange" | "disabled" | "getRootNode"> & {
|
|
35
|
+
containsCurrent?: boolean;
|
|
36
|
+
};
|
|
37
|
+
export type VerticalNavigationBranchTriggerProps = Omit<ComponentProps<typeof Button>, "size" | "theme" | "variant" | "block" | "uppercase">;
|
|
38
|
+
export type VerticalNavigationBranchContentProps = ComponentProps<"div"> & {
|
|
39
|
+
tone?: VerticalNavigationTone;
|
|
40
|
+
variant?: VerticalNavigationVariant;
|
|
41
|
+
indent?: boolean;
|
|
42
|
+
showGuide?: boolean;
|
|
43
|
+
};
|
|
44
|
+
//# sourceMappingURL=vertical-navigation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vertical-navigation.d.ts","sourceRoot":"","sources":["../../../src/molecules/vertical-navigation.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,WAAW,MAAM,qBAAqB,CAAA;AAElD,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,WAAW,EAAqB,MAAM,OAAO,CAAA;AAChF,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAA;AAExC,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,sBAAsB,CAAA;AACvE,OAAO,EAML,KAAK,sBAAsB,EAC3B,KAAK,sBAAsB,EAC3B,KAAK,yBAAyB,EAC/B,MAAM,mDAAmD,CAAA;AAG1D,YAAY,EACV,sBAAsB,EACtB,sBAAsB,EACtB,yBAAyB,GAC1B,MAAM,mDAAmD,CAAA;AAE1D,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,GAAG;IACzE,IAAI,CAAC,EAAE,sBAAsB,CAAA;IAC7B,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,CAAA;IACnB,0EAA0E;IAC1E,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB,CAAA;AAED,wBAAgB,kBAAkB,CAAC,EACjC,IAAW,EACX,cAAkB,EAClB,GAAG,EACH,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAkBzB;yBAzBe,kBAAkB;;kDAiC/B,cAAc,CAAC,IAAI,CAAC;wCAqBpB,cAAc,CAAC,IAAI,CAAC;uCAiBpB,cAAc,CAAC,KAAK,CAAC;eAoBtB,CAAC,SAAS,WAAW,0CACqB,2BAA2B,CAAC,CAAC,CAAC;iIAuCvE,6BAA6B;2DAqC7B,oCAAoC;mDAoBlC,cAAc,CAAC,MAAM,CAAC;mFA8BxB,oCAAoC;wDAyBpC,cAAc,CAAC,KAAK,CAAC,GAAG;QACzB,IAAI,CAAC,EAAE,sBAAsB,CAAA;QAC7B,OAAO,CAAC,EAAE,yBAAyB,CAAA;KACpC;8CAmBE,cAAc,CAAC,IAAI,CAAC;6CAepB,cAAc,CAAC,IAAI,CAAC;;AAnMvB,MAAM,MAAM,2BAA2B,CAAC,CAAC,SAAS,WAAW,GAAG,GAAG,IAAI,IAAI,CACzE,eAAe,CAAC,CAAC,CAAC,EAClB,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,WAAW,CACrD,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAAA;AAuBzB,MAAM,MAAM,6BAA6B,GAAG,IAAI,CAC9C,cAAc,CAAC,IAAI,CAAC,EACpB,UAAU,GAAG,KAAK,CACnB,GACC,IAAI,CACF,WAAW,CAAC,KAAK,EACjB,MAAM,GAAG,aAAa,GAAG,cAAc,GAAG,UAAU,GAAG,aAAa,CACrE,GAAG;IAAE,eAAe,CAAC,EAAE,OAAO,CAAA;CAAE,CAAA;AAyCnC,MAAM,MAAM,oCAAoC,GAAG,IAAI,CACrD,cAAc,CAAC,OAAO,MAAM,CAAC,EAC7B,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,WAAW,CACrD,CAAA;AA0CD,MAAM,MAAM,oCAAoC,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IACzE,IAAI,CAAC,EAAE,sBAAsB,CAAA;IAC7B,OAAO,CAAC,EAAE,yBAAyB,CAAA;IACnC,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../../src/organisms/data-table.tsx"],"names":[],"mappings":"AAwCA,OAAO,EACL,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,EAEvB,KAAK,qBAAqB,EAC1B,KAAK,aAAa,EAGlB,KAAK,eAAe,EACpB,KAAK,OAAO,EACZ,KAAK,iBAAiB,EACtB,KAAK,YAAY,EAElB,MAAM,uBAAuB,CAAA;AAE9B,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,GAAG,EAUT,MAAM,OAAO,CAAA;AAEd,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAE1D,OAAO,EAAQ,KAAK,QAAQ,EAAE,MAAM,eAAe,CAAA;AAGnD,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAI1E,OAAO,EAEL,KAAK,mBAAmB,EAGxB,KAAK,uBAAuB,EAE5B,KAAK,uBAAuB,EAM7B,MAAM,qBAAqB,CAAA;AAC5B,OAAO,EAGL,KAAK,MAAM,EACX,KAAK,SAAS,EAEd,KAAK,oBAAoB,EAOzB,KAAK,GAAG,EAER,KAAK,aAAa,EACnB,MAAM,sBAAsB,CAAA;AAM7B,YAAY,EACV,mBAAmB,EACnB,oBAAoB,EACpB,sBAAsB,EACtB,uBAAuB,EACvB,sBAAsB,EACtB,uBAAuB,EACvB,eAAe,GAChB,MAAM,qBAAqB,CAAA;AAC5B,YAAY,EACV,IAAI,EACJ,WAAW,EACX,MAAM,EACN,SAAS,EACT,iBAAiB,EACjB,oBAAoB,EACpB,+BAA+B,EAC/B,iBAAiB,EACjB,uBAAuB,EACvB,oBAAoB,EACpB,iBAAiB,EACjB,MAAM,EACN,GAAG,EACH,aAAa,GACd,MAAM,sBAAsB,CAAA;AAE7B,OAAO,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAA;
|
|
1
|
+
{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../../src/organisms/data-table.tsx"],"names":[],"mappings":"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"}
|
package/dist/src/types/zag.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ export type * as Accordion from "@zag-js/accordion";
|
|
|
2
2
|
export type * as Carousel from "@zag-js/carousel";
|
|
3
3
|
export type * as CascadeSelect from "@zag-js/cascade-select";
|
|
4
4
|
export type * as Checkbox from "@zag-js/checkbox";
|
|
5
|
+
export type * as Collapsible from "@zag-js/collapsible";
|
|
5
6
|
export type * as Combobox from "@zag-js/combobox";
|
|
6
7
|
export type * as Dialog from "@zag-js/dialog";
|
|
7
8
|
export type * as Drawer from "@zag-js/drawer";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"zag.d.ts","sourceRoot":"","sources":["../../../src/types/zag.ts"],"names":[],"mappings":"AAAA,YAAY,KAAK,SAAS,MAAM,mBAAmB,CAAA;AACnD,YAAY,KAAK,QAAQ,MAAM,kBAAkB,CAAA;AACjD,YAAY,KAAK,aAAa,MAAM,wBAAwB,CAAA;AAC5D,YAAY,KAAK,QAAQ,MAAM,kBAAkB,CAAA;AACjD,YAAY,KAAK,QAAQ,MAAM,kBAAkB,CAAA;AACjD,YAAY,KAAK,MAAM,MAAM,gBAAgB,CAAA;AAC7C,YAAY,KAAK,MAAM,MAAM,gBAAgB,CAAA;AAC7C,YAAY,KAAK,UAAU,MAAM,qBAAqB,CAAA;AACtD,YAAY,KAAK,OAAO,MAAM,iBAAiB,CAAA;AAC/C,YAAY,KAAK,IAAI,MAAM,cAAc,CAAA;AACzC,YAAY,KAAK,WAAW,MAAM,sBAAsB,CAAA;AACxD,YAAY,KAAK,UAAU,MAAM,oBAAoB,CAAA;AACrD,YAAY,KAAK,OAAO,MAAM,iBAAiB,CAAA;AAC/C,YAAY,KAAK,UAAU,MAAM,qBAAqB,CAAA;AACtD,YAAY,KAAK,WAAW,MAAM,sBAAsB,CAAA;AACxD,YAAY,KAAK,MAAM,MAAM,gBAAgB,CAAA;AAC7C,YAAY,KAAK,MAAM,MAAM,gBAAgB,CAAA;AAC7C,YAAY,KAAK,KAAK,MAAM,eAAe,CAAA;AAC3C,YAAY,KAAK,MAAM,MAAM,gBAAgB,CAAA;AAC7C,YAAY,KAAK,IAAI,MAAM,cAAc,CAAA;AACzC,YAAY,KAAK,KAAK,MAAM,eAAe,CAAA;AAC3C,YAAY,KAAK,OAAO,MAAM,iBAAiB,CAAA;AAC/C,YAAY,KAAK,IAAI,MAAM,cAAc,CAAA;AACzC,YAAY,KAAK,QAAQ,MAAM,mBAAmB,CAAA"}
|
|
1
|
+
{"version":3,"file":"zag.d.ts","sourceRoot":"","sources":["../../../src/types/zag.ts"],"names":[],"mappings":"AAAA,YAAY,KAAK,SAAS,MAAM,mBAAmB,CAAA;AACnD,YAAY,KAAK,QAAQ,MAAM,kBAAkB,CAAA;AACjD,YAAY,KAAK,aAAa,MAAM,wBAAwB,CAAA;AAC5D,YAAY,KAAK,QAAQ,MAAM,kBAAkB,CAAA;AACjD,YAAY,KAAK,WAAW,MAAM,qBAAqB,CAAA;AACvD,YAAY,KAAK,QAAQ,MAAM,kBAAkB,CAAA;AACjD,YAAY,KAAK,MAAM,MAAM,gBAAgB,CAAA;AAC7C,YAAY,KAAK,MAAM,MAAM,gBAAgB,CAAA;AAC7C,YAAY,KAAK,UAAU,MAAM,qBAAqB,CAAA;AACtD,YAAY,KAAK,OAAO,MAAM,iBAAiB,CAAA;AAC/C,YAAY,KAAK,IAAI,MAAM,cAAc,CAAA;AACzC,YAAY,KAAK,WAAW,MAAM,sBAAsB,CAAA;AACxD,YAAY,KAAK,UAAU,MAAM,oBAAoB,CAAA;AACrD,YAAY,KAAK,OAAO,MAAM,iBAAiB,CAAA;AAC/C,YAAY,KAAK,UAAU,MAAM,qBAAqB,CAAA;AACtD,YAAY,KAAK,WAAW,MAAM,sBAAsB,CAAA;AACxD,YAAY,KAAK,MAAM,MAAM,gBAAgB,CAAA;AAC7C,YAAY,KAAK,MAAM,MAAM,gBAAgB,CAAA;AAC7C,YAAY,KAAK,KAAK,MAAM,eAAe,CAAA;AAC3C,YAAY,KAAK,MAAM,MAAM,gBAAgB,CAAA;AAC7C,YAAY,KAAK,IAAI,MAAM,cAAc,CAAA;AACzC,YAAY,KAAK,KAAK,MAAM,eAAe,CAAA;AAC3C,YAAY,KAAK,OAAO,MAAM,iBAAiB,CAAA;AAC/C,YAAY,KAAK,IAAI,MAAM,cAAc,CAAA;AACzC,YAAY,KAAK,QAAQ,MAAM,mBAAmB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"changelog.stories.d.ts","sourceRoot":"","sources":["../../../stories/changelog/changelog.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;
|
|
1
|
+
{"version":3,"file":"changelog.stories.d.ts","sourceRoot":"","sources":["../../../stories/changelog/changelog.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAyOtD,iBAAS,SAAS,4CAUjB;AAED,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CAKhC,CAAA;AAED,eAAe,IAAI,CAAA;AAEnB,eAAO,MAAM,UAAU,EAAE,QAAQ,CAAC,OAAO,SAAS,CAAM,CAAA"}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import type { StoryObj } from "@storybook/react";
|
|
2
|
+
import "./vertical-navigation.stories.css";
|
|
3
|
+
type NavigationStoryProps = {
|
|
4
|
+
size: "sm" | "md";
|
|
5
|
+
tone: "plain" | "subtle" | "accent";
|
|
6
|
+
variant: "primary" | "secondary";
|
|
7
|
+
indent: boolean;
|
|
8
|
+
showGuide: boolean;
|
|
9
|
+
dir: "ltr" | "rtl";
|
|
10
|
+
};
|
|
11
|
+
declare function NavigationStory(args: NavigationStoryProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
declare const meta: {
|
|
13
|
+
title: string;
|
|
14
|
+
component: typeof NavigationStory;
|
|
15
|
+
tags: string[];
|
|
16
|
+
parameters: {
|
|
17
|
+
layout: string;
|
|
18
|
+
docs: {
|
|
19
|
+
description: {
|
|
20
|
+
component: string;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
};
|
|
24
|
+
argTypes: {
|
|
25
|
+
variant: {
|
|
26
|
+
control: "select";
|
|
27
|
+
options: string[];
|
|
28
|
+
if: {
|
|
29
|
+
arg: string;
|
|
30
|
+
eq: string;
|
|
31
|
+
};
|
|
32
|
+
description: string;
|
|
33
|
+
};
|
|
34
|
+
size: {
|
|
35
|
+
control: "select";
|
|
36
|
+
options: string[];
|
|
37
|
+
};
|
|
38
|
+
tone: {
|
|
39
|
+
control: "select";
|
|
40
|
+
options: string[];
|
|
41
|
+
description: string;
|
|
42
|
+
};
|
|
43
|
+
indent: {
|
|
44
|
+
control: "boolean";
|
|
45
|
+
};
|
|
46
|
+
showGuide: {
|
|
47
|
+
control: "boolean";
|
|
48
|
+
};
|
|
49
|
+
dir: {
|
|
50
|
+
control: "select";
|
|
51
|
+
options: string[];
|
|
52
|
+
};
|
|
53
|
+
};
|
|
54
|
+
args: {
|
|
55
|
+
size: "md";
|
|
56
|
+
tone: "subtle";
|
|
57
|
+
variant: "primary";
|
|
58
|
+
indent: true;
|
|
59
|
+
showGuide: false;
|
|
60
|
+
dir: "ltr";
|
|
61
|
+
};
|
|
62
|
+
};
|
|
63
|
+
export default meta;
|
|
64
|
+
type Story = StoryObj<typeof meta>;
|
|
65
|
+
export declare const Playground: Story;
|
|
66
|
+
export declare const Variants: Story;
|
|
67
|
+
export declare const Sizes: Story;
|
|
68
|
+
export declare const States: Story;
|
|
69
|
+
export declare const SevenLevels: Story;
|
|
70
|
+
export declare const Controlled: Story;
|
|
71
|
+
export declare const WithinDrawer: Story;
|
|
72
|
+
export declare const WithinSidebar: Story;
|
|
73
|
+
export declare const RTL: Story;
|
|
74
|
+
export declare const AkrosCatalog: Story;
|
|
75
|
+
//# sourceMappingURL=vertical-navigation.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vertical-navigation.stories.d.ts","sourceRoot":"","sources":["../../../stories/molecules/vertical-navigation.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAQtD,OAAO,mCAAmC,CAAA;AAE1C,KAAK,oBAAoB,GAAG;IAC1B,IAAI,EAAE,IAAI,GAAG,IAAI,CAAA;IACjB,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACnC,OAAO,EAAE,SAAS,GAAG,WAAW,CAAA;IAChC,MAAM,EAAE,OAAO,CAAA;IACf,SAAS,EAAE,OAAO,CAAA;IAClB,GAAG,EAAE,KAAK,GAAG,KAAK,CAAA;CACnB,CAAA;AAoGD,iBAAS,eAAe,CAAC,IAAI,EAAE,oBAAoB,2CAMlD;AAED,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsC8B,CAAA;AAExC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,UAAU,EAAE,KAAU,CAAA;AAEnC,eAAO,MAAM,QAAQ,EAAE,KAyBtB,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAanB,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAuEpB,CAAA;AA+ID,eAAO,MAAM,WAAW,EAAE,KAWzB,CAAA;AA2DD,eAAO,MAAM,UAAU,EAAE,KAGxB,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAyB1B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KA4B3B,CAAA;AAED,eAAO,MAAM,GAAG,EAAE,KAAgC,CAAA;AAwGlD,eAAO,MAAM,YAAY,EAAE,KAY1B,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vertical-navigation.behavior.spec.d.ts","sourceRoot":"","sources":["../../test/vertical-navigation.behavior.spec.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vertical-navigation.playwright.config.d.ts","sourceRoot":"","sources":["../../test/vertical-navigation.playwright.config.ts"],"names":[],"mappings":"AAEA,oEAAoE;;AACpE,wBAeE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@techsio/ui-kit",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.48.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"repository": {
|
|
@@ -109,6 +109,7 @@
|
|
|
109
109
|
"@zag-js/carousel": "1.43.3",
|
|
110
110
|
"@zag-js/cascade-select": "1.43.3",
|
|
111
111
|
"@zag-js/checkbox": "1.43.3",
|
|
112
|
+
"@zag-js/collapsible": "1.43.3",
|
|
112
113
|
"@zag-js/combobox": "1.43.3",
|
|
113
114
|
"@zag-js/date-input": "1.43.3",
|
|
114
115
|
"@zag-js/date-picker": "1.43.3",
|
|
@@ -0,0 +1,155 @@
|
|
|
1
|
+
@theme static {
|
|
2
|
+
/* BASE COLOR MAPPING */
|
|
3
|
+
--color-vertical-navigation-surface: var(--color-fill-surface);
|
|
4
|
+
--color-vertical-navigation-foreground: var(--color-fg-primary);
|
|
5
|
+
--color-vertical-navigation-accent: var(--color-bg-primary-base);
|
|
6
|
+
--color-vertical-navigation-secondary: var(--color-bg-secondary-base);
|
|
7
|
+
--color-vertical-navigation-accent-light: color-mix(
|
|
8
|
+
in oklab,
|
|
9
|
+
var(--color-vertical-navigation-accent) 15%,
|
|
10
|
+
var(--color-vertical-navigation-surface)
|
|
11
|
+
);
|
|
12
|
+
|
|
13
|
+
/* DERIVED COLORS */
|
|
14
|
+
--color-vertical-navigation-fg: var(--color-vertical-navigation-foreground);
|
|
15
|
+
--color-vertical-navigation-item-bg: transparent;
|
|
16
|
+
--color-vertical-navigation-label-fg: var(
|
|
17
|
+
--color-vertical-navigation-foreground
|
|
18
|
+
);
|
|
19
|
+
--color-vertical-navigation-guide-border: var(--color-border-primary);
|
|
20
|
+
--color-vertical-navigation-separator-bg: var(--color-border-primary);
|
|
21
|
+
|
|
22
|
+
/* STATE VARIATIONS */
|
|
23
|
+
--color-vertical-navigation-item-bg-hover: var(--color-fill-hover);
|
|
24
|
+
--color-vertical-navigation-indicator-fg-hover: color-mix(
|
|
25
|
+
in oklab,
|
|
26
|
+
var(--color-fg-accent-primary) 60%,
|
|
27
|
+
var(--color-vertical-navigation-foreground)
|
|
28
|
+
);
|
|
29
|
+
--color-vertical-navigation-item-bg-current: color-mix(
|
|
30
|
+
in oklab,
|
|
31
|
+
var(--color-vertical-navigation-accent) 30%,
|
|
32
|
+
var(--color-vertical-navigation-surface)
|
|
33
|
+
);
|
|
34
|
+
--color-vertical-navigation-item-fg-current: var(
|
|
35
|
+
--color-vertical-navigation-foreground
|
|
36
|
+
);
|
|
37
|
+
|
|
38
|
+
/* COMPONENT VARIANTS */
|
|
39
|
+
--color-vertical-navigation-group-bg-plain: transparent;
|
|
40
|
+
--color-vertical-navigation-group-fg-plain: var(
|
|
41
|
+
--color-vertical-navigation-foreground
|
|
42
|
+
);
|
|
43
|
+
--color-vertical-navigation-group-bg-subtle: var(
|
|
44
|
+
--color-vertical-navigation-surface
|
|
45
|
+
);
|
|
46
|
+
--color-vertical-navigation-group-fg-subtle: var(
|
|
47
|
+
--color-vertical-navigation-foreground
|
|
48
|
+
);
|
|
49
|
+
--color-vertical-navigation-group-bg-accent: var(
|
|
50
|
+
--color-vertical-navigation-accent-light
|
|
51
|
+
);
|
|
52
|
+
--color-vertical-navigation-group-fg-accent: var(
|
|
53
|
+
--color-vertical-navigation-foreground
|
|
54
|
+
);
|
|
55
|
+
|
|
56
|
+
--color-vertical-navigation-group-bg-secondary: color-mix(
|
|
57
|
+
in oklab,
|
|
58
|
+
var(--color-vertical-navigation-secondary) 15%,
|
|
59
|
+
var(--color-vertical-navigation-surface)
|
|
60
|
+
);
|
|
61
|
+
--color-vertical-navigation-group-fg-secondary: var(
|
|
62
|
+
--color-vertical-navigation-foreground
|
|
63
|
+
);
|
|
64
|
+
|
|
65
|
+
/* DISABLED STATES */
|
|
66
|
+
--color-vertical-navigation-item-fg-disabled: var(--color-fg-disabled);
|
|
67
|
+
|
|
68
|
+
/* SPACING */
|
|
69
|
+
--spacing-vertical-navigation-list: var(--dimension-2);
|
|
70
|
+
--spacing-vertical-navigation-row: var(--spacing-50);
|
|
71
|
+
--spacing-vertical-navigation-group: var(--spacing-100);
|
|
72
|
+
--spacing-vertical-navigation-indent: var(--dimension-12);
|
|
73
|
+
--spacing-vertical-navigation-label: var(--dimension-8);
|
|
74
|
+
--spacing-vertical-navigation-item-sm: var(--height-form-control-sm);
|
|
75
|
+
--spacing-vertical-navigation-item-md: var(--dimension-36);
|
|
76
|
+
--spacing-vertical-navigation-separator: var(--border-width-sm);
|
|
77
|
+
--padding-vertical-navigation-item-x-sm: var(--padding-popup-item-x-sm);
|
|
78
|
+
--padding-vertical-navigation-item-x-md: var(--padding-popup-item-x-md);
|
|
79
|
+
--padding-vertical-navigation-item-y-sm: var(--padding-popup-item-y-sm);
|
|
80
|
+
--padding-vertical-navigation-item-y-md: var(--padding-popup-item-y-md);
|
|
81
|
+
--padding-vertical-navigation-group: var(--dimension-0);
|
|
82
|
+
|
|
83
|
+
/* TYPOGRAPHY */
|
|
84
|
+
--text-vertical-navigation-sm: var(--text-sm);
|
|
85
|
+
--text-vertical-navigation-md: var(--text-base);
|
|
86
|
+
--text-vertical-navigation-label-sm: var(--text-xs);
|
|
87
|
+
--text-vertical-navigation-icon-sm: var(--text-icon-control-sm);
|
|
88
|
+
--text-vertical-navigation-icon-md: var(--text-icon-control-md);
|
|
89
|
+
--font-weight-vertical-navigation-current: var(--font-weight-semibold);
|
|
90
|
+
--font-weight-vertical-navigation-label: var(--font-weight-semibold);
|
|
91
|
+
--font-weight-vertical-navigation-path: var(--font-weight-medium);
|
|
92
|
+
|
|
93
|
+
/* BORDERS & RADIUS */
|
|
94
|
+
--border-width-vertical-navigation: var(--border-width-sm);
|
|
95
|
+
--radius-vertical-navigation-item: var(--radius-sm);
|
|
96
|
+
--radius-vertical-navigation-group: var(--radius-none);
|
|
97
|
+
|
|
98
|
+
/* FOCUS RINGS */
|
|
99
|
+
--color-vertical-navigation-focus-border: var(--color-ring);
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
@utility vertical-navigation-focus {
|
|
103
|
+
outline-style: var(--default-ring-style);
|
|
104
|
+
outline-width: var(--default-ring-width);
|
|
105
|
+
outline-color: var(--color-vertical-navigation-focus-border);
|
|
106
|
+
outline-offset: var(--default-ring-offset);
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
@utility vertical-navigation-guide {
|
|
110
|
+
border-inline-start: var(--border-width-vertical-navigation) solid
|
|
111
|
+
var(--color-vertical-navigation-guide-border);
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
@utility vertical-navigation-row {
|
|
115
|
+
& > [data-part="link"],
|
|
116
|
+
& > [data-part="branch-trigger"] {
|
|
117
|
+
&,
|
|
118
|
+
&:hover,
|
|
119
|
+
&[data-current] {
|
|
120
|
+
background-color: transparent;
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
& > [data-part="branch-trigger"] {
|
|
125
|
+
width: auto;
|
|
126
|
+
flex-shrink: 0;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
@media (hover: hover) {
|
|
130
|
+
&:hover:not(:has(> [data-part="link"][data-current])):has(
|
|
131
|
+
> [data-part="link"]:not([data-disabled]),
|
|
132
|
+
> [data-part="branch-trigger"]:not(:disabled)
|
|
133
|
+
) {
|
|
134
|
+
background-color: var(--color-vertical-navigation-item-bg-hover);
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
&
|
|
138
|
+
> [data-part="branch-trigger"]:not(:disabled):hover
|
|
139
|
+
> [data-part="branch-indicator"] {
|
|
140
|
+
color: var(--color-vertical-navigation-indicator-fg-hover);
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
&:has(> [data-part="link"][data-current]) {
|
|
145
|
+
background-color: var(--color-vertical-navigation-item-bg-current);
|
|
146
|
+
}
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
@utility vertical-navigation-control {
|
|
150
|
+
overflow-wrap: anywhere;
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
@utility token-icon-vertical-navigation-chevron {
|
|
154
|
+
@apply token-icon-chevron-down;
|
|
155
|
+
}
|
|
@@ -1,3 +1,26 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* DataTable — component tokens.
|
|
3
|
+
*
|
|
4
|
+
* The colour, radius and spacing tokens all come from Figma via
|
|
5
|
+
* libs/ui/src/tokens/figma/variables.css (`--color-data-table-*`,
|
|
6
|
+
* `--padding-data-table-*`, `--spacing-data-table-*`).
|
|
7
|
+
*
|
|
8
|
+
* Kept here: the `-x`/`-y` padding composites. Figma exports padding split
|
|
9
|
+
* into halves, and Tailwind's `p-*` utilities resolve a single
|
|
10
|
+
* `--padding-<name>` value — there is no `px-<name>` lookup for a `-x` token.
|
|
11
|
+
* So the shorthands are rebuilt from the Figma halves (padding: y x), exactly
|
|
12
|
+
* as _table.css does for `--padding-table-cell-*`.
|
|
13
|
+
*/
|
|
14
|
+
|
|
15
|
+
@theme static {
|
|
16
|
+
--padding-data-table-toolbar: var(--padding-data-table-toolbar-y)
|
|
17
|
+
var(--padding-data-table-toolbar-x);
|
|
18
|
+
--padding-data-table-filter-cell: var(--padding-data-table-filter-cell-y)
|
|
19
|
+
var(--padding-data-table-filter-cell-x);
|
|
20
|
+
--padding-data-table-pagination: var(--padding-data-table-pagination-y)
|
|
21
|
+
var(--padding-data-table-pagination-x);
|
|
22
|
+
}
|
|
23
|
+
|
|
1
24
|
/*
|
|
2
25
|
* DataTable — nested-row tint.
|
|
3
26
|
*
|
|
@@ -5,10 +28,9 @@
|
|
|
5
28
|
* than a background, so it composes with `striped`'s zebra background instead
|
|
6
29
|
* of losing the Tailwind-merge conflict against it (two `bg-*` utilities on
|
|
7
30
|
* one element can't both render; a shadow layers on top of whichever
|
|
8
|
-
* background is already there).
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
* still waiting on (see the "PROTOTYPE styling" note in data-table.tsx).
|
|
31
|
+
* background is already there). Reads `--color-data-table-row-bg-nested`,
|
|
32
|
+
* which aliases `--color-table-row-bg-hover` in Figma — the depth shading can
|
|
33
|
+
* now be retargeted without this file knowing which Table token backs it.
|
|
12
34
|
*/
|
|
13
35
|
/*
|
|
14
36
|
* Verified: box-shadow on a `<tr>` *does* paint under `border-collapse` in
|
|
@@ -21,7 +43,7 @@
|
|
|
21
43
|
* would cause.
|
|
22
44
|
*/
|
|
23
45
|
@utility data-table-row-nested-tint {
|
|
24
|
-
box-shadow: inset 0 0 0 9999px var(--color-table-row-bg-
|
|
46
|
+
box-shadow: inset 0 0 0 9999px var(--color-data-table-row-bg-nested);
|
|
25
47
|
}
|
|
26
48
|
|
|
27
49
|
/*
|
|
@@ -37,13 +59,14 @@
|
|
|
37
59
|
* inheriting it yields a see-through cell.
|
|
38
60
|
*
|
|
39
61
|
* Compositing solves both at once — the same trick `OPAQUE_HEADER_BG` uses for
|
|
40
|
-
* the header. The opaque
|
|
62
|
+
* the header. The opaque surface is `--color-data-table-pinned-cell-bg` as the
|
|
63
|
+
* background-*color*; the row tint
|
|
41
64
|
* is painted over it as a gradient image, read from a custom property the row
|
|
42
65
|
* sets. Custom properties inherit, so the row can drive its cells' tint
|
|
43
66
|
* without either knowing about the other.
|
|
44
67
|
*/
|
|
45
68
|
@utility data-table-frozen-cell {
|
|
46
|
-
background-color: var(--color-table-bg);
|
|
69
|
+
background-color: var(--color-data-table-pinned-cell-bg);
|
|
47
70
|
background-image: linear-gradient(
|
|
48
71
|
var(--dt-row-tint, transparent),
|
|
49
72
|
var(--dt-row-tint, transparent)
|
|
@@ -14,21 +14,4 @@
|
|
|
14
14
|
var(--padding-table-cell-md-x);
|
|
15
15
|
--padding-table-cell-lg: var(--padding-table-cell-lg-y)
|
|
16
16
|
var(--padding-table-cell-lg-x);
|
|
17
|
-
|
|
18
|
-
/*
|
|
19
|
-
* Foreground for a selected row. Figma exports
|
|
20
|
-
* --color-table-row-bg-selected but has no `fg` counterpart, so
|
|
21
|
-
* `text-table-row-fg-selected` in table.tsx generated no utility at all and
|
|
22
|
-
* selected rows silently kept their normal text colour on the filled brand
|
|
23
|
-
* background. Reported by review; this restores the intended pairing.
|
|
24
|
-
*
|
|
25
|
-
* White clears AA against every selected background the row can have:
|
|
26
|
-
* base light #155dfc 5.24:1, base dark #0069a8 5.86:1, neo #e60101 4.81:1
|
|
27
|
-
* in both modes. Mode-invariant, because the selected fill stays a solid
|
|
28
|
-
* brand colour in light and dark alike.
|
|
29
|
-
*
|
|
30
|
-
* TEMPORARY BRIDGE: delete once Figma exports color/table/row/fg/selected —
|
|
31
|
-
* figma/variables.css is imported after this file and would win.
|
|
32
|
-
*/
|
|
33
|
-
--color-table-row-fg-selected: var(--color-white);
|
|
34
17
|
}
|