@ztwoint/z-ui 0.1.8 → 0.1.9
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/components/assets/icons/chevron-down.d.ts +7 -0
- package/dist/components/assets/icons/chevron-down.js +20 -0
- package/dist/components/assets/icons/chevron-up-icon.d.ts +7 -0
- package/dist/components/assets/icons/chevron-up-icon.js +22 -0
- package/dist/components/assets/icons/circles-icon.d.ts +8 -0
- package/dist/components/assets/icons/circles-icon.js +58 -0
- package/dist/components/assets/icons/database-copy.d.ts +7 -0
- package/dist/components/assets/icons/database-copy.js +49 -0
- package/dist/components/assets/icons/home.d.ts +6 -0
- package/dist/components/assets/icons/sidebar-left-show-copy.d.ts +7 -0
- package/dist/components/assets/icons/sidebar-left-show-copy.js +46 -0
- package/dist/components/assets/icons/sub-nav-indicator.d.ts +7 -0
- package/dist/components/assets/icons/sub-nav-indicator.js +48 -0
- package/dist/components/assets/icons/window-left-copy.d.ts +7 -0
- package/dist/components/assets/icons/window-left-copy.js +38 -0
- package/dist/components/assets/icons/z2-icon.d.ts +8 -0
- package/dist/components/assets/icons/z2-icon.js +17 -0
- package/dist/components/button/__tests__/Button.test.d.ts +1 -0
- package/dist/components/button/button.d.ts +16 -0
- package/dist/components/button/button.js +100 -0
- package/dist/components/button/button.stories.d.ts +26 -0
- package/dist/components/collapsible-side-nav-bar/constants.d.ts +2 -0
- package/dist/components/collapsible-side-nav-bar/constants.js +5 -0
- package/dist/components/collapsible-side-nav-bar/context.d.ts +4 -0
- package/dist/components/collapsible-side-nav-bar/context.js +11 -0
- package/dist/components/collapsible-side-nav-bar/index.d.ts +18 -0
- package/dist/components/collapsible-side-nav-bar/popover/index.d.ts +3 -0
- package/dist/components/collapsible-side-nav-bar/popover/popover-content.d.ts +3 -0
- package/dist/components/collapsible-side-nav-bar/popover/popover-content.js +97 -0
- package/dist/components/collapsible-side-nav-bar/popover/popover-trigger.d.ts +3 -0
- package/dist/components/collapsible-side-nav-bar/popover/popover-trigger.js +13 -0
- package/dist/components/collapsible-side-nav-bar/popover/popover.d.ts +9 -0
- package/dist/components/collapsible-side-nav-bar/popover/popover.js +45 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-content.d.ts +3 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-content.js +34 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-footer.d.ts +3 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-footer.js +25 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-group.d.ts +3 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-group.js +25 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-header.d.ts +3 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-header.js +122 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-item.d.ts +3 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-item.js +176 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-provider.d.ts +3 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-provider.js +39 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-separator.d.ts +3 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar-separator.js +10 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar.d.ts +7 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar.js +42 -0
- package/dist/components/collapsible-side-nav-bar/side-nav-bar.stories.d.ts +6 -0
- package/dist/components/collapsible-side-nav-bar/types.d.ts +84 -0
- package/dist/components/country-flags/__tests__/country-flags.test.d.ts +1 -0
- package/dist/components/country-flags/country-flags.d.ts +8 -0
- package/dist/components/country-flags/country-flags.js +34 -0
- package/dist/components/country-flags/country-flags.stories.d.ts +11 -0
- package/dist/components/input/__tests__/Input.test.d.ts +1 -0
- package/dist/components/input/input.d.ts +2 -0
- package/dist/components/input/input.js +11 -0
- package/dist/components/nav-header/index.d.ts +2 -0
- package/dist/components/nav-header/nav-header.d.ts +18 -0
- package/dist/components/nav-header/nav-header.js +40 -0
- package/dist/components/nav-header/nav-header.stories.d.ts +7 -0
- package/dist/components/nav-header/nav-item/nav-item.d.ts +6 -0
- package/dist/components/nav-header/nav-item/nav-item.js +31 -0
- package/dist/components/nav-header/nav-item/nav-item.stories.d.ts +12 -0
- package/dist/components/tab/__tests__/tab.test.d.ts +1 -0
- package/dist/components/tab/tab.d.ts +10 -0
- package/dist/components/tab/tab.js +80 -0
- package/dist/components/tab/tab.stories.d.ts +16 -0
- package/dist/css/styles/tailwind.css +1 -0
- package/dist/index.d.ts +6 -0
- package/dist/index.js +59 -0
- package/dist/lib/utils.d.ts +2 -0
- package/dist/lib/utils.js +8 -0
- package/dist/main.d.ts +0 -0
- package/dist/test/setup.d.ts +0 -0
- package/dist/test/test-utils.d.ts +5 -0
- package/dist/tokens/typography/typography.stories.d.ts +12 -0
- package/dist/types/components/assets/icons/chevron-down.d.ts +7 -0
- package/dist/types/components/assets/icons/chevron-up-icon.d.ts +7 -0
- package/dist/types/components/assets/icons/circles-icon.d.ts +8 -0
- package/dist/types/components/assets/icons/database-copy.d.ts +7 -0
- package/dist/types/components/assets/icons/home.d.ts +6 -0
- package/dist/types/components/assets/icons/sidebar-left-show-copy.d.ts +7 -0
- package/dist/types/components/assets/icons/sub-nav-indicator.d.ts +7 -0
- package/dist/types/components/assets/icons/window-left-copy.d.ts +7 -0
- package/dist/types/components/assets/icons/z2-icon.d.ts +8 -0
- package/dist/types/components/button/__tests__/Button.test.d.ts +1 -0
- package/dist/types/components/button/button.d.ts +16 -0
- package/dist/types/components/button/button.stories.d.ts +26 -0
- package/dist/types/components/collapsible-side-nav-bar/constants.d.ts +2 -0
- package/dist/types/components/collapsible-side-nav-bar/context.d.ts +4 -0
- package/dist/types/components/collapsible-side-nav-bar/index.d.ts +18 -0
- package/dist/types/components/collapsible-side-nav-bar/popover/index.d.ts +3 -0
- package/dist/types/components/collapsible-side-nav-bar/popover/popover-content.d.ts +3 -0
- package/dist/types/components/collapsible-side-nav-bar/popover/popover-trigger.d.ts +3 -0
- package/dist/types/components/collapsible-side-nav-bar/popover/popover.d.ts +9 -0
- package/dist/types/components/collapsible-side-nav-bar/side-nav-bar-content.d.ts +3 -0
- package/dist/types/components/collapsible-side-nav-bar/side-nav-bar-footer.d.ts +3 -0
- package/dist/types/components/collapsible-side-nav-bar/side-nav-bar-group.d.ts +3 -0
- package/dist/types/components/collapsible-side-nav-bar/side-nav-bar-header.d.ts +3 -0
- package/dist/types/components/collapsible-side-nav-bar/side-nav-bar-item.d.ts +3 -0
- package/dist/types/components/collapsible-side-nav-bar/side-nav-bar-provider.d.ts +3 -0
- package/dist/types/components/collapsible-side-nav-bar/side-nav-bar-separator.d.ts +3 -0
- package/dist/types/components/collapsible-side-nav-bar/side-nav-bar.d.ts +7 -0
- package/dist/types/components/collapsible-side-nav-bar/side-nav-bar.stories.d.ts +6 -0
- package/dist/types/components/collapsible-side-nav-bar/types.d.ts +84 -0
- package/dist/types/components/country-flags/__tests__/country-flags.test.d.ts +1 -0
- package/dist/types/components/country-flags/country-flags.d.ts +8 -0
- package/dist/types/components/country-flags/country-flags.stories.d.ts +11 -0
- package/dist/types/components/input/__tests__/Input.test.d.ts +1 -0
- package/dist/types/components/input/input.d.ts +2 -0
- package/dist/types/components/nav-header/index.d.ts +2 -0
- package/dist/types/components/nav-header/nav-header.d.ts +18 -0
- package/dist/types/components/nav-header/nav-header.stories.d.ts +7 -0
- package/dist/types/components/nav-header/nav-item/nav-item.d.ts +6 -0
- package/dist/types/components/nav-header/nav-item/nav-item.stories.d.ts +12 -0
- package/dist/types/components/tab/__tests__/tab.test.d.ts +1 -0
- package/dist/types/components/tab/tab.d.ts +10 -0
- package/dist/types/components/tab/tab.stories.d.ts +16 -0
- package/dist/types/index.d.ts +7 -0
- package/dist/types/lib/utils.d.ts +2 -0
- package/dist/types/main.d.ts +1 -0
- package/dist/types/test/setup.d.ts +1 -0
- package/dist/types/test/test-utils.d.ts +5 -0
- package/dist/types/tokens/typography/typography.stories.d.ts +12 -0
- package/package.json +1 -1
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { SVGProps } from 'react';
|
|
2
|
+
type IconProps = SVGProps<SVGSVGElement> & {
|
|
3
|
+
secondaryfill?: string;
|
|
4
|
+
title?: string;
|
|
5
|
+
};
|
|
6
|
+
declare function ChevronDownCopy({ fill, title, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export default ChevronDownCopy;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { jsxs as n, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
function s({ fill: o = "currentColor", title: r = "badge 13", ...t }) {
|
|
3
|
+
return /* @__PURE__ */ n("svg", { height: "14", width: "14", viewBox: "0 0 14 14", xmlns: "http://www.w3.org/2000/svg", ...t, children: [
|
|
4
|
+
/* @__PURE__ */ e("title", { children: r }),
|
|
5
|
+
/* @__PURE__ */ e("g", { fill: o, children: /* @__PURE__ */ e(
|
|
6
|
+
"path",
|
|
7
|
+
{
|
|
8
|
+
d: "M2.45 5.25l4.55 4.55 4.55-4.55",
|
|
9
|
+
fill: "none",
|
|
10
|
+
stroke: o,
|
|
11
|
+
strokeLinecap: "round",
|
|
12
|
+
strokeLinejoin: "round",
|
|
13
|
+
strokeWidth: "2"
|
|
14
|
+
}
|
|
15
|
+
) })
|
|
16
|
+
] });
|
|
17
|
+
}
|
|
18
|
+
export {
|
|
19
|
+
s as default
|
|
20
|
+
};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { jsxs as n, jsx as r } from "react/jsx-runtime";
|
|
2
|
+
const s = ({
|
|
3
|
+
fill: e = "currentColor",
|
|
4
|
+
title: o = "badge 13",
|
|
5
|
+
...t
|
|
6
|
+
}) => /* @__PURE__ */ n("svg", { height: "14", width: "14", viewBox: "0 0 14 14", xmlns: "http://www.w3.org/2000/svg", ...t, children: [
|
|
7
|
+
/* @__PURE__ */ r("title", { children: o }),
|
|
8
|
+
/* @__PURE__ */ r("g", { fill: e, children: /* @__PURE__ */ r(
|
|
9
|
+
"path",
|
|
10
|
+
{
|
|
11
|
+
d: "M11.55 8.75l-4.55-4.55-4.55 4.55",
|
|
12
|
+
fill: "none",
|
|
13
|
+
stroke: e,
|
|
14
|
+
strokeLinecap: "round",
|
|
15
|
+
strokeLinejoin: "round",
|
|
16
|
+
strokeWidth: "2"
|
|
17
|
+
}
|
|
18
|
+
) })
|
|
19
|
+
] });
|
|
20
|
+
export {
|
|
21
|
+
s as ChevronUpIcon
|
|
22
|
+
};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { SVGProps } from 'react';
|
|
2
|
+
type IconProps = SVGProps<SVGSVGElement> & {
|
|
3
|
+
secondaryfill?: string;
|
|
4
|
+
strokewidth?: number;
|
|
5
|
+
title?: string;
|
|
6
|
+
};
|
|
7
|
+
declare function Circles5Copy({ fill, secondaryfill, title, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export default Circles5Copy;
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import { jsxs as o, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
function h({
|
|
3
|
+
fill: r = "currentColor",
|
|
4
|
+
secondaryfill: t,
|
|
5
|
+
title: i = "badge 13",
|
|
6
|
+
...n
|
|
7
|
+
}) {
|
|
8
|
+
return t = t || r, /* @__PURE__ */ o("svg", { height: "14", width: "14", viewBox: "0 0 14 14", xmlns: "http://www.w3.org/2000/svg", ...n, children: [
|
|
9
|
+
/* @__PURE__ */ e("title", { children: i }),
|
|
10
|
+
/* @__PURE__ */ o("g", { fill: r, strokeLinecap: "butt", strokeLinejoin: "miter", strokeMiterlimit: "10", children: [
|
|
11
|
+
/* @__PURE__ */ e(
|
|
12
|
+
"path",
|
|
13
|
+
{
|
|
14
|
+
d: "M7.04 11.44c2.43 0 4.4-1.97 4.4-4.4s-1.97-4.4-4.4-4.4-4.4 1.97-4.4 4.4 1.97 4.4 4.4 4.4z",
|
|
15
|
+
fill: "none",
|
|
16
|
+
stroke: r,
|
|
17
|
+
strokeLinecap: "square",
|
|
18
|
+
strokeWidth: "1"
|
|
19
|
+
}
|
|
20
|
+
),
|
|
21
|
+
/* @__PURE__ */ e(
|
|
22
|
+
"path",
|
|
23
|
+
{
|
|
24
|
+
d: "M2.2 1.54a0.66 0.66 0 1 1-1.32 0 0.66 0.66 0 0 1 1.32 0z",
|
|
25
|
+
fill: t,
|
|
26
|
+
stroke: "none"
|
|
27
|
+
}
|
|
28
|
+
),
|
|
29
|
+
/* @__PURE__ */ e(
|
|
30
|
+
"path",
|
|
31
|
+
{
|
|
32
|
+
d: "M2.2 12.54a0.66 0.66 0 1 1-1.32 0 0.66 0.66 0 0 1 1.32 0z",
|
|
33
|
+
fill: t,
|
|
34
|
+
stroke: "none"
|
|
35
|
+
}
|
|
36
|
+
),
|
|
37
|
+
/* @__PURE__ */ e(
|
|
38
|
+
"path",
|
|
39
|
+
{
|
|
40
|
+
d: "M13.2 1.54a0.66 0.66 0 1 1-1.32 0 0.66 0.66 0 0 1 1.32 0z",
|
|
41
|
+
fill: t,
|
|
42
|
+
stroke: "none"
|
|
43
|
+
}
|
|
44
|
+
),
|
|
45
|
+
/* @__PURE__ */ e(
|
|
46
|
+
"path",
|
|
47
|
+
{
|
|
48
|
+
d: "M13.2 12.54a0.66 0.66 0 1 1-1.32 0 0.66 0.66 0 0 1 1.32 0z",
|
|
49
|
+
fill: t,
|
|
50
|
+
stroke: "none"
|
|
51
|
+
}
|
|
52
|
+
)
|
|
53
|
+
] })
|
|
54
|
+
] });
|
|
55
|
+
}
|
|
56
|
+
export {
|
|
57
|
+
h as default
|
|
58
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { SVGProps } from 'react';
|
|
2
|
+
type IconProps = SVGProps<SVGSVGElement> & {
|
|
3
|
+
secondaryfill?: string;
|
|
4
|
+
title?: string;
|
|
5
|
+
};
|
|
6
|
+
declare function DatabaseCopy({ fill, secondaryfill, title, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export default DatabaseCopy;
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { jsxs as r, jsx as o } from "react/jsx-runtime";
|
|
2
|
+
function d({
|
|
3
|
+
fill: e = "currentColor",
|
|
4
|
+
secondaryfill: t,
|
|
5
|
+
title: n = "badge 13",
|
|
6
|
+
...s
|
|
7
|
+
}) {
|
|
8
|
+
return t = t || e, /* @__PURE__ */ r("svg", { height: "14", width: "14", viewBox: "0 0 14 14", xmlns: "http://www.w3.org/2000/svg", ...s, children: [
|
|
9
|
+
/* @__PURE__ */ o("title", { children: n }),
|
|
10
|
+
/* @__PURE__ */ r("g", { fill: e, children: [
|
|
11
|
+
/* @__PURE__ */ o(
|
|
12
|
+
"path",
|
|
13
|
+
{
|
|
14
|
+
d: "M2.8 3.85v6.3c0 0.97 1.88 1.75 4.2 1.75s4.2-0.78 4.2-1.75v-6.3",
|
|
15
|
+
fill: "none",
|
|
16
|
+
stroke: e,
|
|
17
|
+
strokeLinecap: "round",
|
|
18
|
+
strokeLinejoin: "round",
|
|
19
|
+
strokeWidth: "2"
|
|
20
|
+
}
|
|
21
|
+
),
|
|
22
|
+
/* @__PURE__ */ o(
|
|
23
|
+
"path",
|
|
24
|
+
{
|
|
25
|
+
d: "M7 2.1a4.2 1.75 0 1 0 0 3.5 4.2 1.75 0 1 0 0-3.5z",
|
|
26
|
+
fill: "none",
|
|
27
|
+
stroke: t,
|
|
28
|
+
strokeLinecap: "round",
|
|
29
|
+
strokeLinejoin: "round",
|
|
30
|
+
strokeWidth: "2"
|
|
31
|
+
}
|
|
32
|
+
),
|
|
33
|
+
/* @__PURE__ */ o(
|
|
34
|
+
"path",
|
|
35
|
+
{
|
|
36
|
+
d: "M11.2 7c0 0.97-1.88 1.75-4.2 1.75s-4.2-0.78-4.2-1.75",
|
|
37
|
+
fill: "none",
|
|
38
|
+
stroke: e,
|
|
39
|
+
strokeLinecap: "round",
|
|
40
|
+
strokeLinejoin: "round",
|
|
41
|
+
strokeWidth: "2"
|
|
42
|
+
}
|
|
43
|
+
)
|
|
44
|
+
] })
|
|
45
|
+
] });
|
|
46
|
+
}
|
|
47
|
+
export {
|
|
48
|
+
d as default
|
|
49
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { SVGProps } from 'react';
|
|
2
|
+
type IconProps = SVGProps<SVGSVGElement> & {
|
|
3
|
+
secondaryfill?: string;
|
|
4
|
+
title?: string;
|
|
5
|
+
};
|
|
6
|
+
declare function SidebarLeftShowCopy({ fill, secondaryfill, title, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export default SidebarLeftShowCopy;
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { jsxs as r, jsx as o } from "react/jsx-runtime";
|
|
2
|
+
function d({
|
|
3
|
+
fill: t = "currentColor",
|
|
4
|
+
secondaryfill: e,
|
|
5
|
+
title: h = "badge 13",
|
|
6
|
+
...n
|
|
7
|
+
}) {
|
|
8
|
+
return e = e || t, /* @__PURE__ */ r("svg", { height: "14", width: "14", viewBox: "0 0 14 14", xmlns: "http://www.w3.org/2000/svg", ...n, children: [
|
|
9
|
+
/* @__PURE__ */ o("title", { children: h }),
|
|
10
|
+
/* @__PURE__ */ r("g", { fill: t, children: [
|
|
11
|
+
/* @__PURE__ */ o(
|
|
12
|
+
"path",
|
|
13
|
+
{
|
|
14
|
+
d: "M4.2 2.8h5.6q2.1 0 2.1 2.1v4.2q0 2.1-2.1 2.1h-5.6q-2.1 0-2.1-2.1v-4.2q0-2.1 2.1-2.1z",
|
|
15
|
+
fill: "none",
|
|
16
|
+
stroke: t,
|
|
17
|
+
strokeLinecap: "round",
|
|
18
|
+
strokeLinejoin: "round",
|
|
19
|
+
strokeWidth: "2"
|
|
20
|
+
}
|
|
21
|
+
),
|
|
22
|
+
/* @__PURE__ */ o(
|
|
23
|
+
"path",
|
|
24
|
+
{
|
|
25
|
+
d: "M4.2 2.8h1.4v8.4h-1.4c-1.16 0-2.1-0.94-2.1-2.1v-4.2c0-1.16 0.94-2.1 2.1-2.1z",
|
|
26
|
+
fill: t,
|
|
27
|
+
strokeWidth: "0"
|
|
28
|
+
}
|
|
29
|
+
),
|
|
30
|
+
/* @__PURE__ */ o(
|
|
31
|
+
"path",
|
|
32
|
+
{
|
|
33
|
+
d: "M7.7 5.77l1.4 1.23-1.4 1.22v-2.45z",
|
|
34
|
+
fill: e,
|
|
35
|
+
stroke: e,
|
|
36
|
+
strokeLinecap: "round",
|
|
37
|
+
strokeLinejoin: "round",
|
|
38
|
+
strokeWidth: "2"
|
|
39
|
+
}
|
|
40
|
+
)
|
|
41
|
+
] })
|
|
42
|
+
] });
|
|
43
|
+
}
|
|
44
|
+
export {
|
|
45
|
+
d as default
|
|
46
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { SVGProps } from 'react';
|
|
2
|
+
type IconProps = SVGProps<SVGSVGElement> & {
|
|
3
|
+
secondaryfill?: string;
|
|
4
|
+
title?: string;
|
|
5
|
+
};
|
|
6
|
+
declare function AngleDottedCopy({ fill, secondaryfill, title, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export default AngleDottedCopy;
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { jsxs as i, jsx as a } from "react/jsx-runtime";
|
|
2
|
+
function d({
|
|
3
|
+
fill: h = "currentColor",
|
|
4
|
+
secondaryfill: t,
|
|
5
|
+
title: e = "badge 13",
|
|
6
|
+
...l
|
|
7
|
+
}) {
|
|
8
|
+
return t = t || h, /* @__PURE__ */ i("svg", { height: "14", width: "14", viewBox: "0 0 14 14", xmlns: "http://www.w3.org/2000/svg", ...l, children: [
|
|
9
|
+
/* @__PURE__ */ a("title", { children: e }),
|
|
10
|
+
/* @__PURE__ */ i("g", { fill: h, children: [
|
|
11
|
+
/* @__PURE__ */ a(
|
|
12
|
+
"path",
|
|
13
|
+
{
|
|
14
|
+
d: "M2.15 1.56a0.58 0.58 0 0 1 0.58 0.58v8.2c0 0.54 0.44 0.98 0.98 0.97h8.19a0.58 0.58 0 0 1 0 1.17h-8.19a2.15 2.15 0 0 1-2.15-2.14v-8.19a0.58 0.58 0 0 1 0.59-0.59z",
|
|
15
|
+
fill: h,
|
|
16
|
+
fillRule: "evenodd"
|
|
17
|
+
}
|
|
18
|
+
),
|
|
19
|
+
/* @__PURE__ */ a(
|
|
20
|
+
"path",
|
|
21
|
+
{
|
|
22
|
+
d: "M4.23 7.44a0.58 0.58 0 1 0 0-1.17 0.58 0.58 0 0 0 0 1.17z",
|
|
23
|
+
fill: t,
|
|
24
|
+
fillOpacity: "0.000"
|
|
25
|
+
}
|
|
26
|
+
),
|
|
27
|
+
/* @__PURE__ */ a(
|
|
28
|
+
"path",
|
|
29
|
+
{
|
|
30
|
+
d: "M6.01 8.62a0.58 0.58 0 1 0 0-1.17 0.58 0.58 0 0 0 0 1.17z",
|
|
31
|
+
fill: t,
|
|
32
|
+
fillOpacity: "0.000"
|
|
33
|
+
}
|
|
34
|
+
),
|
|
35
|
+
/* @__PURE__ */ a(
|
|
36
|
+
"path",
|
|
37
|
+
{
|
|
38
|
+
d: "M7.19 10.39a0.58 0.58 0 1 0 0-1.17 0.58 0.58 0 0 0 0 1.17z",
|
|
39
|
+
fill: t,
|
|
40
|
+
fillOpacity: "0.000"
|
|
41
|
+
}
|
|
42
|
+
)
|
|
43
|
+
] })
|
|
44
|
+
] });
|
|
45
|
+
}
|
|
46
|
+
export {
|
|
47
|
+
d as default
|
|
48
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { SVGProps } from 'react';
|
|
2
|
+
type IconProps = SVGProps<SVGSVGElement> & {
|
|
3
|
+
secondaryfill?: string;
|
|
4
|
+
title?: string;
|
|
5
|
+
};
|
|
6
|
+
declare function WindowLeftCopy({ fill, secondaryfill, title, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export default WindowLeftCopy;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { jsxs as r, jsx as o } from "react/jsx-runtime";
|
|
2
|
+
function d({
|
|
3
|
+
fill: e = "currentColor",
|
|
4
|
+
secondaryfill: t,
|
|
5
|
+
title: n = "badge 13",
|
|
6
|
+
...i
|
|
7
|
+
}) {
|
|
8
|
+
return t = t || e, /* @__PURE__ */ r("svg", { height: "14", width: "14", viewBox: "0 0 14 14", xmlns: "http://www.w3.org/2000/svg", ...i, children: [
|
|
9
|
+
/* @__PURE__ */ o("title", { children: n }),
|
|
10
|
+
/* @__PURE__ */ r("g", { fill: e, children: [
|
|
11
|
+
/* @__PURE__ */ o(
|
|
12
|
+
"path",
|
|
13
|
+
{
|
|
14
|
+
d: "M11.9 4.9v4.2q0 2.1-2.1 2.1h-5.6q-2.1 0-2.1-2.1v-4.2q0-2.1 2.1-2.1h5.6q2.1 0 2.1 2.1z",
|
|
15
|
+
fill: "none",
|
|
16
|
+
stroke: e,
|
|
17
|
+
strokeLinecap: "round",
|
|
18
|
+
strokeLinejoin: "round",
|
|
19
|
+
strokeWidth: "2"
|
|
20
|
+
}
|
|
21
|
+
),
|
|
22
|
+
/* @__PURE__ */ o(
|
|
23
|
+
"path",
|
|
24
|
+
{
|
|
25
|
+
d: "M5.6 4.9v4.2h-1.4v-4.2z",
|
|
26
|
+
fill: t,
|
|
27
|
+
stroke: t,
|
|
28
|
+
strokeLinecap: "round",
|
|
29
|
+
strokeLinejoin: "round",
|
|
30
|
+
strokeWidth: "2"
|
|
31
|
+
}
|
|
32
|
+
)
|
|
33
|
+
] })
|
|
34
|
+
] });
|
|
35
|
+
}
|
|
36
|
+
export {
|
|
37
|
+
d as default
|
|
38
|
+
};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { SVGProps } from 'react';
|
|
2
|
+
type IconProps = SVGProps<SVGSVGElement> & {
|
|
3
|
+
secondaryfill?: string;
|
|
4
|
+
strokewidth?: number;
|
|
5
|
+
title?: string;
|
|
6
|
+
};
|
|
7
|
+
declare function Z2Icon({ title, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export default Z2Icon;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { jsxs as L, jsx as C } from "react/jsx-runtime";
|
|
2
|
+
function e({ title: i = "badge 13", ...t }) {
|
|
3
|
+
return /* @__PURE__ */ L("svg", { height: "22", width: "27", viewBox: "0 0 27 22", xmlns: "http://www.w3.org/2000/svg", ...t, children: [
|
|
4
|
+
/* @__PURE__ */ C("title", { children: i }),
|
|
5
|
+
/* @__PURE__ */ C("g", { fill: "none", children: /* @__PURE__ */ C(
|
|
6
|
+
"path",
|
|
7
|
+
{
|
|
8
|
+
d: "M0.823645 0.937748C0.653456 1.04402 0.529087 1.17353 0.450539 1.32629C0.37199 1.47905 0.32617 1.68163 0.313078 1.93401C0.299987 2.23953 0.342534 2.48196 0.44072 2.66128C0.538906 2.84061 0.718913 2.99669 0.980742 3.12953L1.33421 3.30886L12.2328 3.36863L0.313078 19.3686V21.1818L13.2343 21.142C16.3108 21.1287 18.7197 21.1154 20.4608 21.1021C22.1889 21.1021 23.4817 21.0955 24.3392 21.0822C25.1967 21.0689 25.7367 21.0556 25.9592 21.0424C26.1818 21.0158 26.3192 20.9892 26.3716 20.9627C26.5942 20.8564 26.7545 20.7069 26.8527 20.5143C26.9509 20.3217 27 20.0727 27 19.7671C27 19.5147 26.9575 19.2956 26.8724 19.1096C26.7873 18.9236 26.6596 18.7709 26.4894 18.6513L26.2341 18.4919L16.8869 18.4521V12.2155L25.1148 12.1756L25.5076 11.9764C25.8872 11.7904 26.2014 11.5446 26.4502 11.2391C26.6989 10.9336 26.856 10.5949 26.9215 10.2229C26.9476 10.1034 26.9673 9.66502 26.9804 8.90786C26.9935 8.1507 27 7.33044 27 6.44709C27 5.56373 26.9935 4.75012 26.9804 4.00624C26.9673 3.24908 26.9476 2.81072 26.9215 2.69117C26.856 2.33252 26.7153 2.01039 26.4993 1.7248C26.2832 1.4392 26.0116 1.20342 25.6843 1.01745L25.3505 0.818195H13.1951C10.2364 0.818195 7.9323 0.818195 6.28278 0.818195C4.64635 0.818195 3.43212 0.821518 2.64008 0.828159C1.84805 0.834801 1.36039 0.851404 1.17711 0.877972C0.993834 0.891254 0.876011 0.91118 0.823645 0.937748ZM24.3883 6.45705V9.56539L20.3234 9.58532C18.2811 9.5986 17.0734 9.61189 16.7003 9.62517C16.3272 9.63845 16.049 9.6783 15.8657 9.74472C15.4861 9.89084 15.1784 10.0901 14.9428 10.3425C14.7071 10.5949 14.5238 10.927 14.3929 11.3387C14.3275 11.538 14.2849 11.807 14.2653 12.1457C14.2457 12.4844 14.2358 13.4641 14.2358 15.0847L14.2162 18.4521H9.58183C8.23341 18.4521 7.12718 18.4454 6.26314 18.4321C5.39911 18.4189 4.97363 18.4056 4.98673 18.3923C4.98673 18.379 5.13728 18.1731 5.43838 17.7746C5.72639 17.3761 6.12568 16.8348 6.63625 16.1507C7.14682 15.4666 7.74248 14.6663 8.42323 13.7497C9.11708 12.8464 9.8502 11.8767 10.6226 10.8406L16.2388 3.34871L24.3883 3.32878V6.45705Z",
|
|
9
|
+
fill: "#FFFFFF",
|
|
10
|
+
fillOpacity: "1"
|
|
11
|
+
}
|
|
12
|
+
) })
|
|
13
|
+
] });
|
|
14
|
+
}
|
|
15
|
+
export {
|
|
16
|
+
e as default
|
|
17
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { VariantProps } from 'class-variance-authority';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
declare const buttonVariants: (props?: ({
|
|
4
|
+
variant?: "filled" | "stroke" | "ghost" | null | undefined;
|
|
5
|
+
shade?: "neutral" | "brand" | "danger" | "neutralGhost" | null | undefined;
|
|
6
|
+
size?: "large" | "small" | null | undefined;
|
|
7
|
+
iconOnly?: boolean | null | undefined;
|
|
8
|
+
} & import('class-variance-authority/dist/types').ClassProp) | undefined) => string;
|
|
9
|
+
export interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'style' | 'type'>, Omit<VariantProps<typeof buttonVariants>, 'iconOnly'> {
|
|
10
|
+
asChild?: boolean;
|
|
11
|
+
leftIcon?: React.ReactNode;
|
|
12
|
+
rightIcon?: React.ReactNode;
|
|
13
|
+
label?: string;
|
|
14
|
+
}
|
|
15
|
+
declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
16
|
+
export { Button, buttonVariants };
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
import { jsx as e, jsxs as x, Fragment as g } from "react/jsx-runtime";
|
|
2
|
+
import { Slot as O } from "@radix-ui/react-slot";
|
|
3
|
+
import { cva as z } from "class-variance-authority";
|
|
4
|
+
import * as w from "react";
|
|
5
|
+
import { cn as n } from "../../lib/utils.js";
|
|
6
|
+
const N = z(
|
|
7
|
+
"box-border h-7.5 leading-none-medium-sm flex items-center justify-center whitespace-nowrap rounded-lg select-none hover:cursor-pointer active:outline-none border-solid",
|
|
8
|
+
{
|
|
9
|
+
variants: {
|
|
10
|
+
variant: {
|
|
11
|
+
filled: ["border-[.5px]"],
|
|
12
|
+
stroke: [""],
|
|
13
|
+
ghost: [""]
|
|
14
|
+
},
|
|
15
|
+
shade: {
|
|
16
|
+
neutral: "button-primary-neutral-surface-default border-black text-inverted hover:button-primary-neutral-surface-hover active:button-primary-neutral-surface-pressed disabled:button-primary-neutral-surface-disabled disabled:text-inverted-disabled",
|
|
17
|
+
brand: "button-primary-brand-surface-default border-(--color-accent-600) text-inverted hover:button-primary-brand-surface-hover active:button-primary-brand-surface-pressed disabled:button-primary-brand-surface-disabled disabled:text-inverted-disabled",
|
|
18
|
+
danger: "button-primary-danger-surface-default border-(--color-rose-600) text-inverted hover:button-primary-danger-surface-hover active:button-primary-danger-surface-pressed disabled:button-primary-danger-surface-disabled disabled:text-inverted-disabled",
|
|
19
|
+
neutralGhost: "text-default-primary active:text-default-disabled disabled:text-default-disabled"
|
|
20
|
+
},
|
|
21
|
+
size: {
|
|
22
|
+
large: "gap-1",
|
|
23
|
+
small: "gap-1"
|
|
24
|
+
},
|
|
25
|
+
iconOnly: {
|
|
26
|
+
true: "[&>span]:m-0"
|
|
27
|
+
}
|
|
28
|
+
},
|
|
29
|
+
compoundVariants: [
|
|
30
|
+
{
|
|
31
|
+
iconOnly: !0,
|
|
32
|
+
size: "large",
|
|
33
|
+
class: "p-2"
|
|
34
|
+
},
|
|
35
|
+
{
|
|
36
|
+
iconOnly: !0,
|
|
37
|
+
size: "small",
|
|
38
|
+
class: "p-1.5"
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
iconOnly: !1,
|
|
42
|
+
size: "large",
|
|
43
|
+
class: "p-2 gap-1"
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
iconOnly: !1,
|
|
47
|
+
size: "small",
|
|
48
|
+
class: "p-1.5 gap-0.5"
|
|
49
|
+
},
|
|
50
|
+
{
|
|
51
|
+
variant: "stroke",
|
|
52
|
+
shade: "neutral",
|
|
53
|
+
class: "shadown-default button-secondary-surface-default text-default-primary hover:button-secondary-surface-hover hover:text-default-secondary active:button-secondary-surface-pressed active:text-default-disabled disabled:button-secondary-surface-disabled disabled:text-default-disabled"
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
variant: "stroke",
|
|
57
|
+
shade: "danger",
|
|
58
|
+
class: "shadown-default button-secondary-surface-default text-default-danger hover:button-secondary-surface-hover hover:text-default-danger active:button-secondary-surface-pressed active:text-default-danger disabled:button-secondary-surface-disabled disabled:text-default-disabled"
|
|
59
|
+
},
|
|
60
|
+
{
|
|
61
|
+
variant: "ghost",
|
|
62
|
+
shade: "neutral",
|
|
63
|
+
class: "bg-transparent text-default-primary hover:text-default-secondary active:text-default-disabled disabled:text-default-disabled"
|
|
64
|
+
}
|
|
65
|
+
],
|
|
66
|
+
defaultVariants: {
|
|
67
|
+
variant: "filled",
|
|
68
|
+
shade: "neutral",
|
|
69
|
+
size: "large",
|
|
70
|
+
iconOnly: !1
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
), k = w.forwardRef(
|
|
74
|
+
({
|
|
75
|
+
className: u,
|
|
76
|
+
shade: c,
|
|
77
|
+
size: b,
|
|
78
|
+
variant: f,
|
|
79
|
+
asChild: l = !1,
|
|
80
|
+
leftIcon: a,
|
|
81
|
+
rightIcon: t,
|
|
82
|
+
label: p,
|
|
83
|
+
children: o,
|
|
84
|
+
...m
|
|
85
|
+
}, v) => {
|
|
86
|
+
const y = l ? O : "button", r = p || o, s = !r && !!(a || t), i = s ? a || t : null, h = n(
|
|
87
|
+
N({ shade: c, size: b, variant: f, iconOnly: s, className: u })
|
|
88
|
+
), d = "w-3.5 h-3.5";
|
|
89
|
+
return /* @__PURE__ */ e(y, { className: h, ref: v, ...m, children: l ? o : s ? i ? /* @__PURE__ */ e("span", { className: d, children: i }) : null : /* @__PURE__ */ x(g, { children: [
|
|
90
|
+
a && /* @__PURE__ */ e("span", { className: n(d), children: a }),
|
|
91
|
+
r && /* @__PURE__ */ e("span", { children: r }),
|
|
92
|
+
t && /* @__PURE__ */ e("span", { className: n(d), children: t })
|
|
93
|
+
] }) });
|
|
94
|
+
}
|
|
95
|
+
);
|
|
96
|
+
k.displayName = "Button";
|
|
97
|
+
export {
|
|
98
|
+
k as Button,
|
|
99
|
+
N as buttonVariants
|
|
100
|
+
};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react';
|
|
2
|
+
import { Button } from './button';
|
|
3
|
+
declare const meta: Meta<typeof Button>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof Button>;
|
|
6
|
+
export declare const FilledNeutral: Story;
|
|
7
|
+
export declare const FilledBrand: Story;
|
|
8
|
+
export declare const FilledDanger: Story;
|
|
9
|
+
export declare const StrokeNeutral: Story;
|
|
10
|
+
export declare const StrokeDanger: Story;
|
|
11
|
+
export declare const GhostNeutral: Story;
|
|
12
|
+
export declare const Large: Story;
|
|
13
|
+
export declare const Small: Story;
|
|
14
|
+
export declare const DisabledFilled: Story;
|
|
15
|
+
export declare const DisabledStroke: Story;
|
|
16
|
+
export declare const DisabledGhost: Story;
|
|
17
|
+
export declare const WithLeftIcon: Story;
|
|
18
|
+
export declare const WithRightIcon: Story;
|
|
19
|
+
export declare const WithBothIcons: Story;
|
|
20
|
+
export declare const LargeIconOnly: Story;
|
|
21
|
+
export declare const SmallIconOnly: Story;
|
|
22
|
+
export declare const IconOnlyStroke: Story;
|
|
23
|
+
export declare const IconOnlyGhost: Story;
|
|
24
|
+
export declare const AllVariants: Story;
|
|
25
|
+
export declare const SizeComparison: Story;
|
|
26
|
+
export declare const UsageExamples: Story;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import * as t from "react";
|
|
2
|
+
const r = t.createContext(null), o = () => {
|
|
3
|
+
const e = t.useContext(r);
|
|
4
|
+
if (!e)
|
|
5
|
+
throw new Error("useZ2SideNavBar must be used within a Z2SideNavBarProvider");
|
|
6
|
+
return e;
|
|
7
|
+
};
|
|
8
|
+
export {
|
|
9
|
+
r as Z2SideNavBarContext,
|
|
10
|
+
o as useZ2SideNavBar
|
|
11
|
+
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export { Z2SideNavBarProvider } from './side-nav-bar-provider';
|
|
2
|
+
export { Z2SideNavBar, Z2SidebarVariants } from './side-nav-bar';
|
|
3
|
+
export { Z2SideNavBarHeader } from './side-nav-bar-header';
|
|
4
|
+
export { Z2SideNavBarContent } from './side-nav-bar-content';
|
|
5
|
+
export { Z2SideNavBarFooter } from './side-nav-bar-footer';
|
|
6
|
+
export { Z2SideNavBarGroup } from './side-nav-bar-group';
|
|
7
|
+
export { Z2SideNavBarItem } from './side-nav-bar-item';
|
|
8
|
+
export { Z2SideNavBarSeparator } from './side-nav-bar-separator';
|
|
9
|
+
export { useZ2SideNavBar } from './context';
|
|
10
|
+
export type { Z2SideNavBarContextType, Z2SideNavBarProviderProps, Z2SideNavBarProps, Z2SideNavBarHeaderProps, Z2SideNavBarContentProps, Z2SideNavBarFooterProps, Z2SideNavBarGroupProps, Z2SideNavBarItemProps, Z2SideNavBarSeparatorProps, Z2SubNavItem, Z2PopoverContextType, Z2PopoverProps, Z2PopoverTriggerProps, Z2PopoverContentProps, Z2IconProps, } from './types';
|
|
11
|
+
export { Z2Popover, Z2PopoverTrigger, Z2PopoverContent } from './popover/popover';
|
|
12
|
+
export { ChevronUpIcon } from '../assets/icons/chevron-up-icon';
|
|
13
|
+
export { default as SubNavIndicator } from '../assets/icons/sub-nav-indicator';
|
|
14
|
+
export { default as CirclesIcon } from '../assets/icons/circles-icon';
|
|
15
|
+
export { default as DatabaseCopy } from '../assets/icons/database-copy';
|
|
16
|
+
export { default as WindowLeftCopy } from '../assets/icons/window-left-copy';
|
|
17
|
+
export { default as SidebarLeftShowCopy } from '../assets/icons/sidebar-left-show-copy';
|
|
18
|
+
export { SIDEBAR_WIDTH, SIDEBAR_WIDTH_COLLAPSED } from './constants';
|