@deckai/deck-ui 0.0.14 → 0.0.15
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/README.md +18 -2
- package/dist/components/AboutCard.cjs +1 -1
- package/dist/components/AboutCard.cjs.map +1 -1
- package/dist/components/AboutCard.d.cts +12 -0
- package/dist/components/AboutCard.d.ts +12 -0
- package/dist/components/AboutCard.js +1 -1
- package/dist/components/AboutCard.js.map +1 -1
- package/dist/components/Accordion.cjs +1 -1
- package/dist/components/Accordion.d.cts +26 -0
- package/dist/components/Accordion.d.ts +26 -0
- package/dist/components/Accordion.js +1 -1
- package/dist/components/AddWorkCard.cjs +1 -1
- package/dist/components/AddWorkCard.d.cts +9 -0
- package/dist/components/AddWorkCard.d.ts +9 -0
- package/dist/components/AddWorkCard.js +1 -1
- package/dist/components/Avatar.cjs +1 -1
- package/dist/components/Avatar.d.cts +12 -0
- package/dist/components/Avatar.d.ts +12 -0
- package/dist/components/Avatar.js +1 -1
- package/dist/components/Badge.cjs +1 -1
- package/dist/components/Badge.d.cts +13 -0
- package/dist/components/Badge.d.ts +13 -0
- package/dist/components/Badge.js +1 -1
- package/dist/components/Breadcrumbs.cjs +1 -1
- package/dist/components/Breadcrumbs.d.cts +15 -0
- package/dist/components/Breadcrumbs.d.ts +15 -0
- package/dist/components/Breadcrumbs.js +1 -1
- package/dist/components/Button.cjs +1 -1
- package/dist/components/Button.d.cts +38 -0
- package/dist/components/Button.d.ts +38 -0
- package/dist/components/Button.js +1 -1
- package/dist/components/Carousel.cjs +1 -1
- package/dist/components/Carousel.d.cts +12 -0
- package/dist/components/Carousel.d.ts +12 -0
- package/dist/components/Carousel.js +1 -1
- package/dist/components/Collapsible.cjs +1 -1
- package/dist/components/Collapsible.d.cts +12 -0
- package/dist/components/Collapsible.d.ts +12 -0
- package/dist/components/Collapsible.js +1 -1
- package/dist/components/Combobox.cjs +1 -1
- package/dist/components/Combobox.d.cts +29 -0
- package/dist/components/Combobox.d.ts +29 -0
- package/dist/components/Combobox.js +1 -1
- package/dist/components/ContactItem.cjs +1 -1
- package/dist/components/ContactItem.d.cts +10 -0
- package/dist/components/ContactItem.d.ts +10 -0
- package/dist/components/ContactItem.js +1 -1
- package/dist/components/Dropdown.cjs +1 -1
- package/dist/components/Dropdown.d.cts +18 -0
- package/dist/components/Dropdown.d.ts +18 -0
- package/dist/components/Dropdown.js +1 -1
- package/dist/components/EditButton.cjs +1 -1
- package/dist/components/EditButton.d.cts +12 -0
- package/dist/components/EditButton.d.ts +12 -0
- package/dist/components/EditButton.js +1 -1
- package/dist/components/Icon.cjs +1 -1
- package/dist/components/Icon.d.cts +19 -0
- package/dist/components/Icon.d.ts +19 -0
- package/dist/components/Icon.js +1 -1
- package/dist/components/IconRenderer.cjs +1 -1
- package/dist/components/IconRenderer.d.cts +13 -0
- package/dist/components/IconRenderer.d.ts +13 -0
- package/dist/components/IconRenderer.js +1 -1
- package/dist/components/Illustration.cjs +1 -1
- package/dist/components/Illustration.d.cts +10 -0
- package/dist/components/Illustration.d.ts +10 -0
- package/dist/components/Illustration.js +1 -1
- package/dist/components/Input.cjs +1 -1
- package/dist/components/Input.d.cts +20 -0
- package/dist/components/Input.d.ts +20 -0
- package/dist/components/Input.js +1 -1
- package/dist/components/Link.cjs +1 -1
- package/dist/components/Link.d.cts +13 -0
- package/dist/components/Link.d.ts +13 -0
- package/dist/components/Link.js +1 -1
- package/dist/components/Logo.cjs +1 -1
- package/dist/components/Logo.d.cts +8 -0
- package/dist/components/Logo.d.ts +8 -0
- package/dist/components/Logo.js +1 -1
- package/dist/components/MultiSelectCombobox.cjs +1 -1
- package/dist/components/MultiSelectCombobox.d.cts +25 -0
- package/dist/components/MultiSelectCombobox.d.ts +25 -0
- package/dist/components/MultiSelectCombobox.js +1 -1
- package/dist/components/Navbar.cjs +1 -1
- package/dist/components/Navbar.d.cts +22 -0
- package/dist/components/Navbar.d.ts +22 -0
- package/dist/components/Navbar.js +1 -1
- package/dist/components/NavbarItem.cjs +1 -1
- package/dist/components/NavbarItem.d.cts +13 -0
- package/dist/components/NavbarItem.d.ts +13 -0
- package/dist/components/NavbarItem.js +1 -1
- package/dist/components/Option.cjs +1 -1
- package/dist/components/Option.d.cts +16 -0
- package/dist/components/Option.d.ts +16 -0
- package/dist/components/Option.js +1 -1
- package/dist/components/Pressable.cjs +1 -1
- package/dist/components/Pressable.d.cts +6 -0
- package/dist/components/Pressable.d.ts +6 -0
- package/dist/components/Pressable.js +1 -1
- package/dist/components/ProfileCard.cjs +1 -1
- package/dist/components/ProfileCard.cjs.map +1 -1
- package/dist/components/ProfileCard.d.cts +17 -0
- package/dist/components/ProfileCard.d.ts +17 -0
- package/dist/components/ProfileCard.js +1 -1
- package/dist/components/ProfileCard.js.map +1 -1
- package/dist/components/ProgressBar.cjs +1 -1
- package/dist/components/ProgressBar.d.cts +21 -0
- package/dist/components/ProgressBar.d.ts +21 -0
- package/dist/components/ProgressBar.js +1 -1
- package/dist/components/SegmentedTabs.cjs +1 -1
- package/dist/components/SegmentedTabs.d.cts +16 -0
- package/dist/components/SegmentedTabs.d.ts +16 -0
- package/dist/components/SegmentedTabs.js +1 -1
- package/dist/components/Sidebar.cjs +1 -1
- package/dist/components/Sidebar.d.cts +37 -0
- package/dist/components/Sidebar.d.ts +37 -0
- package/dist/components/Sidebar.js +1 -1
- package/dist/components/SlideButton.cjs +3 -0
- package/dist/components/SlideButton.cjs.map +1 -0
- package/dist/components/SlideButton.d.cts +21 -0
- package/dist/components/SlideButton.d.ts +21 -0
- package/dist/components/SlideButton.js +3 -0
- package/dist/components/SlideButton.js.map +1 -0
- package/dist/components/SocialCard.cjs +1 -1
- package/dist/components/SocialCard.d.cts +12 -0
- package/dist/components/SocialCard.d.ts +12 -0
- package/dist/components/SocialCard.js +1 -1
- package/dist/components/Spinner.cjs +1 -1
- package/dist/components/Spinner.d.cts +54 -0
- package/dist/components/Spinner.d.ts +54 -0
- package/dist/components/Spinner.js +1 -1
- package/dist/components/Switch.cjs +1 -1
- package/dist/components/Switch.d.cts +13 -0
- package/dist/components/Switch.d.ts +13 -0
- package/dist/components/Switch.js +1 -1
- package/dist/components/Tabs.cjs +1 -1
- package/dist/components/Tabs.d.cts +17 -0
- package/dist/components/Tabs.d.ts +17 -0
- package/dist/components/Tabs.js +1 -1
- package/dist/components/Tag.cjs +1 -1
- package/dist/components/Tag.d.cts +12 -0
- package/dist/components/Tag.d.ts +12 -0
- package/dist/components/Tag.js +1 -1
- package/dist/components/Text.cjs +1 -1
- package/dist/components/Text.d.cts +42 -0
- package/dist/components/Text.d.ts +42 -0
- package/dist/components/Text.js +1 -1
- package/dist/components/TextArea.cjs +1 -1
- package/dist/components/TextArea.d.cts +19 -0
- package/dist/components/TextArea.d.ts +19 -0
- package/dist/components/TextArea.js +1 -1
- package/dist/components/Toast.cjs +1 -1
- package/dist/components/Toast.d.cts +35 -0
- package/dist/components/Toast.d.ts +35 -0
- package/dist/components/Toast.js +1 -1
- package/dist/components/ToastProvider.cjs +1 -1
- package/dist/components/ToastProvider.d.cts +8 -0
- package/dist/components/ToastProvider.d.ts +8 -0
- package/dist/components/ToastProvider.js +1 -1
- package/dist/components/Tooltip.cjs +1 -1
- package/dist/components/Tooltip.d.cts +16 -0
- package/dist/components/Tooltip.d.ts +16 -0
- package/dist/components/Tooltip.js +1 -1
- package/dist/components/WorkCard.cjs +1 -1
- package/dist/components/WorkCard.d.cts +14 -0
- package/dist/components/WorkCard.d.ts +14 -0
- package/dist/components/WorkCard.js +1 -1
- package/dist/index.cjs +2 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +191 -0
- package/dist/index.d.ts +191 -0
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/dist/styles/fonts.d.cts +2 -0
- package/dist/styles/fonts.d.ts +2 -0
- package/dist/styles/styles.d.cts +2 -0
- package/dist/styles/styles.d.ts +2 -0
- package/dist/tailwind-CuJn6tv4.d.cts +36 -0
- package/dist/tailwind-CuJn6tv4.d.ts +36 -0
- package/package.json +15 -16
|
@@ -6,5 +6,5 @@
|
|
|
6
6
|
transition-colors duration-200
|
|
7
7
|
disabled:opacity-50 disabled:pointer-events-none
|
|
8
8
|
hover:opacity-80 active:scale-95
|
|
9
|
-
truncate`,y,a==="filled"?$[t]:v[t],e),disabled:i||s,type:"button",...p},typeof r=="string"?n__namespace.createElement(T,{variant:["sm:body-default-bold","body-xxs-semibold"],color:"inherit"},r):r));g.displayName="Button";var A=n__namespace.forwardRef(({tabs:e,defaultValue:a,value:t,onChange:s,className:r},i)=>{let p=n__namespace.useCallback(o=>{s?.(o);},[s]);return n__namespace.createElement(l__namespace.Root,{ref:i,defaultValue:a||e[0]?.value,value:t,onValueChange:p,className:c("inline-flex items-center p-1 bg-gray-100 rounded-lg gap-1",r)},n__namespace.createElement(l__namespace.List,{"aria-label":"Select platform"},e.map(o=>n__namespace.createElement(l__namespace.Trigger,{key:o.value,value:o.value,asChild:!0},n__namespace.createElement(g,{variant:"filled",color:"black",className:c("min-w-[100px]","data-[state=inactive]:bg-transparent","data-[state=inactive]:text-gray-600","data-[state=active]:bg-white","data-[state=active]:text-black","data-[state=active]:shadow-sm")},o.label)))))});A.displayName="SegmentedTabs";
|
|
9
|
+
truncate`,y,a==="filled"?$[t]:v[t],e),disabled:i||s,type:"button",...p},typeof r=="string"?n__namespace.createElement(T,{variant:["sm:body-default-bold","body-xxs-semibold"],color:"inherit"},r):r));g.displayName="Button";var A=n__namespace.forwardRef(({tabs:e,defaultValue:a,value:t,onChange:s,className:r},i)=>{let p=n__namespace.useCallback(o=>{s?.(o);},[s]);return n__namespace.createElement(l__namespace.Root,{ref:i,defaultValue:a||e[0]?.value,value:t,onValueChange:p,className:c("inline-flex items-center p-1 bg-gray-100 rounded-lg gap-1",r)},n__namespace.createElement(l__namespace.List,{"aria-label":"Select platform"},e.map(o=>n__namespace.createElement(l__namespace.Trigger,{key:o.value,value:o.value,asChild:!0},n__namespace.createElement(g,{variant:"filled",color:"black",className:c("min-w-[100px]","data-[state=inactive]:bg-transparent","data-[state=inactive]:text-gray-600","data-[state=active]:bg-white","data-[state=active]:text-black","data-[state=active]:shadow-sm")},o.label)))))});A.displayName="SegmentedTabs";exports.SegmentedTabs=A;//# sourceMappingURL=SegmentedTabs.cjs.map
|
|
10
10
|
//# sourceMappingURL=SegmentedTabs.cjs.map
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
type Tab = {
|
|
4
|
+
value: string;
|
|
5
|
+
label: string;
|
|
6
|
+
};
|
|
7
|
+
type SegmentedTabsProps = {
|
|
8
|
+
tabs: Tab[];
|
|
9
|
+
defaultValue?: string;
|
|
10
|
+
value?: string;
|
|
11
|
+
onChange?: (value: string) => void;
|
|
12
|
+
className?: string;
|
|
13
|
+
};
|
|
14
|
+
declare const SegmentedTabs: React.ForwardRefExoticComponent<SegmentedTabsProps & React.RefAttributes<HTMLDivElement>>;
|
|
15
|
+
|
|
16
|
+
export { SegmentedTabs, type SegmentedTabsProps, type Tab };
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
type Tab = {
|
|
4
|
+
value: string;
|
|
5
|
+
label: string;
|
|
6
|
+
};
|
|
7
|
+
type SegmentedTabsProps = {
|
|
8
|
+
tabs: Tab[];
|
|
9
|
+
defaultValue?: string;
|
|
10
|
+
value?: string;
|
|
11
|
+
onChange?: (value: string) => void;
|
|
12
|
+
className?: string;
|
|
13
|
+
};
|
|
14
|
+
declare const SegmentedTabs: React.ForwardRefExoticComponent<SegmentedTabsProps & React.RefAttributes<HTMLDivElement>>;
|
|
15
|
+
|
|
16
|
+
export { SegmentedTabs, type SegmentedTabsProps, type Tab };
|
|
@@ -6,5 +6,5 @@ import*as n from'react';import n__default from'react';import*as l from'@radix-ui
|
|
|
6
6
|
transition-colors duration-200
|
|
7
7
|
disabled:opacity-50 disabled:pointer-events-none
|
|
8
8
|
hover:opacity-80 active:scale-95
|
|
9
|
-
truncate`,y,a==="filled"?$[t]:v[t],e),disabled:i||s,type:"button",...p},typeof r=="string"?n.createElement(T,{variant:["sm:body-default-bold","body-xxs-semibold"],color:"inherit"},r):r));g.displayName="Button";var A=n.forwardRef(({tabs:e,defaultValue:a,value:t,onChange:s,className:r},i)=>{let p=n.useCallback(o=>{s?.(o);},[s]);return n.createElement(l.Root,{ref:i,defaultValue:a||e[0]?.value,value:t,onValueChange:p,className:c("inline-flex items-center p-1 bg-gray-100 rounded-lg gap-1",r)},n.createElement(l.List,{"aria-label":"Select platform"},e.map(o=>n.createElement(l.Trigger,{key:o.value,value:o.value,asChild:!0},n.createElement(g,{variant:"filled",color:"black",className:c("min-w-[100px]","data-[state=inactive]:bg-transparent","data-[state=inactive]:text-gray-600","data-[state=active]:bg-white","data-[state=active]:text-black","data-[state=active]:shadow-sm")},o.label)))))});A.displayName="SegmentedTabs";
|
|
9
|
+
truncate`,y,a==="filled"?$[t]:v[t],e),disabled:i||s,type:"button",...p},typeof r=="string"?n.createElement(T,{variant:["sm:body-default-bold","body-xxs-semibold"],color:"inherit"},r):r));g.displayName="Button";var A=n.forwardRef(({tabs:e,defaultValue:a,value:t,onChange:s,className:r},i)=>{let p=n.useCallback(o=>{s?.(o);},[s]);return n.createElement(l.Root,{ref:i,defaultValue:a||e[0]?.value,value:t,onValueChange:p,className:c("inline-flex items-center p-1 bg-gray-100 rounded-lg gap-1",r)},n.createElement(l.List,{"aria-label":"Select platform"},e.map(o=>n.createElement(l.Trigger,{key:o.value,value:o.value,asChild:!0},n.createElement(g,{variant:"filled",color:"black",className:c("min-w-[100px]","data-[state=inactive]:bg-transparent","data-[state=inactive]:text-gray-600","data-[state=active]:bg-white","data-[state=active]:text-black","data-[state=active]:shadow-sm")},o.label)))))});A.displayName="SegmentedTabs";export{A as SegmentedTabs};//# sourceMappingURL=SegmentedTabs.js.map
|
|
10
10
|
//# sourceMappingURL=SegmentedTabs.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var a=require('react'),n=require('@radix-ui/react-dialog'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),icons=require('@deckai/icons');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var a__default=/*#__PURE__*/_interopDefault(a);var n__namespace=/*#__PURE__*/_interopNamespace(n);var $=typeof window<"u"?a.useEffect:()=>{},h=e=>{let[i,s]=a.useState(null),t=a.useCallback(o=>typeof window<"u"?window.matchMedia(o).matches:!1,[]);return $(()=>{s(t(e));},[e,t]),a.useEffect(()=>{if(typeof window<"u"){let o=window.matchMedia(e),r=()=>{s(t(e));};return o.addEventListener("change",r),()=>{o.removeEventListener("change",r);}}},[e,t]),i??!1};function c(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var x={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB",disabled:"#888888"},I={sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},N=e=>{if(!e)return {width:"24px",height:"24px"};let i=Array.isArray(e)?e:[e],s={},t;return i.forEach(o=>{if(typeof o=="number")t=`${o}px`;else {let[r,l]=o.split(":"),d=parseInt(l,10);s[`@media (min-width: ${I[r]})`]=`${d}px`;}}),{width:t||"24px",height:t||"24px",...Object.entries(s).reduce((o,[r,l])=>({...o,[r]:{width:l,height:l}}),{})}},g=a__default.default.forwardRef(({name:e,size:i=24,color:s="primary",title:t,className:o,style:r={},...l},d)=>{let f=icons.IconMap[e],p=N(i);return a__default.default.createElement("div",{className:c("flex justify-center items-center",o),style:{...p,"--icon-stroke":x[s],...r}},a__default.default.createElement(f,{ref:d,"aria-hidden":!t,"aria-label":t,stroke:e.includes("filled")?void 0:x[s],...l}))});g.displayName="Icon";var v="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";var b=a__default.default.forwardRef(({children:e,type:i="button",className:s,disabled:t,...o},r)=>a__default.default.createElement("button",{ref:r,type:i,disabled:t,className:c("appearance-none hover:opacity-80 transition-all active:scale-95",v,t&&"opacity-50 cursor-not-allowed",s),...o},e));b.displayName="Pressable";var oe=({children:e,open:i,onClose:s,width:t=480,className:o,title:r,footer:l,position:d="left"})=>{let f=h("(max-width: 834px)"),p=a.useCallback(C=>{C.key==="Escape"&&s();},[s]);a.useEffect(()=>(i?(document.addEventListener("keydown",p),document.body.style.overflow="hidden"):(document.removeEventListener("keydown",p),document.body.style.overflow="unset"),()=>{document.removeEventListener("keydown",p),document.body.style.overflow="unset";}),[i,p]);let m=a.useMemo(()=>d==="right"?{position:"right-0",enter:"data-[state=open]:animate-slide-in-from-right",exit:"data-[state=closed]:animate-slide-out-to-right",transform:"translate-x-full"}:{position:"left-0",enter:"data-[state=open]:animate-slide-in-from-left",exit:"data-[state=closed]:animate-slide-out-to-left",transform:"-translate-x-full"},[d]);return a__default.default.createElement(n__namespace.Root,{open:i,onOpenChange:s},a__default.default.createElement(n__namespace.Portal,null,a__default.default.createElement(n__namespace.Overlay,{className:c("fixed inset-0 z-50 bg-sidebarOverlay backdrop-blur-[2px]","data-[state=open]:animate-overlay-show","data-[state=closed]:animate-overlay-hide")}),a__default.default.createElement(n__namespace.Content,{className:c("fixed top-0 z-50 flex h-full flex-col bg-white",m.position,m.enter,m.exit,typeof window>"u"||!f?d==="right"?"border-l":"border-r":"w-full","border-stroke",o),style:{width:typeof window>"u"||!f?t:"100%"}},a__default.default.createElement("div",{className:"flex items-center justify-between border-b border-secondary-50 px-8 py-6"},a__default.default.createElement(n__namespace.Title,{className:"text-heading-xs text-center w-full"},r),a__default.default.createElement(n__namespace.Close,{asChild:!0},a__default.default.createElement(b,{className:"inline-flex items-center justify-center text-text-secondary hover:bg-secondary-100 rounded-lg","aria-label":"Close"},a__default.default.createElement(g,{name:"close",size:12})))),a__default.default.createElement("div",{className:"flex-1 overflow-y-auto p-6"},e),l&&a__default.default.createElement("div",{className:"px-6 pb-6 bg-background"},l))))};
|
|
1
|
+
'use strict';var a=require('react'),n=require('@radix-ui/react-dialog'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),icons=require('@deckai/icons');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var a__default=/*#__PURE__*/_interopDefault(a);var n__namespace=/*#__PURE__*/_interopNamespace(n);var $=typeof window<"u"?a.useEffect:()=>{},h=e=>{let[i,s]=a.useState(null),t=a.useCallback(o=>typeof window<"u"?window.matchMedia(o).matches:!1,[]);return $(()=>{s(t(e));},[e,t]),a.useEffect(()=>{if(typeof window<"u"){let o=window.matchMedia(e),r=()=>{s(t(e));};return o.addEventListener("change",r),()=>{o.removeEventListener("change",r);}}},[e,t]),i??!1};function c(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var x={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB",disabled:"#888888"},I={sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},N=e=>{if(!e)return {width:"24px",height:"24px"};let i=Array.isArray(e)?e:[e],s={},t;return i.forEach(o=>{if(typeof o=="number")t=`${o}px`;else {let[r,l]=o.split(":"),d=parseInt(l,10);s[`@media (min-width: ${I[r]})`]=`${d}px`;}}),{width:t||"24px",height:t||"24px",...Object.entries(s).reduce((o,[r,l])=>({...o,[r]:{width:l,height:l}}),{})}},g=a__default.default.forwardRef(({name:e,size:i=24,color:s="primary",title:t,className:o,style:r={},...l},d)=>{let f=icons.IconMap[e],p=N(i);return a__default.default.createElement("div",{className:c("flex justify-center items-center",o),style:{...p,"--icon-stroke":x[s],...r}},a__default.default.createElement(f,{ref:d,"aria-hidden":!t,"aria-label":t,stroke:e.includes("filled")?void 0:x[s],...l}))});g.displayName="Icon";var v="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";var b=a__default.default.forwardRef(({children:e,type:i="button",className:s,disabled:t,...o},r)=>a__default.default.createElement("button",{ref:r,type:i,disabled:t,className:c("appearance-none hover:opacity-80 transition-all active:scale-95",v,t&&"opacity-50 cursor-not-allowed",s),...o},e));b.displayName="Pressable";var oe=({children:e,open:i,onClose:s,width:t=480,className:o,title:r,footer:l,position:d="left"})=>{let f=h("(max-width: 834px)"),p=a.useCallback(C=>{C.key==="Escape"&&s();},[s]);a.useEffect(()=>(i?(document.addEventListener("keydown",p),document.body.style.overflow="hidden"):(document.removeEventListener("keydown",p),document.body.style.overflow="unset"),()=>{document.removeEventListener("keydown",p),document.body.style.overflow="unset";}),[i,p]);let m=a.useMemo(()=>d==="right"?{position:"right-0",enter:"data-[state=open]:animate-slide-in-from-right",exit:"data-[state=closed]:animate-slide-out-to-right",transform:"translate-x-full"}:{position:"left-0",enter:"data-[state=open]:animate-slide-in-from-left",exit:"data-[state=closed]:animate-slide-out-to-left",transform:"-translate-x-full"},[d]);return a__default.default.createElement(n__namespace.Root,{open:i,onOpenChange:s},a__default.default.createElement(n__namespace.Portal,null,a__default.default.createElement(n__namespace.Overlay,{className:c("fixed inset-0 z-50 bg-sidebarOverlay backdrop-blur-[2px]","data-[state=open]:animate-overlay-show","data-[state=closed]:animate-overlay-hide")}),a__default.default.createElement(n__namespace.Content,{className:c("fixed top-0 z-50 flex h-full flex-col bg-white",m.position,m.enter,m.exit,typeof window>"u"||!f?d==="right"?"border-l":"border-r":"w-full","border-stroke",o),style:{width:typeof window>"u"||!f?t:"100%"}},a__default.default.createElement("div",{className:"flex items-center justify-between border-b border-secondary-50 px-8 py-6"},a__default.default.createElement(n__namespace.Title,{className:"text-heading-xs text-center w-full"},r),a__default.default.createElement(n__namespace.Close,{asChild:!0},a__default.default.createElement(b,{className:"inline-flex items-center justify-center text-text-secondary hover:bg-secondary-100 rounded-lg","aria-label":"Close"},a__default.default.createElement(g,{name:"close",size:12})))),a__default.default.createElement("div",{className:"flex-1 overflow-y-auto p-6"},e),l&&a__default.default.createElement("div",{className:"px-6 pb-6 bg-background"},l))))};exports.Sidebar=oe;//# sourceMappingURL=Sidebar.cjs.map
|
|
2
2
|
//# sourceMappingURL=Sidebar.cjs.map
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import React__default, { ReactNode } from 'react';
|
|
2
|
+
|
|
3
|
+
type SidebarProps = {
|
|
4
|
+
/**
|
|
5
|
+
* The content to be rendered inside the sidebar
|
|
6
|
+
*/
|
|
7
|
+
children: ReactNode;
|
|
8
|
+
/**
|
|
9
|
+
* Whether the sidebar is open
|
|
10
|
+
*/
|
|
11
|
+
open: boolean;
|
|
12
|
+
/**
|
|
13
|
+
* Callback fired when the sidebar is closed
|
|
14
|
+
*/
|
|
15
|
+
onClose: () => void;
|
|
16
|
+
/** @default left */
|
|
17
|
+
position?: "left" | "right";
|
|
18
|
+
/**
|
|
19
|
+
* The width of the sidebar on desktop. Defaults to 480px.
|
|
20
|
+
*/
|
|
21
|
+
width?: number;
|
|
22
|
+
/**
|
|
23
|
+
* Additional class names to be applied to the sidebar
|
|
24
|
+
*/
|
|
25
|
+
className?: string;
|
|
26
|
+
/**
|
|
27
|
+
* The title to display in the header
|
|
28
|
+
*/
|
|
29
|
+
title?: string;
|
|
30
|
+
/**
|
|
31
|
+
* Optional footer content
|
|
32
|
+
*/
|
|
33
|
+
footer?: ReactNode;
|
|
34
|
+
};
|
|
35
|
+
declare const Sidebar: ({ children, open, onClose, width, className, title, footer, position }: SidebarProps) => React__default.JSX.Element;
|
|
36
|
+
|
|
37
|
+
export { Sidebar, type SidebarProps };
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import React__default, { ReactNode } from 'react';
|
|
2
|
+
|
|
3
|
+
type SidebarProps = {
|
|
4
|
+
/**
|
|
5
|
+
* The content to be rendered inside the sidebar
|
|
6
|
+
*/
|
|
7
|
+
children: ReactNode;
|
|
8
|
+
/**
|
|
9
|
+
* Whether the sidebar is open
|
|
10
|
+
*/
|
|
11
|
+
open: boolean;
|
|
12
|
+
/**
|
|
13
|
+
* Callback fired when the sidebar is closed
|
|
14
|
+
*/
|
|
15
|
+
onClose: () => void;
|
|
16
|
+
/** @default left */
|
|
17
|
+
position?: "left" | "right";
|
|
18
|
+
/**
|
|
19
|
+
* The width of the sidebar on desktop. Defaults to 480px.
|
|
20
|
+
*/
|
|
21
|
+
width?: number;
|
|
22
|
+
/**
|
|
23
|
+
* Additional class names to be applied to the sidebar
|
|
24
|
+
*/
|
|
25
|
+
className?: string;
|
|
26
|
+
/**
|
|
27
|
+
* The title to display in the header
|
|
28
|
+
*/
|
|
29
|
+
title?: string;
|
|
30
|
+
/**
|
|
31
|
+
* Optional footer content
|
|
32
|
+
*/
|
|
33
|
+
footer?: ReactNode;
|
|
34
|
+
};
|
|
35
|
+
declare const Sidebar: ({ children, open, onClose, width, className, title, footer, position }: SidebarProps) => React__default.JSX.Element;
|
|
36
|
+
|
|
37
|
+
export { Sidebar, type SidebarProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import a,{useCallback,useEffect,useMemo,useState}from'react';import*as n from'@radix-ui/react-dialog';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {IconMap}from'@deckai/icons';var $=typeof window<"u"?useEffect:()=>{},h=e=>{let[i,s]=useState(null),t=useCallback(o=>typeof window<"u"?window.matchMedia(o).matches:!1,[]);return $(()=>{s(t(e));},[e,t]),useEffect(()=>{if(typeof window<"u"){let o=window.matchMedia(e),r=()=>{s(t(e));};return o.addEventListener("change",r),()=>{o.removeEventListener("change",r);}}},[e,t]),i??!1};function c(...e){return twMerge(clsx(e))}var x={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB",disabled:"#888888"},I={sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},N=e=>{if(!e)return {width:"24px",height:"24px"};let i=Array.isArray(e)?e:[e],s={},t;return i.forEach(o=>{if(typeof o=="number")t=`${o}px`;else {let[r,l]=o.split(":"),d=parseInt(l,10);s[`@media (min-width: ${I[r]})`]=`${d}px`;}}),{width:t||"24px",height:t||"24px",...Object.entries(s).reduce((o,[r,l])=>({...o,[r]:{width:l,height:l}}),{})}},g=a.forwardRef(({name:e,size:i=24,color:s="primary",title:t,className:o,style:r={},...l},d)=>{let f=IconMap[e],p=N(i);return a.createElement("div",{className:c("flex justify-center items-center",o),style:{...p,"--icon-stroke":x[s],...r}},a.createElement(f,{ref:d,"aria-hidden":!t,"aria-label":t,stroke:e.includes("filled")?void 0:x[s],...l}))});g.displayName="Icon";var v="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";var b=a.forwardRef(({children:e,type:i="button",className:s,disabled:t,...o},r)=>a.createElement("button",{ref:r,type:i,disabled:t,className:c("appearance-none hover:opacity-80 transition-all active:scale-95",v,t&&"opacity-50 cursor-not-allowed",s),...o},e));b.displayName="Pressable";var oe=({children:e,open:i,onClose:s,width:t=480,className:o,title:r,footer:l,position:d="left"})=>{let f=h("(max-width: 834px)"),p=useCallback(C=>{C.key==="Escape"&&s();},[s]);useEffect(()=>(i?(document.addEventListener("keydown",p),document.body.style.overflow="hidden"):(document.removeEventListener("keydown",p),document.body.style.overflow="unset"),()=>{document.removeEventListener("keydown",p),document.body.style.overflow="unset";}),[i,p]);let m=useMemo(()=>d==="right"?{position:"right-0",enter:"data-[state=open]:animate-slide-in-from-right",exit:"data-[state=closed]:animate-slide-out-to-right",transform:"translate-x-full"}:{position:"left-0",enter:"data-[state=open]:animate-slide-in-from-left",exit:"data-[state=closed]:animate-slide-out-to-left",transform:"-translate-x-full"},[d]);return a.createElement(n.Root,{open:i,onOpenChange:s},a.createElement(n.Portal,null,a.createElement(n.Overlay,{className:c("fixed inset-0 z-50 bg-sidebarOverlay backdrop-blur-[2px]","data-[state=open]:animate-overlay-show","data-[state=closed]:animate-overlay-hide")}),a.createElement(n.Content,{className:c("fixed top-0 z-50 flex h-full flex-col bg-white",m.position,m.enter,m.exit,typeof window>"u"||!f?d==="right"?"border-l":"border-r":"w-full","border-stroke",o),style:{width:typeof window>"u"||!f?t:"100%"}},a.createElement("div",{className:"flex items-center justify-between border-b border-secondary-50 px-8 py-6"},a.createElement(n.Title,{className:"text-heading-xs text-center w-full"},r),a.createElement(n.Close,{asChild:!0},a.createElement(b,{className:"inline-flex items-center justify-center text-text-secondary hover:bg-secondary-100 rounded-lg","aria-label":"Close"},a.createElement(g,{name:"close",size:12})))),a.createElement("div",{className:"flex-1 overflow-y-auto p-6"},e),l&&a.createElement("div",{className:"px-6 pb-6 bg-background"},l))))};
|
|
1
|
+
import a,{useCallback,useEffect,useMemo,useState}from'react';import*as n from'@radix-ui/react-dialog';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {IconMap}from'@deckai/icons';var $=typeof window<"u"?useEffect:()=>{},h=e=>{let[i,s]=useState(null),t=useCallback(o=>typeof window<"u"?window.matchMedia(o).matches:!1,[]);return $(()=>{s(t(e));},[e,t]),useEffect(()=>{if(typeof window<"u"){let o=window.matchMedia(e),r=()=>{s(t(e));};return o.addEventListener("change",r),()=>{o.removeEventListener("change",r);}}},[e,t]),i??!1};function c(...e){return twMerge(clsx(e))}var x={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB",disabled:"#888888"},I={sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},N=e=>{if(!e)return {width:"24px",height:"24px"};let i=Array.isArray(e)?e:[e],s={},t;return i.forEach(o=>{if(typeof o=="number")t=`${o}px`;else {let[r,l]=o.split(":"),d=parseInt(l,10);s[`@media (min-width: ${I[r]})`]=`${d}px`;}}),{width:t||"24px",height:t||"24px",...Object.entries(s).reduce((o,[r,l])=>({...o,[r]:{width:l,height:l}}),{})}},g=a.forwardRef(({name:e,size:i=24,color:s="primary",title:t,className:o,style:r={},...l},d)=>{let f=IconMap[e],p=N(i);return a.createElement("div",{className:c("flex justify-center items-center",o),style:{...p,"--icon-stroke":x[s],...r}},a.createElement(f,{ref:d,"aria-hidden":!t,"aria-label":t,stroke:e.includes("filled")?void 0:x[s],...l}))});g.displayName="Icon";var v="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";var b=a.forwardRef(({children:e,type:i="button",className:s,disabled:t,...o},r)=>a.createElement("button",{ref:r,type:i,disabled:t,className:c("appearance-none hover:opacity-80 transition-all active:scale-95",v,t&&"opacity-50 cursor-not-allowed",s),...o},e));b.displayName="Pressable";var oe=({children:e,open:i,onClose:s,width:t=480,className:o,title:r,footer:l,position:d="left"})=>{let f=h("(max-width: 834px)"),p=useCallback(C=>{C.key==="Escape"&&s();},[s]);useEffect(()=>(i?(document.addEventListener("keydown",p),document.body.style.overflow="hidden"):(document.removeEventListener("keydown",p),document.body.style.overflow="unset"),()=>{document.removeEventListener("keydown",p),document.body.style.overflow="unset";}),[i,p]);let m=useMemo(()=>d==="right"?{position:"right-0",enter:"data-[state=open]:animate-slide-in-from-right",exit:"data-[state=closed]:animate-slide-out-to-right",transform:"translate-x-full"}:{position:"left-0",enter:"data-[state=open]:animate-slide-in-from-left",exit:"data-[state=closed]:animate-slide-out-to-left",transform:"-translate-x-full"},[d]);return a.createElement(n.Root,{open:i,onOpenChange:s},a.createElement(n.Portal,null,a.createElement(n.Overlay,{className:c("fixed inset-0 z-50 bg-sidebarOverlay backdrop-blur-[2px]","data-[state=open]:animate-overlay-show","data-[state=closed]:animate-overlay-hide")}),a.createElement(n.Content,{className:c("fixed top-0 z-50 flex h-full flex-col bg-white",m.position,m.enter,m.exit,typeof window>"u"||!f?d==="right"?"border-l":"border-r":"w-full","border-stroke",o),style:{width:typeof window>"u"||!f?t:"100%"}},a.createElement("div",{className:"flex items-center justify-between border-b border-secondary-50 px-8 py-6"},a.createElement(n.Title,{className:"text-heading-xs text-center w-full"},r),a.createElement(n.Close,{asChild:!0},a.createElement(b,{className:"inline-flex items-center justify-center text-text-secondary hover:bg-secondary-100 rounded-lg","aria-label":"Close"},a.createElement(g,{name:"close",size:12})))),a.createElement("div",{className:"flex-1 overflow-y-auto p-6"},e),l&&a.createElement("div",{className:"px-6 pb-6 bg-background"},l))))};export{oe as Sidebar};//# sourceMappingURL=Sidebar.js.map
|
|
2
2
|
//# sourceMappingURL=Sidebar.js.map
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
'use strict';var e=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var e__namespace=/*#__PURE__*/_interopNamespace(e);function L(...t){return tailwindMerge.twMerge(clsx.clsx(t))}var K={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},W=t=>{let[i,n]=t.split("-");return i==="heading"?K[n]||"p":i==="label"?"label":"p"},F={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},I=t=>t?(Array.isArray(t)?t:[t]).map(n=>{if(n.includes(":")){let[c,g]=n.split(":");return `${c}:text-${g}`}return `text-${n}`}).join(" "):"text-body-default",v=e__namespace.default.forwardRef(({variant:t="body-default",color:i="primary",as:n,className:c,children:g,weight:a,...R},x)=>{let w=I(t),m=i==="inherit"?"text-inherit":`text-text-${i}`,p=e__namespace.default.useMemo(()=>{let o=typeof t=="string"?t.split(":").pop():Array.isArray(t)?t[0].split(":").pop():"body-default";return W(o)},[t]);return e__namespace.default.createElement(n||p,{ref:x,className:`font-sans antialiased ${w} ${m} ${a?`!${F[a]}`:""} ${c??""}`,...R},g)});v.displayName="Text";var j=e__namespace.forwardRef(({text:t,confirmText:i="Confirmed!",onConfirm:n,variant:c="primary",className:g,disabled:a=!1,"aria-label":R,...x},w)=>{let[m,p]=e__namespace.useState(!1),[u,o]=e__namespace.useState(0),[l,T]=e__namespace.useState(!1),d=e__namespace.useRef(null),h=e__namespace.useRef(null),[N,D]=e__namespace.useState(!1),E={primary:{track:"bg-primary-100/10 hover:bg-primary-100/20",thumb:"bg-primary-100",text:"text-primary-100"},danger:{track:"bg-tertiary-5 hover:bg-tertiary-5",thumb:"bg-tertiary-10",text:"text-tertiary-10"}},$=e__namespace.useCallback(r=>{if(a||l)return;let f=h.current,b=d.current;if(!f||!b)return;let s=b.clientWidth-f.clientWidth;switch(r.key){case"ArrowRight":case"ArrowUp":r.preventDefault();let M=Math.min(s,u+s*.1);o(M),M>=s*.9&&(T(!0),o(s),n());break;case"ArrowLeft":case"ArrowDown":r.preventDefault(),o(Math.max(0,u-s*.1));break;case"Home":r.preventDefault(),o(0);break;case"End":r.preventDefault(),o(s),T(!0),n();break;case"Enter":case" ":r.preventDefault(),u>=s*.9&&(T(!0),o(s),n());break}},[a,l,n,u]),P=e__namespace.useCallback(r=>{a||l||(p(!0),r.preventDefault());},[a,l]),H=e__namespace.useCallback(r=>{if(!m||!d.current||!h.current)return;let f=d.current.getBoundingClientRect(),b=h.current.getBoundingClientRect(),s=f.width-b.width,M=Math.max(0,Math.min(s,r-f.left-b.width/2));o(M),M>=s*.9&&(p(!1),T(!0),o(s),n());},[m,n]),A=e__namespace.useCallback(r=>{H(r.clientX);},[H]),k=e__namespace.useCallback(r=>{H(r.touches[0].clientX);},[H]),y=e__namespace.useCallback(()=>{l||o(0),p(!1);},[l]);e__namespace.useEffect(()=>(m&&(document.addEventListener("mousemove",A),document.addEventListener("mouseup",y),document.addEventListener("touchmove",k),document.addEventListener("touchend",y)),()=>{document.removeEventListener("mousemove",A),document.removeEventListener("mouseup",y),document.removeEventListener("touchmove",k),document.removeEventListener("touchend",y);}),[m,A,k,y]),e__namespace.useEffect(()=>{a&&(o(0),T(!1),p(!1));},[a]);let S=e__namespace.useMemo(()=>{if(!d.current||!h.current)return 0;let r=d.current.clientWidth-h.current.clientWidth;return Math.round(u/r*100)},[u]);return e__namespace.createElement("div",{ref:w,className:L("relative h-12 rounded-full transition-colors",E[c].track,a&&"opacity-50 cursor-not-allowed",g),...x},e__namespace.createElement("div",{ref:d,role:"slider","aria-label":R||t,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":S,"aria-valuetext":l?i:`${S}% complete`,"aria-disabled":a,tabIndex:a?-1:0,className:"relative w-full h-full overflow-hidden rounded-full outline-none focus-visible:ring-2 focus-visible:ring-primary-100 focus-visible:ring-offset-2",onKeyDown:$,onFocus:()=>D(!0),onBlur:()=>D(!1)},e__namespace.createElement("div",{className:"absolute inset-0 flex items-center justify-center","aria-hidden":"true"},e__namespace.createElement(v,{variant:"body-default-semibold",className:L(E[c].text,"transition-opacity select-none",(m||l)&&"opacity-0")},t),e__namespace.createElement(v,{variant:"body-default-semibold",className:L(E[c].text,"transition-opacity select-none",!l&&"opacity-0")},i)),e__namespace.createElement("div",{ref:h,className:L("absolute top-1 bottom-1 left-1 w-10 rounded-full cursor-grab active:cursor-grabbing transition-transform",E[c].thumb,a&&"cursor-not-allowed",N&&"ring-2 ring-white"),style:{transform:`translateX(${u}px)`},onMouseDown:P,onTouchStart:P,"aria-hidden":"true"},e__namespace.createElement("div",{className:"absolute inset-0 flex items-center justify-center"},e__namespace.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e__namespace.createElement("path",{d:"M13.5 10L8.5 15L7.5 14L11.5 10L7.5 6L8.5 5L13.5 10Z",fill:"white"}))))))});j.displayName="SlideButton";
|
|
2
|
+
exports.SlideButton=j;//# sourceMappingURL=SlideButton.cjs.map
|
|
3
|
+
//# sourceMappingURL=SlideButton.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/SlideButton.tsx"],"names":["cn","inputs","twMerge","clsx","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","SlideButton","e","text","confirmText","onConfirm","disabled","ariaLabel","isDragging","setIsDragging","slidePosition","setSlidePosition","isConfirmed","setIsConfirmed","buttonRef","thumbRef","isFocused","setIsFocused","handleKeyDown","thumbElement","trackElement","maxSlide","newPosition","handleDragStart","handleDragMove","clientX","buttonRect","thumbRect","handleMouseMove","handleTouchMove","handleDragEnd","progressPercentage"],"mappings":"ucAGO,SAASA,KAAMC,CAAsB,CAAA,CAC1C,OAAOC,qBAAQC,CAAAA,SAAAA,CAAKF,CAAM,CAAC,CAC7B,CCiEA,IAAMG,CAAmD,CAAA,CACvD,GAAI,IACJ,CAAA,EAAA,CAAI,KACJ,EAAI,CAAA,IAAA,CACJ,EAAI,CAAA,IAAA,CACJ,EAAI,CAAA,IACN,EAEMC,CAAyBC,CAAAA,CAAAA,EAAwC,CACrE,GAAM,CAACC,EAAUC,CAAI,CAAA,CAAIF,CAAQ,CAAA,KAAA,CAAM,GAAG,CAAA,CAE1C,OAAIC,CAAa,GAAA,SAAA,CACRH,EAAoBI,CAAI,CAAA,EAAK,IAGlCD,CAAa,GAAA,OAAA,CACR,OAGF,CAAA,GACT,CAIME,CAAAA,CAAAA,CAAqC,CACzC,KAAO,CAAA,YAAA,CACP,QAAS,cACT,CAAA,QAAA,CAAU,gBACV,IAAM,CAAA,WACR,CA0BMC,CAAAA,CAAAA,CACJC,CAEKA,EAAAA,CAAAA,CAAAA,CAEgB,MAAM,OAAQA,CAAAA,CAAQ,EAAIA,CAAW,CAAA,CAACA,CAAQ,CAGhE,EAAA,GAAA,CAAKL,CAAY,EAAA,CAChB,GAAIA,CAAAA,CAAQ,SAAS,GAAG,CAAA,CAAG,CACzB,GAAM,CAACM,CAAAA,CAAYC,CAAe,CAAIP,CAAAA,CAAAA,CAAQ,KAAM,CAAA,GAAG,CACvD,CAAA,OAAO,GAAGM,CAAU,CAAA,MAAA,EAASC,CAAe,CAC9C,CAAA,CACA,OAAO,CAAQP,KAAAA,EAAAA,CAAO,CACxB,CAAA,CAAC,CACA,CAAA,IAAA,CAAK,GAAG,CAZW,CAAA,mBAAA,CAeXQ,EAAOC,oBAAM,CAAA,UAAA,CACxB,CACE,CACE,OAAA,CAAAT,CAAU,CAAA,cAAA,CACV,KAAAU,CAAAA,CAAAA,CAAQ,UACR,EAAAC,CAAAA,CAAAA,CACA,UAAAC,CACA,CAAA,QAAA,CAAAC,EACA,MAAAC,CAAAA,CAAAA,CACA,GAAGC,CACL,CACAC,CAAAA,CAAAA,GACG,CAEH,IAAMC,CAAAA,CAAoBb,CAAgBJ,CAAAA,CAAO,CAG3CkB,CAAAA,CAAAA,CACJR,IAAU,SAAY,CAAA,cAAA,CAAiB,CAAaA,UAAAA,EAAAA,CAAK,CAErDS,CAAAA,CAAAA,CAAAA,CAAmBV,qBAAM,OAAQ,CAAA,IAAM,CAC3C,IAAMW,CAAAA,CACJ,OAAOpB,CAAY,EAAA,QAAA,CACfA,CAAQ,CAAA,KAAA,CAAM,GAAG,CAAA,CAAE,KACnB,CAAA,KAAA,CAAM,QAAQA,CAAO,CAAA,CACnBA,EAAQ,CAAC,CAAA,CAAE,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,GACtB,cACR,CAAA,OAAOD,EAAsBqB,CAA4B,CAC3D,EAAG,CAACpB,CAAO,CAAC,CAAA,CAIZ,OAEES,oBAAAA,CAAA,cAJiBE,CAAMQ,EAAAA,CAAAA,CAItB,CACC,GAAA,CAAKH,CACL,CAAA,SAAA,CAAW,yBAAyBC,CAAiB,CAAA,CAAA,EAAIC,CAAY,CAAA,CAAA,EACnEJ,CAAS,CAAA,CAAA,CAAA,EAAIX,EAAWW,CAAM,CAAC,GAAK,EACtC,CAAA,CAAA,EAAIF,GAAa,EAAE,CAAA,CAAA,CAClB,GAAGG,CAAAA,CAAAA,CAEHF,CACH,CAEJ,CACF,CAEAL,CAAAA,CAAAA,CAAK,YAAc,MCzKZ,CAAA,IAAMa,EAAoBC,YAC/B,CAAA,UAAA,CAAA,CACE,CACE,IAAA,CAAAC,CACA,CAAA,WAAA,CAAAC,EAAc,YACd,CAAA,SAAA,CAAAC,EACA,OAAAzB,CAAAA,CAAAA,CAAU,UACV,SAAAY,CAAAA,CAAAA,CACA,QAAAc,CAAAA,CAAAA,CAAW,CACX,CAAA,CAAA,YAAA,CAAcC,EACd,GAAGZ,CACL,CACAC,CAAAA,CAAAA,GACG,CACH,GAAM,CAACY,CAAYC,CAAAA,CAAa,CAAU,CAAAP,YAAA,CAAA,QAAA,CAAS,CAAK,CAAA,CAAA,CAClD,CAACQ,CAAeC,CAAAA,CAAgB,EAAUT,YAAS,CAAA,QAAA,CAAA,CAAC,EACpD,CAACU,CAAAA,CAAaC,CAAc,CAAA,CAAUX,YAAS,CAAA,QAAA,CAAA,CAAA,CAAK,EACpDY,CAAkB,CAAAZ,YAAA,CAAA,MAAA,CAAuB,IAAI,CAC7Ca,CAAAA,CAAAA,CAAiBb,oBAAuB,IAAI,CAAA,CAC5C,CAACc,CAAAA,CAAWC,CAAY,CAAA,CAAUf,sBAAS,CAAK,CAAA,CAAA,CAEhDjB,EAAW,CACf,OAAA,CAAS,CACP,KAAO,CAAA,2CAAA,CACP,KAAO,CAAA,gBAAA,CACP,IAAM,CAAA,kBACR,EACA,MAAQ,CAAA,CACN,KAAO,CAAA,mCAAA,CACP,KAAO,CAAA,gBAAA,CACP,KAAM,kBACR,CACF,CAEMiC,CAAAA,CAAAA,CAAsBhB,YACzBA,CAAAA,WAAAA,CAAAA,CAAAA,EAA2B,CAC1B,GAAII,CAAAA,EAAYM,EAAa,OAE7B,IAAMO,EAAeJ,CAAS,CAAA,OAAA,CACxBK,CAAeN,CAAAA,CAAAA,CAAU,OAC/B,CAAA,GAAI,CAACK,CAAgB,EAAA,CAACC,EAAc,OAEpC,IAAMC,EAAWD,CAAa,CAAA,WAAA,CAAcD,CAAa,CAAA,WAAA,CAEzD,OAAQjB,CAAAA,CAAE,KACR,IAAK,aACL,IAAK,SAAA,CACHA,EAAE,cAAe,EAAA,CACjB,IAAMoB,CAAAA,CAAc,IAAK,CAAA,GAAA,CACvBD,EACAX,CAAgBW,CAAAA,CAAAA,CAAW,EAC7B,CAAA,CACAV,CAAiBW,CAAAA,CAAW,EAExBA,CAAeD,EAAAA,CAAAA,CAAW,EAC5BR,GAAAA,CAAAA,CAAe,CAAI,CAAA,CAAA,CACnBF,EAAiBU,CAAQ,CAAA,CACzBhB,GAEF,CAAA,CAAA,MACF,IAAK,WACL,CAAA,IAAK,WACHH,CAAAA,CAAAA,CAAE,cAAe,EAAA,CACjBS,EAAiB,IAAK,CAAA,GAAA,CAAI,EAAGD,CAAgBW,CAAAA,CAAAA,CAAW,EAAG,CAAC,CAAA,CAC5D,MACF,IAAK,MACHnB,CAAAA,CAAAA,CAAE,gBACFS,CAAAA,CAAAA,CAAiB,CAAC,CAClB,CAAA,MACF,IAAK,KACHT,CAAAA,CAAAA,CAAE,cAAe,EAAA,CACjBS,CAAiBU,CAAAA,CAAQ,EACzBR,CAAe,CAAA,CAAA,CAAI,CACnBR,CAAAA,CAAAA,EACA,CAAA,MACF,IAAK,OACL,CAAA,IAAK,GACHH,CAAAA,CAAAA,CAAE,cAAe,EAAA,CACbQ,GAAiBW,CAAW,CAAA,EAAA,GAC9BR,EAAe,CAAI,CAAA,CAAA,CACnBF,EAAiBU,CAAQ,CAAA,CACzBhB,CAAU,EAAA,CAAA,CAEZ,KACJ,CACF,EACA,CAACC,CAAAA,CAAUM,EAAaP,CAAWK,CAAAA,CAAa,CAClD,CAEMa,CAAAA,CAAAA,CAAwBrB,YAC3BA,CAAAA,WAAAA,CAAAA,CAAAA,EAA2C,CACtCI,CAAAA,EAAYM,IAChBH,CAAc,CAAA,CAAA,CAAI,EAElBP,CAAE,CAAA,cAAA,IACJ,CACA,CAAA,CAACI,CAAUM,CAAAA,CAAW,CACxB,CAAA,CAEMY,EAAuBtB,YAC1BuB,CAAAA,WAAAA,CAAAA,CAAAA,EAAoB,CACnB,GAAI,CAACjB,GAAc,CAACM,CAAAA,CAAU,OAAW,EAAA,CAACC,CAAS,CAAA,OAAA,CAAS,OAE5D,IAAMW,CAAAA,CAAaZ,EAAU,OAAQ,CAAA,qBAAA,GAC/Ba,CAAYZ,CAAAA,CAAAA,CAAS,OAAQ,CAAA,qBAAA,EAC7BM,CAAAA,CAAAA,CAAWK,EAAW,KAAQC,CAAAA,CAAAA,CAAU,MAExCL,CAAc,CAAA,IAAA,CAAK,IACvB,CACA,CAAA,IAAA,CAAK,GAAID,CAAAA,CAAAA,CAAUI,CAAUC,CAAAA,CAAAA,CAAW,KAAOC,CAAU,CAAA,KAAA,CAAQ,CAAC,CACpE,CAAA,CAEAhB,EAAiBW,CAAW,CAAA,CAGxBA,CAAeD,EAAAA,CAAAA,CAAW,EAC5BZ,GAAAA,CAAAA,CAAc,EAAK,CACnBI,CAAAA,CAAAA,CAAe,CAAI,CAAA,CAAA,CACnBF,CAAiBU,CAAAA,CAAQ,EACzBhB,CAAU,EAAA,EAEd,CACA,CAAA,CAACG,CAAYH,CAAAA,CAAS,CACxB,CAEMuB,CAAAA,CAAAA,CAAwB1B,yBAC3BA,CAAkB,EAAA,CACjBsB,EAAetB,CAAE,CAAA,OAAO,EAC1B,CAAA,CACA,CAACsB,CAAc,CACjB,CAEMK,CAAAA,CAAAA,CAAwB3B,yBAC3BA,CAAkB,EAAA,CACjBsB,EAAetB,CAAE,CAAA,OAAA,CAAQ,CAAC,CAAA,CAAE,OAAO,EACrC,EACA,CAACsB,CAAc,CACjB,CAEMM,CAAAA,CAAAA,CAAsB5B,yBAAY,IAAM,CACvCU,CACHD,EAAAA,CAAAA,CAAiB,CAAC,CAAA,CAEpBF,EAAc,CAAK,CAAA,EACrB,CAAG,CAAA,CAACG,CAAW,CAAC,EAEVV,YAAU,CAAA,SAAA,CAAA,KACVM,CACF,GAAA,QAAA,CAAS,gBAAiB,CAAA,WAAA,CAAaoB,CAAe,CACtD,CAAA,QAAA,CAAS,iBAAiB,SAAWE,CAAAA,CAAa,EAClD,QAAS,CAAA,gBAAA,CAAiB,WAAaD,CAAAA,CAAe,CACtD,CAAA,QAAA,CAAS,iBAAiB,UAAYC,CAAAA,CAAa,GAG9C,IAAM,CACX,SAAS,mBAAoB,CAAA,WAAA,CAAaF,CAAe,CAAA,CACzD,QAAS,CAAA,mBAAA,CAAoB,UAAWE,CAAa,CAAA,CACrD,SAAS,mBAAoB,CAAA,WAAA,CAAaD,CAAe,CACzD,CAAA,QAAA,CAAS,mBAAoB,CAAA,UAAA,CAAYC,CAAa,EACxD,GACC,CAACtB,CAAAA,CAAYoB,CAAiBC,CAAAA,CAAAA,CAAiBC,CAAa,CAAC,EAG1D5B,YAAU,CAAA,SAAA,CAAA,IAAM,CAChBI,CAAAA,GACFK,CAAiB,CAAA,CAAC,EAClBE,CAAe,CAAA,CAAA,CAAK,EACpBJ,CAAc,CAAA,CAAA,CAAK,GAEvB,CAAG,CAAA,CAACH,CAAQ,CAAC,CAEb,CAAA,IAAMyB,EAA2B7B,YAAQ,CAAA,OAAA,CAAA,IAAM,CAC7C,GAAI,CAACY,EAAU,OAAW,EAAA,CAACC,CAAS,CAAA,OAAA,CAAS,OAAO,CAAA,CACpD,IAAMM,CACJP,CAAAA,CAAAA,CAAU,QAAQ,WAAcC,CAAAA,CAAAA,CAAS,QAAQ,WACnD,CAAA,OAAO,IAAK,CAAA,KAAA,CAAOL,CAAgBW,CAAAA,CAAAA,CAAY,GAAG,CACpD,CAAA,CAAG,CAACX,CAAa,CAAC,CAAA,CAElB,OACER,YAAC,CAAA,aAAA,CAAA,KAAA,CAAA,CACC,GAAKN,CAAAA,CAAAA,CACL,SAAWtB,CAAAA,CAAAA,CACT,+CACAW,CAASL,CAAAA,CAAO,EAAE,KAClB0B,CAAAA,CAAAA,EAAY,gCACZd,CACF,CAAA,CACC,GAAGG,CAAAA,CAAAA,CAEJO,YAAC,CAAA,aAAA,CAAA,KAAA,CAAA,CACC,IAAKY,CACL,CAAA,IAAA,CAAK,SACL,YAAYP,CAAAA,CAAAA,EAAaJ,EACzB,eAAe,CAAA,CAAA,CACf,eAAe,CAAA,GAAA,CACf,eAAe4B,CAAAA,CAAAA,CACf,iBACEnB,CAAcR,CAAAA,CAAAA,CAAc,GAAG2B,CAAkB,CAAA,UAAA,CAAA,CAEnD,gBAAezB,CACf,CAAA,QAAA,CAAUA,CAAW,CAAA,CAAA,CAAA,CAAK,CAC1B,CAAA,SAAA,CAAU,mJACV,SAAWY,CAAAA,CAAAA,CACX,OAAS,CAAA,IAAMD,CAAa,CAAA,CAAA,CAAI,EAChC,MAAQ,CAAA,IAAMA,CAAa,CAAA,CAAA,CAAK,CAGhC,CAAA,CAAAf,YAAA,CAAA,aAAA,CAAC,OACC,SAAU,CAAA,mDAAA,CACV,cAAY,MAEZ,CAAA,CAAAA,YAAA,CAAA,aAAA,CAACd,EAAA,CACC,OAAA,CAAQ,uBACR,CAAA,SAAA,CAAWd,CACTW,CAAAA,CAAAA,CAASL,CAAO,CAAE,CAAA,IAAA,CAClB,kCACC4B,CAAcI,EAAAA,CAAAA,GAAgB,WACjC,CAECT,CAAAA,CAAAA,CACH,CACA,CAAAD,YAAA,CAAA,aAAA,CAACd,CAAA,CAAA,CACC,QAAQ,uBACR,CAAA,SAAA,CAAWd,EACTW,CAASL,CAAAA,CAAO,EAAE,IAClB,CAAA,gCAAA,CACA,CAACgC,CAAAA,EAAe,WAClB,CAAA,CAAA,CAECR,CACH,CACF,CAAA,CAGAF,YAAC,CAAA,aAAA,CAAA,KAAA,CAAA,CACC,GAAKa,CAAAA,CAAAA,CACL,UAAWzC,CACT,CAAA,0GAAA,CACAW,CAASL,CAAAA,CAAO,CAAE,CAAA,KAAA,CAClB0B,GAAY,oBACZU,CAAAA,CAAAA,EAAa,mBACf,CACA,CAAA,KAAA,CAAO,CACL,SAAW,CAAA,CAAA,WAAA,EAAcN,CAAa,CAAA,GAAA,CACxC,CACA,CAAA,WAAA,CAAaa,EACb,YAAcA,CAAAA,CAAAA,CACd,cAAY,MAEZ,CAAA,CAAArB,YAAA,CAAA,aAAA,CAAC,OAAI,SAAU,CAAA,mDAAA,CAAA,CACbA,YAAC,CAAA,aAAA,CAAA,KAAA,CAAA,CACC,KAAM,CAAA,IAAA,CACN,OAAO,IACP,CAAA,OAAA,CAAQ,YACR,IAAK,CAAA,MAAA,CACL,MAAM,4BACN,CAAA,aAAA,CAAY,MAEZ,CAAA,CAAAA,YAAA,CAAA,aAAA,CAAC,MACC,CAAA,CAAA,CAAA,CAAE,sDACF,IAAK,CAAA,OAAA,CACP,CACF,CACF,CACF,CACF,CACF,CAEJ,CACF,EAEAD,CAAAA,CAAY,WAAc,CAAA,aAAA","file":"SlideButton.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\n// Add breakpoint types\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses =\n color === \"inherit\" ? \"text-inherit\" : `text-text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`font-sans antialiased ${typographyClasses} ${colorClasses} ${\n weight ? `!${fontWeight[weight]}` : \"\"\n } ${className ?? \"\"}`}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as React from \"react\";\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\n\nexport type SlideButtonProps = {\n /** The text to display when not sliding */\n text: string;\n /** The text to display when sliding is complete */\n confirmText?: string;\n /** Callback fired when sliding is complete */\n onConfirm: () => void;\n /** Optional variant for different visual styles */\n variant?: \"primary\" | \"danger\";\n /** Optional className for custom styling */\n className?: string;\n /** Whether the button is disabled */\n disabled?: boolean;\n /** Optional ARIA label */\n \"aria-label\"?: string;\n};\n\nexport const SlideButton = React.forwardRef<HTMLDivElement, SlideButtonProps>(\n (\n {\n text,\n confirmText = \"Confirmed!\",\n onConfirm,\n variant = \"primary\",\n className,\n disabled = false,\n \"aria-label\": ariaLabel,\n ...props\n },\n ref\n ) => {\n const [isDragging, setIsDragging] = React.useState(false);\n const [slidePosition, setSlidePosition] = React.useState(0);\n const [isConfirmed, setIsConfirmed] = React.useState(false);\n const buttonRef = React.useRef<HTMLDivElement>(null);\n const thumbRef = React.useRef<HTMLDivElement>(null);\n const [isFocused, setIsFocused] = React.useState(false);\n\n const variants = {\n primary: {\n track: \"bg-primary-100/10 hover:bg-primary-100/20\",\n thumb: \"bg-primary-100\",\n text: \"text-primary-100\"\n },\n danger: {\n track: \"bg-tertiary-5 hover:bg-tertiary-5\",\n thumb: \"bg-tertiary-10\",\n text: \"text-tertiary-10\"\n }\n };\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (disabled || isConfirmed) return;\n\n const thumbElement = thumbRef.current;\n const trackElement = buttonRef.current;\n if (!thumbElement || !trackElement) return;\n\n const maxSlide = trackElement.clientWidth - thumbElement.clientWidth;\n\n switch (e.key) {\n case \"ArrowRight\":\n case \"ArrowUp\":\n e.preventDefault();\n const newPosition = Math.min(\n maxSlide,\n slidePosition + maxSlide * 0.1\n );\n setSlidePosition(newPosition);\n\n if (newPosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n case \"ArrowLeft\":\n case \"ArrowDown\":\n e.preventDefault();\n setSlidePosition(Math.max(0, slidePosition - maxSlide * 0.1));\n break;\n case \"Home\":\n e.preventDefault();\n setSlidePosition(0);\n break;\n case \"End\":\n e.preventDefault();\n setSlidePosition(maxSlide);\n setIsConfirmed(true);\n onConfirm();\n break;\n case \"Enter\":\n case \" \":\n e.preventDefault();\n if (slidePosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n }\n },\n [disabled, isConfirmed, onConfirm, slidePosition]\n );\n\n const handleDragStart = React.useCallback(\n (e: React.MouseEvent | React.TouchEvent) => {\n if (disabled || isConfirmed) return;\n setIsDragging(true);\n // Prevent text selection during drag\n e.preventDefault();\n },\n [disabled, isConfirmed]\n );\n\n const handleDragMove = React.useCallback(\n (clientX: number) => {\n if (!isDragging || !buttonRef.current || !thumbRef.current) return;\n\n const buttonRect = buttonRef.current.getBoundingClientRect();\n const thumbRect = thumbRef.current.getBoundingClientRect();\n const maxSlide = buttonRect.width - thumbRect.width;\n\n const newPosition = Math.max(\n 0,\n Math.min(maxSlide, clientX - buttonRect.left - thumbRect.width / 2)\n );\n\n setSlidePosition(newPosition);\n\n // Check if slide is complete (e.g., 90% of the way)\n if (newPosition >= maxSlide * 0.9) {\n setIsDragging(false);\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n },\n [isDragging, onConfirm]\n );\n\n const handleMouseMove = React.useCallback(\n (e: MouseEvent) => {\n handleDragMove(e.clientX);\n },\n [handleDragMove]\n );\n\n const handleTouchMove = React.useCallback(\n (e: TouchEvent) => {\n handleDragMove(e.touches[0].clientX);\n },\n [handleDragMove]\n );\n\n const handleDragEnd = React.useCallback(() => {\n if (!isConfirmed) {\n setSlidePosition(0);\n }\n setIsDragging(false);\n }, [isConfirmed]);\n\n React.useEffect(() => {\n if (isDragging) {\n document.addEventListener(\"mousemove\", handleMouseMove);\n document.addEventListener(\"mouseup\", handleDragEnd);\n document.addEventListener(\"touchmove\", handleTouchMove);\n document.addEventListener(\"touchend\", handleDragEnd);\n }\n\n return () => {\n document.removeEventListener(\"mousemove\", handleMouseMove);\n document.removeEventListener(\"mouseup\", handleDragEnd);\n document.removeEventListener(\"touchmove\", handleTouchMove);\n document.removeEventListener(\"touchend\", handleDragEnd);\n };\n }, [isDragging, handleMouseMove, handleTouchMove, handleDragEnd]);\n\n // Reset state when disabled prop changes\n React.useEffect(() => {\n if (disabled) {\n setSlidePosition(0);\n setIsConfirmed(false);\n setIsDragging(false);\n }\n }, [disabled]);\n\n const progressPercentage = React.useMemo(() => {\n if (!buttonRef.current || !thumbRef.current) return 0;\n const maxSlide =\n buttonRef.current.clientWidth - thumbRef.current.clientWidth;\n return Math.round((slidePosition / maxSlide) * 100);\n }, [slidePosition]);\n\n return (\n <div\n ref={ref}\n className={cn(\n \"relative h-12 rounded-full transition-colors\",\n variants[variant].track,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n <div\n ref={buttonRef}\n role=\"slider\"\n aria-label={ariaLabel || text}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-valuenow={progressPercentage}\n aria-valuetext={\n isConfirmed ? confirmText : `${progressPercentage}% complete`\n }\n aria-disabled={disabled}\n tabIndex={disabled ? -1 : 0}\n className=\"relative w-full h-full overflow-hidden rounded-full outline-none focus-visible:ring-2 focus-visible:ring-primary-100 focus-visible:ring-offset-2\"\n onKeyDown={handleKeyDown}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n >\n {/* Track text */}\n <div\n className=\"absolute inset-0 flex items-center justify-center\"\n aria-hidden=\"true\"\n >\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n (isDragging || isConfirmed) && \"opacity-0\"\n )}\n >\n {text}\n </Text>\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n !isConfirmed && \"opacity-0\"\n )}\n >\n {confirmText}\n </Text>\n </div>\n\n {/* Sliding thumb */}\n <div\n ref={thumbRef}\n className={cn(\n \"absolute top-1 bottom-1 left-1 w-10 rounded-full cursor-grab active:cursor-grabbing transition-transform\",\n variants[variant].thumb,\n disabled && \"cursor-not-allowed\",\n isFocused && \"ring-2 ring-white\"\n )}\n style={{\n transform: `translateX(${slidePosition}px)`\n }}\n onMouseDown={handleDragStart}\n onTouchStart={handleDragStart}\n aria-hidden=\"true\"\n >\n <div className=\"absolute inset-0 flex items-center justify-center\">\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M13.5 10L8.5 15L7.5 14L11.5 10L7.5 6L8.5 5L13.5 10Z\"\n fill=\"white\"\n />\n </svg>\n </div>\n </div>\n </div>\n </div>\n );\n }\n);\n\nSlideButton.displayName = \"SlideButton\";\n"]}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
type SlideButtonProps = {
|
|
4
|
+
/** The text to display when not sliding */
|
|
5
|
+
text: string;
|
|
6
|
+
/** The text to display when sliding is complete */
|
|
7
|
+
confirmText?: string;
|
|
8
|
+
/** Callback fired when sliding is complete */
|
|
9
|
+
onConfirm: () => void;
|
|
10
|
+
/** Optional variant for different visual styles */
|
|
11
|
+
variant?: "primary" | "danger";
|
|
12
|
+
/** Optional className for custom styling */
|
|
13
|
+
className?: string;
|
|
14
|
+
/** Whether the button is disabled */
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
/** Optional ARIA label */
|
|
17
|
+
"aria-label"?: string;
|
|
18
|
+
};
|
|
19
|
+
declare const SlideButton: React.ForwardRefExoticComponent<SlideButtonProps & React.RefAttributes<HTMLDivElement>>;
|
|
20
|
+
|
|
21
|
+
export { SlideButton, type SlideButtonProps };
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
type SlideButtonProps = {
|
|
4
|
+
/** The text to display when not sliding */
|
|
5
|
+
text: string;
|
|
6
|
+
/** The text to display when sliding is complete */
|
|
7
|
+
confirmText?: string;
|
|
8
|
+
/** Callback fired when sliding is complete */
|
|
9
|
+
onConfirm: () => void;
|
|
10
|
+
/** Optional variant for different visual styles */
|
|
11
|
+
variant?: "primary" | "danger";
|
|
12
|
+
/** Optional className for custom styling */
|
|
13
|
+
className?: string;
|
|
14
|
+
/** Whether the button is disabled */
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
/** Optional ARIA label */
|
|
17
|
+
"aria-label"?: string;
|
|
18
|
+
};
|
|
19
|
+
declare const SlideButton: React.ForwardRefExoticComponent<SlideButtonProps & React.RefAttributes<HTMLDivElement>>;
|
|
20
|
+
|
|
21
|
+
export { SlideButton, type SlideButtonProps };
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import*as e from'react';import e__default from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';function L(...t){return twMerge(clsx(t))}var K={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},W=t=>{let[i,n]=t.split("-");return i==="heading"?K[n]||"p":i==="label"?"label":"p"},F={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},I=t=>t?(Array.isArray(t)?t:[t]).map(n=>{if(n.includes(":")){let[c,g]=n.split(":");return `${c}:text-${g}`}return `text-${n}`}).join(" "):"text-body-default",v=e__default.forwardRef(({variant:t="body-default",color:i="primary",as:n,className:c,children:g,weight:a,...R},x)=>{let w=I(t),m=i==="inherit"?"text-inherit":`text-text-${i}`,p=e__default.useMemo(()=>{let o=typeof t=="string"?t.split(":").pop():Array.isArray(t)?t[0].split(":").pop():"body-default";return W(o)},[t]);return e__default.createElement(n||p,{ref:x,className:`font-sans antialiased ${w} ${m} ${a?`!${F[a]}`:""} ${c??""}`,...R},g)});v.displayName="Text";var j=e.forwardRef(({text:t,confirmText:i="Confirmed!",onConfirm:n,variant:c="primary",className:g,disabled:a=!1,"aria-label":R,...x},w)=>{let[m,p]=e.useState(!1),[u,o]=e.useState(0),[l,T]=e.useState(!1),d=e.useRef(null),h=e.useRef(null),[N,D]=e.useState(!1),E={primary:{track:"bg-primary-100/10 hover:bg-primary-100/20",thumb:"bg-primary-100",text:"text-primary-100"},danger:{track:"bg-tertiary-5 hover:bg-tertiary-5",thumb:"bg-tertiary-10",text:"text-tertiary-10"}},$=e.useCallback(r=>{if(a||l)return;let f=h.current,b=d.current;if(!f||!b)return;let s=b.clientWidth-f.clientWidth;switch(r.key){case"ArrowRight":case"ArrowUp":r.preventDefault();let M=Math.min(s,u+s*.1);o(M),M>=s*.9&&(T(!0),o(s),n());break;case"ArrowLeft":case"ArrowDown":r.preventDefault(),o(Math.max(0,u-s*.1));break;case"Home":r.preventDefault(),o(0);break;case"End":r.preventDefault(),o(s),T(!0),n();break;case"Enter":case" ":r.preventDefault(),u>=s*.9&&(T(!0),o(s),n());break}},[a,l,n,u]),P=e.useCallback(r=>{a||l||(p(!0),r.preventDefault());},[a,l]),H=e.useCallback(r=>{if(!m||!d.current||!h.current)return;let f=d.current.getBoundingClientRect(),b=h.current.getBoundingClientRect(),s=f.width-b.width,M=Math.max(0,Math.min(s,r-f.left-b.width/2));o(M),M>=s*.9&&(p(!1),T(!0),o(s),n());},[m,n]),A=e.useCallback(r=>{H(r.clientX);},[H]),k=e.useCallback(r=>{H(r.touches[0].clientX);},[H]),y=e.useCallback(()=>{l||o(0),p(!1);},[l]);e.useEffect(()=>(m&&(document.addEventListener("mousemove",A),document.addEventListener("mouseup",y),document.addEventListener("touchmove",k),document.addEventListener("touchend",y)),()=>{document.removeEventListener("mousemove",A),document.removeEventListener("mouseup",y),document.removeEventListener("touchmove",k),document.removeEventListener("touchend",y);}),[m,A,k,y]),e.useEffect(()=>{a&&(o(0),T(!1),p(!1));},[a]);let S=e.useMemo(()=>{if(!d.current||!h.current)return 0;let r=d.current.clientWidth-h.current.clientWidth;return Math.round(u/r*100)},[u]);return e.createElement("div",{ref:w,className:L("relative h-12 rounded-full transition-colors",E[c].track,a&&"opacity-50 cursor-not-allowed",g),...x},e.createElement("div",{ref:d,role:"slider","aria-label":R||t,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":S,"aria-valuetext":l?i:`${S}% complete`,"aria-disabled":a,tabIndex:a?-1:0,className:"relative w-full h-full overflow-hidden rounded-full outline-none focus-visible:ring-2 focus-visible:ring-primary-100 focus-visible:ring-offset-2",onKeyDown:$,onFocus:()=>D(!0),onBlur:()=>D(!1)},e.createElement("div",{className:"absolute inset-0 flex items-center justify-center","aria-hidden":"true"},e.createElement(v,{variant:"body-default-semibold",className:L(E[c].text,"transition-opacity select-none",(m||l)&&"opacity-0")},t),e.createElement(v,{variant:"body-default-semibold",className:L(E[c].text,"transition-opacity select-none",!l&&"opacity-0")},i)),e.createElement("div",{ref:h,className:L("absolute top-1 bottom-1 left-1 w-10 rounded-full cursor-grab active:cursor-grabbing transition-transform",E[c].thumb,a&&"cursor-not-allowed",N&&"ring-2 ring-white"),style:{transform:`translateX(${u}px)`},onMouseDown:P,onTouchStart:P,"aria-hidden":"true"},e.createElement("div",{className:"absolute inset-0 flex items-center justify-center"},e.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e.createElement("path",{d:"M13.5 10L8.5 15L7.5 14L11.5 10L7.5 6L8.5 5L13.5 10Z",fill:"white"}))))))});j.displayName="SlideButton";
|
|
2
|
+
export{j as SlideButton};//# sourceMappingURL=SlideButton.js.map
|
|
3
|
+
//# sourceMappingURL=SlideButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/SlideButton.tsx"],"names":["cn","inputs","twMerge","clsx","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","SlideButton","text","confirmText","onConfirm","disabled","ariaLabel","isDragging","setIsDragging","slidePosition","setSlidePosition","isConfirmed","setIsConfirmed","buttonRef","thumbRef","isFocused","setIsFocused","handleKeyDown","e","thumbElement","trackElement","maxSlide","newPosition","handleDragStart","handleDragMove","clientX","buttonRect","thumbRect","handleMouseMove","handleTouchMove","handleDragEnd","progressPercentage"],"mappings":"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","file":"SlideButton.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\n// Add breakpoint types\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses =\n color === \"inherit\" ? \"text-inherit\" : `text-text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`font-sans antialiased ${typographyClasses} ${colorClasses} ${\n weight ? `!${fontWeight[weight]}` : \"\"\n } ${className ?? \"\"}`}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as React from \"react\";\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\n\nexport type SlideButtonProps = {\n /** The text to display when not sliding */\n text: string;\n /** The text to display when sliding is complete */\n confirmText?: string;\n /** Callback fired when sliding is complete */\n onConfirm: () => void;\n /** Optional variant for different visual styles */\n variant?: \"primary\" | \"danger\";\n /** Optional className for custom styling */\n className?: string;\n /** Whether the button is disabled */\n disabled?: boolean;\n /** Optional ARIA label */\n \"aria-label\"?: string;\n};\n\nexport const SlideButton = React.forwardRef<HTMLDivElement, SlideButtonProps>(\n (\n {\n text,\n confirmText = \"Confirmed!\",\n onConfirm,\n variant = \"primary\",\n className,\n disabled = false,\n \"aria-label\": ariaLabel,\n ...props\n },\n ref\n ) => {\n const [isDragging, setIsDragging] = React.useState(false);\n const [slidePosition, setSlidePosition] = React.useState(0);\n const [isConfirmed, setIsConfirmed] = React.useState(false);\n const buttonRef = React.useRef<HTMLDivElement>(null);\n const thumbRef = React.useRef<HTMLDivElement>(null);\n const [isFocused, setIsFocused] = React.useState(false);\n\n const variants = {\n primary: {\n track: \"bg-primary-100/10 hover:bg-primary-100/20\",\n thumb: \"bg-primary-100\",\n text: \"text-primary-100\"\n },\n danger: {\n track: \"bg-tertiary-5 hover:bg-tertiary-5\",\n thumb: \"bg-tertiary-10\",\n text: \"text-tertiary-10\"\n }\n };\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (disabled || isConfirmed) return;\n\n const thumbElement = thumbRef.current;\n const trackElement = buttonRef.current;\n if (!thumbElement || !trackElement) return;\n\n const maxSlide = trackElement.clientWidth - thumbElement.clientWidth;\n\n switch (e.key) {\n case \"ArrowRight\":\n case \"ArrowUp\":\n e.preventDefault();\n const newPosition = Math.min(\n maxSlide,\n slidePosition + maxSlide * 0.1\n );\n setSlidePosition(newPosition);\n\n if (newPosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n case \"ArrowLeft\":\n case \"ArrowDown\":\n e.preventDefault();\n setSlidePosition(Math.max(0, slidePosition - maxSlide * 0.1));\n break;\n case \"Home\":\n e.preventDefault();\n setSlidePosition(0);\n break;\n case \"End\":\n e.preventDefault();\n setSlidePosition(maxSlide);\n setIsConfirmed(true);\n onConfirm();\n break;\n case \"Enter\":\n case \" \":\n e.preventDefault();\n if (slidePosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n }\n },\n [disabled, isConfirmed, onConfirm, slidePosition]\n );\n\n const handleDragStart = React.useCallback(\n (e: React.MouseEvent | React.TouchEvent) => {\n if (disabled || isConfirmed) return;\n setIsDragging(true);\n // Prevent text selection during drag\n e.preventDefault();\n },\n [disabled, isConfirmed]\n );\n\n const handleDragMove = React.useCallback(\n (clientX: number) => {\n if (!isDragging || !buttonRef.current || !thumbRef.current) return;\n\n const buttonRect = buttonRef.current.getBoundingClientRect();\n const thumbRect = thumbRef.current.getBoundingClientRect();\n const maxSlide = buttonRect.width - thumbRect.width;\n\n const newPosition = Math.max(\n 0,\n Math.min(maxSlide, clientX - buttonRect.left - thumbRect.width / 2)\n );\n\n setSlidePosition(newPosition);\n\n // Check if slide is complete (e.g., 90% of the way)\n if (newPosition >= maxSlide * 0.9) {\n setIsDragging(false);\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n },\n [isDragging, onConfirm]\n );\n\n const handleMouseMove = React.useCallback(\n (e: MouseEvent) => {\n handleDragMove(e.clientX);\n },\n [handleDragMove]\n );\n\n const handleTouchMove = React.useCallback(\n (e: TouchEvent) => {\n handleDragMove(e.touches[0].clientX);\n },\n [handleDragMove]\n );\n\n const handleDragEnd = React.useCallback(() => {\n if (!isConfirmed) {\n setSlidePosition(0);\n }\n setIsDragging(false);\n }, [isConfirmed]);\n\n React.useEffect(() => {\n if (isDragging) {\n document.addEventListener(\"mousemove\", handleMouseMove);\n document.addEventListener(\"mouseup\", handleDragEnd);\n document.addEventListener(\"touchmove\", handleTouchMove);\n document.addEventListener(\"touchend\", handleDragEnd);\n }\n\n return () => {\n document.removeEventListener(\"mousemove\", handleMouseMove);\n document.removeEventListener(\"mouseup\", handleDragEnd);\n document.removeEventListener(\"touchmove\", handleTouchMove);\n document.removeEventListener(\"touchend\", handleDragEnd);\n };\n }, [isDragging, handleMouseMove, handleTouchMove, handleDragEnd]);\n\n // Reset state when disabled prop changes\n React.useEffect(() => {\n if (disabled) {\n setSlidePosition(0);\n setIsConfirmed(false);\n setIsDragging(false);\n }\n }, [disabled]);\n\n const progressPercentage = React.useMemo(() => {\n if (!buttonRef.current || !thumbRef.current) return 0;\n const maxSlide =\n buttonRef.current.clientWidth - thumbRef.current.clientWidth;\n return Math.round((slidePosition / maxSlide) * 100);\n }, [slidePosition]);\n\n return (\n <div\n ref={ref}\n className={cn(\n \"relative h-12 rounded-full transition-colors\",\n variants[variant].track,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n <div\n ref={buttonRef}\n role=\"slider\"\n aria-label={ariaLabel || text}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-valuenow={progressPercentage}\n aria-valuetext={\n isConfirmed ? confirmText : `${progressPercentage}% complete`\n }\n aria-disabled={disabled}\n tabIndex={disabled ? -1 : 0}\n className=\"relative w-full h-full overflow-hidden rounded-full outline-none focus-visible:ring-2 focus-visible:ring-primary-100 focus-visible:ring-offset-2\"\n onKeyDown={handleKeyDown}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n >\n {/* Track text */}\n <div\n className=\"absolute inset-0 flex items-center justify-center\"\n aria-hidden=\"true\"\n >\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n (isDragging || isConfirmed) && \"opacity-0\"\n )}\n >\n {text}\n </Text>\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n !isConfirmed && \"opacity-0\"\n )}\n >\n {confirmText}\n </Text>\n </div>\n\n {/* Sliding thumb */}\n <div\n ref={thumbRef}\n className={cn(\n \"absolute top-1 bottom-1 left-1 w-10 rounded-full cursor-grab active:cursor-grabbing transition-transform\",\n variants[variant].thumb,\n disabled && \"cursor-not-allowed\",\n isFocused && \"ring-2 ring-white\"\n )}\n style={{\n transform: `translateX(${slidePosition}px)`\n }}\n onMouseDown={handleDragStart}\n onTouchStart={handleDragStart}\n aria-hidden=\"true\"\n >\n <div className=\"absolute inset-0 flex items-center justify-center\">\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M13.5 10L8.5 15L7.5 14L11.5 10L7.5 6L8.5 5L13.5 10Z\"\n fill=\"white\"\n />\n </svg>\n </div>\n </div>\n </div>\n </div>\n );\n }\n);\n\nSlideButton.displayName = \"SlideButton\";\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var a=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),icons=require('@deckai/icons');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var a__default=/*#__PURE__*/_interopDefault(a);var f="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";function m(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var g=a__default.default.forwardRef(({children:e,type:o="button",className:t,disabled:r,...s},n)=>a__default.default.createElement("button",{ref:n,type:o,disabled:r,className:m("appearance-none hover:opacity-80 transition-all active:scale-95",f,r&&"opacity-50 cursor-not-allowed",t),...s},e));g.displayName="Pressable";var b={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB",disabled:"#888888"},$={sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},R=e=>{if(!e)return {width:"24px",height:"24px"};let o=Array.isArray(e)?e:[e],t={},r;return o.forEach(s=>{if(typeof s=="number")r=`${s}px`;else {let[n,i]=s.split(":"),p=parseInt(i,10);t[`@media (min-width: ${$[n]})`]=`${p}px`;}}),{width:r||"24px",height:r||"24px",...Object.entries(t).reduce((s,[n,i])=>({...s,[n]:{width:i,height:i}}),{})}},l=a__default.default.forwardRef(({name:e,size:o=24,color:t="primary",title:r,className:s,style:n={},...i},p)=>{let d=icons.IconMap[e],y=R(o);return a__default.default.createElement("div",{className:m("flex justify-center items-center",s),style:{...y,"--icon-stroke":b[t],...n}},a__default.default.createElement(d,{ref:p,"aria-hidden":!r,"aria-label":r,stroke:e.includes("filled")?void 0:b[t],...i}))});l.displayName="Icon";var A={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},C=e=>{let[o,t]=e.split("-");return o==="heading"?A[t]||"p":o==="label"?"label":"p"},P={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},S=e=>e?(Array.isArray(e)?e:[e]).map(t=>{if(t.includes(":")){let[r,s]=t.split(":");return `${r}:text-${s}`}return `text-${t}`}).join(" "):"text-body-default",c=a__default.default.forwardRef(({variant:e="body-default",color:o="primary",as:t,className:r,children:s,weight:n,...i},p)=>{let d=S(e),y=o==="inherit"?"text-inherit":`text-text-${o}`,x=a__default.default.useMemo(()=>{let H=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return C(H)},[e]);return a__default.default.createElement(t||x,{ref:p,className:`font-sans antialiased ${d} ${y} ${n?`!${P[n]}`:""} ${r??""}`,...i},s)});c.displayName="Text";var ee=({icon:e,followers:o,engagement:t,...r})=>a__default.default.createElement(g,{className:"sm:w-max w-full hover:bg-secondary-400",...r},a__default.default.createElement("div",{className:"flex sm:flex-row flex-col items-center sm:gap-4 gap-1 sm:px-6 sm:py-4 p-2 border border-secondary rounded-lg"},a__default.default.createElement(l,{name:e,size:["lg:40",32],color:"primaryBlue"}),a__default.default.createElement("div",{className:"flex items-center sm:pt-0 pt-3"},a__default.default.createElement(l,{name:"profile",size:["sm:20",16]}),a__default.default.createElement(c,{variant:["body-default-medium","md:body-xs-medium"]},o)),a__default.default.createElement("div",{className:"flex items-center"},a__default.default.createElement(l,{name:"like-1",size:["sm:20",16]}),a__default.default.createElement(c,{variant:["body-default-medium","md:body-xs-medium"]},t))));
|
|
1
|
+
'use strict';var a=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),icons=require('@deckai/icons');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var a__default=/*#__PURE__*/_interopDefault(a);var f="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";function m(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var g=a__default.default.forwardRef(({children:e,type:o="button",className:t,disabled:r,...s},n)=>a__default.default.createElement("button",{ref:n,type:o,disabled:r,className:m("appearance-none hover:opacity-80 transition-all active:scale-95",f,r&&"opacity-50 cursor-not-allowed",t),...s},e));g.displayName="Pressable";var b={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB",disabled:"#888888"},$={sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},R=e=>{if(!e)return {width:"24px",height:"24px"};let o=Array.isArray(e)?e:[e],t={},r;return o.forEach(s=>{if(typeof s=="number")r=`${s}px`;else {let[n,i]=s.split(":"),p=parseInt(i,10);t[`@media (min-width: ${$[n]})`]=`${p}px`;}}),{width:r||"24px",height:r||"24px",...Object.entries(t).reduce((s,[n,i])=>({...s,[n]:{width:i,height:i}}),{})}},l=a__default.default.forwardRef(({name:e,size:o=24,color:t="primary",title:r,className:s,style:n={},...i},p)=>{let d=icons.IconMap[e],y=R(o);return a__default.default.createElement("div",{className:m("flex justify-center items-center",s),style:{...y,"--icon-stroke":b[t],...n}},a__default.default.createElement(d,{ref:p,"aria-hidden":!r,"aria-label":r,stroke:e.includes("filled")?void 0:b[t],...i}))});l.displayName="Icon";var A={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},C=e=>{let[o,t]=e.split("-");return o==="heading"?A[t]||"p":o==="label"?"label":"p"},P={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},S=e=>e?(Array.isArray(e)?e:[e]).map(t=>{if(t.includes(":")){let[r,s]=t.split(":");return `${r}:text-${s}`}return `text-${t}`}).join(" "):"text-body-default",c=a__default.default.forwardRef(({variant:e="body-default",color:o="primary",as:t,className:r,children:s,weight:n,...i},p)=>{let d=S(e),y=o==="inherit"?"text-inherit":`text-text-${o}`,x=a__default.default.useMemo(()=>{let H=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return C(H)},[e]);return a__default.default.createElement(t||x,{ref:p,className:`font-sans antialiased ${d} ${y} ${n?`!${P[n]}`:""} ${r??""}`,...i},s)});c.displayName="Text";var ee=({icon:e,followers:o,engagement:t,...r})=>a__default.default.createElement(g,{className:"sm:w-max w-full hover:bg-secondary-400",...r},a__default.default.createElement("div",{className:"flex sm:flex-row flex-col items-center sm:gap-4 gap-1 sm:px-6 sm:py-4 p-2 border border-secondary rounded-lg"},a__default.default.createElement(l,{name:e,size:["lg:40",32],color:"primaryBlue"}),a__default.default.createElement("div",{className:"flex items-center sm:pt-0 pt-3"},a__default.default.createElement(l,{name:"profile",size:["sm:20",16]}),a__default.default.createElement(c,{variant:["body-default-medium","md:body-xs-medium"]},o)),a__default.default.createElement("div",{className:"flex items-center"},a__default.default.createElement(l,{name:"like-1",size:["sm:20",16]}),a__default.default.createElement(c,{variant:["body-default-medium","md:body-xs-medium"]},t))));exports.SocialCard=ee;//# sourceMappingURL=SocialCard.cjs.map
|
|
2
2
|
//# sourceMappingURL=SocialCard.cjs.map
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { PressableProps } from './Pressable.cjs';
|
|
3
|
+
import { IconName } from '@deckai/icons';
|
|
4
|
+
|
|
5
|
+
type SocialCardProps = {
|
|
6
|
+
icon: IconName;
|
|
7
|
+
followers: string;
|
|
8
|
+
engagement: string;
|
|
9
|
+
} & PressableProps;
|
|
10
|
+
declare const SocialCard: ({ icon, followers, engagement, ...pressableProps }: SocialCardProps) => React__default.JSX.Element;
|
|
11
|
+
|
|
12
|
+
export { SocialCard, type SocialCardProps };
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { PressableProps } from './Pressable.js';
|
|
3
|
+
import { IconName } from '@deckai/icons';
|
|
4
|
+
|
|
5
|
+
type SocialCardProps = {
|
|
6
|
+
icon: IconName;
|
|
7
|
+
followers: string;
|
|
8
|
+
engagement: string;
|
|
9
|
+
} & PressableProps;
|
|
10
|
+
declare const SocialCard: ({ icon, followers, engagement, ...pressableProps }: SocialCardProps) => React__default.JSX.Element;
|
|
11
|
+
|
|
12
|
+
export { SocialCard, type SocialCardProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import a from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {IconMap}from'@deckai/icons';var f="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";function m(...e){return twMerge(clsx(e))}var g=a.forwardRef(({children:e,type:o="button",className:t,disabled:r,...s},n)=>a.createElement("button",{ref:n,type:o,disabled:r,className:m("appearance-none hover:opacity-80 transition-all active:scale-95",f,r&&"opacity-50 cursor-not-allowed",t),...s},e));g.displayName="Pressable";var b={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB",disabled:"#888888"},$={sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},R=e=>{if(!e)return {width:"24px",height:"24px"};let o=Array.isArray(e)?e:[e],t={},r;return o.forEach(s=>{if(typeof s=="number")r=`${s}px`;else {let[n,i]=s.split(":"),p=parseInt(i,10);t[`@media (min-width: ${$[n]})`]=`${p}px`;}}),{width:r||"24px",height:r||"24px",...Object.entries(t).reduce((s,[n,i])=>({...s,[n]:{width:i,height:i}}),{})}},l=a.forwardRef(({name:e,size:o=24,color:t="primary",title:r,className:s,style:n={},...i},p)=>{let d=IconMap[e],y=R(o);return a.createElement("div",{className:m("flex justify-center items-center",s),style:{...y,"--icon-stroke":b[t],...n}},a.createElement(d,{ref:p,"aria-hidden":!r,"aria-label":r,stroke:e.includes("filled")?void 0:b[t],...i}))});l.displayName="Icon";var A={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},C=e=>{let[o,t]=e.split("-");return o==="heading"?A[t]||"p":o==="label"?"label":"p"},P={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},S=e=>e?(Array.isArray(e)?e:[e]).map(t=>{if(t.includes(":")){let[r,s]=t.split(":");return `${r}:text-${s}`}return `text-${t}`}).join(" "):"text-body-default",c=a.forwardRef(({variant:e="body-default",color:o="primary",as:t,className:r,children:s,weight:n,...i},p)=>{let d=S(e),y=o==="inherit"?"text-inherit":`text-text-${o}`,x=a.useMemo(()=>{let H=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return C(H)},[e]);return a.createElement(t||x,{ref:p,className:`font-sans antialiased ${d} ${y} ${n?`!${P[n]}`:""} ${r??""}`,...i},s)});c.displayName="Text";var ee=({icon:e,followers:o,engagement:t,...r})=>a.createElement(g,{className:"sm:w-max w-full hover:bg-secondary-400",...r},a.createElement("div",{className:"flex sm:flex-row flex-col items-center sm:gap-4 gap-1 sm:px-6 sm:py-4 p-2 border border-secondary rounded-lg"},a.createElement(l,{name:e,size:["lg:40",32],color:"primaryBlue"}),a.createElement("div",{className:"flex items-center sm:pt-0 pt-3"},a.createElement(l,{name:"profile",size:["sm:20",16]}),a.createElement(c,{variant:["body-default-medium","md:body-xs-medium"]},o)),a.createElement("div",{className:"flex items-center"},a.createElement(l,{name:"like-1",size:["sm:20",16]}),a.createElement(c,{variant:["body-default-medium","md:body-xs-medium"]},t))));
|
|
1
|
+
import a from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {IconMap}from'@deckai/icons';var f="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";function m(...e){return twMerge(clsx(e))}var g=a.forwardRef(({children:e,type:o="button",className:t,disabled:r,...s},n)=>a.createElement("button",{ref:n,type:o,disabled:r,className:m("appearance-none hover:opacity-80 transition-all active:scale-95",f,r&&"opacity-50 cursor-not-allowed",t),...s},e));g.displayName="Pressable";var b={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB",disabled:"#888888"},$={sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},R=e=>{if(!e)return {width:"24px",height:"24px"};let o=Array.isArray(e)?e:[e],t={},r;return o.forEach(s=>{if(typeof s=="number")r=`${s}px`;else {let[n,i]=s.split(":"),p=parseInt(i,10);t[`@media (min-width: ${$[n]})`]=`${p}px`;}}),{width:r||"24px",height:r||"24px",...Object.entries(t).reduce((s,[n,i])=>({...s,[n]:{width:i,height:i}}),{})}},l=a.forwardRef(({name:e,size:o=24,color:t="primary",title:r,className:s,style:n={},...i},p)=>{let d=IconMap[e],y=R(o);return a.createElement("div",{className:m("flex justify-center items-center",s),style:{...y,"--icon-stroke":b[t],...n}},a.createElement(d,{ref:p,"aria-hidden":!r,"aria-label":r,stroke:e.includes("filled")?void 0:b[t],...i}))});l.displayName="Icon";var A={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},C=e=>{let[o,t]=e.split("-");return o==="heading"?A[t]||"p":o==="label"?"label":"p"},P={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},S=e=>e?(Array.isArray(e)?e:[e]).map(t=>{if(t.includes(":")){let[r,s]=t.split(":");return `${r}:text-${s}`}return `text-${t}`}).join(" "):"text-body-default",c=a.forwardRef(({variant:e="body-default",color:o="primary",as:t,className:r,children:s,weight:n,...i},p)=>{let d=S(e),y=o==="inherit"?"text-inherit":`text-text-${o}`,x=a.useMemo(()=>{let H=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return C(H)},[e]);return a.createElement(t||x,{ref:p,className:`font-sans antialiased ${d} ${y} ${n?`!${P[n]}`:""} ${r??""}`,...i},s)});c.displayName="Text";var ee=({icon:e,followers:o,engagement:t,...r})=>a.createElement(g,{className:"sm:w-max w-full hover:bg-secondary-400",...r},a.createElement("div",{className:"flex sm:flex-row flex-col items-center sm:gap-4 gap-1 sm:px-6 sm:py-4 p-2 border border-secondary rounded-lg"},a.createElement(l,{name:e,size:["lg:40",32],color:"primaryBlue"}),a.createElement("div",{className:"flex items-center sm:pt-0 pt-3"},a.createElement(l,{name:"profile",size:["sm:20",16]}),a.createElement(c,{variant:["body-default-medium","md:body-xs-medium"]},o)),a.createElement("div",{className:"flex items-center"},a.createElement(l,{name:"like-1",size:["sm:20",16]}),a.createElement(c,{variant:["body-default-medium","md:body-xs-medium"]},t))));export{ee as SocialCard};//# sourceMappingURL=SocialCard.js.map
|
|
2
2
|
//# sourceMappingURL=SocialCard.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var d=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var d__namespace=/*#__PURE__*/_interopNamespace(d);var f=t=>typeof t=="boolean"?`${t}`:t===0?"0":t,y=clsx.clsx,V=(t,r)=>e=>{var o;if(r?.variants==null)return y(t,e?.class,e?.className);let{variants:u,defaultVariants:a}=r,b=Object.keys(u).map(n=>{let s=e?.[n],l=a?.[n];if(s===null)return null;let i=f(s)||f(l);return u[n][i]}),c=e&&Object.entries(e).reduce((n,s)=>{let[l,i]=s;return i===void 0||(n[l]=i),n},{}),x=r==null||(o=r.compoundVariants)===null||o===void 0?void 0:o.reduce((n,s)=>{let{class:l,className:i,...h}=s;return Object.entries(h).every(N=>{let[v,m]=N;return Array.isArray(m)?m.includes({...a,...c}[v]):{...a,...c}[v]===m})?[...n,l,i]:n},[]);return y(t,b,x,e?.class,e?.className)};function p(...t){return tailwindMerge.twMerge(clsx.clsx(t))}var g=V("animate-spin rounded-full border-current border-t-transparent",{variants:{size:{sm:"h-4 w-4 border-3",md:"h-6 w-6 border-4",lg:"h-8 w-8 border-8"}},defaultVariants:{size:"md"}}),M=d__namespace.forwardRef(({size:t,className:r,customSize:e,...o},u)=>{let a=e?{width:e,height:e,borderWidth:Math.max(2,Math.floor(e/16))}:{};return d__namespace.createElement("div",{role:"status","aria-label":"Loading",ref:u,className:p(g({size:t}),"text-primary-100",r),style:a,...o},d__namespace.createElement("span",{className:"sr-only"},"Loading..."))});M.displayName="Spinner";
|
|
1
|
+
'use strict';var d=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var d__namespace=/*#__PURE__*/_interopNamespace(d);var f=t=>typeof t=="boolean"?`${t}`:t===0?"0":t,y=clsx.clsx,V=(t,r)=>e=>{var o;if(r?.variants==null)return y(t,e?.class,e?.className);let{variants:u,defaultVariants:a}=r,b=Object.keys(u).map(n=>{let s=e?.[n],l=a?.[n];if(s===null)return null;let i=f(s)||f(l);return u[n][i]}),c=e&&Object.entries(e).reduce((n,s)=>{let[l,i]=s;return i===void 0||(n[l]=i),n},{}),x=r==null||(o=r.compoundVariants)===null||o===void 0?void 0:o.reduce((n,s)=>{let{class:l,className:i,...h}=s;return Object.entries(h).every(N=>{let[v,m]=N;return Array.isArray(m)?m.includes({...a,...c}[v]):{...a,...c}[v]===m})?[...n,l,i]:n},[]);return y(t,b,x,e?.class,e?.className)};function p(...t){return tailwindMerge.twMerge(clsx.clsx(t))}var g=V("animate-spin rounded-full border-current border-t-transparent",{variants:{size:{sm:"h-4 w-4 border-3",md:"h-6 w-6 border-4",lg:"h-8 w-8 border-8"}},defaultVariants:{size:"md"}}),M=d__namespace.forwardRef(({size:t,className:r,customSize:e,...o},u)=>{let a=e?{width:e,height:e,borderWidth:Math.max(2,Math.floor(e/16))}:{};return d__namespace.createElement("div",{role:"status","aria-label":"Loading",ref:u,className:p(g({size:t}),"text-primary-100",r),style:a,...o},d__namespace.createElement("span",{className:"sr-only"},"Loading..."))});M.displayName="Spinner";exports.Spinner=M;//# sourceMappingURL=Spinner.cjs.map
|
|
2
2
|
//# sourceMappingURL=Spinner.cjs.map
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Copyright 2022 Joe Bell. All rights reserved.
|
|
6
|
+
*
|
|
7
|
+
* This file is licensed to you under the Apache License, Version 2.0
|
|
8
|
+
* (the "License"); you may not use this file except in compliance with the
|
|
9
|
+
* License. You may obtain a copy of the License at
|
|
10
|
+
*
|
|
11
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
12
|
+
*
|
|
13
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
14
|
+
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
|
15
|
+
* WARRANTIES OR REPRESENTATIONS OF ANY KIND, either express or implied. See the
|
|
16
|
+
* License for the specific language governing permissions and limitations under
|
|
17
|
+
* the License.
|
|
18
|
+
*/
|
|
19
|
+
|
|
20
|
+
type OmitUndefined<T> = T extends undefined ? never : T;
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* Copyright 2022 Joe Bell. All rights reserved.
|
|
24
|
+
*
|
|
25
|
+
* This file is licensed to you under the Apache License, Version 2.0
|
|
26
|
+
* (the "License"); you may not use this file except in compliance with the
|
|
27
|
+
* License. You may obtain a copy of the License at
|
|
28
|
+
*
|
|
29
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
30
|
+
*
|
|
31
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
32
|
+
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
|
33
|
+
* WARRANTIES OR REPRESENTATIONS OF ANY KIND, either express or implied. See the
|
|
34
|
+
* License for the specific language governing permissions and limitations under
|
|
35
|
+
* the License.
|
|
36
|
+
*/
|
|
37
|
+
|
|
38
|
+
type VariantProps<Component extends (...args: any) => any> = Omit<OmitUndefined<Parameters<Component>[0]>, "class" | "className">;
|
|
39
|
+
|
|
40
|
+
declare const spinnerVariants: (props?: ({
|
|
41
|
+
size?: "lg" | "md" | "sm" | null | undefined;
|
|
42
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
43
|
+
type SpinnerProps = {
|
|
44
|
+
className?: string;
|
|
45
|
+
customSize?: number;
|
|
46
|
+
} & VariantProps<typeof spinnerVariants>;
|
|
47
|
+
declare const Spinner: React.ForwardRefExoticComponent<{
|
|
48
|
+
className?: string;
|
|
49
|
+
customSize?: number;
|
|
50
|
+
} & VariantProps<(props?: ({
|
|
51
|
+
size?: "lg" | "md" | "sm" | null | undefined;
|
|
52
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
|
|
53
|
+
|
|
54
|
+
export { Spinner, type SpinnerProps };
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Copyright 2022 Joe Bell. All rights reserved.
|
|
6
|
+
*
|
|
7
|
+
* This file is licensed to you under the Apache License, Version 2.0
|
|
8
|
+
* (the "License"); you may not use this file except in compliance with the
|
|
9
|
+
* License. You may obtain a copy of the License at
|
|
10
|
+
*
|
|
11
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
12
|
+
*
|
|
13
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
14
|
+
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
|
15
|
+
* WARRANTIES OR REPRESENTATIONS OF ANY KIND, either express or implied. See the
|
|
16
|
+
* License for the specific language governing permissions and limitations under
|
|
17
|
+
* the License.
|
|
18
|
+
*/
|
|
19
|
+
|
|
20
|
+
type OmitUndefined<T> = T extends undefined ? never : T;
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* Copyright 2022 Joe Bell. All rights reserved.
|
|
24
|
+
*
|
|
25
|
+
* This file is licensed to you under the Apache License, Version 2.0
|
|
26
|
+
* (the "License"); you may not use this file except in compliance with the
|
|
27
|
+
* License. You may obtain a copy of the License at
|
|
28
|
+
*
|
|
29
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
30
|
+
*
|
|
31
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
32
|
+
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
|
33
|
+
* WARRANTIES OR REPRESENTATIONS OF ANY KIND, either express or implied. See the
|
|
34
|
+
* License for the specific language governing permissions and limitations under
|
|
35
|
+
* the License.
|
|
36
|
+
*/
|
|
37
|
+
|
|
38
|
+
type VariantProps<Component extends (...args: any) => any> = Omit<OmitUndefined<Parameters<Component>[0]>, "class" | "className">;
|
|
39
|
+
|
|
40
|
+
declare const spinnerVariants: (props?: ({
|
|
41
|
+
size?: "lg" | "md" | "sm" | null | undefined;
|
|
42
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
43
|
+
type SpinnerProps = {
|
|
44
|
+
className?: string;
|
|
45
|
+
customSize?: number;
|
|
46
|
+
} & VariantProps<typeof spinnerVariants>;
|
|
47
|
+
declare const Spinner: React.ForwardRefExoticComponent<{
|
|
48
|
+
className?: string;
|
|
49
|
+
customSize?: number;
|
|
50
|
+
} & VariantProps<(props?: ({
|
|
51
|
+
size?: "lg" | "md" | "sm" | null | undefined;
|
|
52
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
|
|
53
|
+
|
|
54
|
+
export { Spinner, type SpinnerProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as d from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';var f=t=>typeof t=="boolean"?`${t}`:t===0?"0":t,y=clsx,V=(t,r)=>e=>{var o;if(r?.variants==null)return y(t,e?.class,e?.className);let{variants:u,defaultVariants:a}=r,b=Object.keys(u).map(n=>{let s=e?.[n],l=a?.[n];if(s===null)return null;let i=f(s)||f(l);return u[n][i]}),c=e&&Object.entries(e).reduce((n,s)=>{let[l,i]=s;return i===void 0||(n[l]=i),n},{}),x=r==null||(o=r.compoundVariants)===null||o===void 0?void 0:o.reduce((n,s)=>{let{class:l,className:i,...h}=s;return Object.entries(h).every(N=>{let[v,m]=N;return Array.isArray(m)?m.includes({...a,...c}[v]):{...a,...c}[v]===m})?[...n,l,i]:n},[]);return y(t,b,x,e?.class,e?.className)};function p(...t){return twMerge(clsx(t))}var g=V("animate-spin rounded-full border-current border-t-transparent",{variants:{size:{sm:"h-4 w-4 border-3",md:"h-6 w-6 border-4",lg:"h-8 w-8 border-8"}},defaultVariants:{size:"md"}}),M=d.forwardRef(({size:t,className:r,customSize:e,...o},u)=>{let a=e?{width:e,height:e,borderWidth:Math.max(2,Math.floor(e/16))}:{};return d.createElement("div",{role:"status","aria-label":"Loading",ref:u,className:p(g({size:t}),"text-primary-100",r),style:a,...o},d.createElement("span",{className:"sr-only"},"Loading..."))});M.displayName="Spinner";
|
|
1
|
+
import*as d from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';var f=t=>typeof t=="boolean"?`${t}`:t===0?"0":t,y=clsx,V=(t,r)=>e=>{var o;if(r?.variants==null)return y(t,e?.class,e?.className);let{variants:u,defaultVariants:a}=r,b=Object.keys(u).map(n=>{let s=e?.[n],l=a?.[n];if(s===null)return null;let i=f(s)||f(l);return u[n][i]}),c=e&&Object.entries(e).reduce((n,s)=>{let[l,i]=s;return i===void 0||(n[l]=i),n},{}),x=r==null||(o=r.compoundVariants)===null||o===void 0?void 0:o.reduce((n,s)=>{let{class:l,className:i,...h}=s;return Object.entries(h).every(N=>{let[v,m]=N;return Array.isArray(m)?m.includes({...a,...c}[v]):{...a,...c}[v]===m})?[...n,l,i]:n},[]);return y(t,b,x,e?.class,e?.className)};function p(...t){return twMerge(clsx(t))}var g=V("animate-spin rounded-full border-current border-t-transparent",{variants:{size:{sm:"h-4 w-4 border-3",md:"h-6 w-6 border-4",lg:"h-8 w-8 border-8"}},defaultVariants:{size:"md"}}),M=d.forwardRef(({size:t,className:r,customSize:e,...o},u)=>{let a=e?{width:e,height:e,borderWidth:Math.max(2,Math.floor(e/16))}:{};return d.createElement("div",{role:"status","aria-label":"Loading",ref:u,className:p(g({size:t}),"text-primary-100",r),style:a,...o},d.createElement("span",{className:"sr-only"},"Loading..."))});M.displayName="Spinner";export{M as Spinner};//# sourceMappingURL=Spinner.js.map
|
|
2
2
|
//# sourceMappingURL=Spinner.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var t=require('react'),e=require('@radix-ui/react-switch'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var t__namespace=/*#__PURE__*/_interopNamespace(t);var e__namespace=/*#__PURE__*/_interopNamespace(e);function i(...s){return tailwindMerge.twMerge(clsx.clsx(s))}var n="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";var p=t__namespace.forwardRef(({className:s,label:o,description:r,...a},c)=>t__namespace.createElement("div",{className:"flex items-center gap-2"},t__namespace.createElement(e__namespace.Root,{className:i("peer inline-flex h-6 w-11 shrink-0 cursor-pointer","items-center rounded-full border-2 border-transparent","transition-colors focus-visible:outline-none",n,"disabled:cursor-not-allowed disabled:opacity-50","data-[state=checked]:bg-primary-50 data-[state=unchecked]:bg-secondary-50",s),...a,ref:c},t__namespace.createElement(e__namespace.Thumb,{className:i("pointer-events-none block h-5 w-5","rounded-full bg-white shadow-lg ring-0","transition-transform","data-[state=checked]:translate-x-5","data-[state=unchecked]:translate-x-0")})),(o||r)&&t__namespace.createElement("div",{className:"flex flex-col"},o&&t__namespace.createElement("label",{className:"text-sm font-medium text-text",htmlFor:a.id},o),r&&t__namespace.createElement("span",{className:"text-xs text-text-secondary"},r))));p.displayName="Switch";
|
|
1
|
+
'use strict';var t=require('react'),e=require('@radix-ui/react-switch'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var t__namespace=/*#__PURE__*/_interopNamespace(t);var e__namespace=/*#__PURE__*/_interopNamespace(e);function i(...s){return tailwindMerge.twMerge(clsx.clsx(s))}var n="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";var p=t__namespace.forwardRef(({className:s,label:o,description:r,...a},c)=>t__namespace.createElement("div",{className:"flex items-center gap-2"},t__namespace.createElement(e__namespace.Root,{className:i("peer inline-flex h-6 w-11 shrink-0 cursor-pointer","items-center rounded-full border-2 border-transparent","transition-colors focus-visible:outline-none",n,"disabled:cursor-not-allowed disabled:opacity-50","data-[state=checked]:bg-primary-50 data-[state=unchecked]:bg-secondary-50",s),...a,ref:c},t__namespace.createElement(e__namespace.Thumb,{className:i("pointer-events-none block h-5 w-5","rounded-full bg-white shadow-lg ring-0","transition-transform","data-[state=checked]:translate-x-5","data-[state=unchecked]:translate-x-0")})),(o||r)&&t__namespace.createElement("div",{className:"flex flex-col"},o&&t__namespace.createElement("label",{className:"text-sm font-medium text-text",htmlFor:a.id},o),r&&t__namespace.createElement("span",{className:"text-xs text-text-secondary"},r))));p.displayName="Switch";exports.Switch=p;//# sourceMappingURL=Switch.cjs.map
|
|
2
2
|
//# sourceMappingURL=Switch.cjs.map
|