@shipfox/react-ui 0.13.0 → 0.14.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/.turbo/turbo-build.log +5 -5
- package/.turbo/turbo-check.log +2 -2
- package/.turbo/turbo-type.log +1 -1
- package/CHANGELOG.md +6 -0
- package/dist/components/code-block/code-block-footer.d.ts.map +1 -1
- package/dist/components/code-block/code-block-footer.js +11 -5
- package/dist/components/code-block/code-block-footer.js.map +1 -1
- package/dist/components/confetti/confetti.d.ts +21 -0
- package/dist/components/confetti/confetti.d.ts.map +1 -0
- package/dist/components/confetti/confetti.js +101 -0
- package/dist/components/confetti/confetti.js.map +1 -0
- package/dist/components/confetti/confetti.stories.js +41 -0
- package/dist/components/confetti/confetti.stories.js.map +1 -0
- package/dist/components/confetti/index.d.ts +2 -0
- package/dist/components/confetti/index.d.ts.map +1 -0
- package/dist/components/confetti/index.js +3 -0
- package/dist/components/confetti/index.js.map +1 -0
- package/dist/components/icon/icon.d.ts +3 -2
- package/dist/components/icon/icon.d.ts.map +1 -1
- package/dist/components/icon/icon.js +7 -2
- package/dist/components/icon/icon.js.map +1 -1
- package/dist/components/index.d.ts +2 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +2 -0
- package/dist/components/index.js.map +1 -1
- package/dist/components/modal/modal.stories.js +227 -168
- package/dist/components/modal/modal.stories.js.map +1 -1
- package/dist/components/shiny-text/index.d.ts +2 -0
- package/dist/components/shiny-text/index.d.ts.map +1 -0
- package/dist/components/shiny-text/index.js +3 -0
- package/dist/components/shiny-text/index.js.map +1 -0
- package/dist/components/shiny-text/shiny-text.d.ts +10 -0
- package/dist/components/shiny-text/shiny-text.d.ts.map +1 -0
- package/dist/components/shiny-text/shiny-text.js +17 -0
- package/dist/components/shiny-text/shiny-text.js.map +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/index.css +31 -0
- package/package.json +4 -1
- package/src/components/code-block/code-block-footer.tsx +12 -2
- package/src/components/confetti/confetti.stories.tsx +38 -0
- package/src/components/confetti/confetti.tsx +140 -0
- package/src/components/confetti/index.ts +1 -0
- package/src/components/icon/icon.tsx +7 -3
- package/src/components/index.ts +2 -0
- package/src/components/modal/modal.stories.tsx +58 -4
- package/src/components/shiny-text/index.ts +1 -0
- package/src/components/shiny-text/shiny-text.tsx +21 -0
- package/src/index.ts +1 -0
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
WARN Issue while reading "/runner/_work/tooling/tooling/.npmrc". Failed to replace env in config: ${NPM_ACCESS_TOKEN}
|
|
2
2
|
|
|
3
|
-
> @shipfox/react-ui@0.
|
|
3
|
+
> @shipfox/react-ui@0.14.0 build /runner/_work/tooling/tooling/libs/react/ui
|
|
4
4
|
> swc && pnpm run build:css
|
|
5
5
|
|
|
6
|
-
Successfully compiled:
|
|
6
|
+
Successfully compiled: 141 files with swc (415.03ms)
|
|
7
7
|
WARN Issue while reading "/runner/_work/tooling/tooling/.npmrc". Failed to replace env in config: ${NPM_ACCESS_TOKEN}
|
|
8
8
|
|
|
9
|
-
> @shipfox/react-ui@0.
|
|
9
|
+
> @shipfox/react-ui@0.14.0 build:css /runner/_work/tooling/tooling/libs/react/ui
|
|
10
10
|
> vite build --config vite.css.config.ts && rm -f dist/css-entry.js dist/css-entry.js.map
|
|
11
11
|
|
|
12
12
|
[36mvite v7.2.7 [32mbuilding client environment for production...[36m[39m
|
|
@@ -14,6 +14,6 @@ transforming...
|
|
|
14
14
|
[32m✓[39m 2 modules transformed.
|
|
15
15
|
rendering chunks...
|
|
16
16
|
computing gzip size...
|
|
17
|
-
[2mdist/[22m[35mstyles.css [39m[1m[2m92.
|
|
17
|
+
[2mdist/[22m[35mstyles.css [39m[1m[2m92.87 kB[22m[1m[22m[2m │ gzip: 14.70 kB[22m
|
|
18
18
|
[2mdist/[22m[36mcss-entry.js [39m[1m[2m 0.00 kB[22m[1m[22m[2m │ gzip: 0.02 kB[22m
|
|
19
|
-
[32m✓ built in
|
|
19
|
+
[32m✓ built in 599ms[39m
|
package/.turbo/turbo-check.log
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
WARN Issue while reading "/runner/_work/tooling/tooling/.npmrc". Failed to replace env in config: ${NPM_ACCESS_TOKEN}
|
|
2
2
|
|
|
3
|
-
> @shipfox/react-ui@0.
|
|
3
|
+
> @shipfox/react-ui@0.14.0 check /runner/_work/tooling/tooling/libs/react/ui
|
|
4
4
|
> biome-check --fix
|
|
5
5
|
|
|
6
|
-
Checked
|
|
6
|
+
Checked 160 files in 291ms. No fixes applied.
|
package/.turbo/turbo-type.log
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
WARN Issue while reading "/runner/_work/tooling/tooling/.npmrc". Failed to replace env in config: ${NPM_ACCESS_TOKEN}
|
|
2
2
|
|
|
3
|
-
> @shipfox/react-ui@0.
|
|
3
|
+
> @shipfox/react-ui@0.14.0 type /runner/_work/tooling/tooling/libs/react/ui
|
|
4
4
|
> tsc-emit
|
|
5
5
|
|
package/CHANGELOG.md
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"code-block-footer.d.ts","sourceRoot":"","sources":["../../../src/components/code-block/code-block-footer.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"code-block-footer.d.ts","sourceRoot":"","sources":["../../../src/components/code-block/code-block-footer.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,cAAc,EAAE,cAAc,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAIrE,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IAClE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC3B,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,CAAC;AAEF,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,OAAe,EACf,KAAiB,EACjB,OAAO,EACP,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,oBAAoB,2CAkDtB;AAED,MAAM,MAAM,wBAAwB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC7D,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,OAAe,EACf,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,wBAAwB,2CAY1B;AAED,MAAM,MAAM,2BAA2B,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAChE,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,sBAAsB,CAAC,EACrC,SAAS,EACT,OAAe,EACf,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,2BAA2B,2CAY7B;AAED,MAAM,MAAM,2BAA2B,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAChE,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,sBAAsB,CAAC,EACrC,SAAS,EACT,OAAe,EACf,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,2BAA2B,2CAuB7B;AAED,MAAM,MAAM,+BAA+B,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,0BAA0B,CAAC,EACzC,SAAS,EACT,OAAe,EACf,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,+BAA+B,2CAuBjC"}
|
|
@@ -1,14 +1,17 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Slot } from '@radix-ui/react-slot';
|
|
3
3
|
import { Icon } from '../../components/icon/icon.js';
|
|
4
|
+
import { ShinyText } from '../../components/shiny-text/index.js';
|
|
4
5
|
import { Text } from '../../components/typography/index.js';
|
|
6
|
+
import { ShipfoxLoader } from 'shipfox-loader-react';
|
|
5
7
|
import { cn } from '../../utils/cn.js';
|
|
6
8
|
export function CodeBlockFooter({ className, asChild = false, state = 'running', message, description, icon, children, ...props }) {
|
|
7
9
|
const Comp = asChild ? Slot : 'div';
|
|
8
|
-
const defaultIcon = icon ?? (state === 'running' ? /*#__PURE__*/ _jsx(
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
10
|
+
const defaultIcon = icon ?? (state === 'running' ? /*#__PURE__*/ _jsx(ShipfoxLoader, {
|
|
11
|
+
size: 20,
|
|
12
|
+
animation: "circular",
|
|
13
|
+
color: "white",
|
|
14
|
+
background: "dark"
|
|
12
15
|
}) : /*#__PURE__*/ _jsx(Icon, {
|
|
13
16
|
name: "checkCircleSolid",
|
|
14
17
|
className: "size-20 text-foreground-neutral-base",
|
|
@@ -34,7 +37,10 @@ export function CodeBlockFooter({ className, asChild = false, state = 'running',
|
|
|
34
37
|
(message || description) && /*#__PURE__*/ _jsxs(CodeBlockFooterContent, {
|
|
35
38
|
children: [
|
|
36
39
|
message && /*#__PURE__*/ _jsx(CodeBlockFooterMessage, {
|
|
37
|
-
children: message
|
|
40
|
+
children: state === 'running' && typeof message === 'string' ? /*#__PURE__*/ _jsx(ShinyText, {
|
|
41
|
+
text: message,
|
|
42
|
+
speed: 3
|
|
43
|
+
}) : message
|
|
38
44
|
}),
|
|
39
45
|
description && /*#__PURE__*/ _jsx(CodeBlockFooterDescription, {
|
|
40
46
|
children: description
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/code-block/code-block-footer.tsx"],"sourcesContent":["import {Slot} from '@radix-ui/react-slot';\nimport {Icon} from 'components/icon/icon';\nimport {Text} from 'components/typography';\nimport type {ComponentProps, HTMLAttributes, ReactNode} from 'react';\nimport {cn} from 'utils/cn';\n\nexport type CodeBlockFooterProps = HTMLAttributes<HTMLDivElement> & {\n asChild?: boolean;\n state?: 'running' | 'done';\n message?: ReactNode;\n description?: ReactNode;\n icon?: ReactNode;\n};\n\nexport function CodeBlockFooter({\n className,\n asChild = false,\n state = 'running',\n message,\n description,\n icon,\n children,\n ...props\n}: CodeBlockFooterProps) {\n const Comp = asChild ? Slot : 'div';\n\n const defaultIcon =\n icon ??\n (state === 'running' ? (\n <
|
|
1
|
+
{"version":3,"sources":["../../../src/components/code-block/code-block-footer.tsx"],"sourcesContent":["import {Slot} from '@radix-ui/react-slot';\nimport {Icon} from 'components/icon/icon';\nimport {ShinyText} from 'components/shiny-text';\nimport {Text} from 'components/typography';\nimport type {ComponentProps, HTMLAttributes, ReactNode} from 'react';\nimport {ShipfoxLoader} from 'shipfox-loader-react';\nimport {cn} from 'utils/cn';\n\nexport type CodeBlockFooterProps = HTMLAttributes<HTMLDivElement> & {\n asChild?: boolean;\n state?: 'running' | 'done';\n message?: ReactNode;\n description?: ReactNode;\n icon?: ReactNode;\n};\n\nexport function CodeBlockFooter({\n className,\n asChild = false,\n state = 'running',\n message,\n description,\n icon,\n children,\n ...props\n}: CodeBlockFooterProps) {\n const Comp = asChild ? Slot : 'div';\n\n const defaultIcon =\n icon ??\n (state === 'running' ? (\n <ShipfoxLoader size={20} animation=\"circular\" color=\"white\" background=\"dark\" />\n ) : (\n <Icon\n name=\"checkCircleSolid\"\n className=\"size-20 text-foreground-neutral-base\"\n aria-hidden=\"true\"\n />\n ));\n\n if (asChild || children) {\n return (\n <Comp\n data-slot=\"code-block-footer\"\n className={cn('flex w-full items-center justify-start gap-12 px-16 py-12', className)}\n {...props}\n >\n {children}\n </Comp>\n );\n }\n\n return (\n <Comp\n data-slot=\"code-block-footer\"\n className={cn('flex w-full items-center justify-start gap-12 px-16 py-12', className)}\n {...props}\n >\n <CodeBlockFooterIcon className=\"text-tag-success-icon\">{defaultIcon}</CodeBlockFooterIcon>\n {(message || description) && (\n <CodeBlockFooterContent>\n {message && (\n <CodeBlockFooterMessage>\n {state === 'running' && typeof message === 'string' ? (\n <ShinyText text={message} speed={3} />\n ) : (\n message\n )}\n </CodeBlockFooterMessage>\n )}\n {description && <CodeBlockFooterDescription>{description}</CodeBlockFooterDescription>}\n </CodeBlockFooterContent>\n )}\n </Comp>\n );\n}\n\nexport type CodeBlockFooterIconProps = ComponentProps<'div'> & {\n asChild?: boolean;\n};\n\nexport function CodeBlockFooterIcon({\n className,\n asChild = false,\n children,\n ...props\n}: CodeBlockFooterIconProps) {\n const Comp = asChild ? Slot : 'div';\n\n return (\n <Comp\n data-slot=\"code-block-footer-icon\"\n className={cn('flex shrink-0 items-center justify-center size-20', className)}\n {...props}\n >\n {children}\n </Comp>\n );\n}\n\nexport type CodeBlockFooterContentProps = ComponentProps<'div'> & {\n asChild?: boolean;\n};\n\nexport function CodeBlockFooterContent({\n className,\n asChild = false,\n children,\n ...props\n}: CodeBlockFooterContentProps) {\n const Comp = asChild ? Slot : 'div';\n\n return (\n <Comp\n data-slot=\"code-block-footer-content\"\n className={cn('flex flex-col items-start justify-center gap-0 min-w-0 flex-1', className)}\n {...props}\n >\n {children}\n </Comp>\n );\n}\n\nexport type CodeBlockFooterMessageProps = ComponentProps<'div'> & {\n asChild?: boolean;\n};\n\nexport function CodeBlockFooterMessage({\n className,\n asChild = false,\n children,\n ...props\n}: CodeBlockFooterMessageProps) {\n if (asChild) {\n return (\n <Slot\n data-slot=\"code-block-footer-message\"\n className={cn('overflow-hidden text-ellipsis whitespace-nowrap text-xs', className)}\n {...props}\n >\n {children}\n </Slot>\n );\n }\n\n return (\n <Text\n data-slot=\"code-block-footer-message\"\n size=\"xs\"\n className={cn('overflow-hidden text-ellipsis whitespace-nowrap', className)}\n {...props}\n >\n {children}\n </Text>\n );\n}\n\nexport type CodeBlockFooterDescriptionProps = ComponentProps<'div'> & {\n asChild?: boolean;\n};\n\nexport function CodeBlockFooterDescription({\n className,\n asChild = false,\n children,\n ...props\n}: CodeBlockFooterDescriptionProps) {\n if (asChild) {\n return (\n <Slot\n data-slot=\"code-block-footer-description\"\n className={cn('text-xs text-foreground-neutral-subtle', className)}\n {...props}\n >\n {children}\n </Slot>\n );\n }\n\n return (\n <Text\n data-slot=\"code-block-footer-description\"\n size=\"xs\"\n className={cn('text-foreground-neutral-subtle', className)}\n {...props}\n >\n {children}\n </Text>\n );\n}\n"],"names":["Slot","Icon","ShinyText","Text","ShipfoxLoader","cn","CodeBlockFooter","className","asChild","state","message","description","icon","children","props","Comp","defaultIcon","size","animation","color","background","name","aria-hidden","data-slot","CodeBlockFooterIcon","CodeBlockFooterContent","CodeBlockFooterMessage","text","speed","CodeBlockFooterDescription"],"mappings":";AAAA,SAAQA,IAAI,QAAO,uBAAuB;AAC1C,SAAQC,IAAI,QAAO,uBAAuB;AAC1C,SAAQC,SAAS,QAAO,wBAAwB;AAChD,SAAQC,IAAI,QAAO,wBAAwB;AAE3C,SAAQC,aAAa,QAAO,uBAAuB;AACnD,SAAQC,EAAE,QAAO,WAAW;AAU5B,OAAO,SAASC,gBAAgB,EAC9BC,SAAS,EACTC,UAAU,KAAK,EACfC,QAAQ,SAAS,EACjBC,OAAO,EACPC,WAAW,EACXC,IAAI,EACJC,QAAQ,EACR,GAAGC,OACkB;IACrB,MAAMC,OAAOP,UAAUR,OAAO;IAE9B,MAAMgB,cACJJ,QACCH,CAAAA,UAAU,0BACT,KAACL;QAAca,MAAM;QAAIC,WAAU;QAAWC,OAAM;QAAQC,YAAW;uBAEvE,KAACnB;QACCoB,MAAK;QACLd,WAAU;QACVe,eAAY;MAEhB;IAEF,IAAId,WAAWK,UAAU;QACvB,qBACE,KAACE;YACCQ,aAAU;YACVhB,WAAWF,GAAG,6DAA6DE;YAC1E,GAAGO,KAAK;sBAERD;;IAGP;IAEA,qBACE,MAACE;QACCQ,aAAU;QACVhB,WAAWF,GAAG,6DAA6DE;QAC1E,GAAGO,KAAK;;0BAET,KAACU;gBAAoBjB,WAAU;0BAAyBS;;YACtDN,CAAAA,WAAWC,WAAU,mBACrB,MAACc;;oBACEf,yBACC,KAACgB;kCACEjB,UAAU,aAAa,OAAOC,YAAY,yBACzC,KAACR;4BAAUyB,MAAMjB;4BAASkB,OAAO;6BAEjClB;;oBAILC,6BAAe,KAACkB;kCAA4BlB;;;;;;AAKvD;AAMA,OAAO,SAASa,oBAAoB,EAClCjB,SAAS,EACTC,UAAU,KAAK,EACfK,QAAQ,EACR,GAAGC,OACsB;IACzB,MAAMC,OAAOP,UAAUR,OAAO;IAE9B,qBACE,KAACe;QACCQ,aAAU;QACVhB,WAAWF,GAAG,qDAAqDE;QAClE,GAAGO,KAAK;kBAERD;;AAGP;AAMA,OAAO,SAASY,uBAAuB,EACrClB,SAAS,EACTC,UAAU,KAAK,EACfK,QAAQ,EACR,GAAGC,OACyB;IAC5B,MAAMC,OAAOP,UAAUR,OAAO;IAE9B,qBACE,KAACe;QACCQ,aAAU;QACVhB,WAAWF,GAAG,iEAAiEE;QAC9E,GAAGO,KAAK;kBAERD;;AAGP;AAMA,OAAO,SAASa,uBAAuB,EACrCnB,SAAS,EACTC,UAAU,KAAK,EACfK,QAAQ,EACR,GAAGC,OACyB;IAC5B,IAAIN,SAAS;QACX,qBACE,KAACR;YACCuB,aAAU;YACVhB,WAAWF,GAAG,2DAA2DE;YACxE,GAAGO,KAAK;sBAERD;;IAGP;IAEA,qBACE,KAACV;QACCoB,aAAU;QACVN,MAAK;QACLV,WAAWF,GAAG,mDAAmDE;QAChE,GAAGO,KAAK;kBAERD;;AAGP;AAMA,OAAO,SAASgB,2BAA2B,EACzCtB,SAAS,EACTC,UAAU,KAAK,EACfK,QAAQ,EACR,GAAGC,OAC6B;IAChC,IAAIN,SAAS;QACX,qBACE,KAACR;YACCuB,aAAU;YACVhB,WAAWF,GAAG,0CAA0CE;YACvD,GAAGO,KAAK;sBAERD;;IAGP;IAEA,qBACE,KAACV;QACCoB,aAAU;QACVN,MAAK;QACLV,WAAWF,GAAG,kCAAkCE;QAC/C,GAAGO,KAAK;kBAERD;;AAGP"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { GlobalOptions as ConfettiGlobalOptions, Options as ConfettiOptions } from 'canvas-confetti';
|
|
2
|
+
import type { ComponentProps, ReactNode } from 'react';
|
|
3
|
+
type ConfettiApi = {
|
|
4
|
+
fire: (options?: ConfettiOptions) => Promise<void>;
|
|
5
|
+
};
|
|
6
|
+
export type ConfettiRef = ConfettiApi | null;
|
|
7
|
+
export type ConfettiProps = ComponentProps<'canvas'> & {
|
|
8
|
+
options?: ConfettiOptions;
|
|
9
|
+
globalOptions?: ConfettiGlobalOptions;
|
|
10
|
+
manualstart?: boolean;
|
|
11
|
+
children?: ReactNode;
|
|
12
|
+
};
|
|
13
|
+
export declare const Confetti: import("react").ForwardRefExoticComponent<Omit<ConfettiProps, "ref"> & import("react").RefAttributes<ConfettiRef>>;
|
|
14
|
+
export type ConfettiButtonProps = ComponentProps<'button'> & {
|
|
15
|
+
options?: ConfettiOptions & ConfettiGlobalOptions & {
|
|
16
|
+
canvas?: HTMLCanvasElement;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
export declare function ConfettiButton({ options, onClick, children, ...props }: ConfettiButtonProps): import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
export {};
|
|
21
|
+
//# sourceMappingURL=confetti.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"confetti.d.ts","sourceRoot":"","sources":["../../../src/components/confetti/confetti.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,IAAI,qBAAqB,EAEtC,OAAO,IAAI,eAAe,EAC3B,MAAM,iBAAiB,CAAC;AAGzB,OAAO,KAAK,EAAC,cAAc,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAWrD,KAAK,WAAW,GAAG;IACjB,IAAI,EAAE,CAAC,OAAO,CAAC,EAAE,eAAe,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACpD,CAAC;AAIF,MAAM,MAAM,WAAW,GAAG,WAAW,GAAG,IAAI,CAAC;AAE7C,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACrD,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,aAAa,CAAC,EAAE,qBAAqB,CAAC;IACtC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AA4EF,eAAO,MAAM,QAAQ,oHAAoB,CAAC;AAE1C,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IAC3D,OAAO,CAAC,EAAE,eAAe,GAAG,qBAAqB,GAAG;QAAC,MAAM,CAAC,EAAE,iBAAiB,CAAA;KAAC,CAAC;CAClF,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,mBAAmB,2CA0BzF"}
|
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import confetti from 'canvas-confetti';
|
|
3
|
+
import { Button } from '../../components/button/index.js';
|
|
4
|
+
import { createContext, forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
|
|
5
|
+
const ConfettiContext = /*#__PURE__*/ createContext(null);
|
|
6
|
+
const ConfettiComponent = /*#__PURE__*/ forwardRef(({ options, globalOptions = {
|
|
7
|
+
resize: true,
|
|
8
|
+
useWorker: true
|
|
9
|
+
}, manualstart = false, children, ...props }, ref)=>{
|
|
10
|
+
const instanceRef = useRef(null);
|
|
11
|
+
const hasAutoFiredRef = useRef(false);
|
|
12
|
+
const optionsRef = useRef(options);
|
|
13
|
+
useEffect(()=>{
|
|
14
|
+
optionsRef.current = options;
|
|
15
|
+
}, [
|
|
16
|
+
options
|
|
17
|
+
]);
|
|
18
|
+
const canvasRef = useCallback((node)=>{
|
|
19
|
+
if (node !== null) {
|
|
20
|
+
if (instanceRef.current) {
|
|
21
|
+
instanceRef.current.reset();
|
|
22
|
+
}
|
|
23
|
+
instanceRef.current = confetti.create(node, {
|
|
24
|
+
...globalOptions
|
|
25
|
+
});
|
|
26
|
+
} else {
|
|
27
|
+
if (instanceRef.current) {
|
|
28
|
+
instanceRef.current.reset();
|
|
29
|
+
instanceRef.current = null;
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}, [
|
|
33
|
+
globalOptions
|
|
34
|
+
]);
|
|
35
|
+
const fire = useCallback(async (opts = {})=>{
|
|
36
|
+
try {
|
|
37
|
+
await instanceRef.current?.({
|
|
38
|
+
...optionsRef.current,
|
|
39
|
+
...opts
|
|
40
|
+
});
|
|
41
|
+
} catch (error) {
|
|
42
|
+
// biome-ignore lint/suspicious/noConsole: we need to log the error
|
|
43
|
+
console.error('Confetti error:', error);
|
|
44
|
+
}
|
|
45
|
+
}, []);
|
|
46
|
+
const api = useMemo(()=>({
|
|
47
|
+
fire
|
|
48
|
+
}), [
|
|
49
|
+
fire
|
|
50
|
+
]);
|
|
51
|
+
useImperativeHandle(ref, ()=>api, [
|
|
52
|
+
api
|
|
53
|
+
]);
|
|
54
|
+
useEffect(()=>{
|
|
55
|
+
if (!manualstart && !hasAutoFiredRef.current && instanceRef.current) {
|
|
56
|
+
hasAutoFiredRef.current = true;
|
|
57
|
+
void instanceRef.current(optionsRef.current);
|
|
58
|
+
}
|
|
59
|
+
}, [
|
|
60
|
+
manualstart
|
|
61
|
+
]);
|
|
62
|
+
return /*#__PURE__*/ _jsxs(ConfettiContext.Provider, {
|
|
63
|
+
value: api,
|
|
64
|
+
children: [
|
|
65
|
+
/*#__PURE__*/ _jsx("canvas", {
|
|
66
|
+
ref: canvasRef,
|
|
67
|
+
...props
|
|
68
|
+
}),
|
|
69
|
+
children
|
|
70
|
+
]
|
|
71
|
+
});
|
|
72
|
+
});
|
|
73
|
+
ConfettiComponent.displayName = 'Confetti';
|
|
74
|
+
export const Confetti = ConfettiComponent;
|
|
75
|
+
export function ConfettiButton({ options, onClick, children, ...props }) {
|
|
76
|
+
const handleClick = async (event)=>{
|
|
77
|
+
try {
|
|
78
|
+
const rect = event.currentTarget.getBoundingClientRect();
|
|
79
|
+
const x = rect.left + rect.width / 2;
|
|
80
|
+
const y = rect.top + rect.height / 2;
|
|
81
|
+
await confetti({
|
|
82
|
+
...options,
|
|
83
|
+
origin: {
|
|
84
|
+
x: x / window.innerWidth,
|
|
85
|
+
y: y / window.innerHeight
|
|
86
|
+
}
|
|
87
|
+
});
|
|
88
|
+
} catch (error) {
|
|
89
|
+
// biome-ignore lint/suspicious/noConsole: we need to log the error
|
|
90
|
+
console.error('Confetti button error:', error);
|
|
91
|
+
}
|
|
92
|
+
onClick?.(event);
|
|
93
|
+
};
|
|
94
|
+
return /*#__PURE__*/ _jsx(Button, {
|
|
95
|
+
onClick: handleClick,
|
|
96
|
+
...props,
|
|
97
|
+
children: children
|
|
98
|
+
});
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
//# sourceMappingURL=confetti.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/confetti/confetti.tsx"],"sourcesContent":["import type {\n GlobalOptions as ConfettiGlobalOptions,\n CreateTypes as ConfettiInstance,\n Options as ConfettiOptions,\n} from 'canvas-confetti';\nimport confetti from 'canvas-confetti';\nimport {Button} from 'components/button';\nimport type {ComponentProps, ReactNode} from 'react';\nimport {\n createContext,\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n} from 'react';\n\ntype ConfettiApi = {\n fire: (options?: ConfettiOptions) => Promise<void>;\n};\n\nconst ConfettiContext = createContext<ConfettiApi | null>(null);\n\nexport type ConfettiRef = ConfettiApi | null;\n\nexport type ConfettiProps = ComponentProps<'canvas'> & {\n options?: ConfettiOptions;\n globalOptions?: ConfettiGlobalOptions;\n manualstart?: boolean;\n children?: ReactNode;\n};\n\nconst ConfettiComponent = forwardRef<ConfettiRef, ConfettiProps>(\n (\n {\n options,\n globalOptions = {resize: true, useWorker: true},\n manualstart = false,\n children,\n ...props\n },\n ref,\n ) => {\n const instanceRef = useRef<ConfettiInstance | null>(null);\n const hasAutoFiredRef = useRef<boolean>(false);\n const optionsRef = useRef<ConfettiOptions | undefined>(options);\n\n useEffect(() => {\n optionsRef.current = options;\n }, [options]);\n\n const canvasRef = useCallback(\n (node: HTMLCanvasElement | null) => {\n if (node !== null) {\n if (instanceRef.current) {\n instanceRef.current.reset();\n }\n instanceRef.current = confetti.create(node, {\n ...globalOptions,\n });\n } else {\n if (instanceRef.current) {\n instanceRef.current.reset();\n instanceRef.current = null;\n }\n }\n },\n [globalOptions],\n );\n\n const fire = useCallback(async (opts: ConfettiOptions = {}) => {\n try {\n await instanceRef.current?.({...optionsRef.current, ...opts});\n } catch (error) {\n // biome-ignore lint/suspicious/noConsole: we need to log the error\n console.error('Confetti error:', error);\n }\n }, []);\n\n const api = useMemo<ConfettiApi>(\n () => ({\n fire,\n }),\n [fire],\n );\n\n useImperativeHandle(ref, () => api, [api]);\n\n useEffect(() => {\n if (!manualstart && !hasAutoFiredRef.current && instanceRef.current) {\n hasAutoFiredRef.current = true;\n void instanceRef.current(optionsRef.current);\n }\n }, [manualstart]);\n\n return (\n <ConfettiContext.Provider value={api}>\n <canvas ref={canvasRef} {...props} />\n {children}\n </ConfettiContext.Provider>\n );\n },\n);\n\nConfettiComponent.displayName = 'Confetti';\n\nexport const Confetti = ConfettiComponent;\n\nexport type ConfettiButtonProps = ComponentProps<'button'> & {\n options?: ConfettiOptions & ConfettiGlobalOptions & {canvas?: HTMLCanvasElement};\n};\n\nexport function ConfettiButton({options, onClick, children, ...props}: ConfettiButtonProps) {\n const handleClick: ComponentProps<'button'>['onClick'] = async (event) => {\n try {\n const rect = event.currentTarget.getBoundingClientRect();\n const x = rect.left + rect.width / 2;\n const y = rect.top + rect.height / 2;\n await confetti({\n ...options,\n origin: {\n x: x / window.innerWidth,\n y: y / window.innerHeight,\n },\n });\n } catch (error) {\n // biome-ignore lint/suspicious/noConsole: we need to log the error\n console.error('Confetti button error:', error);\n }\n\n onClick?.(event);\n };\n\n return (\n <Button onClick={handleClick} {...props}>\n {children}\n </Button>\n );\n}\n"],"names":["confetti","Button","createContext","forwardRef","useCallback","useEffect","useImperativeHandle","useMemo","useRef","ConfettiContext","ConfettiComponent","options","globalOptions","resize","useWorker","manualstart","children","props","ref","instanceRef","hasAutoFiredRef","optionsRef","current","canvasRef","node","reset","create","fire","opts","error","console","api","Provider","value","canvas","displayName","Confetti","ConfettiButton","onClick","handleClick","event","rect","currentTarget","getBoundingClientRect","x","left","width","y","top","height","origin","window","innerWidth","innerHeight"],"mappings":";AAKA,OAAOA,cAAc,kBAAkB;AACvC,SAAQC,MAAM,QAAO,oBAAoB;AAEzC,SACEC,aAAa,EACbC,UAAU,EACVC,WAAW,EACXC,SAAS,EACTC,mBAAmB,EACnBC,OAAO,EACPC,MAAM,QACD,QAAQ;AAMf,MAAMC,gCAAkBP,cAAkC;AAW1D,MAAMQ,kCAAoBP,WACxB,CACE,EACEQ,OAAO,EACPC,gBAAgB;IAACC,QAAQ;IAAMC,WAAW;AAAI,CAAC,EAC/CC,cAAc,KAAK,EACnBC,QAAQ,EACR,GAAGC,OACJ,EACDC;IAEA,MAAMC,cAAcX,OAAgC;IACpD,MAAMY,kBAAkBZ,OAAgB;IACxC,MAAMa,aAAab,OAAoCG;IAEvDN,UAAU;QACRgB,WAAWC,OAAO,GAAGX;IACvB,GAAG;QAACA;KAAQ;IAEZ,MAAMY,YAAYnB,YAChB,CAACoB;QACC,IAAIA,SAAS,MAAM;YACjB,IAAIL,YAAYG,OAAO,EAAE;gBACvBH,YAAYG,OAAO,CAACG,KAAK;YAC3B;YACAN,YAAYG,OAAO,GAAGtB,SAAS0B,MAAM,CAACF,MAAM;gBAC1C,GAAGZ,aAAa;YAClB;QACF,OAAO;YACL,IAAIO,YAAYG,OAAO,EAAE;gBACvBH,YAAYG,OAAO,CAACG,KAAK;gBACzBN,YAAYG,OAAO,GAAG;YACxB;QACF;IACF,GACA;QAACV;KAAc;IAGjB,MAAMe,OAAOvB,YAAY,OAAOwB,OAAwB,CAAC,CAAC;QACxD,IAAI;YACF,MAAMT,YAAYG,OAAO,GAAG;gBAAC,GAAGD,WAAWC,OAAO;gBAAE,GAAGM,IAAI;YAAA;QAC7D,EAAE,OAAOC,OAAO;YACd,mEAAmE;YACnEC,QAAQD,KAAK,CAAC,mBAAmBA;QACnC;IACF,GAAG,EAAE;IAEL,MAAME,MAAMxB,QACV,IAAO,CAAA;YACLoB;QACF,CAAA,GACA;QAACA;KAAK;IAGRrB,oBAAoBY,KAAK,IAAMa,KAAK;QAACA;KAAI;IAEzC1B,UAAU;QACR,IAAI,CAACU,eAAe,CAACK,gBAAgBE,OAAO,IAAIH,YAAYG,OAAO,EAAE;YACnEF,gBAAgBE,OAAO,GAAG;YAC1B,KAAKH,YAAYG,OAAO,CAACD,WAAWC,OAAO;QAC7C;IACF,GAAG;QAACP;KAAY;IAEhB,qBACE,MAACN,gBAAgBuB,QAAQ;QAACC,OAAOF;;0BAC/B,KAACG;gBAAOhB,KAAKK;gBAAY,GAAGN,KAAK;;YAChCD;;;AAGP;AAGFN,kBAAkByB,WAAW,GAAG;AAEhC,OAAO,MAAMC,WAAW1B,kBAAkB;AAM1C,OAAO,SAAS2B,eAAe,EAAC1B,OAAO,EAAE2B,OAAO,EAAEtB,QAAQ,EAAE,GAAGC,OAA2B;IACxF,MAAMsB,cAAmD,OAAOC;QAC9D,IAAI;YACF,MAAMC,OAAOD,MAAME,aAAa,CAACC,qBAAqB;YACtD,MAAMC,IAAIH,KAAKI,IAAI,GAAGJ,KAAKK,KAAK,GAAG;YACnC,MAAMC,IAAIN,KAAKO,GAAG,GAAGP,KAAKQ,MAAM,GAAG;YACnC,MAAMjD,SAAS;gBACb,GAAGW,OAAO;gBACVuC,QAAQ;oBACNN,GAAGA,IAAIO,OAAOC,UAAU;oBACxBL,GAAGA,IAAII,OAAOE,WAAW;gBAC3B;YACF;QACF,EAAE,OAAOxB,OAAO;YACd,mEAAmE;YACnEC,QAAQD,KAAK,CAAC,0BAA0BA;QAC1C;QAEAS,UAAUE;IACZ;IAEA,qBACE,KAACvC;QAAOqC,SAASC;QAAc,GAAGtB,KAAK;kBACpCD;;AAGP"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { Confetti, ConfettiButton } from './confetti.js';
|
|
3
|
+
const meta = {
|
|
4
|
+
title: 'Components/Confetti',
|
|
5
|
+
component: Confetti,
|
|
6
|
+
tags: [
|
|
7
|
+
'autodocs'
|
|
8
|
+
],
|
|
9
|
+
parameters: {
|
|
10
|
+
layout: 'centered'
|
|
11
|
+
}
|
|
12
|
+
};
|
|
13
|
+
export default meta;
|
|
14
|
+
export const Default = {
|
|
15
|
+
render: ()=>/*#__PURE__*/ _jsx("div", {
|
|
16
|
+
className: "flex h-400 w-600 items-center justify-center rounded-16 bg-background-subtle-base",
|
|
17
|
+
children: /*#__PURE__*/ _jsx(ConfettiButton, {
|
|
18
|
+
children: "Click for Confetti!"
|
|
19
|
+
})
|
|
20
|
+
})
|
|
21
|
+
};
|
|
22
|
+
export const WithOptions = {
|
|
23
|
+
render: ()=>/*#__PURE__*/ _jsx("div", {
|
|
24
|
+
className: "flex h-400 w-600 items-center justify-center rounded-16 bg-background-subtle-base",
|
|
25
|
+
children: /*#__PURE__*/ _jsx(ConfettiButton, {
|
|
26
|
+
options: {
|
|
27
|
+
particleCount: 150,
|
|
28
|
+
spread: 60,
|
|
29
|
+
colors: [
|
|
30
|
+
'#ff6b6b',
|
|
31
|
+
'#4ecdc4',
|
|
32
|
+
'#ffe66d',
|
|
33
|
+
'#95e1d3'
|
|
34
|
+
]
|
|
35
|
+
},
|
|
36
|
+
children: "Custom Confetti Button"
|
|
37
|
+
})
|
|
38
|
+
})
|
|
39
|
+
};
|
|
40
|
+
|
|
41
|
+
//# sourceMappingURL=confetti.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/confetti/confetti.stories.tsx"],"sourcesContent":["import type {Meta, StoryObj} from '@storybook/react';\nimport {Confetti, ConfettiButton} from './confetti';\n\nconst meta = {\n title: 'Components/Confetti',\n component: Confetti,\n tags: ['autodocs'],\n parameters: {\n layout: 'centered',\n },\n} satisfies Meta<typeof Confetti>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n render: () => (\n <div className=\"flex h-400 w-600 items-center justify-center rounded-16 bg-background-subtle-base\">\n <ConfettiButton>Click for Confetti!</ConfettiButton>\n </div>\n ),\n};\n\nexport const WithOptions: Story = {\n render: () => (\n <div className=\"flex h-400 w-600 items-center justify-center rounded-16 bg-background-subtle-base\">\n <ConfettiButton\n options={{\n particleCount: 150,\n spread: 60,\n colors: ['#ff6b6b', '#4ecdc4', '#ffe66d', '#95e1d3'],\n }}\n >\n Custom Confetti Button\n </ConfettiButton>\n </div>\n ),\n};\n"],"names":["Confetti","ConfettiButton","meta","title","component","tags","parameters","layout","Default","render","div","className","WithOptions","options","particleCount","spread","colors"],"mappings":";AACA,SAAQA,QAAQ,EAAEC,cAAc,QAAO,aAAa;AAEpD,MAAMC,OAAO;IACXC,OAAO;IACPC,WAAWJ;IACXK,MAAM;QAAC;KAAW;IAClBC,YAAY;QACVC,QAAQ;IACV;AACF;AAEA,eAAeL,KAAK;AAGpB,OAAO,MAAMM,UAAiB;IAC5BC,QAAQ,kBACN,KAACC;YAAIC,WAAU;sBACb,cAAA,KAACV;0BAAe;;;AAGtB,EAAE;AAEF,OAAO,MAAMW,cAAqB;IAChCH,QAAQ,kBACN,KAACC;YAAIC,WAAU;sBACb,cAAA,KAACV;gBACCY,SAAS;oBACPC,eAAe;oBACfC,QAAQ;oBACRC,QAAQ;wBAAC;wBAAW;wBAAW;wBAAW;qBAAU;gBACtD;0BACD;;;AAKP,EAAE"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/confetti/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/confetti/index.ts"],"sourcesContent":["export * from './confetti';\n"],"names":[],"mappings":"AAAA,cAAc,aAAa"}
|
|
@@ -23,7 +23,8 @@ export declare const iconNames: IconName[];
|
|
|
23
23
|
type BaseIconProps = ComponentProps<RemixiconComponentType>;
|
|
24
24
|
type IconProps = {
|
|
25
25
|
name: IconName;
|
|
26
|
-
|
|
27
|
-
|
|
26
|
+
size?: number | string;
|
|
27
|
+
} & Omit<BaseIconProps, 'name' | 'size' | 'width' | 'height'>;
|
|
28
|
+
export declare function Icon({ name, size, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
|
|
28
29
|
export {};
|
|
29
30
|
//# sourceMappingURL=icon.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
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;AAiB7D,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;AAoBlB,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;CAeuC,CAAC;AAE5D,QAAA,MAAM,QAAQ,EAIT,MAAM,CAAC,MAAM,EAAE,sBAAsB,CAAC,GAAG,OAAO,cAAc,CAAC;AAEpE,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,QAAQ,CAAC;AAC7C,eAAO,MAAM,SAAS,EAA4B,QAAQ,EAAE,CAAC;AAE7D,KAAK,aAAa,GAAG,cAAc,CAAC,sBAAsB,CAAC,CAAC;AAC5D,KAAK,SAAS,GAAG;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GAAG,IAAI,
|
|
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;AAiB7D,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;AAoBlB,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;CAeuC,CAAC;AAE5D,QAAA,MAAM,QAAQ,EAIT,MAAM,CAAC,MAAM,EAAE,sBAAsB,CAAC,GAAG,OAAO,cAAc,CAAC;AAEpE,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,QAAQ,CAAC;AAC7C,eAAO,MAAM,SAAS,EAA4B,QAAQ,EAAE,CAAC;AAE7D,KAAK,aAAa,GAAG,cAAc,CAAC,sBAAsB,CAAC,CAAC;AAC5D,KAAK,SAAS,GAAG;IAAC,IAAI,EAAE,QAAQ,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAAC,GAAG,IAAI,CAC9D,aAAa,EACb,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CACrC,CAAC;AAEF,wBAAgB,IAAI,CAAC,EAAC,IAAI,EAAE,IAAI,EAAE,GAAG,KAAK,EAAC,EAAE,SAAS,2CAIrD"}
|
|
@@ -40,10 +40,15 @@ const iconsMap = {
|
|
|
40
40
|
...customIconsMap
|
|
41
41
|
};
|
|
42
42
|
export const iconNames = Object.keys(iconsMap);
|
|
43
|
-
export function Icon({ name, ...props }) {
|
|
43
|
+
export function Icon({ name, size, ...props }) {
|
|
44
44
|
const IconComponent = iconsMap[name];
|
|
45
|
+
const svgProps = size && typeof size === 'number' ? {
|
|
46
|
+
...props,
|
|
47
|
+
width: size,
|
|
48
|
+
height: size
|
|
49
|
+
} : props;
|
|
45
50
|
return /*#__PURE__*/ _jsx(IconComponent, {
|
|
46
|
-
...
|
|
51
|
+
...svgProps
|
|
47
52
|
});
|
|
48
53
|
}
|
|
49
54
|
|
|
@@ -1 +1 @@
|
|
|
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';\nimport {remixiconMap} from './remixicon-registry';\n\nconst commonRemixicons = {\n addLine: RiAddLine,\n close: RiCloseLine,\n check: RiCheckLine,\n copy: RiFileCopyLine,\n info: RiInformationFill,\n imageAdd: RiImageAddFill,\n chevronRight: RiArrowRightSLine,\n homeSmile: RiHomeSmileFill,\n money: RiMoneyDollarCircleLine,\n google: RiGoogleFill,\n microsoft: RiMicrosoftFill,\n github: RiGithubFill,\n subtractLine: RiSubtractLine,\n bookOpen: RiBookOpenFill,\n} as const satisfies Record<string, RemixiconComponentType>;\n\nconst customIconsMap = {\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} as const satisfies Record<string, RemixiconComponentType>;\n\nconst iconsMap = {\n ...remixiconMap,\n ...commonRemixicons,\n ...customIconsMap,\n} as Record<string, RemixiconComponentType> & typeof customIconsMap;\n\nexport type IconName = keyof typeof iconsMap;\nexport const iconNames = Object.keys(iconsMap) as IconName[];\n\ntype BaseIconProps = ComponentProps<RemixiconComponentType>;\ntype IconProps = {name: IconName} & Omit
|
|
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';\nimport {remixiconMap} from './remixicon-registry';\n\nconst commonRemixicons = {\n addLine: RiAddLine,\n close: RiCloseLine,\n check: RiCheckLine,\n copy: RiFileCopyLine,\n info: RiInformationFill,\n imageAdd: RiImageAddFill,\n chevronRight: RiArrowRightSLine,\n homeSmile: RiHomeSmileFill,\n money: RiMoneyDollarCircleLine,\n google: RiGoogleFill,\n microsoft: RiMicrosoftFill,\n github: RiGithubFill,\n subtractLine: RiSubtractLine,\n bookOpen: RiBookOpenFill,\n} as const satisfies Record<string, RemixiconComponentType>;\n\nconst customIconsMap = {\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} as const satisfies Record<string, RemixiconComponentType>;\n\nconst iconsMap = {\n ...remixiconMap,\n ...commonRemixicons,\n ...customIconsMap,\n} as Record<string, RemixiconComponentType> & typeof customIconsMap;\n\nexport type IconName = keyof typeof iconsMap;\nexport const iconNames = Object.keys(iconsMap) as IconName[];\n\ntype BaseIconProps = ComponentProps<RemixiconComponentType>;\ntype IconProps = {name: IconName; size?: number | string} & Omit<\n BaseIconProps,\n 'name' | 'size' | 'width' | 'height'\n>;\n\nexport function Icon({name, size, ...props}: IconProps) {\n const IconComponent = iconsMap[name];\n const svgProps = size && typeof size === 'number' ? {...props, width: size, height: size} : props;\n return <IconComponent {...svgProps} />;\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","remixiconMap","commonRemixicons","addLine","close","check","copy","info","imageAdd","chevronRight","homeSmile","money","google","microsoft","github","subtractLine","bookOpen","customIconsMap","shipfox","slack","stripe","badge","checkCircleSolid","circleDottedLine","componentFill","componentLine","ellipseMiniSolid","infoTooltipFill","resize","spinner","thunder","xCircleSolid","iconsMap","iconNames","Object","keys","Icon","name","size","props","IconComponent","svgProps","width","height"],"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;AAClB,SAAQC,YAAY,QAAO,uBAAuB;AAElD,MAAMC,mBAAmB;IACvBC,SAAS9B;IACT+B,OAAO3B;IACP4B,OAAO7B;IACP8B,MAAM5B;IACN6B,MAAMxB;IACNyB,UAAU1B;IACV2B,cAAcnC;IACdoC,WAAW7B;IACX8B,OAAO1B;IACP2B,QAAQhC;IACRiC,WAAW7B;IACX8B,QAAQnC;IACRoC,cAAc7B;IACd8B,UAAUzC;AACZ;AAEA,MAAM0C,iBAAiB;IACrBC,SAASvB;IACTwB,OAAOvB;IACPwB,QAAQtB;IACRuB,OAAOlC;IACPmC,kBAAkBlC;IAClBmC,kBAAkBlC;IAClBmC,eAAelC;IACfmC,eAAelC;IACfmC,kBAAkBlC;IAClBmC,iBAAiBlC;IACjBmC,QAAQlC;IACRmC,SAAShC;IACTiC,SAAS/B;IACTgC,cAAc/B;AAChB;AAEA,MAAMgC,WAAW;IACf,GAAG/B,YAAY;IACf,GAAGC,gBAAgB;IACnB,GAAGe,cAAc;AACnB;AAGA,OAAO,MAAMgB,YAAYC,OAAOC,IAAI,CAACH,UAAwB;AAQ7D,OAAO,SAASI,KAAK,EAACC,IAAI,EAAEC,IAAI,EAAE,GAAGC,OAAiB;IACpD,MAAMC,gBAAgBR,QAAQ,CAACK,KAAK;IACpC,MAAMI,WAAWH,QAAQ,OAAOA,SAAS,WAAW;QAAC,GAAGC,KAAK;QAAEG,OAAOJ;QAAMK,QAAQL;IAAI,IAAIC;IAC5F,qBAAO,KAACC;QAAe,GAAGC,QAAQ;;AACpC"}
|
|
@@ -5,6 +5,7 @@ export * from './button';
|
|
|
5
5
|
export * from './calendar';
|
|
6
6
|
export * from './checkbox';
|
|
7
7
|
export * from './code-block';
|
|
8
|
+
export * from './confetti';
|
|
8
9
|
export * from './date-picker';
|
|
9
10
|
export * from './date-time-range-picker';
|
|
10
11
|
export * from './dot-grid';
|
|
@@ -19,6 +20,7 @@ export * from './label';
|
|
|
19
20
|
export * from './modal';
|
|
20
21
|
export * from './moving-border';
|
|
21
22
|
export * from './popover';
|
|
23
|
+
export * from './shiny-text';
|
|
22
24
|
export * from './tabs';
|
|
23
25
|
export * from './textarea';
|
|
24
26
|
export * from './theme';
|
|
@@ -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,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,0BAA0B,CAAC;AACzC,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,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,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,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,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,0BAA0B,CAAC;AACzC,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,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,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,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
|
@@ -5,6 +5,7 @@ export * from './button/index.js';
|
|
|
5
5
|
export * from './calendar/index.js';
|
|
6
6
|
export * from './checkbox/index.js';
|
|
7
7
|
export * from './code-block/index.js';
|
|
8
|
+
export * from './confetti/index.js';
|
|
8
9
|
export * from './date-picker/index.js';
|
|
9
10
|
export * from './date-time-range-picker/index.js';
|
|
10
11
|
export * from './dot-grid/index.js';
|
|
@@ -19,6 +20,7 @@ export * from './label/index.js';
|
|
|
19
20
|
export * from './modal/index.js';
|
|
20
21
|
export * from './moving-border/index.js';
|
|
21
22
|
export * from './popover/index.js';
|
|
23
|
+
export * from './shiny-text/index.js';
|
|
22
24
|
export * from './tabs/index.js';
|
|
23
25
|
export * from './textarea/index.js';
|
|
24
26
|
export * from './theme/index.js';
|
|
@@ -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 './calendar';\nexport * from './checkbox';\nexport * from './code-block';\nexport * from './date-picker';\nexport * from './date-time-range-picker';\nexport * from './dot-grid';\nexport * from './dropdown-menu';\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 './moving-border';\nexport * from './popover';\nexport * from './tabs';\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,aAAa;AAC3B,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,2BAA2B;AACzC,cAAc,aAAa;AAC3B,cAAc,kBAAkB;AAChC,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,kBAAkB;AAChC,cAAc,YAAY;AAC1B,cAAc,SAAS;AACvB,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,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 './calendar';\nexport * from './checkbox';\nexport * from './code-block';\nexport * from './confetti';\nexport * from './date-picker';\nexport * from './date-time-range-picker';\nexport * from './dot-grid';\nexport * from './dropdown-menu';\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 './moving-border';\nexport * from './popover';\nexport * from './shiny-text';\nexport * from './tabs';\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,aAAa;AAC3B,cAAc,eAAe;AAC7B,cAAc,aAAa;AAC3B,cAAc,gBAAgB;AAC9B,cAAc,2BAA2B;AACzC,cAAc,aAAa;AAC3B,cAAc,kBAAkB;AAChC,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,kBAAkB;AAChC,cAAc,YAAY;AAC1B,cAAc,eAAe;AAC7B,cAAc,SAAS;AACvB,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,cAAc,eAAe"}
|