ndcloud-storybook 1.0.0 → 1.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/dist/index.cjs +21 -4
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +7 -1
- package/dist/index.d.ts +7 -1
- package/dist/index.js +21 -5
- package/dist/index.js.map +1 -1
- package/package.json +4 -4
package/dist/index.cjs
CHANGED
|
@@ -53,6 +53,12 @@ var Spinner = ({
|
|
|
53
53
|
}
|
|
54
54
|
) });
|
|
55
55
|
var Spinner_default = Spinner;
|
|
56
|
+
var Variant = /* @__PURE__ */ ((Variant2) => {
|
|
57
|
+
Variant2["Primary"] = "primary";
|
|
58
|
+
Variant2["Secondary"] = "secondary";
|
|
59
|
+
Variant2["Outline"] = "outline";
|
|
60
|
+
return Variant2;
|
|
61
|
+
})(Variant || {});
|
|
56
62
|
var VARIANTS = {
|
|
57
63
|
primary: {
|
|
58
64
|
background: "linear-gradient(90deg, #6D65DA 0.08%, #55A3BD 68.44%)",
|
|
@@ -109,13 +115,24 @@ var Button = ({
|
|
|
109
115
|
icon,
|
|
110
116
|
loading,
|
|
111
117
|
disabled,
|
|
118
|
+
className,
|
|
112
119
|
...rest
|
|
113
|
-
}) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
120
|
+
}) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
121
|
+
StyledButton,
|
|
122
|
+
{
|
|
123
|
+
label: "",
|
|
124
|
+
disabled: disabled || loading,
|
|
125
|
+
className,
|
|
126
|
+
...rest,
|
|
127
|
+
children: loading ? /* @__PURE__ */ jsxRuntime.jsx(Spinner_default, {}) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
128
|
+
icon && /* @__PURE__ */ jsxRuntime.jsx("span", { children: icon }),
|
|
129
|
+
label
|
|
130
|
+
] })
|
|
131
|
+
}
|
|
132
|
+
);
|
|
117
133
|
var Button_default = Button;
|
|
118
134
|
|
|
119
135
|
exports.Button = Button_default;
|
|
136
|
+
exports.Variant = Variant;
|
|
120
137
|
//# sourceMappingURL=index.cjs.map
|
|
121
138
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/atoms/Spinner/Spinner.tsx","../src/atoms/Button/Button.tsx"],"names":["keyframes","styled","jsx","jsxs","css","Fragment"],"mappings":";;;;;;;;;;;AAYA,IAAM,IAAA,GAAOA,eAAA;AAAA;AAAA;AAAA,CAAA;AAKb,IAAM,UAAUC,uBAAA,CAAO,GAAA;AAAA;AAAA;AAAA;;AAAA;AAAA,WAAA,EAMV,CAAC,EAAE,IAAA,GAAO,EAAA,OAAS,IAAI,CAAA;AAAA,YAAA,EACtB,CAAC,EAAE,IAAA,GAAO,EAAA,OAAS,IAAI,CAAA;AAAA,eAAA,EACpB,IAAI,CAAA,CAAA,EAAI,CAAC,EAAE,KAAA,GAAQ,OAAA,OAAc,KAAK,CAAA;AAAA;AAAA;AAAA,CAAA;AAKvD,IAAM,UAAkC,CAAC;AAAA,EACvC,IAAA,GAAO,EAAA;AAAA,EACP,KAAA,GAAQ,OAAA;AAAA,EACR,OAAA,GAAU,SAAA;AAAA,EACV,OAAA,GAAU;AACZ,CAAA,qBACEC,cAAA,CAAC,OAAA,EAAA,EAAQ,IAAA,EAAY,KAAA,EACnB,QAAA,kBAAAC,eAAA;AAAA,EAAC,KAAA;AAAA,EAAA;AAAA,IACC,OAAA,EAAQ,WAAA;AAAA,IACR,IAAA,EAAK,MAAA;AAAA,IACL,KAAA,EAAM,4BAAA;AAAA,IACN,IAAA,EAAK,QAAA;AAAA,IACL,YAAA,EAAW,SAAA;AAAA,IAEX,QAAA,EAAA;AAAA,sBAAAD,cAAA,CAAC,QAAA,EAAA,EAAO,EAAA,EAAG,IAAA,EAAK,EAAA,EAAG,IAAA,EAAK,GAAE,IAAA,EAAK,MAAA,EAAQ,OAAA,EAAS,WAAA,EAAY,GAAA,EAAI,CAAA;AAAA,sBAChEA,cAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,CAAA,EAAE,0BAAA;AAAA,UACF,MAAA,EAAQ,OAAA;AAAA,UACR,WAAA,EAAY,GAAA;AAAA,UACZ,aAAA,EAAc;AAAA;AAAA;AAChB;AAAA;AACF,CAAA,EACF,CAAA;AAGF,IAAO,eAAA,GAAQ,OAAA;AC/
|
|
1
|
+
{"version":3,"sources":["../src/atoms/Spinner/Spinner.tsx","../src/atoms/Button/Button.tsx"],"names":["keyframes","styled","jsx","jsxs","Variant","css","Fragment"],"mappings":"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","file":"index.cjs","sourcesContent":["/** @jsxImportSource @emotion/react */\nimport React from \"react\";\nimport { keyframes } from \"@emotion/react\";\nimport styled from \"@emotion/styled\";\n\ninterface SpinnerProps {\n size?: number;\n speed?: string;\n bgColor?: string;\n fgColor?: string;\n}\n\nconst spin = keyframes`\n from { transform: rotate(0deg); }\n to { transform: rotate(360deg); }\n`;\n\nconst Wrapper = styled.div<SpinnerProps>`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n svg {\n width: ${({ size = 20 }) => size}px;\n height: ${({ size = 20 }) => size}px;\n animation: ${spin} ${({ speed = \"0.75s\" }) => speed} linear infinite;\n transform-origin: center;\n }\n`;\n\nconst Spinner: React.FC<SpinnerProps> = ({\n size = 20,\n speed = \"0.75s\",\n bgColor = \"#D1D5DB\",\n fgColor = \"#FFFFFF\",\n}) => (\n <Wrapper size={size} speed={speed}>\n <svg\n viewBox=\"0 0 50 50\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n role=\"status\"\n aria-label=\"loading\"\n >\n <circle cx=\"25\" cy=\"25\" r=\"20\" stroke={bgColor} strokeWidth=\"5\" />\n <path\n d=\"M45 25a20 20 0 0 1-20 20\"\n stroke={fgColor}\n strokeWidth=\"5\"\n strokeLinecap=\"round\"\n />\n </svg>\n </Wrapper>\n);\n\nexport default Spinner;\n","/** @jsxImportSource @emotion/react */\nimport { css } from \"@emotion/react\";\nimport styled from \"@emotion/styled\";\nimport React, { ReactNode } from \"react\";\nimport Spinner from \"../Spinner/Spinner\";\n\ntype VariantName = \"primary\" | \"secondary\" | \"outline\";\n\nexport enum Variant {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Outline = \"outline\",\n}\n\ninterface VariantStyle {\n background: string;\n color?: string;\n border?: string;\n}\n\nexport interface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n label: string;\n variant?: VariantName;\n disabled?: boolean;\n selected?: boolean;\n icon?: ReactNode;\n loading?: boolean;\n className?: string;\n}\n\nconst VARIANTS: Record<VariantName, VariantStyle> = {\n primary: {\n background: \"linear-gradient(90deg, #6D65DA 0.08%, #55A3BD 68.44%)\",\n color: \"#FFF\",\n },\n secondary: {\n background: \"#6D65DA\",\n color: \"#FFF\",\n },\n outline: {\n background: \"transparent\",\n border: \"1px solid rgba(70, 70, 74, 0.10)\",\n color: \"#0E1116D9\",\n },\n};\n\nconst StyledButton = styled.button<ButtonProps>`\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 12px 20px;\n border-radius: 100px;\n font-weight: 500;\n font-family: \"ABCFavoritExtended\", sans-serif;\n transition: all 0.2s ease;\n width: 100%;\n max-width: 336px;\n\n span {\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 8px;\n }\n\n ${({ variant = \"primary\", disabled, selected }) => {\n const { background, color, border } = VARIANTS[variant];\n return css`\n background: ${background};\n border: ${selected ? \"2px solid #FFF\" : border || \"none\"};\n color: ${color || \"#FFF\"};\n opacity: ${disabled ? 0.5 : 1};\n cursor: ${disabled ? \"not-allowed\" : \"pointer\"};\n pointer-events: ${disabled ? \"none\" : \"auto\"};\n\n &:focus-visible {\n outline: 2px solid #0070f3;\n outline-offset: 2px;\n }\n `;\n }}\n`;\n\nconst Button: React.FC<ButtonProps> = ({\n label,\n icon,\n loading,\n disabled,\n className,\n ...rest\n}) => (\n <StyledButton\n label={\"\"}\n disabled={disabled || loading}\n className={className}\n {...rest}\n >\n {loading ? (\n <Spinner />\n ) : (\n <>\n {icon && <span>{icon}</span>}\n {label}\n </>\n )}\n </StyledButton>\n);\n\nexport default Button;\n"]}
|
package/dist/index.d.cts
CHANGED
|
@@ -1,6 +1,11 @@
|
|
|
1
1
|
import React, { ReactNode } from 'react';
|
|
2
2
|
|
|
3
3
|
type VariantName = "primary" | "secondary" | "outline";
|
|
4
|
+
declare enum Variant {
|
|
5
|
+
Primary = "primary",
|
|
6
|
+
Secondary = "secondary",
|
|
7
|
+
Outline = "outline"
|
|
8
|
+
}
|
|
4
9
|
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
5
10
|
label: string;
|
|
6
11
|
variant?: VariantName;
|
|
@@ -8,7 +13,8 @@ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
|
8
13
|
selected?: boolean;
|
|
9
14
|
icon?: ReactNode;
|
|
10
15
|
loading?: boolean;
|
|
16
|
+
className?: string;
|
|
11
17
|
}
|
|
12
18
|
declare const Button: React.FC<ButtonProps>;
|
|
13
19
|
|
|
14
|
-
export { Button };
|
|
20
|
+
export { Button, type ButtonProps, Variant };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,11 @@
|
|
|
1
1
|
import React, { ReactNode } from 'react';
|
|
2
2
|
|
|
3
3
|
type VariantName = "primary" | "secondary" | "outline";
|
|
4
|
+
declare enum Variant {
|
|
5
|
+
Primary = "primary",
|
|
6
|
+
Secondary = "secondary",
|
|
7
|
+
Outline = "outline"
|
|
8
|
+
}
|
|
4
9
|
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
5
10
|
label: string;
|
|
6
11
|
variant?: VariantName;
|
|
@@ -8,7 +13,8 @@ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
|
8
13
|
selected?: boolean;
|
|
9
14
|
icon?: ReactNode;
|
|
10
15
|
loading?: boolean;
|
|
16
|
+
className?: string;
|
|
11
17
|
}
|
|
12
18
|
declare const Button: React.FC<ButtonProps>;
|
|
13
19
|
|
|
14
|
-
export { Button };
|
|
20
|
+
export { Button, type ButtonProps, Variant };
|
package/dist/index.js
CHANGED
|
@@ -47,6 +47,12 @@ var Spinner = ({
|
|
|
47
47
|
}
|
|
48
48
|
) });
|
|
49
49
|
var Spinner_default = Spinner;
|
|
50
|
+
var Variant = /* @__PURE__ */ ((Variant2) => {
|
|
51
|
+
Variant2["Primary"] = "primary";
|
|
52
|
+
Variant2["Secondary"] = "secondary";
|
|
53
|
+
Variant2["Outline"] = "outline";
|
|
54
|
+
return Variant2;
|
|
55
|
+
})(Variant || {});
|
|
50
56
|
var VARIANTS = {
|
|
51
57
|
primary: {
|
|
52
58
|
background: "linear-gradient(90deg, #6D65DA 0.08%, #55A3BD 68.44%)",
|
|
@@ -103,13 +109,23 @@ var Button = ({
|
|
|
103
109
|
icon,
|
|
104
110
|
loading,
|
|
105
111
|
disabled,
|
|
112
|
+
className,
|
|
106
113
|
...rest
|
|
107
|
-
}) => /* @__PURE__ */ jsx(
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
114
|
+
}) => /* @__PURE__ */ jsx(
|
|
115
|
+
StyledButton,
|
|
116
|
+
{
|
|
117
|
+
label: "",
|
|
118
|
+
disabled: disabled || loading,
|
|
119
|
+
className,
|
|
120
|
+
...rest,
|
|
121
|
+
children: loading ? /* @__PURE__ */ jsx(Spinner_default, {}) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
122
|
+
icon && /* @__PURE__ */ jsx("span", { children: icon }),
|
|
123
|
+
label
|
|
124
|
+
] })
|
|
125
|
+
}
|
|
126
|
+
);
|
|
111
127
|
var Button_default = Button;
|
|
112
128
|
|
|
113
|
-
export { Button_default as Button };
|
|
129
|
+
export { Button_default as Button, Variant };
|
|
114
130
|
//# sourceMappingURL=index.js.map
|
|
115
131
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/atoms/Spinner/Spinner.tsx","../src/atoms/Button/Button.tsx"],"names":["styled","jsx","jsxs"],"mappings":";;;;;AAYA,IAAM,IAAA,GAAO,SAAA;AAAA;AAAA;AAAA,CAAA;AAKb,IAAM,UAAU,MAAA,CAAO,GAAA;AAAA;AAAA;AAAA;;AAAA;AAAA,WAAA,EAMV,CAAC,EAAE,IAAA,GAAO,EAAA,OAAS,IAAI,CAAA;AAAA,YAAA,EACtB,CAAC,EAAE,IAAA,GAAO,EAAA,OAAS,IAAI,CAAA;AAAA,eAAA,EACpB,IAAI,CAAA,CAAA,EAAI,CAAC,EAAE,KAAA,GAAQ,OAAA,OAAc,KAAK,CAAA;AAAA;AAAA;AAAA,CAAA;AAKvD,IAAM,UAAkC,CAAC;AAAA,EACvC,IAAA,GAAO,EAAA;AAAA,EACP,KAAA,GAAQ,OAAA;AAAA,EACR,OAAA,GAAU,SAAA;AAAA,EACV,OAAA,GAAU;AACZ,CAAA,qBACE,GAAA,CAAC,OAAA,EAAA,EAAQ,IAAA,EAAY,KAAA,EACnB,QAAA,kBAAA,IAAA;AAAA,EAAC,KAAA;AAAA,EAAA;AAAA,IACC,OAAA,EAAQ,WAAA;AAAA,IACR,IAAA,EAAK,MAAA;AAAA,IACL,KAAA,EAAM,4BAAA;AAAA,IACN,IAAA,EAAK,QAAA;AAAA,IACL,YAAA,EAAW,SAAA;AAAA,IAEX,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,QAAA,EAAA,EAAO,EAAA,EAAG,IAAA,EAAK,EAAA,EAAG,IAAA,EAAK,GAAE,IAAA,EAAK,MAAA,EAAQ,OAAA,EAAS,WAAA,EAAY,GAAA,EAAI,CAAA;AAAA,sBAChE,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,CAAA,EAAE,0BAAA;AAAA,UACF,MAAA,EAAQ,OAAA;AAAA,UACR,WAAA,EAAY,GAAA;AAAA,UACZ,aAAA,EAAc;AAAA;AAAA;AAChB;AAAA;AACF,CAAA,EACF,CAAA;AAGF,IAAO,eAAA,GAAQ,OAAA;AC/
|
|
1
|
+
{"version":3,"sources":["../src/atoms/Spinner/Spinner.tsx","../src/atoms/Button/Button.tsx"],"names":["Variant","styled","jsx","jsxs"],"mappings":"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","file":"index.js","sourcesContent":["/** @jsxImportSource @emotion/react */\nimport React from \"react\";\nimport { keyframes } from \"@emotion/react\";\nimport styled from \"@emotion/styled\";\n\ninterface SpinnerProps {\n size?: number;\n speed?: string;\n bgColor?: string;\n fgColor?: string;\n}\n\nconst spin = keyframes`\n from { transform: rotate(0deg); }\n to { transform: rotate(360deg); }\n`;\n\nconst Wrapper = styled.div<SpinnerProps>`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n svg {\n width: ${({ size = 20 }) => size}px;\n height: ${({ size = 20 }) => size}px;\n animation: ${spin} ${({ speed = \"0.75s\" }) => speed} linear infinite;\n transform-origin: center;\n }\n`;\n\nconst Spinner: React.FC<SpinnerProps> = ({\n size = 20,\n speed = \"0.75s\",\n bgColor = \"#D1D5DB\",\n fgColor = \"#FFFFFF\",\n}) => (\n <Wrapper size={size} speed={speed}>\n <svg\n viewBox=\"0 0 50 50\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n role=\"status\"\n aria-label=\"loading\"\n >\n <circle cx=\"25\" cy=\"25\" r=\"20\" stroke={bgColor} strokeWidth=\"5\" />\n <path\n d=\"M45 25a20 20 0 0 1-20 20\"\n stroke={fgColor}\n strokeWidth=\"5\"\n strokeLinecap=\"round\"\n />\n </svg>\n </Wrapper>\n);\n\nexport default Spinner;\n","/** @jsxImportSource @emotion/react */\nimport { css } from \"@emotion/react\";\nimport styled from \"@emotion/styled\";\nimport React, { ReactNode } from \"react\";\nimport Spinner from \"../Spinner/Spinner\";\n\ntype VariantName = \"primary\" | \"secondary\" | \"outline\";\n\nexport enum Variant {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Outline = \"outline\",\n}\n\ninterface VariantStyle {\n background: string;\n color?: string;\n border?: string;\n}\n\nexport interface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n label: string;\n variant?: VariantName;\n disabled?: boolean;\n selected?: boolean;\n icon?: ReactNode;\n loading?: boolean;\n className?: string;\n}\n\nconst VARIANTS: Record<VariantName, VariantStyle> = {\n primary: {\n background: \"linear-gradient(90deg, #6D65DA 0.08%, #55A3BD 68.44%)\",\n color: \"#FFF\",\n },\n secondary: {\n background: \"#6D65DA\",\n color: \"#FFF\",\n },\n outline: {\n background: \"transparent\",\n border: \"1px solid rgba(70, 70, 74, 0.10)\",\n color: \"#0E1116D9\",\n },\n};\n\nconst StyledButton = styled.button<ButtonProps>`\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 12px 20px;\n border-radius: 100px;\n font-weight: 500;\n font-family: \"ABCFavoritExtended\", sans-serif;\n transition: all 0.2s ease;\n width: 100%;\n max-width: 336px;\n\n span {\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 8px;\n }\n\n ${({ variant = \"primary\", disabled, selected }) => {\n const { background, color, border } = VARIANTS[variant];\n return css`\n background: ${background};\n border: ${selected ? \"2px solid #FFF\" : border || \"none\"};\n color: ${color || \"#FFF\"};\n opacity: ${disabled ? 0.5 : 1};\n cursor: ${disabled ? \"not-allowed\" : \"pointer\"};\n pointer-events: ${disabled ? \"none\" : \"auto\"};\n\n &:focus-visible {\n outline: 2px solid #0070f3;\n outline-offset: 2px;\n }\n `;\n }}\n`;\n\nconst Button: React.FC<ButtonProps> = ({\n label,\n icon,\n loading,\n disabled,\n className,\n ...rest\n}) => (\n <StyledButton\n label={\"\"}\n disabled={disabled || loading}\n className={className}\n {...rest}\n >\n {loading ? (\n <Spinner />\n ) : (\n <>\n {icon && <span>{icon}</span>}\n {label}\n </>\n )}\n </StyledButton>\n);\n\nexport default Button;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ndcloud-storybook",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.1",
|
|
4
4
|
"description": "",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"type": "module",
|
|
@@ -15,7 +15,9 @@
|
|
|
15
15
|
},
|
|
16
16
|
"./*": "./dist/*"
|
|
17
17
|
},
|
|
18
|
-
"files": [
|
|
18
|
+
"files": [
|
|
19
|
+
"dist"
|
|
20
|
+
],
|
|
19
21
|
"sideEffects": false,
|
|
20
22
|
"scripts": {
|
|
21
23
|
"build": "tsup --tsconfig tsconfig.build.json",
|
|
@@ -25,11 +27,9 @@
|
|
|
25
27
|
"storybook": "storybook dev -p 6006",
|
|
26
28
|
"build-storybook": "storybook build",
|
|
27
29
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
28
|
-
|
|
29
30
|
"release:patch": "git pull --rebase && npm ci && npm run build && npm version patch -m \"chore(release): %s\" && npm publish --access public && git push && git push --tags",
|
|
30
31
|
"release:minor": "git pull --rebase && npm ci && npm run build && npm version minor -m \"chore(release): %s\" && npm publish --access public && git push && git push --tags",
|
|
31
32
|
"release:major": "git pull --rebase && npm ci && npm run build && npm version major -m \"chore(release): %s\" && npm publish --access public && git push && git push --tags"
|
|
32
|
-
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
35
|
"react": ">=18",
|