@shipfox/react-ui 0.6.0 → 0.8.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/.storybook/main.ts +12 -5
- package/.turbo/turbo-build.log +5 -5
- package/.turbo/turbo-check.log +2 -2
- package/.turbo/turbo-type.log +1 -1
- package/CHANGELOG.md +13 -0
- package/dist/components/button/button.d.ts +2 -1
- package/dist/components/button/button.d.ts.map +1 -1
- package/dist/components/button/button.js +17 -2
- package/dist/components/button/button.js.map +1 -1
- package/dist/components/button/button.stories.js +25 -0
- package/dist/components/button/button.stories.js.map +1 -1
- package/dist/components/button/icon-button.d.ts +2 -1
- package/dist/components/button/icon-button.d.ts.map +1 -1
- package/dist/components/button/icon-button.js +17 -2
- package/dist/components/button/icon-button.js.map +1 -1
- package/dist/components/button/icon-button.stories.js +90 -0
- package/dist/components/button/icon-button.stories.js.map +1 -1
- package/dist/components/dot-grid/dot-grid.d.ts +18 -0
- package/dist/components/dot-grid/dot-grid.d.ts.map +1 -0
- package/dist/components/dot-grid/dot-grid.js +295 -0
- package/dist/components/dot-grid/dot-grid.js.map +1 -0
- package/dist/components/dot-grid/index.d.ts +2 -0
- package/dist/components/dot-grid/index.d.ts.map +1 -0
- package/dist/components/dot-grid/index.js +3 -0
- package/dist/components/dot-grid/index.js.map +1 -0
- package/dist/components/form/form.d.ts +11 -0
- package/dist/components/form/form.d.ts.map +1 -0
- package/dist/components/form/form.js +106 -0
- package/dist/components/form/form.js.map +1 -0
- package/dist/components/form/form.stories.js +582 -0
- package/dist/components/form/form.stories.js.map +1 -0
- package/dist/components/form/index.d.ts +2 -0
- package/dist/components/form/index.d.ts.map +1 -0
- package/dist/components/form/index.js +3 -0
- package/dist/components/form/index.js.map +1 -0
- package/dist/components/icon/custom/spinner.d.ts +1 -1
- package/dist/components/icon/custom/spinner.d.ts.map +1 -1
- package/dist/components/icon/custom/spinner.js +84 -30
- package/dist/components/icon/custom/spinner.js.map +1 -1
- package/dist/components/icon/icon.d.ts +19 -18
- package/dist/components/icon/icon.d.ts.map +1 -1
- package/dist/components/icon/icon.js +17 -17
- package/dist/components/icon/icon.js.map +1 -1
- package/dist/components/index.d.ts +3 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +3 -0
- package/dist/components/index.js.map +1 -1
- package/dist/onboarding/sign-in.stories.js +16 -8
- package/dist/onboarding/sign-in.stories.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +13 -10
- package/src/components/button/button.stories.tsx +18 -0
- package/src/components/button/button.tsx +27 -2
- package/src/components/button/icon-button.stories.tsx +46 -0
- package/src/components/button/icon-button.tsx +26 -1
- package/src/components/dot-grid/dot-grid.tsx +325 -0
- package/src/components/dot-grid/index.ts +1 -0
- package/src/components/form/form.stories.tsx +500 -0
- package/src/components/form/form.tsx +154 -0
- package/src/components/form/index.ts +1 -0
- package/src/components/icon/custom/spinner.tsx +64 -18
- package/src/components/icon/icon.tsx +18 -18
- package/src/components/index.ts +3 -0
- package/src/onboarding/sign-in.stories.tsx +20 -8
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../../src/components/icon/custom/spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,sBAAsB,EAAC,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../../src/components/icon/custom/spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,sBAAsB,EAAC,MAAM,kBAAkB,CAAC;AAE7D,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,OAAO,CAAC;AA+B1C,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,sBAAsB,CAAC,2CA8GxE"}
|
|
@@ -1,17 +1,69 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
2
|
+
import { motion } from 'framer-motion';
|
|
3
|
+
import { cn } from '../../../utils/cn.js';
|
|
4
|
+
const SEGMENT_COUNT = 8;
|
|
5
|
+
const DURATION = 1.2;
|
|
6
|
+
const BASE_OPACITY = 0;
|
|
7
|
+
const CLOCKWISE_ORDER = [
|
|
8
|
+
1,
|
|
9
|
+
8,
|
|
10
|
+
4,
|
|
11
|
+
6,
|
|
12
|
+
2,
|
|
13
|
+
7,
|
|
14
|
+
3,
|
|
15
|
+
5
|
|
16
|
+
];
|
|
17
|
+
const segmentVariants = {};
|
|
18
|
+
for(let i = 0; i < SEGMENT_COUNT; i++){
|
|
19
|
+
const segmentIndex = CLOCKWISE_ORDER[i];
|
|
20
|
+
const delay = i * DURATION / SEGMENT_COUNT;
|
|
21
|
+
segmentVariants[`segment${segmentIndex}`] = {
|
|
22
|
+
initial: {
|
|
23
|
+
opacity: BASE_OPACITY
|
|
24
|
+
},
|
|
25
|
+
animate: {
|
|
26
|
+
opacity: [
|
|
27
|
+
BASE_OPACITY,
|
|
28
|
+
1,
|
|
29
|
+
BASE_OPACITY
|
|
30
|
+
],
|
|
31
|
+
transition: {
|
|
32
|
+
duration: DURATION,
|
|
33
|
+
ease: 'easeInOut',
|
|
34
|
+
repeat: Infinity,
|
|
35
|
+
repeatType: 'loop',
|
|
36
|
+
delay,
|
|
37
|
+
times: [
|
|
38
|
+
0,
|
|
39
|
+
0.5,
|
|
40
|
+
1
|
|
41
|
+
]
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
}
|
|
46
|
+
export function SpinnerIcon(props) {
|
|
47
|
+
const { className, size, ...restProps } = props;
|
|
48
|
+
const iconSize = size ?? 24;
|
|
49
|
+
const svgProps = {
|
|
50
|
+
width: typeof iconSize === 'number' ? String(iconSize) : iconSize,
|
|
51
|
+
height: typeof iconSize === 'number' ? String(iconSize) : iconSize,
|
|
52
|
+
viewBox: '0 0 24 24',
|
|
53
|
+
fill: 'none',
|
|
54
|
+
xmlns: 'http://www.w3.org/2000/svg',
|
|
55
|
+
className: cn(className),
|
|
56
|
+
initial: 'initial',
|
|
57
|
+
animate: 'animate',
|
|
58
|
+
...restProps
|
|
59
|
+
};
|
|
60
|
+
return /*#__PURE__*/ _jsxs(motion.svg, {
|
|
61
|
+
...svgProps,
|
|
9
62
|
children: [
|
|
10
63
|
/*#__PURE__*/ _jsx("title", {
|
|
11
64
|
children: "Spinner"
|
|
12
65
|
}),
|
|
13
|
-
/*#__PURE__*/ _jsx(
|
|
14
|
-
opacity: "0.55",
|
|
66
|
+
/*#__PURE__*/ _jsx(motion.path, {
|
|
15
67
|
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
68
|
fill: "currentColor",
|
|
17
69
|
stroke: "currentColor",
|
|
@@ -23,9 +75,10 @@ export function SpinnerIcon(_props) {
|
|
|
23
75
|
},
|
|
24
76
|
strokeWidth: "0.916667",
|
|
25
77
|
strokeLinecap: "round",
|
|
26
|
-
strokeLinejoin: "round"
|
|
78
|
+
strokeLinejoin: "round",
|
|
79
|
+
variants: segmentVariants.segment1
|
|
27
80
|
}),
|
|
28
|
-
/*#__PURE__*/ _jsx(
|
|
81
|
+
/*#__PURE__*/ _jsx(motion.rect, {
|
|
29
82
|
x: "10.583",
|
|
30
83
|
y: "17.5",
|
|
31
84
|
width: "1.83333",
|
|
@@ -41,10 +94,10 @@ export function SpinnerIcon(_props) {
|
|
|
41
94
|
},
|
|
42
95
|
strokeWidth: "0.916667",
|
|
43
96
|
strokeLinecap: "round",
|
|
44
|
-
strokeLinejoin: "round"
|
|
97
|
+
strokeLinejoin: "round",
|
|
98
|
+
variants: segmentVariants.segment2
|
|
45
99
|
}),
|
|
46
|
-
/*#__PURE__*/ _jsx(
|
|
47
|
-
opacity: "0.25",
|
|
100
|
+
/*#__PURE__*/ _jsx(motion.path, {
|
|
48
101
|
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
102
|
fill: "currentColor",
|
|
50
103
|
stroke: "currentColor",
|
|
@@ -56,10 +109,10 @@ export function SpinnerIcon(_props) {
|
|
|
56
109
|
},
|
|
57
110
|
strokeWidth: "0.916667",
|
|
58
111
|
strokeLinecap: "round",
|
|
59
|
-
strokeLinejoin: "round"
|
|
112
|
+
strokeLinejoin: "round",
|
|
113
|
+
variants: segmentVariants.segment3
|
|
60
114
|
}),
|
|
61
|
-
/*#__PURE__*/ _jsx(
|
|
62
|
-
opacity: "0.75",
|
|
115
|
+
/*#__PURE__*/ _jsx(motion.path, {
|
|
63
116
|
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
117
|
fill: "currentColor",
|
|
65
118
|
stroke: "currentColor",
|
|
@@ -71,10 +124,10 @@ export function SpinnerIcon(_props) {
|
|
|
71
124
|
},
|
|
72
125
|
strokeWidth: "0.916667",
|
|
73
126
|
strokeLinecap: "round",
|
|
74
|
-
strokeLinejoin: "round"
|
|
127
|
+
strokeLinejoin: "round",
|
|
128
|
+
variants: segmentVariants.segment4
|
|
75
129
|
}),
|
|
76
|
-
/*#__PURE__*/ _jsx(
|
|
77
|
-
opacity: "0.38",
|
|
130
|
+
/*#__PURE__*/ _jsx(motion.path, {
|
|
78
131
|
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
132
|
fill: "currentColor",
|
|
80
133
|
stroke: "currentColor",
|
|
@@ -86,10 +139,10 @@ export function SpinnerIcon(_props) {
|
|
|
86
139
|
},
|
|
87
140
|
strokeWidth: "0.916667",
|
|
88
141
|
strokeLinecap: "round",
|
|
89
|
-
strokeLinejoin: "round"
|
|
142
|
+
strokeLinejoin: "round",
|
|
143
|
+
variants: segmentVariants.segment5
|
|
90
144
|
}),
|
|
91
|
-
/*#__PURE__*/ _jsx(
|
|
92
|
-
opacity: "0.88",
|
|
145
|
+
/*#__PURE__*/ _jsx(motion.rect, {
|
|
93
146
|
x: "14.7412",
|
|
94
147
|
y: "16.5391",
|
|
95
148
|
width: "1.83333",
|
|
@@ -106,10 +159,10 @@ export function SpinnerIcon(_props) {
|
|
|
106
159
|
},
|
|
107
160
|
strokeWidth: "0.916667",
|
|
108
161
|
strokeLinecap: "round",
|
|
109
|
-
strokeLinejoin: "round"
|
|
162
|
+
strokeLinejoin: "round",
|
|
163
|
+
variants: segmentVariants.segment6
|
|
110
164
|
}),
|
|
111
|
-
/*#__PURE__*/ _jsx(
|
|
112
|
-
opacity: "0.13",
|
|
165
|
+
/*#__PURE__*/ _jsx(motion.path, {
|
|
113
166
|
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
167
|
fill: "currentColor",
|
|
115
168
|
stroke: "currentColor",
|
|
@@ -121,10 +174,10 @@ export function SpinnerIcon(_props) {
|
|
|
121
174
|
},
|
|
122
175
|
strokeWidth: "0.916667",
|
|
123
176
|
strokeLinecap: "round",
|
|
124
|
-
strokeLinejoin: "round"
|
|
177
|
+
strokeLinejoin: "round",
|
|
178
|
+
variants: segmentVariants.segment7
|
|
125
179
|
}),
|
|
126
|
-
/*#__PURE__*/ _jsx(
|
|
127
|
-
opacity: "0.63",
|
|
180
|
+
/*#__PURE__*/ _jsx(motion.path, {
|
|
128
181
|
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
182
|
fill: "currentColor",
|
|
130
183
|
stroke: "currentColor",
|
|
@@ -136,7 +189,8 @@ export function SpinnerIcon(_props) {
|
|
|
136
189
|
},
|
|
137
190
|
strokeWidth: "0.916667",
|
|
138
191
|
strokeLinecap: "round",
|
|
139
|
-
strokeLinejoin: "round"
|
|
192
|
+
strokeLinejoin: "round",
|
|
193
|
+
variants: segmentVariants.segment8
|
|
140
194
|
})
|
|
141
195
|
]
|
|
142
196
|
});
|
|
@@ -1 +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(
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/icon/custom/spinner.tsx"],"sourcesContent":["import type {RemixiconComponentType} from '@remixicon/react';\nimport {motion, type SVGMotionProps, type Variants} from 'framer-motion';\nimport type {ComponentProps} from 'react';\nimport {cn} from 'utils/cn';\n\nconst SEGMENT_COUNT = 8;\nconst DURATION = 1.2;\nconst BASE_OPACITY = 0;\n\nconst CLOCKWISE_ORDER = [1, 8, 4, 6, 2, 7, 3, 5];\n\nconst segmentVariants: Record<string, Variants> = {};\n\nfor (let i = 0; i < SEGMENT_COUNT; i++) {\n const segmentIndex = CLOCKWISE_ORDER[i];\n const delay = (i * DURATION) / SEGMENT_COUNT;\n\n segmentVariants[`segment${segmentIndex}`] = {\n initial: {opacity: BASE_OPACITY},\n animate: {\n opacity: [BASE_OPACITY, 1, BASE_OPACITY],\n transition: {\n duration: DURATION,\n ease: 'easeInOut',\n repeat: Infinity,\n repeatType: 'loop',\n delay,\n times: [0, 0.5, 1],\n },\n },\n };\n}\n\nexport function SpinnerIcon(props: ComponentProps<RemixiconComponentType>) {\n const {className, size, ...restProps} = props;\n\n const iconSize = size ?? 24;\n\n const svgProps: SVGMotionProps<SVGSVGElement> = {\n width: typeof iconSize === 'number' ? String(iconSize) : iconSize,\n height: typeof iconSize === 'number' ? String(iconSize) : iconSize,\n viewBox: '0 0 24 24',\n fill: 'none',\n xmlns: 'http://www.w3.org/2000/svg',\n className: cn(className),\n initial: 'initial',\n animate: 'animate',\n ...(restProps as SVGMotionProps<SVGSVGElement>),\n };\n return (\n <motion.svg {...svgProps}>\n <title>Spinner</title>\n <motion.path\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 variants={segmentVariants.segment1}\n />\n <motion.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 variants={segmentVariants.segment2}\n />\n <motion.path\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 variants={segmentVariants.segment3}\n />\n <motion.path\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 variants={segmentVariants.segment4}\n />\n <motion.path\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 variants={segmentVariants.segment5}\n />\n <motion.rect\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 variants={segmentVariants.segment6}\n />\n <motion.path\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 variants={segmentVariants.segment7}\n />\n <motion.path\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 variants={segmentVariants.segment8}\n />\n </motion.svg>\n );\n}\n"],"names":["motion","cn","SEGMENT_COUNT","DURATION","BASE_OPACITY","CLOCKWISE_ORDER","segmentVariants","i","segmentIndex","delay","initial","opacity","animate","transition","duration","ease","repeat","Infinity","repeatType","times","SpinnerIcon","props","className","size","restProps","iconSize","svgProps","width","String","height","viewBox","fill","xmlns","svg","title","path","d","stroke","style","fillOpacity","strokeOpacity","strokeWidth","strokeLinecap","strokeLinejoin","variants","segment1","rect","x","y","rx","segment2","segment3","segment4","segment5","transform","segment6","segment7","segment8"],"mappings":"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"}
|
|
@@ -1,35 +1,36 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import type { RemixiconComponentType } from '@remixicon/react';
|
|
2
|
+
import { RiGoogleFill } from '@remixicon/react';
|
|
2
3
|
import type { ComponentProps } from 'react';
|
|
3
4
|
import { BadgeIcon, CheckCircleSolidIcon, CircleDottedLineIcon, ComponentFillIcon, ComponentLineIcon, EllipseMiniSolidIcon, InfoTooltipFillIcon, ResizeIcon, ShipfoxLogo, SlackLogo, SpinnerIcon, StripeLogo, ThunderIcon, XCircleSolidIcon } from './custom';
|
|
4
5
|
declare const iconsMap: {
|
|
5
6
|
readonly google: RemixiconComponentType;
|
|
6
7
|
readonly microsoft: RemixiconComponentType;
|
|
8
|
+
readonly github: RemixiconComponentType;
|
|
9
|
+
readonly shipfox: typeof ShipfoxLogo;
|
|
10
|
+
readonly slack: typeof SlackLogo;
|
|
11
|
+
readonly stripe: typeof StripeLogo;
|
|
7
12
|
readonly badge: typeof BadgeIcon;
|
|
8
13
|
readonly checkCircleSolid: typeof CheckCircleSolidIcon;
|
|
9
14
|
readonly circleDottedLine: typeof CircleDottedLineIcon;
|
|
10
15
|
readonly componentFill: typeof ComponentFillIcon;
|
|
11
|
-
readonly
|
|
12
|
-
readonly
|
|
13
|
-
readonly resize: typeof ResizeIcon;
|
|
16
|
+
readonly componentLine: typeof ComponentLineIcon;
|
|
17
|
+
readonly ellipseMiniSolid: typeof EllipseMiniSolidIcon;
|
|
14
18
|
readonly infoTooltipFill: typeof InfoTooltipFillIcon;
|
|
19
|
+
readonly resize: typeof ResizeIcon;
|
|
15
20
|
readonly spinner: typeof SpinnerIcon;
|
|
16
|
-
readonly
|
|
17
|
-
readonly
|
|
18
|
-
readonly
|
|
19
|
-
readonly
|
|
20
|
-
readonly shipfox: typeof ShipfoxLogo;
|
|
21
|
-
readonly slack: typeof SlackLogo;
|
|
22
|
-
readonly stripe: typeof StripeLogo;
|
|
23
|
-
readonly github: RemixiconComponentType;
|
|
21
|
+
readonly thunder: typeof ThunderIcon;
|
|
22
|
+
readonly xCircleSolid: typeof XCircleSolidIcon;
|
|
23
|
+
readonly addLine: RemixiconComponentType;
|
|
24
|
+
readonly bookOpen: RemixiconComponentType;
|
|
24
25
|
readonly check: RemixiconComponentType;
|
|
25
|
-
readonly
|
|
26
|
+
readonly chevronRight: RemixiconComponentType;
|
|
27
|
+
readonly close: RemixiconComponentType;
|
|
28
|
+
readonly copy: RemixiconComponentType;
|
|
29
|
+
readonly homeSmile: RemixiconComponentType;
|
|
30
|
+
readonly imageAdd: RemixiconComponentType;
|
|
26
31
|
readonly info: RemixiconComponentType;
|
|
27
32
|
readonly money: RemixiconComponentType;
|
|
28
|
-
readonly
|
|
29
|
-
readonly copy: RemixiconComponentType;
|
|
30
|
-
readonly addLine: RemixiconComponentType;
|
|
31
|
-
readonly chevronRight: RemixiconComponentType;
|
|
32
|
-
readonly bookOpen: RemixiconComponentType;
|
|
33
|
+
readonly subtractLine: RemixiconComponentType;
|
|
33
34
|
};
|
|
34
35
|
export type IconName = keyof typeof iconsMap;
|
|
35
36
|
export declare const iconNames: IconName[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/components/icon/icon.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/components/icon/icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,sBAAsB,EAAC,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAQL,YAAY,EAOb,MAAM,kBAAkB,CAAC;AAC1B,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,SAAS,EACT,WAAW,EACX,UAAU,EACV,WAAW,EACX,gBAAgB,EACjB,MAAM,UAAU,CAAC;AAElB,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6B6C,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"}
|
|
@@ -4,32 +4,32 @@ import { BadgeIcon, CheckCircleSolidIcon, CircleDottedLineIcon, ComponentFillIco
|
|
|
4
4
|
const iconsMap = {
|
|
5
5
|
google: RiGoogleFill,
|
|
6
6
|
microsoft: RiMicrosoftFill,
|
|
7
|
+
github: RiGithubFill,
|
|
8
|
+
shipfox: ShipfoxLogo,
|
|
9
|
+
slack: SlackLogo,
|
|
10
|
+
stripe: StripeLogo,
|
|
7
11
|
badge: BadgeIcon,
|
|
8
12
|
checkCircleSolid: CheckCircleSolidIcon,
|
|
9
13
|
circleDottedLine: CircleDottedLineIcon,
|
|
10
14
|
componentFill: ComponentFillIcon,
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
resize: ResizeIcon,
|
|
15
|
+
componentLine: ComponentLineIcon,
|
|
16
|
+
ellipseMiniSolid: EllipseMiniSolidIcon,
|
|
14
17
|
infoTooltipFill: InfoTooltipFillIcon,
|
|
18
|
+
resize: ResizeIcon,
|
|
15
19
|
spinner: SpinnerIcon,
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
shipfox: ShipfoxLogo,
|
|
21
|
-
slack: SlackLogo,
|
|
22
|
-
stripe: StripeLogo,
|
|
23
|
-
github: RiGithubFill,
|
|
20
|
+
thunder: ThunderIcon,
|
|
21
|
+
xCircleSolid: XCircleSolidIcon,
|
|
22
|
+
addLine: RiAddLine,
|
|
23
|
+
bookOpen: RiBookOpenFill,
|
|
24
24
|
check: RiCheckLine,
|
|
25
|
-
|
|
25
|
+
chevronRight: RiArrowRightSLine,
|
|
26
|
+
close: RiCloseLine,
|
|
27
|
+
copy: RiFileCopyLine,
|
|
28
|
+
homeSmile: RiHomeSmileFill,
|
|
29
|
+
imageAdd: RiImageAddFill,
|
|
26
30
|
info: RiInformationFill,
|
|
27
31
|
money: RiMoneyDollarCircleLine,
|
|
28
|
-
|
|
29
|
-
copy: RiFileCopyLine,
|
|
30
|
-
addLine: RiAddLine,
|
|
31
|
-
chevronRight: RiArrowRightSLine,
|
|
32
|
-
bookOpen: RiBookOpenFill
|
|
32
|
+
subtractLine: RiSubtractLine
|
|
33
33
|
};
|
|
34
34
|
export const iconNames = Object.keys(iconsMap);
|
|
35
35
|
export function Icon({ name, ...props }) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/icon/icon.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"sources":["../../../src/components/icon/icon.tsx"],"sourcesContent":["import type {RemixiconComponentType} from '@remixicon/react';\nimport {\n RiAddLine,\n RiArrowRightSLine,\n RiBookOpenFill,\n RiCheckLine,\n RiCloseLine,\n RiFileCopyLine,\n RiGithubFill,\n RiGoogleFill,\n RiHomeSmileFill,\n RiImageAddFill,\n RiInformationFill,\n RiMicrosoftFill,\n RiMoneyDollarCircleLine,\n RiSubtractLine,\n} 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 ShipfoxLogo,\n SlackLogo,\n SpinnerIcon,\n StripeLogo,\n ThunderIcon,\n XCircleSolidIcon,\n} from './custom';\n\nconst iconsMap = {\n google: RiGoogleFill,\n microsoft: RiMicrosoftFill,\n github: RiGithubFill,\n shipfox: ShipfoxLogo,\n slack: SlackLogo,\n stripe: StripeLogo,\n badge: BadgeIcon,\n checkCircleSolid: CheckCircleSolidIcon,\n circleDottedLine: CircleDottedLineIcon,\n componentFill: ComponentFillIcon,\n componentLine: ComponentLineIcon,\n ellipseMiniSolid: EllipseMiniSolidIcon,\n infoTooltipFill: InfoTooltipFillIcon,\n resize: ResizeIcon,\n spinner: SpinnerIcon,\n thunder: ThunderIcon,\n xCircleSolid: XCircleSolidIcon,\n addLine: RiAddLine,\n bookOpen: RiBookOpenFill,\n check: RiCheckLine,\n chevronRight: RiArrowRightSLine,\n close: RiCloseLine,\n copy: RiFileCopyLine,\n homeSmile: RiHomeSmileFill,\n imageAdd: RiImageAddFill,\n info: RiInformationFill,\n money: RiMoneyDollarCircleLine,\n subtractLine: RiSubtractLine,\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":["RiAddLine","RiArrowRightSLine","RiBookOpenFill","RiCheckLine","RiCloseLine","RiFileCopyLine","RiGithubFill","RiGoogleFill","RiHomeSmileFill","RiImageAddFill","RiInformationFill","RiMicrosoftFill","RiMoneyDollarCircleLine","RiSubtractLine","BadgeIcon","CheckCircleSolidIcon","CircleDottedLineIcon","ComponentFillIcon","ComponentLineIcon","EllipseMiniSolidIcon","InfoTooltipFillIcon","ResizeIcon","ShipfoxLogo","SlackLogo","SpinnerIcon","StripeLogo","ThunderIcon","XCircleSolidIcon","iconsMap","google","microsoft","github","shipfox","slack","stripe","badge","checkCircleSolid","circleDottedLine","componentFill","componentLine","ellipseMiniSolid","infoTooltipFill","resize","spinner","thunder","xCircleSolid","addLine","bookOpen","check","chevronRight","close","copy","homeSmile","imageAdd","info","money","subtractLine","iconNames","Object","keys","Icon","name","props","IconComponent"],"mappings":";AACA,SACEA,SAAS,EACTC,iBAAiB,EACjBC,cAAc,EACdC,WAAW,EACXC,WAAW,EACXC,cAAc,EACdC,YAAY,EACZC,YAAY,EACZC,eAAe,EACfC,cAAc,EACdC,iBAAiB,EACjBC,eAAe,EACfC,uBAAuB,EACvBC,cAAc,QACT,mBAAmB;AAE1B,SACEC,SAAS,EACTC,oBAAoB,EACpBC,oBAAoB,EACpBC,iBAAiB,EACjBC,iBAAiB,EACjBC,oBAAoB,EACpBC,mBAAmB,EACnBC,UAAU,EACVC,WAAW,EACXC,SAAS,EACTC,WAAW,EACXC,UAAU,EACVC,WAAW,EACXC,gBAAgB,QACX,WAAW;AAElB,MAAMC,WAAW;IACfC,QAAQtB;IACRuB,WAAWnB;IACXoB,QAAQzB;IACR0B,SAASV;IACTW,OAAOV;IACPW,QAAQT;IACRU,OAAOrB;IACPsB,kBAAkBrB;IAClBsB,kBAAkBrB;IAClBsB,eAAerB;IACfsB,eAAerB;IACfsB,kBAAkBrB;IAClBsB,iBAAiBrB;IACjBsB,QAAQrB;IACRsB,SAASnB;IACToB,SAASlB;IACTmB,cAAclB;IACdmB,SAAS9C;IACT+C,UAAU7C;IACV8C,OAAO7C;IACP8C,cAAchD;IACdiD,OAAO9C;IACP+C,MAAM9C;IACN+C,WAAW5C;IACX6C,UAAU5C;IACV6C,MAAM5C;IACN6C,OAAO3C;IACP4C,cAAc3C;AAChB;AAGA,OAAO,MAAM4C,YAAYC,OAAOC,IAAI,CAAC/B,UAAwB;AAK7D,OAAO,SAASgC,KAAK,EAACC,IAAI,EAAE,GAAGC,OAAiB;IAC9C,MAAMC,gBAAgBnC,QAAQ,CAACiC,KAAK;IACpC,qBAAO,KAACE;QAAe,GAAGD,KAAK;;AACjC"}
|
|
@@ -4,7 +4,9 @@ export * from './badge';
|
|
|
4
4
|
export * from './button';
|
|
5
5
|
export * from './checkbox';
|
|
6
6
|
export * from './code-block';
|
|
7
|
+
export * from './dot-grid';
|
|
7
8
|
export * from './dynamic-item';
|
|
9
|
+
export * from './form';
|
|
8
10
|
export * from './icon';
|
|
9
11
|
export * from './inline-tips';
|
|
10
12
|
export * from './input';
|
|
@@ -14,5 +16,6 @@ export * from './modal';
|
|
|
14
16
|
export * from './textarea';
|
|
15
17
|
export * from './theme';
|
|
16
18
|
export * from './toast';
|
|
19
|
+
export * from './tooltip';
|
|
17
20
|
export * from './typography';
|
|
18
21
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC"}
|
package/dist/components/index.js
CHANGED
|
@@ -4,7 +4,9 @@ export * from './badge/index.js';
|
|
|
4
4
|
export * from './button/index.js';
|
|
5
5
|
export * from './checkbox/index.js';
|
|
6
6
|
export * from './code-block/index.js';
|
|
7
|
+
export * from './dot-grid/index.js';
|
|
7
8
|
export * from './dynamic-item/index.js';
|
|
9
|
+
export * from './form/index.js';
|
|
8
10
|
export * from './icon/index.js';
|
|
9
11
|
export * from './inline-tips/index.js';
|
|
10
12
|
export * from './input/index.js';
|
|
@@ -14,6 +16,7 @@ export * from './modal/index.js';
|
|
|
14
16
|
export * from './textarea/index.js';
|
|
15
17
|
export * from './theme/index.js';
|
|
16
18
|
export * from './toast/index.js';
|
|
19
|
+
export * from './tooltip/index.js';
|
|
17
20
|
export * from './typography/index.js';
|
|
18
21
|
|
|
19
22
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/index.ts"],"sourcesContent":["export * from './alert';\nexport * from './avatar';\nexport * from './badge';\nexport * from './button';\nexport * from './checkbox';\nexport * from './code-block';\nexport * from './dynamic-item';\nexport * from './icon';\nexport * from './inline-tips';\nexport * from './input';\nexport * from './item';\nexport * from './label';\nexport * from './modal';\nexport * from './textarea';\nexport * from './theme';\nexport * from './toast';\nexport * from './typography';\n"],"names":[],"mappings":"AAAA,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,aAAa;AAC3B,cAAc,eAAe;AAC7B,cAAc,iBAAiB;AAC/B,cAAc,SAAS;AACvB,cAAc,gBAAgB;AAC9B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,eAAe"}
|
|
1
|
+
{"version":3,"sources":["../../src/components/index.ts"],"sourcesContent":["export * from './alert';\nexport * from './avatar';\nexport * from './badge';\nexport * from './button';\nexport * from './checkbox';\nexport * from './code-block';\nexport * from './dot-grid';\nexport * from './dynamic-item';\nexport * from './form';\nexport * from './icon';\nexport * from './inline-tips';\nexport * from './input';\nexport * from './item';\nexport * from './label';\nexport * from './modal';\nexport * from './textarea';\nexport * from './theme';\nexport * from './toast';\nexport * from './tooltip';\nexport * from './typography';\n"],"names":[],"mappings":"AAAA,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,aAAa;AAC3B,cAAc,eAAe;AAC7B,cAAc,aAAa;AAC3B,cAAc,iBAAiB;AAC/B,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,gBAAgB;AAC9B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,cAAc,eAAe"}
|
|
@@ -2,6 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { argosScreenshot } from '@argos-ci/storybook/vitest';
|
|
3
3
|
import { Avatar } from '../components/avatar/index.js';
|
|
4
4
|
import { Button } from '../components/button/index.js';
|
|
5
|
+
import { DotGrid } from '../components/dot-grid/index.js';
|
|
5
6
|
import { Header, Text } from '../components/typography/index.js';
|
|
6
7
|
const meta = {
|
|
7
8
|
title: 'Onboarding/Signin',
|
|
@@ -19,14 +20,21 @@ export const Default = {
|
|
|
19
20
|
className: "flex min-h-screen items-center justify-center bg-background-subtle-base",
|
|
20
21
|
children: [
|
|
21
22
|
/*#__PURE__*/ _jsx("div", {
|
|
22
|
-
className: "
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
23
|
+
className: "absolute w-[800px] max-w-[800px] h-[400px] top-0 left-1/2 -translate-x-1/2 translate-y-[-145px]",
|
|
24
|
+
style: {
|
|
25
|
+
maskImage: 'radial-gradient(ellipse 100% 125% at 50% 0%, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0.5) 60%, rgba(0, 0, 0, 0) 100%)',
|
|
26
|
+
WebkitMaskImage: 'radial-gradient(ellipse 100% 125% at 50% 0%, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0.5) 60%, rgba(0, 0, 0, 0) 100%)'
|
|
27
|
+
},
|
|
28
|
+
children: /*#__PURE__*/ _jsx(DotGrid, {
|
|
29
|
+
dotSize: 2,
|
|
30
|
+
gap: 20,
|
|
31
|
+
baseColor: "#e63e00",
|
|
32
|
+
activeColor: "#FF0076",
|
|
33
|
+
proximity: 100,
|
|
34
|
+
shockRadius: 8,
|
|
35
|
+
shockStrength: 100,
|
|
36
|
+
resistance: 500,
|
|
37
|
+
returnDuration: 1.5
|
|
30
38
|
})
|
|
31
39
|
}),
|
|
32
40
|
/*#__PURE__*/ _jsxs("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/onboarding/sign-in.stories.tsx"],"sourcesContent":["import {argosScreenshot} from '@argos-ci/storybook/vitest';\nimport type {Meta, StoryObj} from '@storybook/react';\nimport {Avatar} from 'components/avatar';\nimport {Button} from 'components/button';\nimport {Header, Text} from 'components/typography';\n\nconst meta = {\n title: 'Onboarding/Signin',\n parameters: {\n layout: 'fullscreen',\n },\n} satisfies Meta;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n play: async (ctx) => {\n await argosScreenshot(ctx, 'example-screenshot');\n },\n render: () => {\n return (\n <div className=\"flex min-h-screen items-center justify-center bg-background-subtle-base\">\n {/* Background illustration - simplified decorative element */}\n <div
|
|
1
|
+
{"version":3,"sources":["../../src/onboarding/sign-in.stories.tsx"],"sourcesContent":["import {argosScreenshot} from '@argos-ci/storybook/vitest';\nimport type {Meta, StoryObj} from '@storybook/react';\nimport {Avatar} from 'components/avatar';\nimport {Button} from 'components/button';\nimport {DotGrid} from 'components/dot-grid';\nimport {Header, Text} from 'components/typography';\n\nconst meta = {\n title: 'Onboarding/Signin',\n parameters: {\n layout: 'fullscreen',\n },\n} satisfies Meta;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n play: async (ctx) => {\n await argosScreenshot(ctx, 'example-screenshot');\n },\n render: () => {\n return (\n <div className=\"flex min-h-screen items-center justify-center bg-background-subtle-base\">\n {/* Background illustration - simplified decorative element */}\n <div\n className=\"absolute w-[800px] max-w-[800px] h-[400px] top-0 left-1/2 -translate-x-1/2 translate-y-[-145px]\"\n style={{\n maskImage:\n 'radial-gradient(ellipse 100% 125% at 50% 0%, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0.5) 60%, rgba(0, 0, 0, 0) 100%)',\n WebkitMaskImage:\n 'radial-gradient(ellipse 100% 125% at 50% 0%, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0.5) 60%, rgba(0, 0, 0, 0) 100%)',\n }}\n >\n <DotGrid\n dotSize={2}\n gap={20}\n baseColor=\"#e63e00\"\n activeColor=\"#FF0076\"\n proximity={100}\n shockRadius={8}\n shockStrength={100}\n resistance={500}\n returnDuration={1.5}\n />\n </div>\n\n {/* Main content */}\n <div className=\"relative flex w-full max-w-[384px] flex-col items-center gap-32 px-24 pb-80 pt-24\">\n {/* Logo and title section */}\n <div className=\"flex flex-col items-center gap-16\">\n <Avatar content=\"logo\" size=\"xl\" radius=\"rounded\" logoName=\"shipfox\" />\n <div className=\"flex min-w-[128px] flex-col items-center gap-4 text-center\">\n <Header\n variant=\"h1\"\n className=\"text-[28px] font-medium leading-[44px] text-foreground-neutral-base\"\n >\n Connect to Shipfox\n </Header>\n <Text\n size=\"sm\"\n className=\"text-sm font-normal leading-[24px] text-foreground-neutral-subtle\"\n >\n Log in to access Shipfox.\n </Text>\n </div>\n </div>\n\n {/* Action buttons */}\n <div className=\"flex w-full flex-col gap-20\">\n <Button variant=\"primary\" size=\"md\" iconLeft=\"google\" className=\"w-full\">\n Continue with Google\n </Button>\n <Button variant=\"primary\" size=\"md\" iconLeft=\"microsoft\" className=\"w-full\">\n Continue with Microsoft\n </Button>\n <Button variant=\"transparent\" size=\"md\" className=\"w-full\">\n Connect with Enterprise SSO\n </Button>\n </div>\n </div>\n </div>\n );\n },\n};\n"],"names":["argosScreenshot","Avatar","Button","DotGrid","Header","Text","meta","title","parameters","layout","Default","play","ctx","render","div","className","style","maskImage","WebkitMaskImage","dotSize","gap","baseColor","activeColor","proximity","shockRadius","shockStrength","resistance","returnDuration","content","size","radius","logoName","variant","iconLeft"],"mappings":";AAAA,SAAQA,eAAe,QAAO,6BAA6B;AAE3D,SAAQC,MAAM,QAAO,oBAAoB;AACzC,SAAQC,MAAM,QAAO,oBAAoB;AACzC,SAAQC,OAAO,QAAO,sBAAsB;AAC5C,SAAQC,MAAM,EAAEC,IAAI,QAAO,wBAAwB;AAEnD,MAAMC,OAAO;IACXC,OAAO;IACPC,YAAY;QACVC,QAAQ;IACV;AACF;AAEA,eAAeH,KAAK;AAGpB,OAAO,MAAMI,UAAiB;IAC5BC,MAAM,OAAOC;QACX,MAAMZ,gBAAgBY,KAAK;IAC7B;IACAC,QAAQ;QACN,qBACE,MAACC;YAAIC,WAAU;;8BAEb,KAACD;oBACCC,WAAU;oBACVC,OAAO;wBACLC,WACE;wBACFC,iBACE;oBACJ;8BAEA,cAAA,KAACf;wBACCgB,SAAS;wBACTC,KAAK;wBACLC,WAAU;wBACVC,aAAY;wBACZC,WAAW;wBACXC,aAAa;wBACbC,eAAe;wBACfC,YAAY;wBACZC,gBAAgB;;;8BAKpB,MAACb;oBAAIC,WAAU;;sCAEb,MAACD;4BAAIC,WAAU;;8CACb,KAACd;oCAAO2B,SAAQ;oCAAOC,MAAK;oCAAKC,QAAO;oCAAUC,UAAS;;8CAC3D,MAACjB;oCAAIC,WAAU;;sDACb,KAACX;4CACC4B,SAAQ;4CACRjB,WAAU;sDACX;;sDAGD,KAACV;4CACCwB,MAAK;4CACLd,WAAU;sDACX;;;;;;sCAOL,MAACD;4BAAIC,WAAU;;8CACb,KAACb;oCAAO8B,SAAQ;oCAAUH,MAAK;oCAAKI,UAAS;oCAASlB,WAAU;8CAAS;;8CAGzE,KAACb;oCAAO8B,SAAQ;oCAAUH,MAAK;oCAAKI,UAAS;oCAAYlB,WAAU;8CAAS;;8CAG5E,KAACb;oCAAO8B,SAAQ;oCAAcH,MAAK;oCAAKd,WAAU;8CAAS;;;;;;;;IAOrE;AACF,EAAE"}
|