@cryptlex/web-components 6.7.14 → 6.7.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/components/toast.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{classNames as e}from"../utilities/theme.js";import{D as t,U as n,c as r,l as i}from"../icons.js";import{Button as a}from"./button.js";import{alertVariants as o}from"./alert.js";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{UNSTABLE_Toast as l,UNSTABLE_ToastContent as u,UNSTABLE_ToastQueue as d,UNSTABLE_ToastRegion as f}from"react-aria-components";import{flushSync as p}from"react-dom";var m=new d({wrapUpdate(e){`startViewTransition`in document?document.startViewTransition(()=>{p(e)}):e()}});function h(){return s(f,{queue:m,className:`fixed z-50 top-4 right-4 flex flex-col-reverse justify-end gap-2`,children:({toast:t})=>s(l,{style:{viewTransitionName:t.key},toast:t,className:`animate-in fade-in-0 slide-in-from-right duration-300 ease-out`,children:c(u,{className:e(o({variant:t.content.variant}),`flex flex-col items-stretch
|
|
1
|
+
import{classNames as e}from"../utilities/theme.js";import{D as t,U as n,c as r,l as i}from"../icons.js";import{Button as a}from"./button.js";import{alertVariants as o}from"./alert.js";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{UNSTABLE_Toast as l,UNSTABLE_ToastContent as u,UNSTABLE_ToastQueue as d,UNSTABLE_ToastRegion as f}from"react-aria-components";import{flushSync as p}from"react-dom";var m=new d({wrapUpdate(e){`startViewTransition`in document?document.startViewTransition(()=>{p(e)}):e()}});function h(){return s(f,{queue:m,className:`fixed z-50 top-4 right-4 flex flex-col-reverse justify-end gap-2`,children:({toast:t})=>s(l,{style:{viewTransitionName:t.key},toast:t,className:`animate-in fade-in-0 slide-in-from-right duration-300 ease-out`,children:c(u,{className:e(o({variant:t.content.variant}),`flex flex-col items-stretch w-full max-w-md sm:max-w-* gap-2`),children:[c(`div`,{className:`flex flex-row items-start gap-3`,children:[s(`span`,{className:`shrink-0`,children:g(t.content.variant)}),c(`div`,{className:`flex-1 min-w-0`,children:[s(`p`,{slot:`title`,className:`font-medium body-base`,children:t.content.title}),t.content.description&&s(`p`,{slot:`description`,className:`body-sm`,children:t.content.description})]}),!t.content.autoDismiss&&c(a,{slot:`close`,size:`icon`,variant:`neutral`,className:`rounded-full border-none shrink-0 -mr-1 -mt-1`,children:[s(i,{className:`size-4`}),s(`span`,{className:`sr-only`,children:`Close`})]})]}),t.content.action&&s(`div`,{className:`flex w-full justify-end gap-2 mt-1`,children:s(a,{slot:`close`,onPress:()=>{t.content.action?.()},variant:`neutral`,className:`shrink-0`,children:t.content.actionLabel||`Action`})})]})})})}function g(e){switch(e){case`destructive`:return s(t,{});case`success`:return s(r,{});case`neutral`:return s(n,{});default:return s(n,{})}}function _({title:e,description:t,variant:n,autoDismiss:r=!0,action:i,actionLabel:a}){let o=r&&!i?{timeout:3e3}:{};m.add({title:e,description:t,variant:n,autoDismiss:r,action:i,actionLabel:a},o)}export{h as ToastProvider,_ as toast};
|
|
2
2
|
//# sourceMappingURL=toast.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.js","names":[],"sources":["../../lib/components/toast.tsx"],"sourcesContent":["import type { VariantProps } from 'class-variance-authority';\nimport {\n UNSTABLE_Toast as AriaToast,\n UNSTABLE_ToastContent as AriaToastContent,\n UNSTABLE_ToastQueue as AriaToastQueue,\n UNSTABLE_ToastRegion as AriaToastRegion,\n} from 'react-aria-components';\nimport { flushSync } from 'react-dom';\nimport { classNames } from '../utilities/theme';\nimport { alertVariants } from './alert';\nimport { Button } from './button';\nimport { IcCheck, IcClose, IcError, IcInfo } from './icons';\n\nexport interface ToastProps {\n title: string;\n description?: string;\n variant: VariantProps<typeof alertVariants>['variant'];\n action?: () => void;\n actionLabel?: string;\n autoDismiss?: boolean;\n}\n\n/**\n * Toast queue.\n * @returns The toast queue.\n */\nconst queue = new AriaToastQueue<ToastProps>({\n wrapUpdate(fn) {\n if ('startViewTransition' in document) {\n document.startViewTransition(() => {\n flushSync(fn);\n });\n } else {\n fn();\n }\n },\n});\n\n/**\n * Toast provider.\n * @returns The toast provider.\n */\nexport function ToastProvider() {\n return (\n <AriaToastRegion queue={queue} className=\"fixed z-50 top-4 right-4 flex flex-col-reverse justify-end gap-2\">\n {({ toast }) => (\n <AriaToast\n style={{ viewTransitionName: toast.key }}\n toast={toast}\n className=\"animate-in fade-in-0 slide-in-from-right duration-300 ease-out\"\n >\n <AriaToastContent\n className={classNames(\n alertVariants({ variant: toast.content.variant }),\n 'flex flex-col items-stretch
|
|
1
|
+
{"version":3,"file":"toast.js","names":[],"sources":["../../lib/components/toast.tsx"],"sourcesContent":["import type { VariantProps } from 'class-variance-authority';\nimport {\n UNSTABLE_Toast as AriaToast,\n UNSTABLE_ToastContent as AriaToastContent,\n UNSTABLE_ToastQueue as AriaToastQueue,\n UNSTABLE_ToastRegion as AriaToastRegion,\n} from 'react-aria-components';\nimport { flushSync } from 'react-dom';\nimport { classNames } from '../utilities/theme';\nimport { alertVariants } from './alert';\nimport { Button } from './button';\nimport { IcCheck, IcClose, IcError, IcInfo } from './icons';\n\nexport interface ToastProps {\n title: string;\n description?: string;\n variant: VariantProps<typeof alertVariants>['variant'];\n action?: () => void;\n actionLabel?: string;\n autoDismiss?: boolean;\n}\n\n/**\n * Toast queue.\n * @returns The toast queue.\n */\nconst queue = new AriaToastQueue<ToastProps>({\n wrapUpdate(fn) {\n if ('startViewTransition' in document) {\n document.startViewTransition(() => {\n flushSync(fn);\n });\n } else {\n fn();\n }\n },\n});\n\n/**\n * Toast provider.\n * @returns The toast provider.\n */\nexport function ToastProvider() {\n return (\n <AriaToastRegion queue={queue} className=\"fixed z-50 top-4 right-4 flex flex-col-reverse justify-end gap-2\">\n {({ toast }) => (\n <AriaToast\n style={{ viewTransitionName: toast.key }}\n toast={toast}\n className=\"animate-in fade-in-0 slide-in-from-right duration-300 ease-out\"\n >\n <AriaToastContent\n className={classNames(\n alertVariants({ variant: toast.content.variant }),\n 'flex flex-col items-stretch w-full max-w-md sm:max-w-* gap-2'\n )}\n >\n <div className=\"flex flex-row items-start gap-3\">\n <span className=\"shrink-0\">{getToastIcon(toast.content.variant)}</span>\n <div className=\"flex-1 min-w-0\">\n <p slot=\"title\" className=\"font-medium body-base\">\n {toast.content.title}\n </p>\n {toast.content.description && (\n <p slot=\"description\" className=\"body-sm\">\n {toast.content.description}\n </p>\n )}\n </div>\n {!toast.content.autoDismiss && (\n <Button\n slot=\"close\"\n size=\"icon\"\n variant=\"neutral\"\n className=\"rounded-full border-none shrink-0 -mr-1 -mt-1\"\n >\n <IcClose className=\"size-4\" />\n <span className=\"sr-only\">Close</span>\n </Button>\n )}\n </div>\n {toast.content.action && (\n <div className=\"flex w-full justify-end gap-2 mt-1\">\n <Button\n slot=\"close\"\n onPress={() => {\n toast.content.action?.();\n }}\n variant=\"neutral\"\n className=\"shrink-0\"\n >\n {toast.content.actionLabel || 'Action'}\n </Button>\n </div>\n )}\n </AriaToastContent>\n </AriaToast>\n )}\n </AriaToastRegion>\n );\n}\n\n/**\n * Get the icon for a toast notification.\n * @param variant - The variant of the toast.\n * @returns The icon for the toast.\n */\nfunction getToastIcon(variant: ToastProps['variant']) {\n switch (variant) {\n case 'destructive':\n return <IcError />;\n case 'success':\n return <IcCheck />;\n case 'neutral':\n return <IcInfo />;\n default:\n return <IcInfo />;\n }\n}\n\n/**\n * Show a toast notification.\n * @param title - The title of the toast.\n * @param description - The description of the toast.\n * @param variant - The variant of the toast.\n * @param autoDismiss - Whether to automatically dismiss the toast.\n */\nexport function toast({ title, description, variant, autoDismiss = true, action, actionLabel }: ToastProps) {\n const options = autoDismiss && !action ? { timeout: 3000 } : {};\n queue.add({ title, description, variant, autoDismiss, action, actionLabel }, options);\n}\n"],"mappings":"qZA0BA,IAAM,EAAQ,IAAI,EAA2B,CACzC,WAAW,EAAI,CACP,wBAAyB,SACzB,SAAS,wBAA0B,CAC/B,EAAU,CAAE,CAChB,CAAC,EAED,EAAG,CAEX,CACJ,CAAC,EAMD,SAAgB,GAAgB,CAC5B,OACI,EAAC,EAAD,CAAwB,QAAO,UAAU,mEACnC,UAAA,CAAE,WACA,EAAC,EAAD,CACI,MAAO,CAAE,mBAAoB,EAAM,GAAI,EAChC,QACP,UAAU,iEAEV,SAAA,EAAC,EAAD,CACI,UAAW,EACP,EAAc,CAAE,QAAS,EAAM,QAAQ,OAAQ,CAAC,EAChD,8DACJ,EAJJ,SAAA,CAMI,EAAC,MAAD,CAAK,UAAU,kCAAf,SAAA,CACI,EAAC,OAAD,CAAM,UAAU,WAAY,SAAA,EAAa,EAAM,QAAQ,OAAO,CAAQ,CAAA,EACtE,EAAC,MAAD,CAAK,UAAU,iBAAf,SAAA,CACI,EAAC,IAAD,CAAG,KAAK,QAAQ,UAAU,wBACrB,SAAA,EAAM,QAAQ,KAChB,CAAA,EACF,EAAM,QAAQ,aACX,EAAC,IAAD,CAAG,KAAK,cAAc,UAAU,UAC3B,SAAA,EAAM,QAAQ,WAChB,CAAA,CAEN,IACJ,CAAC,EAAM,QAAQ,aACZ,EAAC,EAAD,CACI,KAAK,QACL,KAAK,OACL,QAAQ,UACR,UAAU,gDAJd,SAAA,CAMI,EAAC,EAAD,CAAS,UAAU,QAAU,CAAA,EAC7B,EAAC,OAAD,CAAM,UAAU,UAAU,SAAA,OAAW,CAAA,CACjC,GAEX,CACJ,CAAA,EAAA,EAAM,QAAQ,QACX,EAAC,MAAD,CAAK,UAAU,qCACX,SAAA,EAAC,EAAD,CACI,KAAK,QACL,YAAe,CACX,EAAM,QAAQ,SAAS,CAC3B,EACA,QAAQ,UACR,UAAU,WAET,SAAA,EAAM,QAAQ,aAAe,QAC1B,CAAA,CACP,CAAA,CAEK,GACX,CAAA,CAEF,CAAA,CAEzB,CAOA,SAAS,EAAa,EAAgC,CAClD,OAAQ,EAAR,CACI,IAAK,cACD,OAAO,EAAC,EAAD,CAAU,CAAA,EACrB,IAAK,UACD,OAAO,EAAC,EAAD,CAAU,CAAA,EACrB,IAAK,UACD,OAAO,EAAC,EAAD,CAAS,CAAA,EACpB,QACI,OAAO,EAAC,EAAD,CAAS,CAAA,CACxB,CACJ,CASA,SAAgB,EAAM,CAAE,QAAO,cAAa,UAAS,cAAc,GAAM,SAAQ,eAA2B,CACxG,IAAM,EAAU,GAAe,CAAC,EAAS,CAAE,QAAS,GAAK,EAAI,CAAC,EAC9D,EAAM,IAAI,CAAE,QAAO,cAAa,UAAS,cAAa,SAAQ,aAAY,EAAG,CAAO,CACxF"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cryptlex/web-components",
|
|
3
|
-
"version": "6.7.
|
|
3
|
+
"version": "6.7.16",
|
|
4
4
|
"description": "React component library for Cryptlex web applications",
|
|
5
5
|
"author": "Cryptlex",
|
|
6
6
|
"type": "module",
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
"*.{ts,tsx,css,json}": "prettier --write"
|
|
49
49
|
},
|
|
50
50
|
"peerDependencies": {
|
|
51
|
-
"@cryptlex/web-api-types": "2.
|
|
51
|
+
"@cryptlex/web-api-types": "2.175.0",
|
|
52
52
|
"@dnd-kit/core": "6.3.1",
|
|
53
53
|
"@dnd-kit/sortable": "10.0.0",
|
|
54
54
|
"@dnd-kit/utilities": "3.2.2",
|