@shipfox/react-ui 0.0.1
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/.storybook/main.ts +18 -0
- package/.storybook/preview.tsx +48 -0
- package/.turbo/turbo-build.log +6 -0
- package/.turbo/turbo-check.log +6 -0
- package/.turbo/turbo-type.log +5 -0
- package/CHANGELOG.md +7 -0
- package/LICENSE +21 -0
- package/dist/colors.stories.conts.d.ts +33 -0
- package/dist/colors.stories.conts.d.ts.map +1 -0
- package/dist/colors.stories.conts.js +166 -0
- package/dist/colors.stories.conts.js.map +1 -0
- package/dist/colors.stories.js +61 -0
- package/dist/colors.stories.js.map +1 -0
- package/dist/components/button.d.ts +13 -0
- package/dist/components/button.d.ts.map +1 -0
- package/dist/components/button.js +51 -0
- package/dist/components/button.js.map +1 -0
- package/dist/components/button.stories.js +174 -0
- package/dist/components/button.stories.js.map +1 -0
- package/dist/components/icon/custom/badge.d.ts +4 -0
- package/dist/components/icon/custom/badge.d.ts.map +1 -0
- package/dist/components/icon/custom/badge.js +20 -0
- package/dist/components/icon/custom/badge.js.map +1 -0
- package/dist/components/icon/custom/check-circle-solid.d.ts +4 -0
- package/dist/components/icon/custom/check-circle-solid.d.ts.map +1 -0
- package/dist/components/icon/custom/check-circle-solid.js +34 -0
- package/dist/components/icon/custom/check-circle-solid.js.map +1 -0
- package/dist/components/icon/custom/circle-dotted-line.d.ts +4 -0
- package/dist/components/icon/custom/circle-dotted-line.d.ts.map +1 -0
- package/dist/components/icon/custom/circle-dotted-line.js +20 -0
- package/dist/components/icon/custom/circle-dotted-line.js.map +1 -0
- package/dist/components/icon/custom/component-fill.d.ts +4 -0
- package/dist/components/icon/custom/component-fill.d.ts.map +1 -0
- package/dist/components/icon/custom/component-fill.js +20 -0
- package/dist/components/icon/custom/component-fill.js.map +1 -0
- package/dist/components/icon/custom/component-line.d.ts +4 -0
- package/dist/components/icon/custom/component-line.d.ts.map +1 -0
- package/dist/components/icon/custom/component-line.js +20 -0
- package/dist/components/icon/custom/component-line.js.map +1 -0
- package/dist/components/icon/custom/ellipse-mini-solid.d.ts +4 -0
- package/dist/components/icon/custom/ellipse-mini-solid.d.ts.map +1 -0
- package/dist/components/icon/custom/ellipse-mini-solid.js +22 -0
- package/dist/components/icon/custom/ellipse-mini-solid.js.map +1 -0
- package/dist/components/icon/custom/index.d.ts +12 -0
- package/dist/components/icon/custom/index.d.ts.map +1 -0
- package/dist/components/icon/custom/index.js +13 -0
- package/dist/components/icon/custom/index.js.map +1 -0
- package/dist/components/icon/custom/info-tooltip-fill.d.ts +4 -0
- package/dist/components/icon/custom/info-tooltip-fill.d.ts.map +1 -0
- package/dist/components/icon/custom/info-tooltip-fill.js +22 -0
- package/dist/components/icon/custom/info-tooltip-fill.js.map +1 -0
- package/dist/components/icon/custom/resize.d.ts +4 -0
- package/dist/components/icon/custom/resize.d.ts.map +1 -0
- package/dist/components/icon/custom/resize.js +20 -0
- package/dist/components/icon/custom/resize.js.map +1 -0
- package/dist/components/icon/custom/spinner.d.ts +4 -0
- package/dist/components/icon/custom/spinner.d.ts.map +1 -0
- package/dist/components/icon/custom/spinner.js +145 -0
- package/dist/components/icon/custom/spinner.js.map +1 -0
- package/dist/components/icon/custom/thunder.d.ts +4 -0
- package/dist/components/icon/custom/thunder.d.ts.map +1 -0
- package/dist/components/icon/custom/thunder.js +20 -0
- package/dist/components/icon/custom/thunder.js.map +1 -0
- package/dist/components/icon/custom/x-circle-solid.d.ts +4 -0
- package/dist/components/icon/custom/x-circle-solid.d.ts.map +1 -0
- package/dist/components/icon/custom/x-circle-solid.js +34 -0
- package/dist/components/icon/custom/x-circle-solid.js.map +1 -0
- package/dist/components/icon/icon.d.ts +27 -0
- package/dist/components/icon/icon.d.ts.map +1 -0
- package/dist/components/icon/icon.js +27 -0
- package/dist/components/icon/icon.js.map +1 -0
- package/dist/components/icon/icon.stories.js +35 -0
- package/dist/components/icon/icon.stories.js.map +1 -0
- package/dist/components/icon/index.d.ts +2 -0
- package/dist/components/icon/index.d.ts.map +1 -0
- package/dist/components/icon/index.js +3 -0
- package/dist/components/icon/index.js.map +1 -0
- package/dist/components/index.d.ts +5 -0
- package/dist/components/index.d.ts.map +1 -0
- package/dist/components/index.js +6 -0
- package/dist/components/index.js.map +1 -0
- package/dist/components/theme-provider.d.ts +10 -0
- package/dist/components/theme-provider.d.ts.map +1 -0
- package/dist/components/theme-provider.js +32 -0
- package/dist/components/theme-provider.js.map +1 -0
- package/dist/components/typography/code.d.ts +11 -0
- package/dist/components/typography/code.d.ts.map +1 -0
- package/dist/components/typography/code.js +28 -0
- package/dist/components/typography/code.js.map +1 -0
- package/dist/components/typography/code.stories.js +54 -0
- package/dist/components/typography/code.stories.js.map +1 -0
- package/dist/components/typography/header.d.ts +10 -0
- package/dist/components/typography/header.d.ts.map +1 -0
- package/dist/components/typography/header.js +34 -0
- package/dist/components/typography/header.js.map +1 -0
- package/dist/components/typography/header.stories.js +34 -0
- package/dist/components/typography/header.stories.js.map +1 -0
- package/dist/components/typography/index.d.ts +4 -0
- package/dist/components/typography/index.d.ts.map +1 -0
- package/dist/components/typography/index.js +5 -0
- package/dist/components/typography/index.js.map +1 -0
- package/dist/components/typography/text.d.ts +12 -0
- package/dist/components/typography/text.d.ts.map +1 -0
- package/dist/components/typography/text.js +32 -0
- package/dist/components/typography/text.js.map +1 -0
- package/dist/components/typography/text.stories.js +105 -0
- package/dist/components/typography/text.stories.js.map +1 -0
- package/dist/hooks/index.d.ts +3 -0
- package/dist/hooks/index.d.ts.map +1 -0
- package/dist/hooks/index.js +4 -0
- package/dist/hooks/index.js.map +1 -0
- package/dist/hooks/useCopy.d.ts +1 -0
- package/dist/hooks/useCopy.d.ts.map +1 -0
- package/dist/hooks/useCopy.js +2 -0
- package/dist/hooks/useCopy.js.map +1 -0
- package/dist/hooks/useCopyToClipboard.d.ts +10 -0
- package/dist/hooks/useCopyToClipboard.d.ts.map +1 -0
- package/dist/hooks/useCopyToClipboard.js +16 -0
- package/dist/hooks/useCopyToClipboard.js.map +1 -0
- package/dist/hooks/useTheme.d.ts +2 -0
- package/dist/hooks/useTheme.d.ts.map +1 -0
- package/dist/hooks/useTheme.js +9 -0
- package/dist/hooks/useTheme.js.map +1 -0
- package/dist/index.d.ts +4 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +5 -0
- package/dist/index.js.map +1 -0
- package/dist/state/theme.d.ts +7 -0
- package/dist/state/theme.d.ts.map +1 -0
- package/dist/state/theme.js +8 -0
- package/dist/state/theme.js.map +1 -0
- package/dist/utils/clipboard.d.ts +2 -0
- package/dist/utils/clipboard.d.ts.map +1 -0
- package/dist/utils/clipboard.js +6 -0
- package/dist/utils/clipboard.js.map +1 -0
- package/dist/utils/cn.d.ts +3 -0
- package/dist/utils/cn.d.ts.map +1 -0
- package/dist/utils/cn.js +7 -0
- package/dist/utils/cn.js.map +1 -0
- package/dist/utils/date.d.ts +16 -0
- package/dist/utils/date.d.ts.map +1 -0
- package/dist/utils/date.js +79 -0
- package/dist/utils/date.js.map +1 -0
- package/dist/utils/format/chart.d.ts +3 -0
- package/dist/utils/format/chart.d.ts.map +1 -0
- package/dist/utils/format/chart.js +14 -0
- package/dist/utils/format/chart.js.map +1 -0
- package/dist/utils/format/date.d.ts +10 -0
- package/dist/utils/format/date.d.ts.map +1 -0
- package/dist/utils/format/date.js +57 -0
- package/dist/utils/format/date.js.map +1 -0
- package/dist/utils/format/duration.d.ts +9 -0
- package/dist/utils/format/duration.d.ts.map +1 -0
- package/dist/utils/format/duration.js +71 -0
- package/dist/utils/format/duration.js.map +1 -0
- package/dist/utils/format/index.d.ts +5 -0
- package/dist/utils/format/index.d.ts.map +1 -0
- package/dist/utils/format/index.js +6 -0
- package/dist/utils/format/index.js.map +1 -0
- package/dist/utils/format/number.d.ts +7 -0
- package/dist/utils/format/number.d.ts.map +1 -0
- package/dist/utils/format/number.js +20 -0
- package/dist/utils/format/number.js.map +1 -0
- package/dist/utils/index.d.ts +5 -0
- package/dist/utils/index.d.ts.map +1 -0
- package/dist/utils/index.js +6 -0
- package/dist/utils/index.js.map +1 -0
- package/index.css +778 -0
- package/package.json +74 -0
- package/src/colors.stories.conts.ts +164 -0
- package/src/colors.stories.tsx +66 -0
- package/src/components/button.stories.tsx +126 -0
- package/src/components/button.tsx +63 -0
- package/src/components/icon/custom/badge.tsx +17 -0
- package/src/components/icon/custom/check-circle-solid.tsx +24 -0
- package/src/components/icon/custom/circle-dotted-line.tsx +17 -0
- package/src/components/icon/custom/component-fill.tsx +17 -0
- package/src/components/icon/custom/component-line.tsx +17 -0
- package/src/components/icon/custom/ellipse-mini-solid.tsx +17 -0
- package/src/components/icon/custom/index.ts +11 -0
- package/src/components/icon/custom/info-tooltip-fill.tsx +21 -0
- package/src/components/icon/custom/resize.tsx +17 -0
- package/src/components/icon/custom/spinner.tsx +98 -0
- package/src/components/icon/custom/thunder.tsx +17 -0
- package/src/components/icon/custom/x-circle-solid.tsx +24 -0
- package/src/components/icon/icon.stories.tsx +29 -0
- package/src/components/icon/icon.tsx +42 -0
- package/src/components/icon/index.ts +1 -0
- package/src/components/index.ts +4 -0
- package/src/components/renovate.json +23 -0
- package/src/components/theme-provider.tsx +50 -0
- package/src/components/typography/code.stories.tsx +36 -0
- package/src/components/typography/code.tsx +38 -0
- package/src/components/typography/header.stories.tsx +27 -0
- package/src/components/typography/header.tsx +41 -0
- package/src/components/typography/index.ts +3 -0
- package/src/components/typography/text.stories.tsx +67 -0
- package/src/components/typography/text.tsx +42 -0
- package/src/hooks/index.ts +2 -0
- package/src/hooks/useCopy.ts +0 -0
- package/src/hooks/useCopyToClipboard.ts +20 -0
- package/src/hooks/useTheme.ts +10 -0
- package/src/index.ts +3 -0
- package/src/state/theme.ts +15 -0
- package/src/utils/clipboard.ts +4 -0
- package/src/utils/cn.ts +6 -0
- package/src/utils/date.test.ts +119 -0
- package/src/utils/date.ts +99 -0
- package/src/utils/format/chart.ts +16 -0
- package/src/utils/format/date.test.ts +65 -0
- package/src/utils/format/date.ts +75 -0
- package/src/utils/format/duration.test.ts +58 -0
- package/src/utils/format/duration.ts +82 -0
- package/src/utils/format/index.ts +4 -0
- package/src/utils/format/number.test.ts +38 -0
- package/src/utils/format/number.ts +33 -0
- package/src/utils/index.ts +4 -0
- package/test/global.ts +3 -0
- package/test/setup.ts +9 -0
- package/tsconfig.build.json +13 -0
- package/tsconfig.json +11 -0
- package/tsconfig.test.json +12 -0
- package/vercel.json +8 -0
- package/vitest.config.ts +17 -0
|
@@ -0,0 +1,145 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
export function SpinnerIcon(_props) {
|
|
3
|
+
return /*#__PURE__*/ _jsxs("svg", {
|
|
4
|
+
width: "23",
|
|
5
|
+
height: "24",
|
|
6
|
+
viewBox: "0 0 23 24",
|
|
7
|
+
fill: "none",
|
|
8
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
9
|
+
children: [
|
|
10
|
+
/*#__PURE__*/ _jsx("title", {
|
|
11
|
+
children: "Spinner"
|
|
12
|
+
}),
|
|
13
|
+
/*#__PURE__*/ _jsx("path", {
|
|
14
|
+
opacity: "0.55",
|
|
15
|
+
d: "M10.583 1.91667C10.583 1.41041 10.9934 1 11.4997 1C12.0059 1 12.4163 1.41041 12.4163 1.91667V5.58333C12.4163 6.08959 12.0059 6.5 11.4997 6.5C10.9934 6.5 10.583 6.08959 10.583 5.58333V1.91667Z",
|
|
16
|
+
fill: "currentColor",
|
|
17
|
+
stroke: "currentColor",
|
|
18
|
+
style: {
|
|
19
|
+
fill: 'currentColor',
|
|
20
|
+
fillOpacity: 1,
|
|
21
|
+
stroke: 'currentColor',
|
|
22
|
+
strokeOpacity: 1
|
|
23
|
+
},
|
|
24
|
+
strokeWidth: "0.916667",
|
|
25
|
+
strokeLinecap: "round",
|
|
26
|
+
strokeLinejoin: "round"
|
|
27
|
+
}),
|
|
28
|
+
/*#__PURE__*/ _jsx("rect", {
|
|
29
|
+
x: "10.583",
|
|
30
|
+
y: "17.5",
|
|
31
|
+
width: "1.83333",
|
|
32
|
+
height: "5.5",
|
|
33
|
+
rx: "0.916667",
|
|
34
|
+
fill: "currentColor",
|
|
35
|
+
stroke: "currentColor",
|
|
36
|
+
style: {
|
|
37
|
+
fill: 'currentColor',
|
|
38
|
+
fillOpacity: 1,
|
|
39
|
+
stroke: 'currentColor',
|
|
40
|
+
strokeOpacity: 1
|
|
41
|
+
},
|
|
42
|
+
strokeWidth: "0.916667",
|
|
43
|
+
strokeLinecap: "round",
|
|
44
|
+
strokeLinejoin: "round"
|
|
45
|
+
}),
|
|
46
|
+
/*#__PURE__*/ _jsx("path", {
|
|
47
|
+
opacity: "0.25",
|
|
48
|
+
d: "M1.41667 12.918C0.910406 12.918 0.5 12.5076 0.5 12.0013C0.5 11.495 0.910405 11.0846 1.41667 11.0846L5.08333 11.0846C5.58959 11.0846 6 11.495 6 12.0013C6 12.5076 5.58959 12.918 5.08333 12.918L1.41667 12.918Z",
|
|
49
|
+
fill: "currentColor",
|
|
50
|
+
stroke: "currentColor",
|
|
51
|
+
style: {
|
|
52
|
+
fill: 'currentColor',
|
|
53
|
+
fillOpacity: 1,
|
|
54
|
+
stroke: 'currentColor',
|
|
55
|
+
strokeOpacity: 1
|
|
56
|
+
},
|
|
57
|
+
strokeWidth: "0.916667",
|
|
58
|
+
strokeLinecap: "round",
|
|
59
|
+
strokeLinejoin: "round"
|
|
60
|
+
}),
|
|
61
|
+
/*#__PURE__*/ _jsx("path", {
|
|
62
|
+
opacity: "0.75",
|
|
63
|
+
d: "M17.9167 12.918C17.4104 12.918 17 12.5076 17 12.0013C17 11.495 17.4104 11.0846 17.9167 11.0846L21.5833 11.0846C22.0896 11.0846 22.5 11.495 22.5 12.0013C22.5 12.5076 22.0896 12.918 21.5833 12.918L17.9167 12.918Z",
|
|
64
|
+
fill: "currentColor",
|
|
65
|
+
stroke: "currentColor",
|
|
66
|
+
style: {
|
|
67
|
+
fill: 'currentColor',
|
|
68
|
+
fillOpacity: 1,
|
|
69
|
+
stroke: 'currentColor',
|
|
70
|
+
strokeOpacity: 1
|
|
71
|
+
},
|
|
72
|
+
strokeWidth: "0.916667",
|
|
73
|
+
strokeLinecap: "round",
|
|
74
|
+
strokeLinejoin: "round"
|
|
75
|
+
}),
|
|
76
|
+
/*#__PURE__*/ _jsx("path", {
|
|
77
|
+
opacity: "0.38",
|
|
78
|
+
d: "M3.7224 5.52123C3.36442 5.16325 3.36442 4.58285 3.7224 4.22487C4.08038 3.86689 4.66078 3.86688 5.01876 4.22487L7.61149 6.81759C7.96947 7.17557 7.96947 7.75597 7.61149 8.11395C7.25351 8.47193 6.67311 8.47193 6.31512 8.11395L3.7224 5.52123Z",
|
|
79
|
+
fill: "currentColor",
|
|
80
|
+
stroke: "currentColor",
|
|
81
|
+
style: {
|
|
82
|
+
fill: 'currentColor',
|
|
83
|
+
fillOpacity: 1,
|
|
84
|
+
stroke: 'currentColor',
|
|
85
|
+
strokeOpacity: 1
|
|
86
|
+
},
|
|
87
|
+
strokeWidth: "0.916667",
|
|
88
|
+
strokeLinecap: "round",
|
|
89
|
+
strokeLinejoin: "round"
|
|
90
|
+
}),
|
|
91
|
+
/*#__PURE__*/ _jsx("rect", {
|
|
92
|
+
opacity: "0.88",
|
|
93
|
+
x: "14.7412",
|
|
94
|
+
y: "16.5391",
|
|
95
|
+
width: "1.83333",
|
|
96
|
+
height: "5.5",
|
|
97
|
+
rx: "0.916667",
|
|
98
|
+
transform: "rotate(-45 14.7412 16.5391)",
|
|
99
|
+
fill: "currentColor",
|
|
100
|
+
stroke: "currentColor",
|
|
101
|
+
style: {
|
|
102
|
+
fill: 'currentColor',
|
|
103
|
+
fillOpacity: 1,
|
|
104
|
+
stroke: 'currentColor',
|
|
105
|
+
strokeOpacity: 1
|
|
106
|
+
},
|
|
107
|
+
strokeWidth: "0.916667",
|
|
108
|
+
strokeLinecap: "round",
|
|
109
|
+
strokeLinejoin: "round"
|
|
110
|
+
}),
|
|
111
|
+
/*#__PURE__*/ _jsx("path", {
|
|
112
|
+
opacity: "0.13",
|
|
113
|
+
d: "M5.0183 19.7796C4.66032 20.1375 4.07992 20.1375 3.72194 19.7796C3.36396 19.4216 3.36396 18.8412 3.72194 18.4832L6.31466 15.8905C6.67264 15.5325 7.25304 15.5325 7.61102 15.8905C7.969 16.2484 7.969 16.8288 7.61102 17.1868L5.0183 19.7796Z",
|
|
114
|
+
fill: "currentColor",
|
|
115
|
+
stroke: "currentColor",
|
|
116
|
+
style: {
|
|
117
|
+
fill: 'currentColor',
|
|
118
|
+
fillOpacity: 1,
|
|
119
|
+
stroke: 'currentColor',
|
|
120
|
+
strokeOpacity: 1
|
|
121
|
+
},
|
|
122
|
+
strokeWidth: "0.916667",
|
|
123
|
+
strokeLinecap: "round",
|
|
124
|
+
strokeLinejoin: "round"
|
|
125
|
+
}),
|
|
126
|
+
/*#__PURE__*/ _jsx("path", {
|
|
127
|
+
opacity: "0.63",
|
|
128
|
+
d: "M16.6853 8.11354C16.3273 8.47152 15.7469 8.47152 15.3889 8.11354C15.0309 7.75556 15.0309 7.17516 15.3889 6.81718L17.9817 4.22445C18.3396 3.86647 18.92 3.86647 19.278 4.22445C19.636 4.58243 19.636 5.16283 19.278 5.52081L16.6853 8.11354Z",
|
|
129
|
+
fill: "currentColor",
|
|
130
|
+
stroke: "currentColor",
|
|
131
|
+
style: {
|
|
132
|
+
fill: 'currentColor',
|
|
133
|
+
fillOpacity: 1,
|
|
134
|
+
stroke: 'currentColor',
|
|
135
|
+
strokeOpacity: 1
|
|
136
|
+
},
|
|
137
|
+
strokeWidth: "0.916667",
|
|
138
|
+
strokeLinecap: "round",
|
|
139
|
+
strokeLinejoin: "round"
|
|
140
|
+
})
|
|
141
|
+
]
|
|
142
|
+
});
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
//# sourceMappingURL=spinner.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/icon/custom/spinner.tsx"],"sourcesContent":["import type {RemixiconComponentType} from '@remixicon/react';\nimport type {ComponentProps} from 'react';\n\nexport function SpinnerIcon(_props: ComponentProps<RemixiconComponentType>) {\n return (\n <svg width=\"23\" height=\"24\" viewBox=\"0 0 23 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <title>Spinner</title>\n <path\n opacity=\"0.55\"\n d=\"M10.583 1.91667C10.583 1.41041 10.9934 1 11.4997 1C12.0059 1 12.4163 1.41041 12.4163 1.91667V5.58333C12.4163 6.08959 12.0059 6.5 11.4997 6.5C10.9934 6.5 10.583 6.08959 10.583 5.58333V1.91667Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style={{fill: 'currentColor', fillOpacity: 1, stroke: 'currentColor', strokeOpacity: 1}}\n strokeWidth=\"0.916667\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <rect\n x=\"10.583\"\n y=\"17.5\"\n width=\"1.83333\"\n height=\"5.5\"\n rx=\"0.916667\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style={{fill: 'currentColor', fillOpacity: 1, stroke: 'currentColor', strokeOpacity: 1}}\n strokeWidth=\"0.916667\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n opacity=\"0.25\"\n d=\"M1.41667 12.918C0.910406 12.918 0.5 12.5076 0.5 12.0013C0.5 11.495 0.910405 11.0846 1.41667 11.0846L5.08333 11.0846C5.58959 11.0846 6 11.495 6 12.0013C6 12.5076 5.58959 12.918 5.08333 12.918L1.41667 12.918Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style={{fill: 'currentColor', fillOpacity: 1, stroke: 'currentColor', strokeOpacity: 1}}\n strokeWidth=\"0.916667\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n opacity=\"0.75\"\n d=\"M17.9167 12.918C17.4104 12.918 17 12.5076 17 12.0013C17 11.495 17.4104 11.0846 17.9167 11.0846L21.5833 11.0846C22.0896 11.0846 22.5 11.495 22.5 12.0013C22.5 12.5076 22.0896 12.918 21.5833 12.918L17.9167 12.918Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style={{fill: 'currentColor', fillOpacity: 1, stroke: 'currentColor', strokeOpacity: 1}}\n strokeWidth=\"0.916667\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n opacity=\"0.38\"\n d=\"M3.7224 5.52123C3.36442 5.16325 3.36442 4.58285 3.7224 4.22487C4.08038 3.86689 4.66078 3.86688 5.01876 4.22487L7.61149 6.81759C7.96947 7.17557 7.96947 7.75597 7.61149 8.11395C7.25351 8.47193 6.67311 8.47193 6.31512 8.11395L3.7224 5.52123Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style={{fill: 'currentColor', fillOpacity: 1, stroke: 'currentColor', strokeOpacity: 1}}\n strokeWidth=\"0.916667\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <rect\n opacity=\"0.88\"\n x=\"14.7412\"\n y=\"16.5391\"\n width=\"1.83333\"\n height=\"5.5\"\n rx=\"0.916667\"\n transform=\"rotate(-45 14.7412 16.5391)\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style={{fill: 'currentColor', fillOpacity: 1, stroke: 'currentColor', strokeOpacity: 1}}\n strokeWidth=\"0.916667\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n opacity=\"0.13\"\n d=\"M5.0183 19.7796C4.66032 20.1375 4.07992 20.1375 3.72194 19.7796C3.36396 19.4216 3.36396 18.8412 3.72194 18.4832L6.31466 15.8905C6.67264 15.5325 7.25304 15.5325 7.61102 15.8905C7.969 16.2484 7.969 16.8288 7.61102 17.1868L5.0183 19.7796Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style={{fill: 'currentColor', fillOpacity: 1, stroke: 'currentColor', strokeOpacity: 1}}\n strokeWidth=\"0.916667\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n opacity=\"0.63\"\n d=\"M16.6853 8.11354C16.3273 8.47152 15.7469 8.47152 15.3889 8.11354C15.0309 7.75556 15.0309 7.17516 15.3889 6.81718L17.9817 4.22445C18.3396 3.86647 18.92 3.86647 19.278 4.22445C19.636 4.58243 19.636 5.16283 19.278 5.52081L16.6853 8.11354Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style={{fill: 'currentColor', fillOpacity: 1, stroke: 'currentColor', strokeOpacity: 1}}\n strokeWidth=\"0.916667\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n}\n"],"names":["SpinnerIcon","_props","svg","width","height","viewBox","fill","xmlns","title","path","opacity","d","stroke","style","fillOpacity","strokeOpacity","strokeWidth","strokeLinecap","strokeLinejoin","rect","x","y","rx","transform"],"mappings":";AAGA,OAAO,SAASA,YAAYC,MAA8C;IACxE,qBACE,MAACC;QAAIC,OAAM;QAAKC,QAAO;QAAKC,SAAQ;QAAYC,MAAK;QAAOC,OAAM;;0BAChE,KAACC;0BAAM;;0BACP,KAACC;gBACCC,SAAQ;gBACRC,GAAE;gBACFL,MAAK;gBACLM,QAAO;gBACPC,OAAO;oBAACP,MAAM;oBAAgBQ,aAAa;oBAAGF,QAAQ;oBAAgBG,eAAe;gBAAC;gBACtFC,aAAY;gBACZC,eAAc;gBACdC,gBAAe;;0BAEjB,KAACC;gBACCC,GAAE;gBACFC,GAAE;gBACFlB,OAAM;gBACNC,QAAO;gBACPkB,IAAG;gBACHhB,MAAK;gBACLM,QAAO;gBACPC,OAAO;oBAACP,MAAM;oBAAgBQ,aAAa;oBAAGF,QAAQ;oBAAgBG,eAAe;gBAAC;gBACtFC,aAAY;gBACZC,eAAc;gBACdC,gBAAe;;0BAEjB,KAACT;gBACCC,SAAQ;gBACRC,GAAE;gBACFL,MAAK;gBACLM,QAAO;gBACPC,OAAO;oBAACP,MAAM;oBAAgBQ,aAAa;oBAAGF,QAAQ;oBAAgBG,eAAe;gBAAC;gBACtFC,aAAY;gBACZC,eAAc;gBACdC,gBAAe;;0BAEjB,KAACT;gBACCC,SAAQ;gBACRC,GAAE;gBACFL,MAAK;gBACLM,QAAO;gBACPC,OAAO;oBAACP,MAAM;oBAAgBQ,aAAa;oBAAGF,QAAQ;oBAAgBG,eAAe;gBAAC;gBACtFC,aAAY;gBACZC,eAAc;gBACdC,gBAAe;;0BAEjB,KAACT;gBACCC,SAAQ;gBACRC,GAAE;gBACFL,MAAK;gBACLM,QAAO;gBACPC,OAAO;oBAACP,MAAM;oBAAgBQ,aAAa;oBAAGF,QAAQ;oBAAgBG,eAAe;gBAAC;gBACtFC,aAAY;gBACZC,eAAc;gBACdC,gBAAe;;0BAEjB,KAACC;gBACCT,SAAQ;gBACRU,GAAE;gBACFC,GAAE;gBACFlB,OAAM;gBACNC,QAAO;gBACPkB,IAAG;gBACHC,WAAU;gBACVjB,MAAK;gBACLM,QAAO;gBACPC,OAAO;oBAACP,MAAM;oBAAgBQ,aAAa;oBAAGF,QAAQ;oBAAgBG,eAAe;gBAAC;gBACtFC,aAAY;gBACZC,eAAc;gBACdC,gBAAe;;0BAEjB,KAACT;gBACCC,SAAQ;gBACRC,GAAE;gBACFL,MAAK;gBACLM,QAAO;gBACPC,OAAO;oBAACP,MAAM;oBAAgBQ,aAAa;oBAAGF,QAAQ;oBAAgBG,eAAe;gBAAC;gBACtFC,aAAY;gBACZC,eAAc;gBACdC,gBAAe;;0BAEjB,KAACT;gBACCC,SAAQ;gBACRC,GAAE;gBACFL,MAAK;gBACLM,QAAO;gBACPC,OAAO;oBAACP,MAAM;oBAAgBQ,aAAa;oBAAGF,QAAQ;oBAAgBG,eAAe;gBAAC;gBACtFC,aAAY;gBACZC,eAAc;gBACdC,gBAAe;;;;AAIvB"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { RemixiconComponentType } from '@remixicon/react';
|
|
2
|
+
import type { ComponentProps } from 'react';
|
|
3
|
+
export declare function ThunderIcon(_props: ComponentProps<RemixiconComponentType>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
//# sourceMappingURL=thunder.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"thunder.d.ts","sourceRoot":"","sources":["../../../../src/components/icon/custom/thunder.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,sBAAsB,EAAC,MAAM,kBAAkB,CAAC;AAC7D,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,OAAO,CAAC;AAE1C,wBAAgB,WAAW,CAAC,MAAM,EAAE,cAAc,CAAC,sBAAsB,CAAC,2CAazE"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
export function ThunderIcon(_props) {
|
|
3
|
+
return /*#__PURE__*/ _jsxs("svg", {
|
|
4
|
+
width: "25",
|
|
5
|
+
height: "24",
|
|
6
|
+
viewBox: "0 0 25 24",
|
|
7
|
+
fill: "currentColor",
|
|
8
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
9
|
+
children: [
|
|
10
|
+
/*#__PURE__*/ _jsx("title", {
|
|
11
|
+
children: "Thunder"
|
|
12
|
+
}),
|
|
13
|
+
/*#__PURE__*/ _jsx("path", {
|
|
14
|
+
d: "M14.2707 10.1872H19.5832L10.729 22V13.8219H5.4165L14.2707 2V10.1872Z"
|
|
15
|
+
})
|
|
16
|
+
]
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
//# sourceMappingURL=thunder.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/icon/custom/thunder.tsx"],"sourcesContent":["import type {RemixiconComponentType} from '@remixicon/react';\nimport type {ComponentProps} from 'react';\n\nexport function ThunderIcon(_props: ComponentProps<RemixiconComponentType>) {\n return (\n <svg\n width=\"25\"\n height=\"24\"\n viewBox=\"0 0 25 24\"\n fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <title>Thunder</title>\n <path d=\"M14.2707 10.1872H19.5832L10.729 22V13.8219H5.4165L14.2707 2V10.1872Z\" />\n </svg>\n );\n}\n"],"names":["ThunderIcon","_props","svg","width","height","viewBox","fill","xmlns","title","path","d"],"mappings":";AAGA,OAAO,SAASA,YAAYC,MAA8C;IACxE,qBACE,MAACC;QACCC,OAAM;QACNC,QAAO;QACPC,SAAQ;QACRC,MAAK;QACLC,OAAM;;0BAEN,KAACC;0BAAM;;0BACP,KAACC;gBAAKC,GAAE;;;;AAGd"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { RemixiconComponentType } from '@remixicon/react';
|
|
2
|
+
import type { ComponentProps } from 'react';
|
|
3
|
+
export declare function XCircleSolidIcon(_props: ComponentProps<RemixiconComponentType>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
//# sourceMappingURL=x-circle-solid.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"x-circle-solid.d.ts","sourceRoot":"","sources":["../../../../src/components/icon/custom/x-circle-solid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,sBAAsB,EAAC,MAAM,kBAAkB,CAAC;AAC7D,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,OAAO,CAAC;AAE1C,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,cAAc,CAAC,sBAAsB,CAAC,2CAoB9E"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
export function XCircleSolidIcon(_props) {
|
|
3
|
+
return /*#__PURE__*/ _jsxs("svg", {
|
|
4
|
+
width: "19",
|
|
5
|
+
height: "18",
|
|
6
|
+
viewBox: "0 0 19 18",
|
|
7
|
+
fill: "currentColor",
|
|
8
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
9
|
+
children: [
|
|
10
|
+
/*#__PURE__*/ _jsx("title", {
|
|
11
|
+
children: "X Circle Solid"
|
|
12
|
+
}),
|
|
13
|
+
/*#__PURE__*/ _jsx("g", {
|
|
14
|
+
clipPath: "url(#clip0_6552_160759)",
|
|
15
|
+
children: /*#__PURE__*/ _jsx("path", {
|
|
16
|
+
d: "M9.49964 0.464844C4.79458 0.464844 0.966309 4.29311 0.966309 8.99818C0.966309 13.7032 4.79458 17.5315 9.49964 17.5315C14.2047 17.5315 18.033 13.7032 18.033 8.99818C18.033 4.29311 14.2047 0.464844 9.49964 0.464844ZM12.9983 11.3662C13.3108 11.6787 13.3108 12.1854 12.9983 12.4979C12.8426 12.6536 12.6378 12.7326 12.433 12.7326C12.2282 12.7326 12.0234 12.6547 11.8676 12.4979L9.49964 10.1299L7.13164 12.4979C6.97591 12.6536 6.77111 12.7326 6.56631 12.7326C6.36151 12.7326 6.15671 12.6547 6.00097 12.4979C5.68844 12.1854 5.68844 11.6787 6.00097 11.3662L8.36897 8.99818L6.00097 6.63018C5.68844 6.31764 5.68844 5.81098 6.00097 5.49844C6.31351 5.18591 6.82018 5.18591 7.13271 5.49844L9.50071 7.86644L11.8687 5.49844C12.1812 5.18591 12.6879 5.18591 13.0004 5.49844C13.313 5.81098 13.313 6.31764 13.0004 6.63018L10.6324 8.99818L13.0004 11.3662H12.9983Z"
|
|
17
|
+
})
|
|
18
|
+
}),
|
|
19
|
+
/*#__PURE__*/ _jsx("defs", {
|
|
20
|
+
children: /*#__PURE__*/ _jsx("clipPath", {
|
|
21
|
+
id: "clip0_6552_160759",
|
|
22
|
+
children: /*#__PURE__*/ _jsx("rect", {
|
|
23
|
+
width: "18",
|
|
24
|
+
height: "18",
|
|
25
|
+
fill: "white",
|
|
26
|
+
transform: "translate(0.5)"
|
|
27
|
+
})
|
|
28
|
+
})
|
|
29
|
+
})
|
|
30
|
+
]
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
//# sourceMappingURL=x-circle-solid.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/icon/custom/x-circle-solid.tsx"],"sourcesContent":["import type {RemixiconComponentType} from '@remixicon/react';\nimport type {ComponentProps} from 'react';\n\nexport function XCircleSolidIcon(_props: ComponentProps<RemixiconComponentType>) {\n return (\n <svg\n width=\"19\"\n height=\"18\"\n viewBox=\"0 0 19 18\"\n fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <title>X Circle Solid</title>\n <g clipPath=\"url(#clip0_6552_160759)\">\n <path d=\"M9.49964 0.464844C4.79458 0.464844 0.966309 4.29311 0.966309 8.99818C0.966309 13.7032 4.79458 17.5315 9.49964 17.5315C14.2047 17.5315 18.033 13.7032 18.033 8.99818C18.033 4.29311 14.2047 0.464844 9.49964 0.464844ZM12.9983 11.3662C13.3108 11.6787 13.3108 12.1854 12.9983 12.4979C12.8426 12.6536 12.6378 12.7326 12.433 12.7326C12.2282 12.7326 12.0234 12.6547 11.8676 12.4979L9.49964 10.1299L7.13164 12.4979C6.97591 12.6536 6.77111 12.7326 6.56631 12.7326C6.36151 12.7326 6.15671 12.6547 6.00097 12.4979C5.68844 12.1854 5.68844 11.6787 6.00097 11.3662L8.36897 8.99818L6.00097 6.63018C5.68844 6.31764 5.68844 5.81098 6.00097 5.49844C6.31351 5.18591 6.82018 5.18591 7.13271 5.49844L9.50071 7.86644L11.8687 5.49844C12.1812 5.18591 12.6879 5.18591 13.0004 5.49844C13.313 5.81098 13.313 6.31764 13.0004 6.63018L10.6324 8.99818L13.0004 11.3662H12.9983Z\" />\n </g>\n <defs>\n <clipPath id=\"clip0_6552_160759\">\n <rect width=\"18\" height=\"18\" fill=\"white\" transform=\"translate(0.5)\" />\n </clipPath>\n </defs>\n </svg>\n );\n}\n"],"names":["XCircleSolidIcon","_props","svg","width","height","viewBox","fill","xmlns","title","g","clipPath","path","d","defs","id","rect","transform"],"mappings":";AAGA,OAAO,SAASA,iBAAiBC,MAA8C;IAC7E,qBACE,MAACC;QACCC,OAAM;QACNC,QAAO;QACPC,SAAQ;QACRC,MAAK;QACLC,OAAM;;0BAEN,KAACC;0BAAM;;0BACP,KAACC;gBAAEC,UAAS;0BACV,cAAA,KAACC;oBAAKC,GAAE;;;0BAEV,KAACC;0BACC,cAAA,KAACH;oBAASI,IAAG;8BACX,cAAA,KAACC;wBAAKZ,OAAM;wBAAKC,QAAO;wBAAKE,MAAK;wBAAQU,WAAU;;;;;;AAK9D"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { type RemixiconComponentType, RiGoogleFill } from '@remixicon/react';
|
|
2
|
+
import type { ComponentProps } from 'react';
|
|
3
|
+
import { BadgeIcon, CheckCircleSolidIcon, CircleDottedLineIcon, ComponentFillIcon, ComponentLineIcon, EllipseMiniSolidIcon, InfoTooltipFillIcon, ResizeIcon, SpinnerIcon, ThunderIcon, XCircleSolidIcon } from './custom';
|
|
4
|
+
declare const iconsMap: {
|
|
5
|
+
readonly google: RemixiconComponentType;
|
|
6
|
+
readonly microsoft: RemixiconComponentType;
|
|
7
|
+
readonly badge: typeof BadgeIcon;
|
|
8
|
+
readonly checkCircleSolid: typeof CheckCircleSolidIcon;
|
|
9
|
+
readonly circleDottedLine: typeof CircleDottedLineIcon;
|
|
10
|
+
readonly componentFill: typeof ComponentFillIcon;
|
|
11
|
+
readonly xCircleSolid: typeof XCircleSolidIcon;
|
|
12
|
+
readonly thunder: typeof ThunderIcon;
|
|
13
|
+
readonly resize: typeof ResizeIcon;
|
|
14
|
+
readonly infoTooltipFill: typeof InfoTooltipFillIcon;
|
|
15
|
+
readonly spinner: typeof SpinnerIcon;
|
|
16
|
+
readonly ellipseMiniSolid: typeof EllipseMiniSolidIcon;
|
|
17
|
+
readonly componentLine: typeof ComponentLineIcon;
|
|
18
|
+
};
|
|
19
|
+
export type IconName = keyof typeof iconsMap;
|
|
20
|
+
export declare const iconNames: IconName[];
|
|
21
|
+
type BaseIconProps = ComponentProps<typeof RiGoogleFill>;
|
|
22
|
+
type IconProps = {
|
|
23
|
+
name: IconName;
|
|
24
|
+
} & Omit<BaseIconProps, 'name'>;
|
|
25
|
+
export declare function Icon({ name, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
|
|
26
|
+
export {};
|
|
27
|
+
//# sourceMappingURL=icon.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/components/icon/icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,sBAAsB,EAAE,YAAY,EAAkB,MAAM,kBAAkB,CAAC;AAC5F,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,OAAO,CAAC;AAC1C,OAAO,EACL,SAAS,EACT,oBAAoB,EACpB,oBAAoB,EACpB,iBAAiB,EACjB,iBAAiB,EACjB,oBAAoB,EACpB,mBAAmB,EACnB,UAAU,EACV,WAAW,EACX,WAAW,EACX,gBAAgB,EACjB,MAAM,UAAU,CAAC;AAElB,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;CAc6C,CAAC;AAE5D,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,QAAQ,CAAC;AAC7C,eAAO,MAAM,SAAS,EAA4B,QAAQ,EAAE,CAAC;AAE7D,KAAK,aAAa,GAAG,cAAc,CAAC,OAAO,YAAY,CAAC,CAAC;AACzD,KAAK,SAAS,GAAG;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GAAG,IAAI,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;AAEhE,wBAAgB,IAAI,CAAC,EAAC,IAAI,EAAE,GAAG,KAAK,EAAC,EAAE,SAAS,2CAG/C"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { RiGoogleFill, RiMicrosoftFill } from '@remixicon/react';
|
|
3
|
+
import { BadgeIcon, CheckCircleSolidIcon, CircleDottedLineIcon, ComponentFillIcon, ComponentLineIcon, EllipseMiniSolidIcon, InfoTooltipFillIcon, ResizeIcon, SpinnerIcon, ThunderIcon, XCircleSolidIcon } from './custom/index.js';
|
|
4
|
+
const iconsMap = {
|
|
5
|
+
google: RiGoogleFill,
|
|
6
|
+
microsoft: RiMicrosoftFill,
|
|
7
|
+
badge: BadgeIcon,
|
|
8
|
+
checkCircleSolid: CheckCircleSolidIcon,
|
|
9
|
+
circleDottedLine: CircleDottedLineIcon,
|
|
10
|
+
componentFill: ComponentFillIcon,
|
|
11
|
+
xCircleSolid: XCircleSolidIcon,
|
|
12
|
+
thunder: ThunderIcon,
|
|
13
|
+
resize: ResizeIcon,
|
|
14
|
+
infoTooltipFill: InfoTooltipFillIcon,
|
|
15
|
+
spinner: SpinnerIcon,
|
|
16
|
+
ellipseMiniSolid: EllipseMiniSolidIcon,
|
|
17
|
+
componentLine: ComponentLineIcon
|
|
18
|
+
};
|
|
19
|
+
export const iconNames = Object.keys(iconsMap);
|
|
20
|
+
export function Icon({ name, ...props }) {
|
|
21
|
+
const IconComponent = iconsMap[name];
|
|
22
|
+
return /*#__PURE__*/ _jsx(IconComponent, {
|
|
23
|
+
...props
|
|
24
|
+
});
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
//# sourceMappingURL=icon.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/icon/icon.tsx"],"sourcesContent":["import {type RemixiconComponentType, RiGoogleFill, RiMicrosoftFill} from '@remixicon/react';\nimport type {ComponentProps} from 'react';\nimport {\n BadgeIcon,\n CheckCircleSolidIcon,\n CircleDottedLineIcon,\n ComponentFillIcon,\n ComponentLineIcon,\n EllipseMiniSolidIcon,\n InfoTooltipFillIcon,\n ResizeIcon,\n SpinnerIcon,\n ThunderIcon,\n XCircleSolidIcon,\n} from './custom';\n\nconst iconsMap = {\n google: RiGoogleFill,\n microsoft: RiMicrosoftFill,\n badge: BadgeIcon,\n checkCircleSolid: CheckCircleSolidIcon,\n circleDottedLine: CircleDottedLineIcon,\n componentFill: ComponentFillIcon,\n xCircleSolid: XCircleSolidIcon,\n thunder: ThunderIcon,\n resize: ResizeIcon,\n infoTooltipFill: InfoTooltipFillIcon,\n spinner: SpinnerIcon,\n ellipseMiniSolid: EllipseMiniSolidIcon,\n componentLine: ComponentLineIcon,\n} as const satisfies Record<string, RemixiconComponentType>;\n\nexport type IconName = keyof typeof iconsMap;\nexport const iconNames = Object.keys(iconsMap) as IconName[];\n\ntype BaseIconProps = ComponentProps<typeof RiGoogleFill>;\ntype IconProps = {name: IconName} & Omit<BaseIconProps, 'name'>;\n\nexport function Icon({name, ...props}: IconProps) {\n const IconComponent = iconsMap[name];\n return <IconComponent {...props} />;\n}\n"],"names":["RiGoogleFill","RiMicrosoftFill","BadgeIcon","CheckCircleSolidIcon","CircleDottedLineIcon","ComponentFillIcon","ComponentLineIcon","EllipseMiniSolidIcon","InfoTooltipFillIcon","ResizeIcon","SpinnerIcon","ThunderIcon","XCircleSolidIcon","iconsMap","google","microsoft","badge","checkCircleSolid","circleDottedLine","componentFill","xCircleSolid","thunder","resize","infoTooltipFill","spinner","ellipseMiniSolid","componentLine","iconNames","Object","keys","Icon","name","props","IconComponent"],"mappings":";AAAA,SAAqCA,YAAY,EAAEC,eAAe,QAAO,mBAAmB;AAE5F,SACEC,SAAS,EACTC,oBAAoB,EACpBC,oBAAoB,EACpBC,iBAAiB,EACjBC,iBAAiB,EACjBC,oBAAoB,EACpBC,mBAAmB,EACnBC,UAAU,EACVC,WAAW,EACXC,WAAW,EACXC,gBAAgB,QACX,WAAW;AAElB,MAAMC,WAAW;IACfC,QAAQd;IACRe,WAAWd;IACXe,OAAOd;IACPe,kBAAkBd;IAClBe,kBAAkBd;IAClBe,eAAed;IACfe,cAAcR;IACdS,SAASV;IACTW,QAAQb;IACRc,iBAAiBf;IACjBgB,SAASd;IACTe,kBAAkBlB;IAClBmB,eAAepB;AACjB;AAGA,OAAO,MAAMqB,YAAYC,OAAOC,IAAI,CAAChB,UAAwB;AAK7D,OAAO,SAASiB,KAAK,EAACC,IAAI,EAAE,GAAGC,OAAiB;IAC9C,MAAMC,gBAAgBpB,QAAQ,CAACkB,KAAK;IACpC,qBAAO,KAACE;QAAe,GAAGD,KAAK;;AACjC"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Code } from '../../components/typography/index.js';
|
|
3
|
+
import { Icon, iconNames } from './icon.js';
|
|
4
|
+
const meta = {
|
|
5
|
+
title: 'Components/Icon',
|
|
6
|
+
component: Icon
|
|
7
|
+
};
|
|
8
|
+
export default meta;
|
|
9
|
+
export const Gallery = {
|
|
10
|
+
args: {
|
|
11
|
+
name: 'google'
|
|
12
|
+
},
|
|
13
|
+
render: (args)=>/*#__PURE__*/ _jsx("div", {
|
|
14
|
+
className: "flex flex-col gap-16",
|
|
15
|
+
children: /*#__PURE__*/ _jsx("div", {
|
|
16
|
+
className: "grid grid-cols-8 gap-16",
|
|
17
|
+
children: iconNames.toSorted().map((name)=>/*#__PURE__*/ _jsxs("div", {
|
|
18
|
+
className: "flex flex-col items-center gap-4",
|
|
19
|
+
children: [
|
|
20
|
+
/*#__PURE__*/ _jsx(Icon, {
|
|
21
|
+
...args,
|
|
22
|
+
name: name
|
|
23
|
+
}),
|
|
24
|
+
/*#__PURE__*/ _jsx(Code, {
|
|
25
|
+
variant: "label",
|
|
26
|
+
className: "text-foreground-neutral-subtle",
|
|
27
|
+
children: name
|
|
28
|
+
})
|
|
29
|
+
]
|
|
30
|
+
}, name))
|
|
31
|
+
})
|
|
32
|
+
})
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
//# sourceMappingURL=icon.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/icon/icon.stories.tsx"],"sourcesContent":["import type {Meta, StoryObj} from '@storybook/react';\nimport {Code} from 'components/typography';\nimport {Icon, iconNames} from './icon';\n\nconst meta = {\n title: 'Components/Icon',\n component: Icon,\n} satisfies Meta<typeof Icon>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Gallery: Story = {\n args: {name: 'google'},\n render: (args) => (\n <div className=\"flex flex-col gap-16\">\n <div className=\"grid grid-cols-8 gap-16\">\n {iconNames.toSorted().map((name) => (\n <div key={name} className=\"flex flex-col items-center gap-4\">\n <Icon {...args} name={name} />\n <Code variant=\"label\" className=\"text-foreground-neutral-subtle\">\n {name}\n </Code>\n </div>\n ))}\n </div>\n </div>\n ),\n};\n"],"names":["Code","Icon","iconNames","meta","title","component","Gallery","args","name","render","div","className","toSorted","map","variant"],"mappings":";AACA,SAAQA,IAAI,QAAO,wBAAwB;AAC3C,SAAQC,IAAI,EAAEC,SAAS,QAAO,SAAS;AAEvC,MAAMC,OAAO;IACXC,OAAO;IACPC,WAAWJ;AACb;AAEA,eAAeE,KAAK;AAGpB,OAAO,MAAMG,UAAiB;IAC5BC,MAAM;QAACC,MAAM;IAAQ;IACrBC,QAAQ,CAACF,qBACP,KAACG;YAAIC,WAAU;sBACb,cAAA,KAACD;gBAAIC,WAAU;0BACZT,UAAUU,QAAQ,GAAGC,GAAG,CAAC,CAACL,qBACzB,MAACE;wBAAeC,WAAU;;0CACxB,KAACV;gCAAM,GAAGM,IAAI;gCAAEC,MAAMA;;0CACtB,KAACR;gCAAKc,SAAQ;gCAAQH,WAAU;0CAC7BH;;;uBAHKA;;;AAUpB,EAAE"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/icon/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/icon/index.ts"],"sourcesContent":["export * from './icon';\n"],"names":[],"mappings":"AAAA,cAAc,SAAS"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/index.ts"],"sourcesContent":["export * from './button';\nexport * from './icon';\nexport * from './theme-provider';\nexport * from './typography';\n"],"names":[],"mappings":"AAAA,cAAc,WAAW;AACzB,cAAc,SAAS;AACvB,cAAc,mBAAmB;AACjC,cAAc,eAAe"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
2
|
+
import { type Theme } from '../state/theme';
|
|
3
|
+
type ThemeProviderProps = {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
defaultTheme?: Theme;
|
|
6
|
+
storageKey?: string;
|
|
7
|
+
};
|
|
8
|
+
export declare function ThemeProvider({ children, defaultTheme, storageKey, ...props }: ThemeProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export {};
|
|
10
|
+
//# sourceMappingURL=theme-provider.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"theme-provider.d.ts","sourceRoot":"","sources":["../../src/components/theme-provider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,SAAS,EAAsB,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAC,KAAK,KAAK,EAAuB,MAAM,aAAa,CAAC;AAE7D,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,YAAuB,EACvB,UAA4B,EAC5B,GAAG,KAAK,EACT,EAAE,kBAAkB,2CAmCpB"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useState } from 'react';
|
|
3
|
+
import { ThemeProviderContext } from '../state/theme.js';
|
|
4
|
+
export function ThemeProvider({ children, defaultTheme = 'system', storageKey = 'shipfox-theme', ...props }) {
|
|
5
|
+
const [theme, setTheme] = useState(()=>localStorage.getItem(storageKey) || defaultTheme);
|
|
6
|
+
useEffect(()=>{
|
|
7
|
+
const root = window.document.documentElement;
|
|
8
|
+
root.classList.remove('light', 'dark');
|
|
9
|
+
if (theme === 'system') {
|
|
10
|
+
const systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
11
|
+
root.classList.add(systemTheme);
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
root.classList.add(theme);
|
|
15
|
+
}, [
|
|
16
|
+
theme
|
|
17
|
+
]);
|
|
18
|
+
const value = {
|
|
19
|
+
theme,
|
|
20
|
+
setTheme: (theme)=>{
|
|
21
|
+
localStorage.setItem(storageKey, theme);
|
|
22
|
+
setTheme(theme);
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
return /*#__PURE__*/ _jsx(ThemeProviderContext.Provider, {
|
|
26
|
+
...props,
|
|
27
|
+
value: value,
|
|
28
|
+
children: children
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
//# sourceMappingURL=theme-provider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/theme-provider.tsx"],"sourcesContent":["import {type ReactNode, useEffect, useState} from 'react';\nimport {type Theme, ThemeProviderContext} from 'state/theme';\n\ntype ThemeProviderProps = {\n children: ReactNode;\n defaultTheme?: Theme;\n storageKey?: string;\n};\n\nexport function ThemeProvider({\n children,\n defaultTheme = 'system',\n storageKey = 'shipfox-theme',\n ...props\n}: ThemeProviderProps) {\n const [theme, setTheme] = useState<Theme>(\n () => (localStorage.getItem(storageKey) as Theme) || defaultTheme,\n );\n\n useEffect(() => {\n const root = window.document.documentElement;\n\n root.classList.remove('light', 'dark');\n\n if (theme === 'system') {\n const systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches\n ? 'dark'\n : 'light';\n\n root.classList.add(systemTheme);\n return;\n }\n\n root.classList.add(theme);\n }, [theme]);\n\n const value = {\n theme,\n setTheme: (theme: Theme) => {\n localStorage.setItem(storageKey, theme);\n setTheme(theme);\n },\n };\n\n return (\n <ThemeProviderContext.Provider {...props} value={value}>\n {children}\n </ThemeProviderContext.Provider>\n );\n}\n"],"names":["useEffect","useState","ThemeProviderContext","ThemeProvider","children","defaultTheme","storageKey","props","theme","setTheme","localStorage","getItem","root","window","document","documentElement","classList","remove","systemTheme","matchMedia","matches","add","value","setItem","Provider"],"mappings":";AAAA,SAAwBA,SAAS,EAAEC,QAAQ,QAAO,QAAQ;AAC1D,SAAoBC,oBAAoB,QAAO,cAAc;AAQ7D,OAAO,SAASC,cAAc,EAC5BC,QAAQ,EACRC,eAAe,QAAQ,EACvBC,aAAa,eAAe,EAC5B,GAAGC,OACgB;IACnB,MAAM,CAACC,OAAOC,SAAS,GAAGR,SACxB,IAAM,AAACS,aAAaC,OAAO,CAACL,eAAyBD;IAGvDL,UAAU;QACR,MAAMY,OAAOC,OAAOC,QAAQ,CAACC,eAAe;QAE5CH,KAAKI,SAAS,CAACC,MAAM,CAAC,SAAS;QAE/B,IAAIT,UAAU,UAAU;YACtB,MAAMU,cAAcL,OAAOM,UAAU,CAAC,gCAAgCC,OAAO,GACzE,SACA;YAEJR,KAAKI,SAAS,CAACK,GAAG,CAACH;YACnB;QACF;QAEAN,KAAKI,SAAS,CAACK,GAAG,CAACb;IACrB,GAAG;QAACA;KAAM;IAEV,MAAMc,QAAQ;QACZd;QACAC,UAAU,CAACD;YACTE,aAAaa,OAAO,CAACjB,YAAYE;YACjCC,SAASD;QACX;IACF;IAEA,qBACE,KAACN,qBAAqBsB,QAAQ;QAAE,GAAGjB,KAAK;QAAEe,OAAOA;kBAC9ClB;;AAGP"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
2
|
+
import type { ElementType, HTMLAttributes, PropsWithChildren } from 'react';
|
|
3
|
+
export declare const codeVariants: (props?: ({
|
|
4
|
+
variant?: "label" | "paragraph" | null | undefined;
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
|
+
export type CodeProps = PropsWithChildren<HTMLAttributes<HTMLParagraphElement>> & VariantProps<typeof codeVariants> & {
|
|
7
|
+
as?: ElementType;
|
|
8
|
+
bold?: boolean;
|
|
9
|
+
};
|
|
10
|
+
export declare function Code({ children, className, variant, as, bold, ...props }: CodeProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
//# sourceMappingURL=code.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"code.d.ts","sourceRoot":"","sources":["../../../src/components/typography/code.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAM,KAAK,YAAY,EAAC,MAAM,0BAA0B,CAAC;AAChE,OAAO,KAAK,EAAC,WAAW,EAAE,cAAc,EAAE,iBAAiB,EAAC,MAAM,OAAO,CAAC;AAG1E,eAAO,MAAM,YAAY;;8EAUvB,CAAC;AAEH,MAAM,MAAM,SAAS,GAAG,iBAAiB,CAAC,cAAc,CAAC,oBAAoB,CAAC,CAAC,GAC7E,YAAY,CAAC,OAAO,YAAY,CAAC,GAAG;IAClC,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEJ,wBAAgB,IAAI,CAAC,EAAC,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,EAAE,IAAI,EAAE,GAAG,KAAK,EAAC,EAAE,SAAS,2CAejF"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { cva } from 'class-variance-authority';
|
|
3
|
+
import { cn } from '../../utils/index.js';
|
|
4
|
+
export const codeVariants = cva('', {
|
|
5
|
+
variants: {
|
|
6
|
+
variant: {
|
|
7
|
+
label: 'text-xs',
|
|
8
|
+
paragraph: 'text-sm'
|
|
9
|
+
}
|
|
10
|
+
},
|
|
11
|
+
defaultVariants: {
|
|
12
|
+
variant: 'paragraph'
|
|
13
|
+
}
|
|
14
|
+
});
|
|
15
|
+
export function Code({ children, className, variant, as, bold, ...props }) {
|
|
16
|
+
const Component = as ?? 'p';
|
|
17
|
+
return /*#__PURE__*/ _jsx(Component, {
|
|
18
|
+
className: cn(codeVariants({
|
|
19
|
+
variant
|
|
20
|
+
}), 'leading-20 font-code', {
|
|
21
|
+
'font-bold': bold
|
|
22
|
+
}, className),
|
|
23
|
+
...props,
|
|
24
|
+
children: children
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
//# sourceMappingURL=code.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/typography/code.tsx"],"sourcesContent":["import {cva, type VariantProps} from 'class-variance-authority';\nimport type {ElementType, HTMLAttributes, PropsWithChildren} from 'react';\nimport {cn} from 'utils';\n\nexport const codeVariants = cva('', {\n variants: {\n variant: {\n label: 'text-xs',\n paragraph: 'text-sm',\n },\n },\n defaultVariants: {\n variant: 'paragraph',\n },\n});\n\nexport type CodeProps = PropsWithChildren<HTMLAttributes<HTMLParagraphElement>> &\n VariantProps<typeof codeVariants> & {\n as?: ElementType;\n bold?: boolean;\n };\n\nexport function Code({children, className, variant, as, bold, ...props}: CodeProps) {\n const Component = as ?? 'p';\n return (\n <Component\n className={cn(\n codeVariants({variant}),\n 'leading-20 font-code',\n {'font-bold': bold},\n className,\n )}\n {...props}\n >\n {children}\n </Component>\n );\n}\n"],"names":["cva","cn","codeVariants","variants","variant","label","paragraph","defaultVariants","Code","children","className","as","bold","props","Component"],"mappings":";AAAA,SAAQA,GAAG,QAA0B,2BAA2B;AAEhE,SAAQC,EAAE,QAAO,QAAQ;AAEzB,OAAO,MAAMC,eAAeF,IAAI,IAAI;IAClCG,UAAU;QACRC,SAAS;YACPC,OAAO;YACPC,WAAW;QACb;IACF;IACAC,iBAAiB;QACfH,SAAS;IACX;AACF,GAAG;AAQH,OAAO,SAASI,KAAK,EAACC,QAAQ,EAAEC,SAAS,EAAEN,OAAO,EAAEO,EAAE,EAAEC,IAAI,EAAE,GAAGC,OAAiB;IAChF,MAAMC,YAAYH,MAAM;IACxB,qBACE,KAACG;QACCJ,WAAWT,GACTC,aAAa;YAACE;QAAO,IACrB,wBACA;YAAC,aAAaQ;QAAI,GAClBF;QAED,GAAGG,KAAK;kBAERJ;;AAGP"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Code } from './code.js';
|
|
3
|
+
const meta = {
|
|
4
|
+
title: 'Typography/Code'
|
|
5
|
+
};
|
|
6
|
+
export default meta;
|
|
7
|
+
const variants = [
|
|
8
|
+
'label',
|
|
9
|
+
'paragraph'
|
|
10
|
+
];
|
|
11
|
+
export const Default = {
|
|
12
|
+
render: ()=>/*#__PURE__*/ _jsx("div", {
|
|
13
|
+
className: "flex flex-col gap-16",
|
|
14
|
+
children: variants.map((variant)=>/*#__PURE__*/ _jsxs("div", {
|
|
15
|
+
className: "grid grid-cols-2 gap-8",
|
|
16
|
+
children: [
|
|
17
|
+
/*#__PURE__*/ _jsxs("div", {
|
|
18
|
+
className: "flex flex-col gap-4",
|
|
19
|
+
children: [
|
|
20
|
+
/*#__PURE__*/ _jsx(Code, {
|
|
21
|
+
variant: "label",
|
|
22
|
+
className: "text-foreground-neutral-subtle",
|
|
23
|
+
children: variant
|
|
24
|
+
}),
|
|
25
|
+
/*#__PURE__*/ _jsx(Code, {
|
|
26
|
+
variant: variant,
|
|
27
|
+
children: "The quick brown fox jumps over the lazy dog"
|
|
28
|
+
})
|
|
29
|
+
]
|
|
30
|
+
}),
|
|
31
|
+
/*#__PURE__*/ _jsxs("div", {
|
|
32
|
+
className: "flex flex-col gap-4",
|
|
33
|
+
children: [
|
|
34
|
+
/*#__PURE__*/ _jsxs(Code, {
|
|
35
|
+
variant: "label",
|
|
36
|
+
className: "text-foreground-neutral-subtle",
|
|
37
|
+
children: [
|
|
38
|
+
variant,
|
|
39
|
+
" - Bold"
|
|
40
|
+
]
|
|
41
|
+
}),
|
|
42
|
+
/*#__PURE__*/ _jsx(Code, {
|
|
43
|
+
variant: variant,
|
|
44
|
+
bold: true,
|
|
45
|
+
children: "The quick brown fox jumps over the lazy dog"
|
|
46
|
+
})
|
|
47
|
+
]
|
|
48
|
+
})
|
|
49
|
+
]
|
|
50
|
+
}, variant))
|
|
51
|
+
})
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
//# sourceMappingURL=code.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/typography/code.stories.tsx"],"sourcesContent":["import type {Meta, StoryObj} from '@storybook/react';\nimport {Code} from './code';\n\nconst meta: Meta = {\n title: 'Typography/Code',\n};\nexport default meta;\n\ntype Story = StoryObj;\n\nconst variants = ['label', 'paragraph'] as const;\n\nexport const Default: Story = {\n render: () => (\n <div className=\"flex flex-col gap-16\">\n {variants.map((variant) => (\n <div key={variant} className=\"grid grid-cols-2 gap-8\">\n <div className=\"flex flex-col gap-4\">\n <Code variant=\"label\" className=\"text-foreground-neutral-subtle\">\n {variant}\n </Code>\n <Code variant={variant}>The quick brown fox jumps over the lazy dog</Code>\n </div>\n <div className=\"flex flex-col gap-4\">\n <Code variant=\"label\" className=\"text-foreground-neutral-subtle\">\n {variant} - Bold\n </Code>\n <Code variant={variant} bold>\n The quick brown fox jumps over the lazy dog\n </Code>\n </div>\n </div>\n ))}\n </div>\n ),\n};\n"],"names":["Code","meta","title","variants","Default","render","div","className","map","variant","bold"],"mappings":";AACA,SAAQA,IAAI,QAAO,SAAS;AAE5B,MAAMC,OAAa;IACjBC,OAAO;AACT;AACA,eAAeD,KAAK;AAIpB,MAAME,WAAW;IAAC;IAAS;CAAY;AAEvC,OAAO,MAAMC,UAAiB;IAC5BC,QAAQ,kBACN,KAACC;YAAIC,WAAU;sBACZJ,SAASK,GAAG,CAAC,CAACC,wBACb,MAACH;oBAAkBC,WAAU;;sCAC3B,MAACD;4BAAIC,WAAU;;8CACb,KAACP;oCAAKS,SAAQ;oCAAQF,WAAU;8CAC7BE;;8CAEH,KAACT;oCAAKS,SAASA;8CAAS;;;;sCAE1B,MAACH;4BAAIC,WAAU;;8CACb,MAACP;oCAAKS,SAAQ;oCAAQF,WAAU;;wCAC7BE;wCAAQ;;;8CAEX,KAACT;oCAAKS,SAASA;oCAASC,IAAI;8CAAC;;;;;mBAXvBD;;AAmBlB,EAAE"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
2
|
+
import type { ElementType, HTMLAttributes, PropsWithChildren } from 'react';
|
|
3
|
+
export declare const headerVariants: (props?: ({
|
|
4
|
+
variant?: "h1" | "h2" | "h3" | "h4" | null | undefined;
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
|
+
export type HeaderProps = PropsWithChildren<HTMLAttributes<HTMLParagraphElement>> & VariantProps<typeof headerVariants> & {
|
|
7
|
+
as?: ElementType;
|
|
8
|
+
};
|
|
9
|
+
export declare function Header({ children, className, variant, as, ...props }: HeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
//# sourceMappingURL=header.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../src/components/typography/header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAM,KAAK,YAAY,EAAC,MAAM,0BAA0B,CAAC;AAChE,OAAO,KAAK,EAAC,WAAW,EAAE,cAAc,EAAE,iBAAiB,EAAC,MAAM,OAAO,CAAC;AAG1E,eAAO,MAAM,cAAc;;8EAYzB,CAAC;AASH,MAAM,MAAM,WAAW,GAAG,iBAAiB,CAAC,cAAc,CAAC,oBAAoB,CAAC,CAAC,GAC/E,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC,EAAE,CAAC,EAAE,WAAW,CAAC;CAClB,CAAC;AAEJ,wBAAgB,MAAM,CAAC,EAAC,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,KAAK,EAAC,EAAE,WAAW,2CAU/E"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { cva } from 'class-variance-authority';
|
|
3
|
+
import { cn } from '../../utils/index.js';
|
|
4
|
+
export const headerVariants = cva('', {
|
|
5
|
+
variants: {
|
|
6
|
+
variant: {
|
|
7
|
+
h1: 'text-3xl',
|
|
8
|
+
h2: 'text-xl',
|
|
9
|
+
h3: 'text-lg',
|
|
10
|
+
h4: 'text-md'
|
|
11
|
+
}
|
|
12
|
+
},
|
|
13
|
+
defaultVariants: {
|
|
14
|
+
variant: 'h1'
|
|
15
|
+
}
|
|
16
|
+
});
|
|
17
|
+
const components = {
|
|
18
|
+
h1: 'h1',
|
|
19
|
+
h2: 'h2',
|
|
20
|
+
h3: 'h3',
|
|
21
|
+
h4: 'h4'
|
|
22
|
+
};
|
|
23
|
+
export function Header({ children, className, variant, as, ...props }) {
|
|
24
|
+
const Component = as ?? (variant ? components[variant] : 'h1');
|
|
25
|
+
return /*#__PURE__*/ _jsx(Component, {
|
|
26
|
+
className: cn(headerVariants({
|
|
27
|
+
variant
|
|
28
|
+
}), 'font-display font-medium', className),
|
|
29
|
+
...props,
|
|
30
|
+
children: children
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
//# sourceMappingURL=header.js.map
|