@deckai/deck-ui 0.0.22 → 0.0.23
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 +0 -1
- package/dist/components/AboutCard.cjs +3 -3
- package/dist/components/AboutCard.cjs.map +1 -1
- package/dist/components/AboutCard.d.cts +1 -1
- package/dist/components/AboutCard.d.ts +1 -1
- package/dist/components/AboutCard.js +3 -3
- package/dist/components/AboutCard.js.map +1 -1
- package/dist/components/Accordion.cjs +2 -2
- package/dist/components/Accordion.cjs.map +1 -1
- package/dist/components/Accordion.js +2 -2
- package/dist/components/Accordion.js.map +1 -1
- package/dist/components/AddWorkCard.cjs +4 -4
- package/dist/components/AddWorkCard.cjs.map +1 -1
- package/dist/components/AddWorkCard.d.cts +1 -1
- package/dist/components/AddWorkCard.d.ts +1 -1
- package/dist/components/AddWorkCard.js +4 -4
- package/dist/components/AddWorkCard.js.map +1 -1
- package/dist/components/AutocompleteInput.cjs +4 -4
- package/dist/components/AutocompleteInput.cjs.map +1 -1
- package/dist/components/AutocompleteInput.d.cts +6 -6
- package/dist/components/AutocompleteInput.d.ts +6 -6
- package/dist/components/AutocompleteInput.js +4 -4
- package/dist/components/AutocompleteInput.js.map +1 -1
- package/dist/components/Avatar.cjs +1 -1
- package/dist/components/Avatar.cjs.map +1 -1
- package/dist/components/Avatar.d.cts +2 -2
- package/dist/components/Avatar.d.ts +2 -2
- package/dist/components/Avatar.js +1 -1
- package/dist/components/Avatar.js.map +1 -1
- package/dist/components/Badge.cjs +4 -4
- package/dist/components/Badge.cjs.map +1 -1
- package/dist/components/Badge.d.cts +2 -2
- package/dist/components/Badge.d.ts +2 -2
- package/dist/components/Badge.js +4 -4
- package/dist/components/Badge.js.map +1 -1
- package/dist/components/Breadcrumbs.cjs +2 -2
- package/dist/components/Breadcrumbs.cjs.map +1 -1
- package/dist/components/Breadcrumbs.js +2 -2
- package/dist/components/Breadcrumbs.js.map +1 -1
- package/dist/components/Button.cjs +5 -5
- package/dist/components/Button.cjs.map +1 -1
- package/dist/components/Button.d.cts +5 -5
- package/dist/components/Button.d.ts +5 -5
- package/dist/components/Button.js +5 -5
- package/dist/components/Button.js.map +1 -1
- package/dist/components/Carousel.cjs +1 -1
- package/dist/components/Carousel.cjs.map +1 -1
- package/dist/components/Carousel.d.cts +1 -1
- package/dist/components/Carousel.d.ts +1 -1
- package/dist/components/Carousel.js +1 -1
- package/dist/components/Carousel.js.map +1 -1
- package/dist/components/Collapsible.cjs +2 -2
- package/dist/components/Collapsible.cjs.map +1 -1
- package/dist/components/Collapsible.d.cts +4 -4
- package/dist/components/Collapsible.d.ts +4 -4
- package/dist/components/Collapsible.js +2 -2
- package/dist/components/Collapsible.js.map +1 -1
- package/dist/components/Combobox.cjs +4 -4
- package/dist/components/Combobox.cjs.map +1 -1
- package/dist/components/Combobox.d.cts +5 -2
- package/dist/components/Combobox.d.ts +5 -2
- package/dist/components/Combobox.js +4 -4
- package/dist/components/Combobox.js.map +1 -1
- package/dist/components/ContactItem.cjs +3 -3
- package/dist/components/ContactItem.cjs.map +1 -1
- package/dist/components/ContactItem.d.cts +1 -1
- package/dist/components/ContactItem.d.ts +1 -1
- package/dist/components/ContactItem.js +3 -3
- package/dist/components/ContactItem.js.map +1 -1
- package/dist/components/Dropdown.cjs +3 -3
- package/dist/components/Dropdown.cjs.map +1 -1
- package/dist/components/Dropdown.js +3 -3
- package/dist/components/Dropdown.js.map +1 -1
- package/dist/components/EditButton.cjs +5 -5
- package/dist/components/EditButton.cjs.map +1 -1
- package/dist/components/EditButton.d.cts +4 -4
- package/dist/components/EditButton.d.ts +4 -4
- package/dist/components/EditButton.js +5 -5
- package/dist/components/EditButton.js.map +1 -1
- package/dist/components/Fallback.cjs +1 -1
- package/dist/components/Fallback.cjs.map +1 -1
- package/dist/components/Fallback.js +1 -1
- package/dist/components/Fallback.js.map +1 -1
- package/dist/components/Icon.cjs +1 -1
- package/dist/components/Icon.cjs.map +1 -1
- package/dist/components/Icon.js +1 -1
- package/dist/components/Icon.js.map +1 -1
- package/dist/components/IconRenderer.cjs +1 -1
- package/dist/components/IconRenderer.cjs.map +1 -1
- package/dist/components/IconRenderer.d.cts +4 -4
- package/dist/components/IconRenderer.d.ts +4 -4
- package/dist/components/IconRenderer.js +1 -1
- package/dist/components/IconRenderer.js.map +1 -1
- package/dist/components/Input.cjs +3 -3
- package/dist/components/Input.cjs.map +1 -1
- package/dist/components/Input.d.cts +11 -11
- package/dist/components/Input.d.ts +11 -11
- package/dist/components/Input.js +3 -3
- package/dist/components/Input.js.map +1 -1
- package/dist/components/Link.cjs +4 -4
- package/dist/components/Link.cjs.map +1 -1
- package/dist/components/Link.d.cts +1 -1
- package/dist/components/Link.d.ts +1 -1
- package/dist/components/Link.js +4 -4
- package/dist/components/Link.js.map +1 -1
- package/dist/components/Logo.cjs +1 -1
- package/dist/components/Logo.cjs.map +1 -1
- package/dist/components/Logo.d.cts +1 -1
- package/dist/components/Logo.d.ts +1 -1
- package/dist/components/Logo.js +1 -1
- package/dist/components/Logo.js.map +1 -1
- package/dist/components/Modal.cjs +1 -1
- package/dist/components/Modal.cjs.map +1 -1
- package/dist/components/Modal.d.cts +4 -4
- package/dist/components/Modal.d.ts +4 -4
- package/dist/components/Modal.js +1 -1
- package/dist/components/Modal.js.map +1 -1
- package/dist/components/MultiSelectCombobox.cjs +2 -2
- package/dist/components/MultiSelectCombobox.cjs.map +1 -1
- package/dist/components/MultiSelectCombobox.d.cts +1 -1
- package/dist/components/MultiSelectCombobox.d.ts +1 -1
- package/dist/components/MultiSelectCombobox.js +2 -2
- package/dist/components/MultiSelectCombobox.js.map +1 -1
- package/dist/components/Navbar.cjs +7 -7
- package/dist/components/Navbar.cjs.map +1 -1
- package/dist/components/Navbar.d.cts +1 -1
- package/dist/components/Navbar.d.ts +1 -1
- package/dist/components/Navbar.js +7 -7
- package/dist/components/Navbar.js.map +1 -1
- package/dist/components/NavbarItem.cjs +4 -4
- package/dist/components/NavbarItem.cjs.map +1 -1
- package/dist/components/NavbarItem.d.cts +1 -1
- package/dist/components/NavbarItem.d.ts +1 -1
- package/dist/components/NavbarItem.js +4 -4
- package/dist/components/NavbarItem.js.map +1 -1
- package/dist/components/Option.cjs +2 -2
- package/dist/components/Option.cjs.map +1 -1
- package/dist/components/Option.js +2 -2
- package/dist/components/Option.js.map +1 -1
- package/dist/components/Pressable.cjs +1 -1
- package/dist/components/Pressable.cjs.map +1 -1
- package/dist/components/Pressable.js +1 -1
- package/dist/components/Pressable.js.map +1 -1
- package/dist/components/ProfileCard.cjs +2 -2
- package/dist/components/ProfileCard.cjs.map +1 -1
- package/dist/components/ProfileCard.d.cts +1 -1
- package/dist/components/ProfileCard.d.ts +1 -1
- package/dist/components/ProfileCard.js +2 -2
- package/dist/components/ProfileCard.js.map +1 -1
- package/dist/components/ProgressBar.cjs +3 -3
- package/dist/components/ProgressBar.cjs.map +1 -1
- package/dist/components/ProgressBar.js +3 -3
- package/dist/components/ProgressBar.js.map +1 -1
- package/dist/components/RadioGroup.cjs +3 -3
- package/dist/components/RadioGroup.cjs.map +1 -1
- package/dist/components/RadioGroup.js +3 -3
- package/dist/components/RadioGroup.js.map +1 -1
- package/dist/components/SegmentedTabs.cjs +4 -4
- package/dist/components/SegmentedTabs.cjs.map +1 -1
- package/dist/components/SegmentedTabs.js +4 -4
- package/dist/components/SegmentedTabs.js.map +1 -1
- package/dist/components/Sidebar.cjs +1 -1
- package/dist/components/Sidebar.cjs.map +1 -1
- package/dist/components/Sidebar.d.cts +1 -1
- package/dist/components/Sidebar.d.ts +1 -1
- package/dist/components/Sidebar.js +1 -1
- package/dist/components/Sidebar.js.map +1 -1
- package/dist/components/SlideButton.cjs +1 -1
- package/dist/components/SlideButton.cjs.map +1 -1
- package/dist/components/SlideButton.js +1 -1
- package/dist/components/SlideButton.js.map +1 -1
- package/dist/components/Slider.cjs.map +1 -1
- package/dist/components/Slider.js.map +1 -1
- package/dist/components/SocialCard.cjs +4 -4
- package/dist/components/SocialCard.cjs.map +1 -1
- package/dist/components/SocialCard.d.cts +1 -1
- package/dist/components/SocialCard.d.ts +1 -1
- package/dist/components/SocialCard.js +4 -4
- package/dist/components/SocialCard.js.map +1 -1
- package/dist/components/Spinner.cjs +1 -1
- package/dist/components/Spinner.cjs.map +1 -1
- package/dist/components/Spinner.d.cts +2 -2
- package/dist/components/Spinner.d.ts +2 -2
- package/dist/components/Spinner.js +1 -1
- package/dist/components/Spinner.js.map +1 -1
- package/dist/components/Switch.cjs.map +1 -1
- package/dist/components/Switch.d.cts +2 -2
- package/dist/components/Switch.d.ts +2 -2
- package/dist/components/Switch.js.map +1 -1
- package/dist/components/Tabs.cjs +3 -3
- package/dist/components/Tabs.cjs.map +1 -1
- package/dist/components/Tabs.js +3 -3
- package/dist/components/Tabs.js.map +1 -1
- package/dist/components/Tag.cjs +3 -3
- package/dist/components/Tag.cjs.map +1 -1
- package/dist/components/Tag.d.cts +1 -1
- package/dist/components/Tag.d.ts +1 -1
- package/dist/components/Tag.js +3 -3
- package/dist/components/Tag.js.map +1 -1
- package/dist/components/Text.cjs +1 -1
- package/dist/components/Text.cjs.map +1 -1
- package/dist/components/Text.d.cts +1 -1
- package/dist/components/Text.d.ts +1 -1
- package/dist/components/Text.js +1 -1
- package/dist/components/Text.js.map +1 -1
- package/dist/components/TextArea.cjs +4 -4
- package/dist/components/TextArea.cjs.map +1 -1
- package/dist/components/TextArea.d.cts +1 -1
- package/dist/components/TextArea.d.ts +1 -1
- package/dist/components/TextArea.js +4 -4
- package/dist/components/TextArea.js.map +1 -1
- package/dist/components/Toast.cjs +3 -3
- package/dist/components/Toast.cjs.map +1 -1
- package/dist/components/Toast.d.cts +7 -7
- package/dist/components/Toast.d.ts +7 -7
- package/dist/components/Toast.js +3 -3
- package/dist/components/Toast.js.map +1 -1
- package/dist/components/ToastProvider.cjs +1 -1
- package/dist/components/ToastProvider.cjs.map +1 -1
- package/dist/components/ToastProvider.d.cts +1 -1
- package/dist/components/ToastProvider.d.ts +1 -1
- package/dist/components/ToastProvider.js +1 -1
- package/dist/components/ToastProvider.js.map +1 -1
- package/dist/components/Tooltip.cjs +3 -3
- package/dist/components/Tooltip.cjs.map +1 -1
- package/dist/components/Tooltip.d.cts +1 -1
- package/dist/components/Tooltip.d.ts +1 -1
- package/dist/components/Tooltip.js +3 -3
- package/dist/components/Tooltip.js.map +1 -1
- package/dist/components/VideoPlayer.cjs +2 -2
- package/dist/components/VideoPlayer.cjs.map +1 -1
- package/dist/components/VideoPlayer.d.cts +4 -4
- package/dist/components/VideoPlayer.d.ts +4 -4
- package/dist/components/VideoPlayer.js +2 -2
- package/dist/components/VideoPlayer.js.map +1 -1
- package/dist/components/WorkCard.cjs +3 -3
- package/dist/components/WorkCard.cjs.map +1 -1
- package/dist/components/WorkCard.d.cts +1 -1
- package/dist/components/WorkCard.d.ts +1 -1
- package/dist/components/WorkCard.js +3 -3
- package/dist/components/WorkCard.js.map +1 -1
- package/dist/index.cjs +8 -8
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +39 -39
- package/dist/index.d.ts +39 -39
- package/dist/index.js +8 -8
- package/dist/index.js.map +1 -1
- package/dist/styles/styles.css +1 -1
- package/package.json +2 -2
|
@@ -3,6 +3,6 @@ import * as React from 'react';
|
|
|
3
3
|
type ToastProviderProps = {
|
|
4
4
|
children: React.ReactNode;
|
|
5
5
|
};
|
|
6
|
-
declare
|
|
6
|
+
declare function ToastProvider({ children }: ToastProviderProps): React.JSX.Element;
|
|
7
7
|
|
|
8
8
|
export { ToastProvider, type ToastProviderProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as r from'@radix-ui/react-toast';import*as e from'react';function t({children:o}){return e.createElement(r.Provider,null,o,e.createElement(r.Viewport,{className:"fixed bottom-0 right-0 z-[100] m-6 flex max-h-screen w-full flex-col-reverse gap-2 sm:max-w-[420px]"}))}export{t as ToastProvider};//# sourceMappingURL=ToastProvider.js.map
|
|
2
2
|
//# sourceMappingURL=ToastProvider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/ToastProvider.tsx"],"names":["ToastProvider","children"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../src/components/ToastProvider.tsx"],"names":["ToastProvider","children"],"mappings":"gEAMO,SAASA,CAAAA,CAAc,CAAE,QAAA,CAAAC,CAAS,CAAA,CAAuB,CAC9D,OACE,CAAA,CAAA,aAAA,CAAgB,CAAf,CAAA,QAAA,CAAA,IAAA,CACEA,CACD,CAAA,CAAA,CAAA,aAAA,CAAgB,WAAf,CAAwB,SAAA,CAAU,qGAAsG,CAAA,CAC3I,CAEJ","file":"ToastProvider.js","sourcesContent":["import * as ToastPrimitive from \"@radix-ui/react-toast\";\nimport * as React from \"react\";\n\nexport type ToastProviderProps = { children: React.ReactNode };\n\n// Provider component that should wrap the application\nexport function ToastProvider({ children }: ToastProviderProps) {\n return (\n <ToastPrimitive.Provider>\n {children}\n <ToastPrimitive.Viewport className=\"fixed bottom-0 right-0 z-[100] m-6 flex max-h-screen w-full flex-col-reverse gap-2 sm:max-w-[420px]\" />\n </ToastPrimitive.Provider>\n );\n}\n"]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
'use strict';var t=require('@radix-ui/react-tooltip'),r=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 t__namespace=/*#__PURE__*/_interopNamespace(t);var r__namespace=/*#__PURE__*/_interopNamespace(r);function L(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var A={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},P=e=>{let[n,o]=e.split("-");return n==="heading"?A[o]||"p":n==="label"?"label":"p"},C={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},v=e=>e?(Array.isArray(e)?e:[e]).map(o=>{if(o.includes(":")){let[
|
|
1
|
+
'use strict';var t=require('@radix-ui/react-tooltip'),r=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 t__namespace=/*#__PURE__*/_interopNamespace(t);var r__namespace=/*#__PURE__*/_interopNamespace(r);function L(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var A={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},P=e=>{let[n,o]=e.split("-");return n==="heading"?A[o]||"p":n==="label"?"label":"p"},C={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},v=e=>e?(Array.isArray(e)?e:[e]).map(o=>{if(o.includes(":")){let[a,l]=o.split(":");return `${a}:text-${l}`}return `text-${o}`}).join(" "):"text-body-default",h=r__namespace.default.forwardRef(({variant:e="body-default",color:n="primary",as:o,className:a,children:l,weight:m,...c},s)=>{let T=v(e),d=n==="inherit"?"text-inherit":`text-${n}`,y=r__namespace.default.useMemo(()=>{let i=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return P(i)},[e]);return r__namespace.default.createElement(o||y,{ref:s,className:`
|
|
2
2
|
font-sans antialiased
|
|
3
3
|
${T}
|
|
4
4
|
${d}
|
|
5
5
|
${m&&`!${C[m]}`}
|
|
6
|
-
${
|
|
7
|
-
`,...c},l)});
|
|
6
|
+
${a}
|
|
7
|
+
`,...c},l)});h.displayName="Text";function W({content:e,children:n,side:o="bottom",align:a="center",className:l,delayDuration:m=200,defaultOpen:c,open:s,onOpenChange:T,longPressDuration:d=500}){let[y,M]=r.useState(c||false),i=null,f=s??y,p=r.useCallback(g=>{s||M(g),T?.(g);},[s,T]),E=r.useCallback(()=>{i=setTimeout(()=>{p(true);},d);},[p,d]),b=r.useCallback(()=>{i&&(clearTimeout(i),i=null),setTimeout(()=>p(false),1500);},[i,p]);return r__namespace.createElement(t__namespace.Provider,{delayDuration:m},r__namespace.createElement(t__namespace.Root,{open:f,onOpenChange:p},r__namespace.createElement(t__namespace.Trigger,{asChild:true},r__namespace.createElement("span",{tabIndex:0,onTouchStart:E,onTouchEnd:b,onTouchCancel:b},n)),r__namespace.createElement(t__namespace.Portal,null,r__namespace.createElement(t__namespace.Content,{side:o,align:a,sideOffset:4,className:L("z-50 overflow-hidden rounded-lg","bg-primary px-3 py-1.5","text-xs text-white","animate-in fade-in-0 zoom-in-95","data-[state=closed]:animate-out data-[state=closed]:fade-out-0","data-[side=bottom]:slide-in-from-top-2","data-[side=top]:slide-in-from-bottom-2","select-none","max-w-60","touch-none",l)},typeof e=="string"?r__namespace.createElement(h,{variant:"body-default-medium",color:"white"},e):e,r__namespace.createElement(t__namespace.Arrow,{className:"fill-text-primary",width:10,height:5})))))}exports.Tooltip=W;//# sourceMappingURL=Tooltip.cjs.map
|
|
8
8
|
//# sourceMappingURL=Tooltip.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/Tooltip.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","Tooltip","content","side","align","delayDuration","defaultOpen","controlledOpen","onOpenChange","longPressDuration","isOpen","setIsOpen","useState","longPressTimer","open","handleOpenChange","useCallback","newOpen","handleTouchStart","handleTouchEnd","r","t"],"mappings":"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","file":"Tooltip.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\";\nimport { Breakpoint } from \"../utils/responsive\";\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 | \"primary-100\";\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\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 using Tailwind classes that reference CSS variables\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `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={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport * as React from \"react\";\nimport { useCallback, useState } from \"react\";\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\nexport interface TooltipProps {\n content: React.ReactNode;\n children: React.ReactNode;\n side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n align?: \"start\" | \"center\" | \"end\";\n className?: string;\n delayDuration?: number;\n defaultOpen?: boolean;\n open?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Duration in ms for long press on mobile devices */\n longPressDuration?: number;\n}\n\nexport const Tooltip = ({\n content,\n children,\n side = \"bottom\",\n align = \"center\",\n className,\n delayDuration = 200,\n defaultOpen,\n open: controlledOpen,\n onOpenChange,\n longPressDuration = 500\n}: TooltipProps) => {\n const [isOpen, setIsOpen] = useState(defaultOpen || false);\n let longPressTimer: Timer | null = null;\n\n const open = controlledOpen ?? isOpen;\n const handleOpenChange = useCallback(\n (newOpen: boolean) => {\n if (!controlledOpen) {\n setIsOpen(newOpen);\n }\n onOpenChange?.(newOpen);\n },\n [controlledOpen, onOpenChange]\n );\n\n const handleTouchStart = useCallback(() => {\n const timer = setTimeout(() => {\n handleOpenChange(true);\n }, longPressDuration);\n longPressTimer = timer;\n }, [handleOpenChange, longPressDuration]);\n\n const handleTouchEnd = useCallback(() => {\n if (longPressTimer) {\n clearTimeout(longPressTimer);\n longPressTimer = null;\n }\n // Keep tooltip open for a brief moment after touch\n setTimeout(() => handleOpenChange(false), 1500);\n }, [longPressTimer, handleOpenChange]);\n\n return (\n <TooltipPrimitive.Provider delayDuration={delayDuration}>\n <TooltipPrimitive.Root open={open} onOpenChange={handleOpenChange}>\n <TooltipPrimitive.Trigger asChild>\n <span\n tabIndex={0}\n onTouchStart={handleTouchStart}\n onTouchEnd={handleTouchEnd}\n onTouchCancel={handleTouchEnd}\n >\n {children}\n </span>\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal>\n <TooltipPrimitive.Content\n side={side}\n align={align}\n sideOffset={4}\n className={cn(\n \"z-50 overflow-hidden rounded-lg\",\n \"bg-primary px-3 py-1.5\",\n \"text-xs text-white\",\n \"animate-in fade-in-0 zoom-in-95\",\n \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0\",\n \"data-[side=bottom]:slide-in-from-top-2\",\n \"data-[side=top]:slide-in-from-bottom-2\",\n \"select-none\",\n \"max-w-60\",\n \"touch-none\", // Prevent touch events from interfering with scrolling\n className\n )}\n >\n {typeof content === \"string\" ? (\n <Text variant=\"body-default-medium\" color=\"white\">\n {content}\n </Text>\n ) : (\n content\n )}\n <TooltipPrimitive.Arrow\n className=\"fill-text-primary\"\n width={10}\n height={5}\n />\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.Provider>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/Tooltip.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","Tooltip","content","side","align","delayDuration","defaultOpen","controlledOpen","onOpenChange","longPressDuration","isOpen","setIsOpen","useState","longPressTimer","open","handleOpenChange","useCallback","newOpen","handleTouchStart","handleTouchEnd","r","t"],"mappings":"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","file":"Tooltip.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\";\n\nimport type { Typography } from \"../types/tailwind\";\nimport type { Breakpoint } from \"../utils/responsive\";\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 | \"primary-100\";\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\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 using Tailwind classes that reference CSS variables\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `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={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport * as React from \"react\";\nimport { useCallback, useState } from \"react\";\n\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\nexport interface TooltipProps {\n content: React.ReactNode;\n children: React.ReactNode;\n side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n align?: \"start\" | \"center\" | \"end\";\n className?: string;\n delayDuration?: number;\n defaultOpen?: boolean;\n open?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Duration in ms for long press on mobile devices */\n longPressDuration?: number;\n}\n\nexport function Tooltip({\n content,\n children,\n side = \"bottom\",\n align = \"center\",\n className,\n delayDuration = 200,\n defaultOpen,\n open: controlledOpen,\n onOpenChange,\n longPressDuration = 500\n}: TooltipProps) {\n const [isOpen, setIsOpen] = useState(defaultOpen || false);\n let longPressTimer: Timer | null = null;\n\n const open = controlledOpen ?? isOpen;\n const handleOpenChange = useCallback(\n (newOpen: boolean) => {\n if (!controlledOpen) {\n setIsOpen(newOpen);\n }\n onOpenChange?.(newOpen);\n },\n [controlledOpen, onOpenChange]\n );\n\n const handleTouchStart = useCallback(() => {\n const timer = setTimeout(() => {\n handleOpenChange(true);\n }, longPressDuration);\n longPressTimer = timer;\n }, [handleOpenChange, longPressDuration]);\n\n const handleTouchEnd = useCallback(() => {\n if (longPressTimer) {\n clearTimeout(longPressTimer);\n longPressTimer = null;\n }\n // Keep tooltip open for a brief moment after touch\n setTimeout(() => handleOpenChange(false), 1500);\n }, [longPressTimer, handleOpenChange]);\n\n return (\n <TooltipPrimitive.Provider delayDuration={delayDuration}>\n <TooltipPrimitive.Root open={open} onOpenChange={handleOpenChange}>\n <TooltipPrimitive.Trigger asChild>\n <span\n tabIndex={0}\n onTouchStart={handleTouchStart}\n onTouchEnd={handleTouchEnd}\n onTouchCancel={handleTouchEnd}\n >\n {children}\n </span>\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal>\n <TooltipPrimitive.Content\n side={side}\n align={align}\n sideOffset={4}\n className={cn(\n \"z-50 overflow-hidden rounded-lg\",\n \"bg-primary px-3 py-1.5\",\n \"text-xs text-white\",\n \"animate-in fade-in-0 zoom-in-95\",\n \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0\",\n \"data-[side=bottom]:slide-in-from-top-2\",\n \"data-[side=top]:slide-in-from-bottom-2\",\n \"select-none\",\n \"max-w-60\",\n \"touch-none\", // Prevent touch events from interfering with scrolling\n className\n )}\n >\n {typeof content === \"string\" ? (\n <Text variant=\"body-default-medium\" color=\"white\">\n {content}\n </Text>\n ) : (\n content\n )}\n <TooltipPrimitive.Arrow\n className=\"fill-text-primary\"\n width={10}\n height={5}\n />\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.Provider>\n );\n}\n"]}
|
|
@@ -13,6 +13,6 @@ interface TooltipProps {
|
|
|
13
13
|
/** Duration in ms for long press on mobile devices */
|
|
14
14
|
longPressDuration?: number;
|
|
15
15
|
}
|
|
16
|
-
declare
|
|
16
|
+
declare function Tooltip({ content, children, side, align, className, delayDuration, defaultOpen, open: controlledOpen, onOpenChange, longPressDuration }: TooltipProps): React.JSX.Element;
|
|
17
17
|
|
|
18
18
|
export { Tooltip, type TooltipProps };
|
|
@@ -13,6 +13,6 @@ interface TooltipProps {
|
|
|
13
13
|
/** Duration in ms for long press on mobile devices */
|
|
14
14
|
longPressDuration?: number;
|
|
15
15
|
}
|
|
16
|
-
declare
|
|
16
|
+
declare function Tooltip({ content, children, side, align, className, delayDuration, defaultOpen, open: controlledOpen, onOpenChange, longPressDuration }: TooltipProps): React.JSX.Element;
|
|
17
17
|
|
|
18
18
|
export { Tooltip, type TooltipProps };
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import*as t from'@radix-ui/react-tooltip';import*as r from'react';import r__default,{useState,useCallback}from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';function L(...e){return twMerge(clsx(e))}var A={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},P=e=>{let[n,o]=e.split("-");return n==="heading"?A[o]||"p":n==="label"?"label":"p"},C={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},v=e=>e?(Array.isArray(e)?e:[e]).map(o=>{if(o.includes(":")){let[
|
|
1
|
+
import*as t from'@radix-ui/react-tooltip';import*as r from'react';import r__default,{useState,useCallback}from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';function L(...e){return twMerge(clsx(e))}var A={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},P=e=>{let[n,o]=e.split("-");return n==="heading"?A[o]||"p":n==="label"?"label":"p"},C={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},v=e=>e?(Array.isArray(e)?e:[e]).map(o=>{if(o.includes(":")){let[a,l]=o.split(":");return `${a}:text-${l}`}return `text-${o}`}).join(" "):"text-body-default",h=r__default.forwardRef(({variant:e="body-default",color:n="primary",as:o,className:a,children:l,weight:m,...c},s)=>{let T=v(e),d=n==="inherit"?"text-inherit":`text-${n}`,y=r__default.useMemo(()=>{let i=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return P(i)},[e]);return r__default.createElement(o||y,{ref:s,className:`
|
|
2
2
|
font-sans antialiased
|
|
3
3
|
${T}
|
|
4
4
|
${d}
|
|
5
5
|
${m&&`!${C[m]}`}
|
|
6
|
-
${
|
|
7
|
-
`,...c},l)});
|
|
6
|
+
${a}
|
|
7
|
+
`,...c},l)});h.displayName="Text";function W({content:e,children:n,side:o="bottom",align:a="center",className:l,delayDuration:m=200,defaultOpen:c,open:s,onOpenChange:T,longPressDuration:d=500}){let[y,M]=useState(c||false),i=null,f=s??y,p=useCallback(g=>{s||M(g),T?.(g);},[s,T]),E=useCallback(()=>{i=setTimeout(()=>{p(true);},d);},[p,d]),b=useCallback(()=>{i&&(clearTimeout(i),i=null),setTimeout(()=>p(false),1500);},[i,p]);return r.createElement(t.Provider,{delayDuration:m},r.createElement(t.Root,{open:f,onOpenChange:p},r.createElement(t.Trigger,{asChild:true},r.createElement("span",{tabIndex:0,onTouchStart:E,onTouchEnd:b,onTouchCancel:b},n)),r.createElement(t.Portal,null,r.createElement(t.Content,{side:o,align:a,sideOffset:4,className:L("z-50 overflow-hidden rounded-lg","bg-primary px-3 py-1.5","text-xs text-white","animate-in fade-in-0 zoom-in-95","data-[state=closed]:animate-out data-[state=closed]:fade-out-0","data-[side=bottom]:slide-in-from-top-2","data-[side=top]:slide-in-from-bottom-2","select-none","max-w-60","touch-none",l)},typeof e=="string"?r.createElement(h,{variant:"body-default-medium",color:"white"},e):e,r.createElement(t.Arrow,{className:"fill-text-primary",width:10,height:5})))))}export{W as Tooltip};//# sourceMappingURL=Tooltip.js.map
|
|
8
8
|
//# sourceMappingURL=Tooltip.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/Tooltip.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","Tooltip","content","side","align","delayDuration","defaultOpen","controlledOpen","onOpenChange","longPressDuration","isOpen","setIsOpen","useState","longPressTimer","open","handleOpenChange","useCallback","newOpen","handleTouchStart","handleTouchEnd"],"mappings":"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","file":"Tooltip.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\";\nimport { Breakpoint } from \"../utils/responsive\";\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 | \"primary-100\";\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\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 using Tailwind classes that reference CSS variables\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `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={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport * as React from \"react\";\nimport { useCallback, useState } from \"react\";\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\nexport interface TooltipProps {\n content: React.ReactNode;\n children: React.ReactNode;\n side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n align?: \"start\" | \"center\" | \"end\";\n className?: string;\n delayDuration?: number;\n defaultOpen?: boolean;\n open?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Duration in ms for long press on mobile devices */\n longPressDuration?: number;\n}\n\nexport const Tooltip = ({\n content,\n children,\n side = \"bottom\",\n align = \"center\",\n className,\n delayDuration = 200,\n defaultOpen,\n open: controlledOpen,\n onOpenChange,\n longPressDuration = 500\n}: TooltipProps) => {\n const [isOpen, setIsOpen] = useState(defaultOpen || false);\n let longPressTimer: Timer | null = null;\n\n const open = controlledOpen ?? isOpen;\n const handleOpenChange = useCallback(\n (newOpen: boolean) => {\n if (!controlledOpen) {\n setIsOpen(newOpen);\n }\n onOpenChange?.(newOpen);\n },\n [controlledOpen, onOpenChange]\n );\n\n const handleTouchStart = useCallback(() => {\n const timer = setTimeout(() => {\n handleOpenChange(true);\n }, longPressDuration);\n longPressTimer = timer;\n }, [handleOpenChange, longPressDuration]);\n\n const handleTouchEnd = useCallback(() => {\n if (longPressTimer) {\n clearTimeout(longPressTimer);\n longPressTimer = null;\n }\n // Keep tooltip open for a brief moment after touch\n setTimeout(() => handleOpenChange(false), 1500);\n }, [longPressTimer, handleOpenChange]);\n\n return (\n <TooltipPrimitive.Provider delayDuration={delayDuration}>\n <TooltipPrimitive.Root open={open} onOpenChange={handleOpenChange}>\n <TooltipPrimitive.Trigger asChild>\n <span\n tabIndex={0}\n onTouchStart={handleTouchStart}\n onTouchEnd={handleTouchEnd}\n onTouchCancel={handleTouchEnd}\n >\n {children}\n </span>\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal>\n <TooltipPrimitive.Content\n side={side}\n align={align}\n sideOffset={4}\n className={cn(\n \"z-50 overflow-hidden rounded-lg\",\n \"bg-primary px-3 py-1.5\",\n \"text-xs text-white\",\n \"animate-in fade-in-0 zoom-in-95\",\n \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0\",\n \"data-[side=bottom]:slide-in-from-top-2\",\n \"data-[side=top]:slide-in-from-bottom-2\",\n \"select-none\",\n \"max-w-60\",\n \"touch-none\", // Prevent touch events from interfering with scrolling\n className\n )}\n >\n {typeof content === \"string\" ? (\n <Text variant=\"body-default-medium\" color=\"white\">\n {content}\n </Text>\n ) : (\n content\n )}\n <TooltipPrimitive.Arrow\n className=\"fill-text-primary\"\n width={10}\n height={5}\n />\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.Provider>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/Tooltip.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","Tooltip","content","side","align","delayDuration","defaultOpen","controlledOpen","onOpenChange","longPressDuration","isOpen","setIsOpen","useState","longPressTimer","open","handleOpenChange","useCallback","newOpen","handleTouchStart","handleTouchEnd"],"mappings":"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","file":"Tooltip.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\";\n\nimport type { Typography } from \"../types/tailwind\";\nimport type { Breakpoint } from \"../utils/responsive\";\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 | \"primary-100\";\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\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 using Tailwind classes that reference CSS variables\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `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={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport * as React from \"react\";\nimport { useCallback, useState } from \"react\";\n\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\nexport interface TooltipProps {\n content: React.ReactNode;\n children: React.ReactNode;\n side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n align?: \"start\" | \"center\" | \"end\";\n className?: string;\n delayDuration?: number;\n defaultOpen?: boolean;\n open?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Duration in ms for long press on mobile devices */\n longPressDuration?: number;\n}\n\nexport function Tooltip({\n content,\n children,\n side = \"bottom\",\n align = \"center\",\n className,\n delayDuration = 200,\n defaultOpen,\n open: controlledOpen,\n onOpenChange,\n longPressDuration = 500\n}: TooltipProps) {\n const [isOpen, setIsOpen] = useState(defaultOpen || false);\n let longPressTimer: Timer | null = null;\n\n const open = controlledOpen ?? isOpen;\n const handleOpenChange = useCallback(\n (newOpen: boolean) => {\n if (!controlledOpen) {\n setIsOpen(newOpen);\n }\n onOpenChange?.(newOpen);\n },\n [controlledOpen, onOpenChange]\n );\n\n const handleTouchStart = useCallback(() => {\n const timer = setTimeout(() => {\n handleOpenChange(true);\n }, longPressDuration);\n longPressTimer = timer;\n }, [handleOpenChange, longPressDuration]);\n\n const handleTouchEnd = useCallback(() => {\n if (longPressTimer) {\n clearTimeout(longPressTimer);\n longPressTimer = null;\n }\n // Keep tooltip open for a brief moment after touch\n setTimeout(() => handleOpenChange(false), 1500);\n }, [longPressTimer, handleOpenChange]);\n\n return (\n <TooltipPrimitive.Provider delayDuration={delayDuration}>\n <TooltipPrimitive.Root open={open} onOpenChange={handleOpenChange}>\n <TooltipPrimitive.Trigger asChild>\n <span\n tabIndex={0}\n onTouchStart={handleTouchStart}\n onTouchEnd={handleTouchEnd}\n onTouchCancel={handleTouchEnd}\n >\n {children}\n </span>\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal>\n <TooltipPrimitive.Content\n side={side}\n align={align}\n sideOffset={4}\n className={cn(\n \"z-50 overflow-hidden rounded-lg\",\n \"bg-primary px-3 py-1.5\",\n \"text-xs text-white\",\n \"animate-in fade-in-0 zoom-in-95\",\n \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0\",\n \"data-[side=bottom]:slide-in-from-top-2\",\n \"data-[side=top]:slide-in-from-bottom-2\",\n \"select-none\",\n \"max-w-60\",\n \"touch-none\", // Prevent touch events from interfering with scrolling\n className\n )}\n >\n {typeof content === \"string\" ? (\n <Text variant=\"body-default-medium\" color=\"white\">\n {content}\n </Text>\n ) : (\n content\n )}\n <TooltipPrimitive.Arrow\n className=\"fill-text-primary\"\n width={10}\n height={5}\n />\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.Provider>\n );\n}\n"]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
'use strict';var c=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),i=require('@radix-ui/react-dialog'),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 c__default=/*#__PURE__*/_interopDefault(c);var i__namespace=/*#__PURE__*/_interopNamespace(i);function l(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var
|
|
1
|
+
'use strict';var c=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),i=require('@radix-ui/react-dialog'),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 c__default=/*#__PURE__*/_interopDefault(c);var i__namespace=/*#__PURE__*/_interopNamespace(i);function l(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var g={12:"h-[12px] w-[12px]",16:"h-[16px] w-[16px]",18:"h-[18px] w-[18px]",20:"h-[20px] w-[20px]",24:"h-[24px] w-[24px]",32:"h-[32px] w-[32px]",36:"h-[36px] w-[36px]",40:"h-[40px] w-[40px]",42:"h-[42px] w-[42px]",48:"h-[48px] w-[48px]",64:"h-[64px] w-[64px]",72:"h-[72px] w-[72px]"},v={sm:{12:"sm:h-[12px] sm:w-[12px]",16:"sm:h-[16px] sm:w-[16px]",18:"sm:h-[18px] sm:w-[18px]",20:"sm:h-[20px] sm:w-[20px]",24:"sm:h-[24px] sm:w-[24px]",32:"sm:h-[32px] sm:w-[32px]",36:"sm:h-[36px] sm:w-[36px]",40:"sm:h-[40px] sm:w-[40px]",42:"sm:h-[42px] sm:w-[42px]",48:"sm:h-[48px] sm:w-[48px]",64:"sm:h-[64px] sm:w-[64px]",72:"sm:h-[72px] sm:w-[72px]"},md:{12:"md:h-[12px] md:w-[12px]",16:"md:h-[16px] md:w-[16px]",18:"md:h-[18px] md:w-[18px]",20:"md:h-[20px] md:w-[20px]",24:"md:h-[24px] md:w-[24px]",32:"md:h-[32px] md:w-[32px]",36:"md:h-[36px] md:w-[36px]",40:"md:h-[40px] md:w-[40px]",42:"md:h-[42px] md:w-[42px]",48:"md:h-[48px] md:w-[48px]",64:"md:h-[64px] md:w-[64px]",72:"md:h-[72px] md:w-[72px]"},lg:{12:"lg:h-[12px] lg:w-[12px]",16:"lg:h-[16px] lg:w-[16px]",18:"lg:h-[18px] lg:w-[18px]",20:"lg:h-[20px] lg:w-[20px]",24:"lg:h-[24px] lg:w-[24px]",32:"lg:h-[32px] lg:w-[32px]",36:"lg:h-[36px] lg:w-[36px]",40:"lg:h-[40px] lg:w-[40px]",42:"lg:h-[42px] lg:w-[42px]",48:"lg:h-[48px] lg:w-[48px]",64:"lg:h-[64px] lg:w-[64px]",72:"lg:h-[72px] lg:w-[72px]"},xl:{12:"xl:h-[12px] xl:w-[12px]",16:"xl:h-[16px] xl:w-[16px]",18:"xl:h-[18px] xl:w-[18px]",20:"xl:h-[20px] xl:w-[20px]",24:"xl:h-[24px] xl:w-[24px]",32:"xl:h-[32px] xl:w-[32px]",36:"xl:h-[36px] xl:w-[36px]",40:"xl:h-[40px] xl:w-[40px]",42:"xl:h-[42px] xl:w-[42px]",48:"xl:h-[48px] xl:w-[48px]",64:"xl:h-[64px] xl:w-[64px]",72:"xl:h-[72px] xl:w-[72px]"},"2xl":{12:"2xl:h-[12px] 2xl:w-[12px]",16:"2xl:h-[16px] 2xl:w-[16px]",18:"2xl:h-[18px] 2xl:w-[18px]",20:"2xl:h-[20px] 2xl:w-[20px]",24:"2xl:h-[24px] 2xl:w-[24px]",32:"2xl:h-[32px] 2xl:w-[32px]",36:"2xl:h-[36px] 2xl:w-[36px]",40:"2xl:h-[40px] 2xl:w-[40px]",42:"2xl:h-[42px] 2xl:w-[42px]",48:"2xl:h-[48px] 2xl:w-[48px]",64:"2xl:h-[64px] 2xl:w-[64px]",72:"2xl:h-[72px] 2xl:w-[72px]"}},h=e=>String(e),M=(e,s=24)=>{let t=[],r={};if(e===void 0){let o=h(s);o?t.push(g[o]):(r.height=`${s}px`,r.width=`${s}px`);}if(typeof e=="number"){let o=h(e);o?t.push(g[o]):(r.height=`${e}px`,r.width=`${e}px`);}if(Array.isArray(e)){let o=h(s),p=[o&&g[o]||`h-[${s}px] w-[${s}px]`];e.forEach(n=>{if(typeof n=="string"){let[a,m]=n.split(":"),x=parseInt(m,10),d=h(x);t.push(d&&v[a]?.[d]||`${a}:h-[${x}px] ${a}:w-[${x}px]`);}}),t.push(...p);}if(typeof e=="string"){let[o,p]=e.split(":"),n=parseInt(p,10),a=h(n);t.push(a&&v[o]?.[a]||`${o}:h-[${n}px] ${o}:w-[${n}px]`);}return {responsiveSizeClasses:t.join(" "),responsiveSizeStyles:r}};var H={primary:"var(--color-primary)",secondary:"var(--color-secondary)",white:"var(--color-white)",primaryBlue:"var(--color-primary-100)",disabled:"var(--color-disabled)",danger:"var(--color-danger)"},f=c__default.default.forwardRef(({name:e,size:s=24,color:t="primary",title:r,className:o,style:p={},...n},a)=>{let m=icons.IconMap[e],{responsiveSizeClasses:x,responsiveSizeStyles:d}=M(s,24);return c__default.default.createElement("div",{className:l("flex justify-center items-center",x,o),style:{"--icon-stroke":H[t],...d,...p}},c__default.default.createElement(m,{ref:a,"aria-hidden":!r,"aria-label":r,stroke:e.includes("filled")?void 0:H[t],...n}))});f.displayName="Icon";var L="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100";var w=c__default.default.forwardRef(({children:e,type:s="button",className:t,disabled:r,...o},p)=>c__default.default.createElement("button",{ref:p,type:s,disabled:r,className:l("appearance-none hover:opacity-80 transition-all active:scale-95",L,r&&"opacity-50 cursor-not-allowed",t),...o},e));w.displayName="Pressable";var $=(e,{isActive:s=true,preventScroll:t=false}={})=>{let r=c.useCallback(o=>{let p=e[o.key];p&&p(o);},[e]);c.useEffect(()=>(s&&(document.addEventListener("keydown",r),t&&(document.body.style.overflow="hidden")),()=>{document.removeEventListener("keydown",r),t&&(document.body.style.overflow="unset");}),[s,r,t]);};function b({children:e,open:s,onClose:t,className:r,showCloseButton:o=true}){return $({Escape:t},{isActive:s,preventScroll:true}),c__default.default.createElement(i__namespace.Root,{open:s,onOpenChange:t},c__default.default.createElement(i__namespace.Portal,null,c__default.default.createElement(i__namespace.Overlay,{className:l("fixed inset-0 z-50 bg-sidebarOverlay backdrop-blur-[2px]","data-[state=open]:animate-overlay-show","data-[state=closed]:animate-overlay-hide")}),c__default.default.createElement(i__namespace.Content,{className:l("fixed left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2","w-[90vw] max-w-[90vw] max-h-[90vh]","rounded-xl overflow-hidden","data-[state=open]:animate-in data-[state=closed]:animate-out","data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0","data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95","data-[state=closed]:slide-out-to-left-1/2 data-[state=open]:slide-in-from-left-1/2","data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%]",r)},e,o&&c__default.default.createElement(i__namespace.Close,{asChild:true},c__default.default.createElement(w,{className:"inline-flex items-center justify-center text-secondary absolute top-4 right-4","aria-label":"Close"},c__default.default.createElement(f,{name:"close",size:12}))))))}b.displayName="Modal";var K={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},I=e=>{let[s,t]=e.split("-");return s==="heading"?K[t]||"p":s==="label"?"label":"p"},B={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},O=e=>e?(Array.isArray(e)?e:[e]).map(t=>{if(t.includes(":")){let[r,o]=t.split(":");return `${r}:text-${o}`}return `text-${t}`}).join(" "):"text-body-default",E=c__default.default.forwardRef(({variant:e="body-default",color:s="primary",as:t,className:r,children:o,weight:p,...n},a)=>{let m=O(e),x=s==="inherit"?"text-inherit":`text-${s}`,d=c__default.default.useMemo(()=>{let S=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return I(S)},[e]);return c__default.default.createElement(t||d,{ref:a,className:`
|
|
2
2
|
font-sans antialiased
|
|
3
3
|
${m}
|
|
4
4
|
${x}
|
|
5
5
|
${p&&`!${B[p]}`}
|
|
6
6
|
${r}
|
|
7
|
-
`,...n},o)});E.displayName="Text";var D={"16:9":"aspect-video","9:16":"aspect-[9/16]","4:3":"aspect-[4/3]","1:1":"aspect-square"}
|
|
7
|
+
`,...n},o)});E.displayName="Text";var D={"16:9":"aspect-video","9:16":"aspect-[9/16]","4:3":"aspect-[4/3]","1:1":"aspect-square"};function G({src:e,open:s,onClose:t,caption:r,aspectRatio:o="16:9",className:p}){let n=c.useRef(null),[a,m]=c.useState(false),x=c.useCallback(()=>{m(true);},[]),d=c.useCallback(()=>{m(false);},[]);return c__default.default.createElement(b,{open:s,onClose:t,showCloseButton:a,className:l("rounded-xl",p)},c__default.default.createElement("div",{className:l("w-full max-h-[90vh]",D[o],"relative w-full h-full flex items-center justify-center"),onMouseEnter:x,onMouseLeave:d},c__default.default.createElement("video",{ref:n,src:e,className:"w-full h-full object-contain",controls:true,autoPlay:true}),r&&c__default.default.createElement("div",{className:"absolute left-4 bottom-16 flex flex-col gap-1 p-2 rounded-lg bg-overlay max-w-[80%]"},c__default.default.createElement(E,{variant:"body-default-medium",className:"text-white"},r))))}G.displayName="VideoPlayer";exports.VideoPlayer=G;//# sourceMappingURL=VideoPlayer.cjs.map
|
|
8
8
|
//# sourceMappingURL=VideoPlayer.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utils/index.ts","../../src/utils/usePortalKeyboardEvent.ts","../../src/utils/responsive.ts","../../src/components/Icon.tsx","../../src/components/Pressable.tsx","../../src/utils/tailwind.ts","../../src/components/Modal.tsx","../../src/components/Text.tsx","../../src/components/VideoPlayer.tsx"],"names":["cn","inputs","twMerge","clsx","usePortalKeyboardEvent","eventMap","isActive","preventScroll","handleKeyDown","useCallback","event","handler","useEffect","BASE_SIZES","RESPONSIVE_SIZES","getSizeKey","size","getResponsiveSize","baseSize","classes","styles","key","baseKey","responsiveClasses","s","breakpoint","valueStr","value","valueKey","COLOR_MAP","Icon","React","name","color","title","className","style","props","ref","IconComponent","IconMap","responsiveSizeClasses","responsiveSizeStyles","focusRingStyles","Pressable","children","type","disabled","Modal","open","onClose","showCloseButton","i","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","fontWeight","processVariants","variants","typographyClass","Text","as","weight","typographyClasses","colorClasses","suggestedElement","baseVariant","aspectRatioClasses","VideoPlayer","src","caption","aspectRatio","videoRef","useRef","isHovering","setIsHovering","useState","handleMouseEnter","handleMouseLeave"],"mappings":"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","file":"VideoPlayer.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 { useCallback, useEffect } from \"react\";\n\ntype KeyboardEventHandler = (event: KeyboardEvent) => void;\n\ntype KeyboardEventOptions = {\n /**\n * Whether the event should be active\n */\n isActive?: boolean;\n /**\n * Whether to prevent body scroll when active\n * @default false\n */\n preventScroll?: boolean;\n};\n\n/**\n * Hook for handling keyboard events within portals\n * @param eventMap - Map of keyboard events to their handlers\n * @param options - Options for the keyboard events\n * @example\n * ```tsx\n * const handleKeyboardEvents = usePortalKeyboardEvent({\n * Escape: onClose,\n * Enter: onConfirm,\n * }, { isActive: isOpen });\n * ```\n */\nexport const usePortalKeyboardEvent = (\n eventMap: Record<string, KeyboardEventHandler>,\n { isActive = true, preventScroll = false }: KeyboardEventOptions = {}\n) => {\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n const handler = eventMap[event.key];\n if (handler) {\n handler(event);\n }\n },\n [eventMap]\n );\n\n useEffect(() => {\n if (isActive) {\n document.addEventListener(\"keydown\", handleKeyDown);\n if (preventScroll) {\n document.body.style.overflow = \"hidden\";\n }\n }\n\n return () => {\n document.removeEventListener(\"keydown\", handleKeyDown);\n if (preventScroll) {\n document.body.style.overflow = \"unset\";\n }\n };\n }, [isActive, handleKeyDown, preventScroll]);\n};\n","export type Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\nexport type ResponsiveSize = number | `${Breakpoint}:${number}`;\n\ntype SizeKey =\n | \"12\"\n | \"16\"\n | \"18\"\n | \"20\"\n | \"24\"\n | \"32\"\n | \"36\"\n | \"40\"\n | \"42\"\n | \"48\"\n | \"64\"\n | \"72\";\n\n// These constants help Tailwind identify the classes during compilation\nconst BASE_SIZES: Record<SizeKey, string> = {\n \"12\": \"h-[12px] w-[12px]\",\n \"16\": \"h-[16px] w-[16px]\",\n \"18\": \"h-[18px] w-[18px]\",\n \"20\": \"h-[20px] w-[20px]\",\n \"24\": \"h-[24px] w-[24px]\",\n \"32\": \"h-[32px] w-[32px]\",\n \"36\": \"h-[36px] w-[36px]\",\n \"40\": \"h-[40px] w-[40px]\",\n \"42\": \"h-[42px] w-[42px]\",\n \"48\": \"h-[48px] w-[48px]\",\n \"64\": \"h-[64px] w-[64px]\",\n \"72\": \"h-[72px] w-[72px]\"\n};\n\nconst RESPONSIVE_SIZES: Record<Breakpoint, Record<SizeKey, string>> = {\n sm: {\n \"12\": \"sm:h-[12px] sm:w-[12px]\",\n \"16\": \"sm:h-[16px] sm:w-[16px]\",\n \"18\": \"sm:h-[18px] sm:w-[18px]\",\n \"20\": \"sm:h-[20px] sm:w-[20px]\",\n \"24\": \"sm:h-[24px] sm:w-[24px]\",\n \"32\": \"sm:h-[32px] sm:w-[32px]\",\n \"36\": \"sm:h-[36px] sm:w-[36px]\",\n \"40\": \"sm:h-[40px] sm:w-[40px]\",\n \"42\": \"sm:h-[42px] sm:w-[42px]\",\n \"48\": \"sm:h-[48px] sm:w-[48px]\",\n \"64\": \"sm:h-[64px] sm:w-[64px]\",\n \"72\": \"sm:h-[72px] sm:w-[72px]\"\n },\n md: {\n \"12\": \"md:h-[12px] md:w-[12px]\",\n \"16\": \"md:h-[16px] md:w-[16px]\",\n \"18\": \"md:h-[18px] md:w-[18px]\",\n \"20\": \"md:h-[20px] md:w-[20px]\",\n \"24\": \"md:h-[24px] md:w-[24px]\",\n \"32\": \"md:h-[32px] md:w-[32px]\",\n \"36\": \"md:h-[36px] md:w-[36px]\",\n \"40\": \"md:h-[40px] md:w-[40px]\",\n \"42\": \"md:h-[42px] md:w-[42px]\",\n \"48\": \"md:h-[48px] md:w-[48px]\",\n \"64\": \"md:h-[64px] md:w-[64px]\",\n \"72\": \"md:h-[72px] md:w-[72px]\"\n },\n lg: {\n \"12\": \"lg:h-[12px] lg:w-[12px]\",\n \"16\": \"lg:h-[16px] lg:w-[16px]\",\n \"18\": \"lg:h-[18px] lg:w-[18px]\",\n \"20\": \"lg:h-[20px] lg:w-[20px]\",\n \"24\": \"lg:h-[24px] lg:w-[24px]\",\n \"32\": \"lg:h-[32px] lg:w-[32px]\",\n \"36\": \"lg:h-[36px] lg:w-[36px]\",\n \"40\": \"lg:h-[40px] lg:w-[40px]\",\n \"42\": \"lg:h-[42px] lg:w-[42px]\",\n \"48\": \"lg:h-[48px] lg:w-[48px]\",\n \"64\": \"lg:h-[64px] lg:w-[64px]\",\n \"72\": \"lg:h-[72px] lg:w-[72px]\"\n },\n xl: {\n \"12\": \"xl:h-[12px] xl:w-[12px]\",\n \"16\": \"xl:h-[16px] xl:w-[16px]\",\n \"18\": \"xl:h-[18px] xl:w-[18px]\",\n \"20\": \"xl:h-[20px] xl:w-[20px]\",\n \"24\": \"xl:h-[24px] xl:w-[24px]\",\n \"32\": \"xl:h-[32px] xl:w-[32px]\",\n \"36\": \"xl:h-[36px] xl:w-[36px]\",\n \"40\": \"xl:h-[40px] xl:w-[40px]\",\n \"42\": \"xl:h-[42px] xl:w-[42px]\",\n \"48\": \"xl:h-[48px] xl:w-[48px]\",\n \"64\": \"xl:h-[64px] xl:w-[64px]\",\n \"72\": \"xl:h-[72px] xl:w-[72px]\"\n },\n \"2xl\": {\n \"12\": \"2xl:h-[12px] 2xl:w-[12px]\",\n \"16\": \"2xl:h-[16px] 2xl:w-[16px]\",\n \"18\": \"2xl:h-[18px] 2xl:w-[18px]\",\n \"20\": \"2xl:h-[20px] 2xl:w-[20px]\",\n \"24\": \"2xl:h-[24px] 2xl:w-[24px]\",\n \"32\": \"2xl:h-[32px] 2xl:w-[32px]\",\n \"36\": \"2xl:h-[36px] 2xl:w-[36px]\",\n \"40\": \"2xl:h-[40px] 2xl:w-[40px]\",\n \"42\": \"2xl:h-[42px] 2xl:w-[42px]\",\n \"48\": \"2xl:h-[48px] 2xl:w-[48px]\",\n \"64\": \"2xl:h-[64px] 2xl:w-[64px]\",\n \"72\": \"2xl:h-[72px] 2xl:w-[72px]\"\n }\n};\n\nconst getSizeKey = (size: number): SizeKey | undefined => {\n return String(size) as SizeKey;\n};\n\nexport const getResponsiveSize = (\n size: ResponsiveSize | ResponsiveSize[] | undefined,\n baseSize: number = 24\n): {\n responsiveSizeClasses: string;\n responsiveSizeStyles: Record<string, string>;\n} => {\n const classes: string[] = [];\n const styles: Record<string, string> = {};\n\n // If no size provided, use baseSize\n if (size === undefined) {\n const key = getSizeKey(baseSize);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${baseSize}px`;\n styles.width = `${baseSize}px`;\n }\n }\n\n // If size is a number, use that directly\n if (typeof size === \"number\") {\n const key = getSizeKey(size);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${size}px`;\n styles.width = `${size}px`;\n }\n }\n\n // If array of responsive sizes, generate responsive classes\n if (Array.isArray(size)) {\n const baseKey = getSizeKey(baseSize);\n const responsiveClasses = [\n (baseKey && BASE_SIZES[baseKey]) || `h-[${baseSize}px] w-[${baseSize}px]`\n ];\n\n size.forEach((s) => {\n if (typeof s === \"string\") {\n const [breakpoint, valueStr] = s.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const key = getSizeKey(value);\n classes.push(\n (key && RESPONSIVE_SIZES[breakpoint]?.[key]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n });\n\n classes.push(...responsiveClasses);\n }\n\n if (typeof size === \"string\") {\n const [breakpoint, valueStr] = size.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const valueKey = getSizeKey(value);\n classes.push(\n (valueKey && RESPONSIVE_SIZES[breakpoint]?.[valueKey]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n\n return {\n responsiveSizeClasses: classes.join(\" \"),\n responsiveSizeStyles: styles\n };\n};\n","import { IconMap, IconName } from \"@deckai/icons\";\nimport React, { SVGProps } from \"react\";\nimport { IconColors } from \"../types/tailwind\";\nimport { cn } from \"../utils\";\nimport { ResponsiveSize, getResponsiveSize } from \"../utils/responsive\";\n\nexport type IconProps = {\n name: IconName;\n /** @default 24 */\n size?: ResponsiveSize | ResponsiveSize[];\n /** @default primary */\n color?: IconColors;\n title?: string;\n className?: string;\n style?: React.CSSProperties;\n} & Omit<SVGProps<SVGSVGElement>, \"aria-hidden\" | \"aria-label\">;\n\n// Using CSS variables to support dark mode\nconst COLOR_MAP: Record<IconColors, string> = {\n primary: \"var(--color-primary)\",\n secondary: \"var(--color-secondary)\",\n white: \"var(--color-white)\",\n primaryBlue: \"var(--color-primary-100)\",\n disabled: \"var(--color-disabled)\",\n danger: \"var(--color-danger)\"\n};\n\nexport const Icon = React.forwardRef<SVGSVGElement, IconProps>(\n (\n {\n name,\n size = 24,\n color = \"primary\",\n title,\n className,\n style = {},\n ...props\n },\n ref\n ) => {\n const IconComponent = IconMap[name];\n const { responsiveSizeClasses, responsiveSizeStyles } = getResponsiveSize(\n size,\n 24\n );\n\n return (\n <div\n className={cn(\n \"flex justify-center items-center\",\n responsiveSizeClasses,\n className\n )}\n style={{\n [\"--icon-stroke\" as string]: COLOR_MAP[color],\n ...responsiveSizeStyles,\n ...style\n }}\n >\n <IconComponent\n ref={ref}\n aria-hidden={!title}\n aria-label={title}\n stroke={name.includes(\"filled\") ? undefined : COLOR_MAP[color]}\n {...props}\n />\n </div>\n );\n }\n);\n\nIcon.displayName = \"Icon\";\n","import React, { ButtonHTMLAttributes } from \"react\";\nimport { focusRingStyles } from \"../utils/tailwind\";\nimport { cn } from \"../utils\";\n\nexport type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const Pressable = React.forwardRef<HTMLButtonElement, PressableProps>(\n ({ children, type = \"button\", className, disabled, ...props }, ref) => (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n className={cn(\n \"appearance-none hover:opacity-80 transition-all active:scale-95\",\n focusRingStyles,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n {children}\n </button>\n )\n);\n\nPressable.displayName = \"Pressable\";\n","import { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const sizes = [\"24\", \"42\", \"48\", \"64\", \"72\"]; // Add all the sizes you need\n\n const safelist: (string | { pattern: RegExp; variants: string[] })[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n // Generate size classes with responsive variants\n const sizeClasses = sizes.flatMap((size) => [\n `h-[${size}px]`,\n `w-[${size}px]`,\n ...breakpoints.flatMap((bp) => [\n `${bp}:h-[${size}px]`,\n `${bp}:w-[${size}px]`\n ])\n ]);\n\n return [...typographyClasses, ...responsiveTypographyClasses, ...sizeClasses];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100\";\nexport const focusRingWithinStyles =\n \"focus-within:outline-none focus-within:ring-2 focus-within:ring-primary-100\";\nexport const focusRingStylesCoerced = \"ring-2 ring-primary-100\";\n","import * as Dialog from \"@radix-ui/react-dialog\";\nimport React, { type ReactNode } from \"react\";\nimport { cn } from \"../utils\";\nimport { usePortalKeyboardEvent } from \"../utils/usePortalKeyboardEvent\";\nimport { Icon } from \"./Icon\";\nimport { Pressable } from \"./Pressable\";\n\nexport type ModalProps = {\n /**\n * The content to be rendered inside the modal\n */\n children: ReactNode;\n /**\n * Whether the modal is open\n */\n open: boolean;\n /**\n * Callback fired when the modal is closed\n */\n onClose: () => void;\n /**\n * Additional class names to be applied to the modal\n */\n className?: string;\n /**\n * Whether to show the close button\n * @default true\n */\n showCloseButton?: boolean;\n};\n\nexport const Modal = ({\n children,\n open,\n onClose,\n className,\n showCloseButton = true\n}: ModalProps) => {\n usePortalKeyboardEvent(\n { Escape: onClose },\n { isActive: open, preventScroll: true }\n );\n\n return (\n <Dialog.Root open={open} onOpenChange={onClose}>\n <Dialog.Portal>\n <Dialog.Overlay\n className={cn(\n \"fixed inset-0 z-50 bg-sidebarOverlay backdrop-blur-[2px]\",\n \"data-[state=open]:animate-overlay-show\",\n \"data-[state=closed]:animate-overlay-hide\"\n )}\n />\n <Dialog.Content\n className={cn(\n \"fixed left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2\",\n \"w-[90vw] max-w-[90vw] max-h-[90vh]\",\n \"rounded-xl overflow-hidden\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out\",\n \"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n \"data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n \"data-[state=closed]:slide-out-to-left-1/2 data-[state=open]:slide-in-from-left-1/2\",\n \"data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%]\",\n className\n )}\n >\n {children}\n {showCloseButton && (\n <Dialog.Close asChild>\n <Pressable\n className=\"inline-flex items-center justify-center text-secondary absolute top-4 right-4\"\n aria-label=\"Close\"\n >\n <Icon name=\"close\" size={12} />\n </Pressable>\n </Dialog.Close>\n )}\n </Dialog.Content>\n </Dialog.Portal>\n </Dialog.Root>\n );\n};\n\nModal.displayName = \"Modal\";\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\nimport { Breakpoint } from \"../utils/responsive\";\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 | \"primary-100\";\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\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 using Tailwind classes that reference CSS variables\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `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={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import React, { useCallback, useRef, useState } from \"react\";\nimport { cn } from \"../utils\";\nimport { Modal } from \"./Modal\";\nimport { Text } from \"./Text\";\n\nexport type AspectRatio = \"16:9\" | \"9:16\" | \"4:3\" | \"1:1\";\n\nexport type VideoPlayerProps = {\n /**\n * The URL of the video to play\n */\n src: string;\n /**\n * Whether the video modal is open\n */\n open: boolean;\n /**\n * Callback fired when the video modal is closed\n */\n onClose: () => void;\n /**\n * The caption to display in the bottom left corner\n */\n caption?: React.ReactNode;\n /**\n * The aspect ratio of the video\n * @default \"16:9\"\n */\n aspectRatio?: AspectRatio;\n /**\n * Additional class names to be applied to the video container\n */\n className?: string;\n};\n\nconst aspectRatioClasses: Record<AspectRatio, string> = {\n \"16:9\": \"aspect-video\",\n \"9:16\": \"aspect-[9/16]\",\n \"4:3\": \"aspect-[4/3]\",\n \"1:1\": \"aspect-square\"\n};\n\nexport const VideoPlayer = ({\n src,\n open,\n onClose,\n caption,\n aspectRatio = \"16:9\",\n className\n}: VideoPlayerProps) => {\n const videoRef = useRef<HTMLVideoElement>(null);\n const [isHovering, setIsHovering] = useState(false);\n\n const handleMouseEnter = useCallback(() => {\n setIsHovering(true);\n }, []);\n\n const handleMouseLeave = useCallback(() => {\n setIsHovering(false);\n }, []);\n\n return (\n <Modal\n open={open}\n onClose={onClose}\n showCloseButton={isHovering}\n className={cn(\"rounded-xl\", className)}\n >\n <div\n className={cn(\n \"w-full max-h-[90vh]\",\n aspectRatioClasses[aspectRatio],\n \"relative w-full h-full flex items-center justify-center\"\n )}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n <video\n ref={videoRef}\n src={src}\n className=\"w-full h-full object-contain\"\n controls\n autoPlay\n />\n {caption && (\n <div className=\"absolute left-4 bottom-16 flex flex-col gap-1 p-2 rounded-lg bg-overlay max-w-[80%]\">\n <Text variant=\"body-default-medium\" className=\"text-white\">\n {caption}\n </Text>\n </div>\n )}\n </div>\n </Modal>\n );\n};\n\nVideoPlayer.displayName = \"VideoPlayer\";\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/utils/responsive.ts","../../src/components/Icon.tsx","../../src/utils/tailwind.ts","../../src/components/Pressable.tsx","../../src/utils/usePortalKeyboardEvent.ts","../../src/components/Modal.tsx","../../src/components/Text.tsx","../../src/components/VideoPlayer.tsx"],"names":["cn","inputs","twMerge","clsx","BASE_SIZES","RESPONSIVE_SIZES","getSizeKey","size","getResponsiveSize","baseSize","classes","styles","key","baseKey","responsiveClasses","s","breakpoint","valueStr","value","valueKey","COLOR_MAP","Icon","React","name","color","title","className","style","props","ref","IconComponent","IconMap","responsiveSizeClasses","responsiveSizeStyles","focusRingStyles","Pressable","children","type","disabled","usePortalKeyboardEvent","eventMap","isActive","preventScroll","handleKeyDown","useCallback","event","handler","useEffect","Modal","open","onClose","showCloseButton","i","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","fontWeight","processVariants","variants","typographyClass","Text","as","weight","typographyClasses","colorClasses","suggestedElement","baseVariant","aspectRatioClasses","VideoPlayer","src","caption","aspectRatio","videoRef","useRef","isHovering","setIsHovering","useState","handleMouseEnter","handleMouseLeave"],"mappings":"0nBAGO,SAASA,CAAMC,CAAAA,GAAAA,CAAAA,CAAsB,CAC1C,OAAOC,qBAAQC,CAAAA,SAAAA,CAAKF,CAAM,CAAC,CAC7B,CCaA,IAAMG,EAAsC,CAC1C,EAAA,CAAM,mBACN,CAAA,EAAA,CAAM,mBACN,CAAA,EAAA,CAAM,mBACN,CAAA,EAAA,CAAM,mBACN,CAAA,EAAA,CAAM,mBACN,CAAA,EAAA,CAAM,mBACN,CAAA,EAAA,CAAM,oBACN,EAAM,CAAA,mBAAA,CACN,EAAM,CAAA,mBAAA,CACN,EAAM,CAAA,mBAAA,CACN,GAAM,mBACN,CAAA,EAAA,CAAM,mBACR,CAAA,CAEMC,CAAgE,CAAA,CACpE,GAAI,CACF,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,yBACR,CAAA,CACA,EAAI,CAAA,CACF,GAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACR,CAAA,CACA,EAAI,CAAA,CACF,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBACR,EACA,EAAI,CAAA,CACF,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBACR,CACA,CAAA,KAAA,CAAO,CACL,EAAM,CAAA,2BAAA,CACN,EAAM,CAAA,2BAAA,CACN,EAAM,CAAA,2BAAA,CACN,GAAM,2BACN,CAAA,EAAA,CAAM,2BACN,CAAA,EAAA,CAAM,2BACN,CAAA,EAAA,CAAM,2BACN,CAAA,EAAA,CAAM,2BACN,CAAA,EAAA,CAAM,2BACN,CAAA,EAAA,CAAM,2BACN,CAAA,EAAA,CAAM,4BACN,EAAM,CAAA,2BACR,CACF,CAAA,CAEMC,CAAcC,CAAAA,CAAAA,EACX,OAAOA,CAAI,CAAA,CAGPC,CAAoB,CAAA,CAC/BD,CACAE,CAAAA,CAAAA,CAAmB,KAIhB,CACH,IAAMC,CAAoB,CAAA,EACpBC,CAAAA,CAAAA,CAAiC,EAAC,CAGxC,GAAIJ,CAAAA,GAAS,MAAW,CAAA,CACtB,IAAMK,CAAAA,CAAMN,EAAWG,CAAQ,CAAA,CAC3BG,CACFF,CAAAA,CAAAA,CAAQ,IAAKN,CAAAA,CAAAA,CAAWQ,CAAG,CAAC,CAAA,EAE5BD,CAAO,CAAA,MAAA,CAAS,CAAGF,EAAAA,CAAQ,KAC3BE,CAAO,CAAA,KAAA,CAAQ,CAAGF,EAAAA,CAAQ,CAE9B,EAAA,CAAA,EAAA,CAGA,GAAI,OAAOF,CAAS,EAAA,QAAA,CAAU,CAC5B,IAAMK,CAAMN,CAAAA,CAAAA,CAAWC,CAAI,CACvBK,CAAAA,CAAAA,CACFF,CAAQ,CAAA,IAAA,CAAKN,CAAWQ,CAAAA,CAAG,CAAC,CAE5BD,EAAAA,CAAAA,CAAO,MAAS,CAAA,CAAA,EAAGJ,CAAI,CAAA,EAAA,CAAA,CACvBI,EAAO,KAAQ,CAAA,CAAA,EAAGJ,CAAI,CAAA,EAAA,CAAA,EAE1B,CAGA,GAAI,KAAM,CAAA,OAAA,CAAQA,CAAI,CAAA,CAAG,CACvB,IAAMM,CAAUP,CAAAA,CAAAA,CAAWG,CAAQ,CAC7BK,CAAAA,CAAAA,CAAoB,CACvBD,CAAAA,EAAWT,CAAWS,CAAAA,CAAO,GAAM,CAAMJ,GAAAA,EAAAA,CAAQ,CAAUA,OAAAA,EAAAA,CAAQ,CACtE,GAAA,CAAA,CAAA,CAEAF,EAAK,OAASQ,CAAAA,CAAAA,EAAM,CAClB,GAAI,OAAOA,CAAAA,EAAM,QAAU,CAAA,CACzB,GAAM,CAACC,CAAYC,CAAAA,CAAQ,CAAIF,CAAAA,CAAAA,CAAE,MAAM,GAAG,CAAA,CACpCG,CAAQ,CAAA,QAAA,CAASD,CAAU,CAAA,EAAE,EAC7BL,CAAMN,CAAAA,CAAAA,CAAWY,CAAK,CAAA,CAC5BR,CAAQ,CAAA,IAAA,CACLE,GAAOP,CAAiBW,CAAAA,CAAU,CAAIJ,GAAAA,CAAG,CACxC,EAAA,CAAA,EAAGI,CAAU,CAAA,IAAA,EAAOE,CAAK,CAAA,IAAA,EAAOF,CAAU,CAAA,IAAA,EAAOE,CAAK,CAAA,GAAA,CAC1D,EACF,CACF,CAAC,CAEDR,CAAAA,CAAAA,CAAQ,IAAK,CAAA,GAAGI,CAAiB,EACnC,CAEA,GAAI,OAAOP,CAAS,EAAA,QAAA,CAAU,CAC5B,GAAM,CAACS,CAAYC,CAAAA,CAAQ,CAAIV,CAAAA,CAAAA,CAAK,KAAM,CAAA,GAAG,CACvCW,CAAAA,CAAAA,CAAQ,QAASD,CAAAA,CAAAA,CAAU,EAAE,CAAA,CAC7BE,EAAWb,CAAWY,CAAAA,CAAK,CACjCR,CAAAA,CAAAA,CAAQ,IACLS,CAAAA,CAAAA,EAAYd,EAAiBW,CAAU,CAAA,GAAIG,CAAQ,CAAA,EAClD,CAAGH,EAAAA,CAAU,OAAOE,CAAK,CAAA,IAAA,EAAOF,CAAU,CAAA,IAAA,EAAOE,CAAK,CAAA,GAAA,CAC1D,EACF,CAEA,OAAO,CACL,qBAAuBR,CAAAA,CAAAA,CAAQ,IAAK,CAAA,GAAG,EACvC,oBAAsBC,CAAAA,CACxB,CACF,CAAA,CC5JA,IAAMS,CAAAA,CAAwC,CAC5C,OAAS,CAAA,sBAAA,CACT,SAAW,CAAA,wBAAA,CACX,KAAO,CAAA,oBAAA,CACP,YAAa,0BACb,CAAA,QAAA,CAAU,uBACV,CAAA,MAAA,CAAQ,qBACV,CAAA,CAEaC,CAAOC,CAAAA,kBAAAA,CAAM,UACxB,CAAA,CACE,CACE,IAAA,CAAAC,CACA,CAAA,IAAA,CAAAhB,EAAO,EACP,CAAA,KAAA,CAAAiB,CAAQ,CAAA,SAAA,CACR,KAAAC,CAAAA,CAAAA,CACA,UAAAC,CACA,CAAA,KAAA,CAAAC,CAAQ,CAAA,EACR,CAAA,GAAGC,CACL,CACAC,CAAAA,CAAAA,GACG,CACH,IAAMC,CAAgBC,CAAAA,aAAAA,CAAQR,CAAI,CAAA,CAC5B,CAAE,qBAAA,CAAAS,CAAuB,CAAA,oBAAA,CAAAC,CAAqB,CAAA,CAAIzB,EACtDD,CACA,CAAA,EACF,CAEA,CAAA,OACEe,kBAAA,CAAA,aAAA,CAAC,OACC,SAAWtB,CAAAA,CAAAA,CACT,kCACAgC,CAAAA,CAAAA,CACAN,CACF,CAAA,CACA,MAAO,CACJ,eAAA,CAA4BN,CAAUI,CAAAA,CAAK,CAC5C,CAAA,GAAGS,CACH,CAAA,GAAGN,CACL,CAAA,CAAA,CAEAL,kBAAA,CAAA,aAAA,CAACQ,CAAA,CAAA,CACC,IAAKD,CACL,CAAA,aAAA,CAAa,CAACJ,CAAAA,CACd,YAAYA,CAAAA,CAAAA,CACZ,OAAQF,CAAK,CAAA,QAAA,CAAS,QAAQ,CAAA,CAAI,MAAYH,CAAAA,CAAAA,CAAUI,CAAK,CAC5D,CAAA,GAAGI,CACN,CAAA,CACF,CAEJ,CACF,CAEAP,CAAAA,CAAAA,CAAK,WAAc,CAAA,MAAA,CCDZ,IAAMa,EACX,gFCnEK,CAAA,IAAMC,CAAYb,CAAAA,kBAAAA,CAAM,UAC7B,CAAA,CAAC,CAAE,QAAAc,CAAAA,CAAAA,CAAU,IAAAC,CAAAA,CAAAA,CAAO,QAAU,CAAA,SAAA,CAAAX,EAAW,QAAAY,CAAAA,CAAAA,CAAU,GAAGV,CAAM,CAAGC,CAAAA,CAAAA,GAC7DP,kBAAA,CAAA,aAAA,CAAC,QACC,CAAA,CAAA,GAAA,CAAKO,CACL,CAAA,IAAA,CAAMQ,CACN,CAAA,QAAA,CAAUC,EACV,SAAWtC,CAAAA,CAAAA,CACT,iEACAkC,CAAAA,CAAAA,CACAI,CAAY,EAAA,+BAAA,CACZZ,CACF,CACC,CAAA,GAAGE,CAEHQ,CAAAA,CAAAA,CACH,CAEJ,CAAA,CAEAD,EAAU,WAAc,CAAA,WAAA,CCCjB,IAAMI,CAAAA,CAAyB,CACpCC,CAAAA,CACA,CAAE,QAAA,CAAAC,EAAW,IAAM,CAAA,aAAA,CAAAC,CAAgB,CAAA,KAAM,CAA0B,CAAA,KAChE,CACH,IAAMC,CAAgBC,CAAAA,aAAAA,CACnBC,CAAyB,EAAA,CACxB,IAAMC,CAAUN,CAAAA,CAAAA,CAASK,CAAM,CAAA,GAAG,CAC9BC,CAAAA,CAAAA,EACFA,CAAQD,CAAAA,CAAK,EAEjB,CAAA,CACA,CAACL,CAAQ,CACX,CAAA,CAEAO,YAAU,KACJN,CAAAA,GACF,QAAS,CAAA,gBAAA,CAAiB,SAAWE,CAAAA,CAAa,EAC9CD,CACF,GAAA,QAAA,CAAS,IAAK,CAAA,KAAA,CAAM,QAAW,CAAA,QAAA,CAAA,CAAA,CAI5B,IAAM,CACX,QAAA,CAAS,mBAAoB,CAAA,SAAA,CAAWC,CAAa,CAAA,CACjDD,CACF,GAAA,QAAA,CAAS,IAAK,CAAA,KAAA,CAAM,QAAW,CAAA,OAAA,EAEnC,CACC,CAAA,CAAA,CAACD,EAAUE,CAAeD,CAAAA,CAAa,CAAC,EAC7C,CCzBO,CAAA,SAASM,EAAM,CACpB,QAAA,CAAAZ,CACA,CAAA,IAAA,CAAAa,CACA,CAAA,OAAA,CAAAC,EACA,SAAAxB,CAAAA,CAAAA,CACA,eAAAyB,CAAAA,CAAAA,CAAkB,IACpB,CAAA,CAAe,CACb,OAAAZ,CACE,CAAA,CAAE,MAAQW,CAAAA,CAAQ,CAClB,CAAA,CAAE,SAAUD,CAAM,CAAA,aAAA,CAAe,IAAK,CACxC,CAGE3B,CAAAA,kBAAAA,CAAA,cAAQ8B,YAAP,CAAA,IAAA,CAAA,CAAY,IAAMH,CAAAA,CAAAA,CAAM,YAAcC,CAAAA,CAAAA,CAAAA,CACrC5B,mBAAA,aAAQ,CAAA8B,YAAA,CAAA,MAAA,CAAP,IACC9B,CAAAA,kBAAAA,CAAA,aAAQ,CAAA8B,YAAA,CAAA,OAAA,CAAP,CACC,SAAA,CAAWpD,CACT,CAAA,0DAAA,CACA,wCACA,CAAA,0CACF,CACF,CAAA,CAAA,CACAsB,mBAAA,aAAQ,CAAA8B,YAAA,CAAA,OAAA,CAAP,CACC,SAAA,CAAWpD,CACT,CAAA,+DAAA,CACA,qCACA,4BACA,CAAA,8DAAA,CACA,4DACA,CAAA,8DAAA,CACA,oFACA,CAAA,sFAAA,CACA0B,CACF,CAECU,CAAAA,CAAAA,CAAAA,CACAe,CACC7B,EAAAA,kBAAAA,CAAA,aAAQ,CAAA8B,YAAA,CAAA,KAAA,CAAP,CAAa,OAAA,CAAO,IACnB9B,CAAAA,CAAAA,kBAAAA,CAAA,aAACa,CAAAA,CAAAA,CAAA,CACC,SAAA,CAAU,gFACV,YAAW,CAAA,OAAA,CAAA,CAEXb,kBAAA,CAAA,aAAA,CAACD,CAAA,CAAA,CAAK,KAAK,OAAQ,CAAA,IAAA,CAAM,EAAI,CAAA,CAC/B,CACF,CAEJ,CACF,CACF,CAEJ,CAEA2B,CAAAA,CAAM,WAAc,CAAA,OAAA,CCXpB,IAAMK,CAAmD,CAAA,CACvD,EAAI,CAAA,IAAA,CACJ,GAAI,IACJ,CAAA,EAAA,CAAI,IACJ,CAAA,EAAA,CAAI,IACJ,CAAA,EAAA,CAAI,IACN,CAEMC,CAAAA,CAAAA,CAAyBC,CAAwC,EAAA,CACrE,GAAM,CAACC,EAAUjD,CAAI,CAAA,CAAIgD,CAAQ,CAAA,KAAA,CAAM,GAAG,CAAA,CAE1C,OAAIC,CAAAA,GAAa,SACRH,CAAAA,CAAAA,CAAoB9C,CAAI,CAAA,EAAK,GAGlCiD,CAAAA,CAAAA,GAAa,QACR,OAGF,CAAA,GACT,CAIMC,CAAAA,CAAAA,CAAqC,CACzC,KAAA,CAAO,aACP,OAAS,CAAA,cAAA,CACT,QAAU,CAAA,eAAA,CACV,IAAM,CAAA,WACR,EAwBMC,CACJC,CAAAA,CAAAA,EAEKA,CAEgB,CAAA,CAAA,KAAA,CAAM,OAAQA,CAAAA,CAAQ,CAAIA,CAAAA,CAAAA,CAAW,CAACA,CAAQ,CAGhE,EAAA,GAAA,CAAKJ,CAAY,EAAA,CAChB,GAAIA,CAAQ,CAAA,QAAA,CAAS,GAAG,CAAA,CAAG,CACzB,GAAM,CAACvC,CAAY4C,CAAAA,CAAe,CAAIL,CAAAA,CAAAA,CAAQ,KAAM,CAAA,GAAG,EACvD,OAAO,CAAA,EAAGvC,CAAU,CAAA,MAAA,EAAS4C,CAAe,CAAA,CAC9C,CACA,OAAO,CAAQL,KAAAA,EAAAA,CAAO,CACxB,CAAA,CAAC,CACA,CAAA,IAAA,CAAK,GAAG,CAZW,CAAA,mBAAA,CAeXM,CAAOvC,CAAAA,kBAAAA,CAAM,UACxB,CAAA,CACE,CACE,OAAAiC,CAAAA,CAAAA,CAAU,cACV,CAAA,KAAA,CAAA/B,CAAQ,CAAA,SAAA,CACR,GAAAsC,CACA,CAAA,SAAA,CAAApC,CACA,CAAA,QAAA,CAAAU,CACA,CAAA,MAAA,CAAA2B,CACA,CAAA,GAAGnC,CACL,CAAA,CACAC,CACG,GAAA,CAEH,IAAMmC,CAAAA,CAAoBN,EAAgBH,CAAO,CAAA,CAG3CU,CAAezC,CAAAA,CAAAA,GAAU,SAAY,CAAA,cAAA,CAAiB,QAAQA,CAAK,CAAA,CAAA,CAEnE0C,CAAmB5C,CAAAA,kBAAAA,CAAM,OAAQ,CAAA,IAAM,CAC3C,IAAM6C,CAAAA,CACJ,OAAOZ,CAAAA,EAAY,QACfA,CAAAA,CAAAA,CAAQ,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,EACnB,CAAA,KAAA,CAAM,OAAQA,CAAAA,CAAO,EACnBA,CAAQ,CAAA,CAAC,CAAE,CAAA,KAAA,CAAM,GAAG,CAAA,CAAE,KACtB,CAAA,cAAA,CACR,OAAOD,CAAAA,CAAsBa,CAA4B,CAC3D,EAAG,CAACZ,CAAO,CAAC,CAAA,CAIZ,OAEEjC,kBAAAA,CAAA,aAJiBwC,CAAAA,CAAAA,EAAMI,CAItB,CAAA,CACC,GAAKrC,CAAAA,CAAAA,CACL,SAAW,CAAA;AAAA;AAAA,UAAA,EAEPmC,CAAiB;AAAA,UAAA,EACjBC,CAAY;AAAA,UAAA,EACZF,CAAU,EAAA,CAAA,CAAA,EAAIN,CAAWM,CAAAA,CAAM,CAAC,CAAE,CAAA;AAAA,UAAA,EAClCrC,CAAS;AAAA,QAAA,CAAA,CAEZ,GAAGE,CAAAA,CAAAA,CAEHQ,CACH,CAEJ,CACF,CAAA,CAEAyB,CAAK,CAAA,WAAA,CAAc,MC9JnB,CAAA,IAAMO,CAAkD,CAAA,CACtD,OAAQ,cACR,CAAA,MAAA,CAAQ,eACR,CAAA,KAAA,CAAO,cACP,CAAA,KAAA,CAAO,eACT,CAAA,CAEO,SAASC,CAAY,CAAA,CAC1B,GAAAC,CAAAA,CAAAA,CACA,IAAArB,CAAAA,CAAAA,CACA,OAAAC,CAAAA,CAAAA,CACA,QAAAqB,CACA,CAAA,WAAA,CAAAC,CAAc,CAAA,MAAA,CACd,SAAA9C,CAAAA,CACF,CAAqB,CAAA,CACnB,IAAM+C,CAAWC,CAAAA,QAAAA,CAAyB,IAAI,CAAA,CACxC,CAACC,CAAAA,CAAYC,CAAa,CAAA,CAAIC,WAAS,KAAK,CAAA,CAE5CC,CAAmBlC,CAAAA,aAAAA,CAAY,IAAM,CACzCgC,CAAc,CAAA,IAAI,EACpB,CAAG,CAAA,EAAE,CAAA,CAECG,CAAmBnC,CAAAA,aAAAA,CAAY,IAAM,CACzCgC,EAAc,KAAK,EACrB,CAAG,CAAA,EAAE,CAAA,CAEL,OACEtD,kBAAAA,CAAA,cAAC0B,CAAA,CAAA,CACC,IAAMC,CAAAA,CAAAA,CACN,OAASC,CAAAA,CAAAA,CACT,eAAiByB,CAAAA,CAAAA,CACjB,UAAW3E,CAAG,CAAA,YAAA,CAAc0B,CAAS,CAAA,CAAA,CAErCJ,kBAAA,CAAA,aAAA,CAAC,KACC,CAAA,CAAA,SAAA,CAAWtB,EACT,qBACAoE,CAAAA,CAAAA,CAAmBI,CAAW,CAAA,CAC9B,yDACF,CAAA,CACA,YAAcM,CAAAA,CAAAA,CACd,aAAcC,CAEdzD,CAAAA,CAAAA,kBAAAA,CAAA,aAAC,CAAA,OAAA,CAAA,CACC,GAAKmD,CAAAA,CAAAA,CACL,GAAKH,CAAAA,CAAAA,CACL,UAAU,8BACV,CAAA,QAAA,CAAQ,IACR,CAAA,QAAA,CAAQ,IACV,CAAA,CAAA,CACCC,CACCjD,EAAAA,kBAAAA,CAAA,cAAC,KAAI,CAAA,CAAA,SAAA,CAAU,qFACbA,CAAAA,CAAAA,kBAAAA,CAAA,aAACuC,CAAAA,CAAAA,CAAA,CAAK,OAAA,CAAQ,sBAAsB,SAAU,CAAA,YAAA,CAAA,CAC3CU,CACH,CACF,CAEJ,CACF,CAEJ,CAEAF,EAAY,WAAc,CAAA,aAAA","file":"VideoPlayer.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","export type Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\nexport type ResponsiveSize = number | `${Breakpoint}:${number}`;\n\ntype SizeKey =\n | \"12\"\n | \"16\"\n | \"18\"\n | \"20\"\n | \"24\"\n | \"32\"\n | \"36\"\n | \"40\"\n | \"42\"\n | \"48\"\n | \"64\"\n | \"72\";\n\n// These constants help Tailwind identify the classes during compilation\nconst BASE_SIZES: Record<SizeKey, string> = {\n \"12\": \"h-[12px] w-[12px]\",\n \"16\": \"h-[16px] w-[16px]\",\n \"18\": \"h-[18px] w-[18px]\",\n \"20\": \"h-[20px] w-[20px]\",\n \"24\": \"h-[24px] w-[24px]\",\n \"32\": \"h-[32px] w-[32px]\",\n \"36\": \"h-[36px] w-[36px]\",\n \"40\": \"h-[40px] w-[40px]\",\n \"42\": \"h-[42px] w-[42px]\",\n \"48\": \"h-[48px] w-[48px]\",\n \"64\": \"h-[64px] w-[64px]\",\n \"72\": \"h-[72px] w-[72px]\"\n};\n\nconst RESPONSIVE_SIZES: Record<Breakpoint, Record<SizeKey, string>> = {\n sm: {\n \"12\": \"sm:h-[12px] sm:w-[12px]\",\n \"16\": \"sm:h-[16px] sm:w-[16px]\",\n \"18\": \"sm:h-[18px] sm:w-[18px]\",\n \"20\": \"sm:h-[20px] sm:w-[20px]\",\n \"24\": \"sm:h-[24px] sm:w-[24px]\",\n \"32\": \"sm:h-[32px] sm:w-[32px]\",\n \"36\": \"sm:h-[36px] sm:w-[36px]\",\n \"40\": \"sm:h-[40px] sm:w-[40px]\",\n \"42\": \"sm:h-[42px] sm:w-[42px]\",\n \"48\": \"sm:h-[48px] sm:w-[48px]\",\n \"64\": \"sm:h-[64px] sm:w-[64px]\",\n \"72\": \"sm:h-[72px] sm:w-[72px]\"\n },\n md: {\n \"12\": \"md:h-[12px] md:w-[12px]\",\n \"16\": \"md:h-[16px] md:w-[16px]\",\n \"18\": \"md:h-[18px] md:w-[18px]\",\n \"20\": \"md:h-[20px] md:w-[20px]\",\n \"24\": \"md:h-[24px] md:w-[24px]\",\n \"32\": \"md:h-[32px] md:w-[32px]\",\n \"36\": \"md:h-[36px] md:w-[36px]\",\n \"40\": \"md:h-[40px] md:w-[40px]\",\n \"42\": \"md:h-[42px] md:w-[42px]\",\n \"48\": \"md:h-[48px] md:w-[48px]\",\n \"64\": \"md:h-[64px] md:w-[64px]\",\n \"72\": \"md:h-[72px] md:w-[72px]\"\n },\n lg: {\n \"12\": \"lg:h-[12px] lg:w-[12px]\",\n \"16\": \"lg:h-[16px] lg:w-[16px]\",\n \"18\": \"lg:h-[18px] lg:w-[18px]\",\n \"20\": \"lg:h-[20px] lg:w-[20px]\",\n \"24\": \"lg:h-[24px] lg:w-[24px]\",\n \"32\": \"lg:h-[32px] lg:w-[32px]\",\n \"36\": \"lg:h-[36px] lg:w-[36px]\",\n \"40\": \"lg:h-[40px] lg:w-[40px]\",\n \"42\": \"lg:h-[42px] lg:w-[42px]\",\n \"48\": \"lg:h-[48px] lg:w-[48px]\",\n \"64\": \"lg:h-[64px] lg:w-[64px]\",\n \"72\": \"lg:h-[72px] lg:w-[72px]\"\n },\n xl: {\n \"12\": \"xl:h-[12px] xl:w-[12px]\",\n \"16\": \"xl:h-[16px] xl:w-[16px]\",\n \"18\": \"xl:h-[18px] xl:w-[18px]\",\n \"20\": \"xl:h-[20px] xl:w-[20px]\",\n \"24\": \"xl:h-[24px] xl:w-[24px]\",\n \"32\": \"xl:h-[32px] xl:w-[32px]\",\n \"36\": \"xl:h-[36px] xl:w-[36px]\",\n \"40\": \"xl:h-[40px] xl:w-[40px]\",\n \"42\": \"xl:h-[42px] xl:w-[42px]\",\n \"48\": \"xl:h-[48px] xl:w-[48px]\",\n \"64\": \"xl:h-[64px] xl:w-[64px]\",\n \"72\": \"xl:h-[72px] xl:w-[72px]\"\n },\n \"2xl\": {\n \"12\": \"2xl:h-[12px] 2xl:w-[12px]\",\n \"16\": \"2xl:h-[16px] 2xl:w-[16px]\",\n \"18\": \"2xl:h-[18px] 2xl:w-[18px]\",\n \"20\": \"2xl:h-[20px] 2xl:w-[20px]\",\n \"24\": \"2xl:h-[24px] 2xl:w-[24px]\",\n \"32\": \"2xl:h-[32px] 2xl:w-[32px]\",\n \"36\": \"2xl:h-[36px] 2xl:w-[36px]\",\n \"40\": \"2xl:h-[40px] 2xl:w-[40px]\",\n \"42\": \"2xl:h-[42px] 2xl:w-[42px]\",\n \"48\": \"2xl:h-[48px] 2xl:w-[48px]\",\n \"64\": \"2xl:h-[64px] 2xl:w-[64px]\",\n \"72\": \"2xl:h-[72px] 2xl:w-[72px]\"\n }\n};\n\nconst getSizeKey = (size: number): SizeKey | undefined => {\n return String(size) as SizeKey;\n};\n\nexport const getResponsiveSize = (\n size: ResponsiveSize | ResponsiveSize[] | undefined,\n baseSize: number = 24\n): {\n responsiveSizeClasses: string;\n responsiveSizeStyles: Record<string, string>;\n} => {\n const classes: string[] = [];\n const styles: Record<string, string> = {};\n\n // If no size provided, use baseSize\n if (size === undefined) {\n const key = getSizeKey(baseSize);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${baseSize}px`;\n styles.width = `${baseSize}px`;\n }\n }\n\n // If size is a number, use that directly\n if (typeof size === \"number\") {\n const key = getSizeKey(size);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${size}px`;\n styles.width = `${size}px`;\n }\n }\n\n // If array of responsive sizes, generate responsive classes\n if (Array.isArray(size)) {\n const baseKey = getSizeKey(baseSize);\n const responsiveClasses = [\n (baseKey && BASE_SIZES[baseKey]) || `h-[${baseSize}px] w-[${baseSize}px]`\n ];\n\n size.forEach((s) => {\n if (typeof s === \"string\") {\n const [breakpoint, valueStr] = s.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const key = getSizeKey(value);\n classes.push(\n (key && RESPONSIVE_SIZES[breakpoint]?.[key]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n });\n\n classes.push(...responsiveClasses);\n }\n\n if (typeof size === \"string\") {\n const [breakpoint, valueStr] = size.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const valueKey = getSizeKey(value);\n classes.push(\n (valueKey && RESPONSIVE_SIZES[breakpoint]?.[valueKey]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n\n return {\n responsiveSizeClasses: classes.join(\" \"),\n responsiveSizeStyles: styles\n };\n};\n","import type { IconName } from \"@deckai/icons\";\nimport { IconMap } from \"@deckai/icons\";\nimport type { SVGProps } from \"react\";\nimport React from \"react\";\n\nimport type { IconColors } from \"../types/tailwind\";\nimport { cn } from \"../utils\";\nimport type { ResponsiveSize } from \"../utils/responsive\";\nimport { getResponsiveSize } from \"../utils/responsive\";\n\nexport type IconProps = {\n name: IconName;\n /** @default 24 */\n size?: ResponsiveSize | ResponsiveSize[];\n /** @default primary */\n color?: IconColors;\n title?: string;\n className?: string;\n style?: React.CSSProperties;\n} & Omit<SVGProps<SVGSVGElement>, \"aria-hidden\" | \"aria-label\">;\n\n// Using CSS variables to support dark mode\nconst COLOR_MAP: Record<IconColors, string> = {\n primary: \"var(--color-primary)\",\n secondary: \"var(--color-secondary)\",\n white: \"var(--color-white)\",\n primaryBlue: \"var(--color-primary-100)\",\n disabled: \"var(--color-disabled)\",\n danger: \"var(--color-danger)\"\n};\n\nexport const Icon = React.forwardRef<SVGSVGElement, IconProps>(\n (\n {\n name,\n size = 24,\n color = \"primary\",\n title,\n className,\n style = {},\n ...props\n },\n ref\n ) => {\n const IconComponent = IconMap[name];\n const { responsiveSizeClasses, responsiveSizeStyles } = getResponsiveSize(\n size,\n 24\n );\n\n return (\n <div\n className={cn(\n \"flex justify-center items-center\",\n responsiveSizeClasses,\n className\n )}\n style={{\n [\"--icon-stroke\" as string]: COLOR_MAP[color],\n ...responsiveSizeStyles,\n ...style\n }}\n >\n <IconComponent\n ref={ref}\n aria-hidden={!title}\n aria-label={title}\n stroke={name.includes(\"filled\") ? undefined : COLOR_MAP[color]}\n {...props}\n />\n </div>\n );\n }\n);\n\nIcon.displayName = \"Icon\";\n","import type { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const sizes = [\"24\", \"42\", \"48\", \"64\", \"72\"]; // Add all the sizes you need\n\n const safelist: (string | { pattern: RegExp; variants: string[] })[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n // Generate size classes with responsive variants\n const sizeClasses = sizes.flatMap((size) => [\n `h-[${size}px]`,\n `w-[${size}px]`,\n ...breakpoints.flatMap((bp) => [\n `${bp}:h-[${size}px]`,\n `${bp}:w-[${size}px]`\n ])\n ]);\n\n return [...typographyClasses, ...responsiveTypographyClasses, ...sizeClasses];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100\";\nexport const focusRingWithinStyles =\n \"focus-within:outline-none focus-within:ring-2 focus-within:ring-primary-100\";\nexport const focusRingStylesCoerced = \"ring-2 ring-primary-100\";\n","import type { ButtonHTMLAttributes } from \"react\";\nimport React from \"react\";\n\nimport { cn } from \"../utils\";\nimport { focusRingStyles } from \"../utils/tailwind\";\n\nexport type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const Pressable = React.forwardRef<HTMLButtonElement, PressableProps>(\n ({ children, type = \"button\", className, disabled, ...props }, ref) => (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n className={cn(\n \"appearance-none hover:opacity-80 transition-all active:scale-95\",\n focusRingStyles,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n {children}\n </button>\n )\n);\n\nPressable.displayName = \"Pressable\";\n","import { useCallback, useEffect } from \"react\";\n\ntype KeyboardEventHandler = (event: KeyboardEvent) => void;\n\ntype KeyboardEventOptions = {\n /**\n * Whether the event should be active\n */\n isActive?: boolean;\n /**\n * Whether to prevent body scroll when active\n * @default false\n */\n preventScroll?: boolean;\n};\n\n/**\n * Hook for handling keyboard events within portals\n * @param eventMap - Map of keyboard events to their handlers\n * @param options - Options for the keyboard events\n * @example\n * ```tsx\n * const handleKeyboardEvents = usePortalKeyboardEvent({\n * Escape: onClose,\n * Enter: onConfirm,\n * }, { isActive: isOpen });\n * ```\n */\nexport const usePortalKeyboardEvent = (\n eventMap: Record<string, KeyboardEventHandler>,\n { isActive = true, preventScroll = false }: KeyboardEventOptions = {}\n) => {\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n const handler = eventMap[event.key];\n if (handler) {\n handler(event);\n }\n },\n [eventMap]\n );\n\n useEffect(() => {\n if (isActive) {\n document.addEventListener(\"keydown\", handleKeyDown);\n if (preventScroll) {\n document.body.style.overflow = \"hidden\";\n }\n }\n\n return () => {\n document.removeEventListener(\"keydown\", handleKeyDown);\n if (preventScroll) {\n document.body.style.overflow = \"unset\";\n }\n };\n }, [isActive, handleKeyDown, preventScroll]);\n};\n","import * as Dialog from \"@radix-ui/react-dialog\";\nimport React, { type ReactNode } from \"react\";\n\nimport { cn } from \"../utils\";\nimport { Icon } from \"./Icon\";\nimport { Pressable } from \"./Pressable\";\nimport { usePortalKeyboardEvent } from \"../utils/usePortalKeyboardEvent\";\n\nexport type ModalProps = {\n /**\n * The content to be rendered inside the modal\n */\n children: ReactNode;\n /**\n * Whether the modal is open\n */\n open: boolean;\n /**\n * Callback fired when the modal is closed\n */\n onClose: () => void;\n /**\n * Additional class names to be applied to the modal\n */\n className?: string;\n /**\n * Whether to show the close button\n * @default true\n */\n showCloseButton?: boolean;\n};\n\nexport function Modal({\n children,\n open,\n onClose,\n className,\n showCloseButton = true\n}: ModalProps) {\n usePortalKeyboardEvent(\n { Escape: onClose },\n { isActive: open, preventScroll: true }\n );\n\n return (\n <Dialog.Root open={open} onOpenChange={onClose}>\n <Dialog.Portal>\n <Dialog.Overlay\n className={cn(\n \"fixed inset-0 z-50 bg-sidebarOverlay backdrop-blur-[2px]\",\n \"data-[state=open]:animate-overlay-show\",\n \"data-[state=closed]:animate-overlay-hide\"\n )}\n />\n <Dialog.Content\n className={cn(\n \"fixed left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2\",\n \"w-[90vw] max-w-[90vw] max-h-[90vh]\",\n \"rounded-xl overflow-hidden\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out\",\n \"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n \"data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n \"data-[state=closed]:slide-out-to-left-1/2 data-[state=open]:slide-in-from-left-1/2\",\n \"data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%]\",\n className\n )}\n >\n {children}\n {showCloseButton && (\n <Dialog.Close asChild>\n <Pressable\n className=\"inline-flex items-center justify-center text-secondary absolute top-4 right-4\"\n aria-label=\"Close\"\n >\n <Icon name=\"close\" size={12} />\n </Pressable>\n </Dialog.Close>\n )}\n </Dialog.Content>\n </Dialog.Portal>\n </Dialog.Root>\n );\n}\n\nModal.displayName = \"Modal\";\n","import React from \"react\";\n\nimport type { Typography } from \"../types/tailwind\";\nimport type { Breakpoint } from \"../utils/responsive\";\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 | \"primary-100\";\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\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 using Tailwind classes that reference CSS variables\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `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={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import React, { useCallback, useRef, useState } from \"react\";\n\nimport { cn } from \"../utils\";\nimport { Modal } from \"./Modal\";\nimport { Text } from \"./Text\";\n\nexport type AspectRatio = \"16:9\" | \"9:16\" | \"4:3\" | \"1:1\";\n\nexport type VideoPlayerProps = {\n /**\n * The URL of the video to play\n */\n src: string;\n /**\n * Whether the video modal is open\n */\n open: boolean;\n /**\n * Callback fired when the video modal is closed\n */\n onClose: () => void;\n /**\n * The caption to display in the bottom left corner\n */\n caption?: React.ReactNode;\n /**\n * The aspect ratio of the video\n * @default \"16:9\"\n */\n aspectRatio?: AspectRatio;\n /**\n * Additional class names to be applied to the video container\n */\n className?: string;\n};\n\nconst aspectRatioClasses: Record<AspectRatio, string> = {\n \"16:9\": \"aspect-video\",\n \"9:16\": \"aspect-[9/16]\",\n \"4:3\": \"aspect-[4/3]\",\n \"1:1\": \"aspect-square\"\n};\n\nexport function VideoPlayer({\n src,\n open,\n onClose,\n caption,\n aspectRatio = \"16:9\",\n className\n}: VideoPlayerProps) {\n const videoRef = useRef<HTMLVideoElement>(null);\n const [isHovering, setIsHovering] = useState(false);\n\n const handleMouseEnter = useCallback(() => {\n setIsHovering(true);\n }, []);\n\n const handleMouseLeave = useCallback(() => {\n setIsHovering(false);\n }, []);\n\n return (\n <Modal\n open={open}\n onClose={onClose}\n showCloseButton={isHovering}\n className={cn(\"rounded-xl\", className)}\n >\n <div\n className={cn(\n \"w-full max-h-[90vh]\",\n aspectRatioClasses[aspectRatio],\n \"relative w-full h-full flex items-center justify-center\"\n )}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n <video\n ref={videoRef}\n src={src}\n className=\"w-full h-full object-contain\"\n controls\n autoPlay\n />\n {caption && (\n <div className=\"absolute left-4 bottom-16 flex flex-col gap-1 p-2 rounded-lg bg-overlay max-w-[80%]\">\n <Text variant=\"body-default-medium\" className=\"text-white\">\n {caption}\n </Text>\n </div>\n )}\n </div>\n </Modal>\n );\n}\n\nVideoPlayer.displayName = \"VideoPlayer\";\n"]}
|
|
@@ -28,9 +28,9 @@ type VideoPlayerProps = {
|
|
|
28
28
|
*/
|
|
29
29
|
className?: string;
|
|
30
30
|
};
|
|
31
|
-
declare
|
|
32
|
-
|
|
33
|
-
displayName: string;
|
|
34
|
-
}
|
|
31
|
+
declare function VideoPlayer({ src, open, onClose, caption, aspectRatio, className }: VideoPlayerProps): React__default.JSX.Element;
|
|
32
|
+
declare namespace VideoPlayer {
|
|
33
|
+
var displayName: string;
|
|
34
|
+
}
|
|
35
35
|
|
|
36
36
|
export { type AspectRatio, VideoPlayer, type VideoPlayerProps };
|
|
@@ -28,9 +28,9 @@ type VideoPlayerProps = {
|
|
|
28
28
|
*/
|
|
29
29
|
className?: string;
|
|
30
30
|
};
|
|
31
|
-
declare
|
|
32
|
-
|
|
33
|
-
displayName: string;
|
|
34
|
-
}
|
|
31
|
+
declare function VideoPlayer({ src, open, onClose, caption, aspectRatio, className }: VideoPlayerProps): React__default.JSX.Element;
|
|
32
|
+
declare namespace VideoPlayer {
|
|
33
|
+
var displayName: string;
|
|
34
|
+
}
|
|
35
35
|
|
|
36
36
|
export { type AspectRatio, VideoPlayer, type VideoPlayerProps };
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import c,{useRef,useState,useCallback,useEffect}from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import*as i from'@radix-ui/react-dialog';import {IconMap}from'@deckai/icons';function l(...e){return twMerge(clsx(e))}var
|
|
1
|
+
import c,{useRef,useState,useCallback,useEffect}from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import*as i from'@radix-ui/react-dialog';import {IconMap}from'@deckai/icons';function l(...e){return twMerge(clsx(e))}var g={12:"h-[12px] w-[12px]",16:"h-[16px] w-[16px]",18:"h-[18px] w-[18px]",20:"h-[20px] w-[20px]",24:"h-[24px] w-[24px]",32:"h-[32px] w-[32px]",36:"h-[36px] w-[36px]",40:"h-[40px] w-[40px]",42:"h-[42px] w-[42px]",48:"h-[48px] w-[48px]",64:"h-[64px] w-[64px]",72:"h-[72px] w-[72px]"},v={sm:{12:"sm:h-[12px] sm:w-[12px]",16:"sm:h-[16px] sm:w-[16px]",18:"sm:h-[18px] sm:w-[18px]",20:"sm:h-[20px] sm:w-[20px]",24:"sm:h-[24px] sm:w-[24px]",32:"sm:h-[32px] sm:w-[32px]",36:"sm:h-[36px] sm:w-[36px]",40:"sm:h-[40px] sm:w-[40px]",42:"sm:h-[42px] sm:w-[42px]",48:"sm:h-[48px] sm:w-[48px]",64:"sm:h-[64px] sm:w-[64px]",72:"sm:h-[72px] sm:w-[72px]"},md:{12:"md:h-[12px] md:w-[12px]",16:"md:h-[16px] md:w-[16px]",18:"md:h-[18px] md:w-[18px]",20:"md:h-[20px] md:w-[20px]",24:"md:h-[24px] md:w-[24px]",32:"md:h-[32px] md:w-[32px]",36:"md:h-[36px] md:w-[36px]",40:"md:h-[40px] md:w-[40px]",42:"md:h-[42px] md:w-[42px]",48:"md:h-[48px] md:w-[48px]",64:"md:h-[64px] md:w-[64px]",72:"md:h-[72px] md:w-[72px]"},lg:{12:"lg:h-[12px] lg:w-[12px]",16:"lg:h-[16px] lg:w-[16px]",18:"lg:h-[18px] lg:w-[18px]",20:"lg:h-[20px] lg:w-[20px]",24:"lg:h-[24px] lg:w-[24px]",32:"lg:h-[32px] lg:w-[32px]",36:"lg:h-[36px] lg:w-[36px]",40:"lg:h-[40px] lg:w-[40px]",42:"lg:h-[42px] lg:w-[42px]",48:"lg:h-[48px] lg:w-[48px]",64:"lg:h-[64px] lg:w-[64px]",72:"lg:h-[72px] lg:w-[72px]"},xl:{12:"xl:h-[12px] xl:w-[12px]",16:"xl:h-[16px] xl:w-[16px]",18:"xl:h-[18px] xl:w-[18px]",20:"xl:h-[20px] xl:w-[20px]",24:"xl:h-[24px] xl:w-[24px]",32:"xl:h-[32px] xl:w-[32px]",36:"xl:h-[36px] xl:w-[36px]",40:"xl:h-[40px] xl:w-[40px]",42:"xl:h-[42px] xl:w-[42px]",48:"xl:h-[48px] xl:w-[48px]",64:"xl:h-[64px] xl:w-[64px]",72:"xl:h-[72px] xl:w-[72px]"},"2xl":{12:"2xl:h-[12px] 2xl:w-[12px]",16:"2xl:h-[16px] 2xl:w-[16px]",18:"2xl:h-[18px] 2xl:w-[18px]",20:"2xl:h-[20px] 2xl:w-[20px]",24:"2xl:h-[24px] 2xl:w-[24px]",32:"2xl:h-[32px] 2xl:w-[32px]",36:"2xl:h-[36px] 2xl:w-[36px]",40:"2xl:h-[40px] 2xl:w-[40px]",42:"2xl:h-[42px] 2xl:w-[42px]",48:"2xl:h-[48px] 2xl:w-[48px]",64:"2xl:h-[64px] 2xl:w-[64px]",72:"2xl:h-[72px] 2xl:w-[72px]"}},h=e=>String(e),M=(e,s=24)=>{let t=[],r={};if(e===void 0){let o=h(s);o?t.push(g[o]):(r.height=`${s}px`,r.width=`${s}px`);}if(typeof e=="number"){let o=h(e);o?t.push(g[o]):(r.height=`${e}px`,r.width=`${e}px`);}if(Array.isArray(e)){let o=h(s),p=[o&&g[o]||`h-[${s}px] w-[${s}px]`];e.forEach(n=>{if(typeof n=="string"){let[a,m]=n.split(":"),x=parseInt(m,10),d=h(x);t.push(d&&v[a]?.[d]||`${a}:h-[${x}px] ${a}:w-[${x}px]`);}}),t.push(...p);}if(typeof e=="string"){let[o,p]=e.split(":"),n=parseInt(p,10),a=h(n);t.push(a&&v[o]?.[a]||`${o}:h-[${n}px] ${o}:w-[${n}px]`);}return {responsiveSizeClasses:t.join(" "),responsiveSizeStyles:r}};var H={primary:"var(--color-primary)",secondary:"var(--color-secondary)",white:"var(--color-white)",primaryBlue:"var(--color-primary-100)",disabled:"var(--color-disabled)",danger:"var(--color-danger)"},f=c.forwardRef(({name:e,size:s=24,color:t="primary",title:r,className:o,style:p={},...n},a)=>{let m=IconMap[e],{responsiveSizeClasses:x,responsiveSizeStyles:d}=M(s,24);return c.createElement("div",{className:l("flex justify-center items-center",x,o),style:{"--icon-stroke":H[t],...d,...p}},c.createElement(m,{ref:a,"aria-hidden":!r,"aria-label":r,stroke:e.includes("filled")?void 0:H[t],...n}))});f.displayName="Icon";var L="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100";var w=c.forwardRef(({children:e,type:s="button",className:t,disabled:r,...o},p)=>c.createElement("button",{ref:p,type:s,disabled:r,className:l("appearance-none hover:opacity-80 transition-all active:scale-95",L,r&&"opacity-50 cursor-not-allowed",t),...o},e));w.displayName="Pressable";var $=(e,{isActive:s=true,preventScroll:t=false}={})=>{let r=useCallback(o=>{let p=e[o.key];p&&p(o);},[e]);useEffect(()=>(s&&(document.addEventListener("keydown",r),t&&(document.body.style.overflow="hidden")),()=>{document.removeEventListener("keydown",r),t&&(document.body.style.overflow="unset");}),[s,r,t]);};function b({children:e,open:s,onClose:t,className:r,showCloseButton:o=true}){return $({Escape:t},{isActive:s,preventScroll:true}),c.createElement(i.Root,{open:s,onOpenChange:t},c.createElement(i.Portal,null,c.createElement(i.Overlay,{className:l("fixed inset-0 z-50 bg-sidebarOverlay backdrop-blur-[2px]","data-[state=open]:animate-overlay-show","data-[state=closed]:animate-overlay-hide")}),c.createElement(i.Content,{className:l("fixed left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2","w-[90vw] max-w-[90vw] max-h-[90vh]","rounded-xl overflow-hidden","data-[state=open]:animate-in data-[state=closed]:animate-out","data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0","data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95","data-[state=closed]:slide-out-to-left-1/2 data-[state=open]:slide-in-from-left-1/2","data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%]",r)},e,o&&c.createElement(i.Close,{asChild:true},c.createElement(w,{className:"inline-flex items-center justify-center text-secondary absolute top-4 right-4","aria-label":"Close"},c.createElement(f,{name:"close",size:12}))))))}b.displayName="Modal";var K={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},I=e=>{let[s,t]=e.split("-");return s==="heading"?K[t]||"p":s==="label"?"label":"p"},B={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},O=e=>e?(Array.isArray(e)?e:[e]).map(t=>{if(t.includes(":")){let[r,o]=t.split(":");return `${r}:text-${o}`}return `text-${t}`}).join(" "):"text-body-default",E=c.forwardRef(({variant:e="body-default",color:s="primary",as:t,className:r,children:o,weight:p,...n},a)=>{let m=O(e),x=s==="inherit"?"text-inherit":`text-${s}`,d=c.useMemo(()=>{let S=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return I(S)},[e]);return c.createElement(t||d,{ref:a,className:`
|
|
2
2
|
font-sans antialiased
|
|
3
3
|
${m}
|
|
4
4
|
${x}
|
|
5
5
|
${p&&`!${B[p]}`}
|
|
6
6
|
${r}
|
|
7
|
-
`,...n},o)});E.displayName="Text";var D={"16:9":"aspect-video","9:16":"aspect-[9/16]","4:3":"aspect-[4/3]","1:1":"aspect-square"}
|
|
7
|
+
`,...n},o)});E.displayName="Text";var D={"16:9":"aspect-video","9:16":"aspect-[9/16]","4:3":"aspect-[4/3]","1:1":"aspect-square"};function G({src:e,open:s,onClose:t,caption:r,aspectRatio:o="16:9",className:p}){let n=useRef(null),[a,m]=useState(false),x=useCallback(()=>{m(true);},[]),d=useCallback(()=>{m(false);},[]);return c.createElement(b,{open:s,onClose:t,showCloseButton:a,className:l("rounded-xl",p)},c.createElement("div",{className:l("w-full max-h-[90vh]",D[o],"relative w-full h-full flex items-center justify-center"),onMouseEnter:x,onMouseLeave:d},c.createElement("video",{ref:n,src:e,className:"w-full h-full object-contain",controls:true,autoPlay:true}),r&&c.createElement("div",{className:"absolute left-4 bottom-16 flex flex-col gap-1 p-2 rounded-lg bg-overlay max-w-[80%]"},c.createElement(E,{variant:"body-default-medium",className:"text-white"},r))))}G.displayName="VideoPlayer";export{G as VideoPlayer};//# sourceMappingURL=VideoPlayer.js.map
|
|
8
8
|
//# sourceMappingURL=VideoPlayer.js.map
|