@shopify/shop-minis-react 0.0.6 → 0.0.8

package/src/components/atoms/touchable.tsx

@@ -0,0 +1,83 @@
+import * as React from 'react'
+
+import {motion, HTMLMotionProps, useAnimationControls} from 'motion/react'
+
+export const Touchable = ({
+  children,
+  onClick,
+  stopPropagation = false,
+  ...props
+}: HTMLMotionProps<'div'> & {
+  onClick?: React.MouseEventHandler<HTMLDivElement>
+  stopPropagation?: boolean
+}) => {
+  const ref = React.useRef<HTMLDivElement>(null)
+  const controls = useAnimationControls()
+
+  const handleClick = React.useCallback(
+    (event: React.MouseEvent<HTMLDivElement>) => {
+      if (stopPropagation) event.stopPropagation()
+      onClick?.(event)
+    },
+    [stopPropagation, onClick]
+  )
+
+  // Handle animations manually when stopPropagation is true to prevent parent from receiving event
+  React.useEffect(() => {
+    if (!stopPropagation || !ref.current) return
+
+    const element = ref.current
+
+    const handlePointerDown = (event: PointerEvent) => {
+      event.stopImmediatePropagation()
+      event.stopPropagation()
+
+      // Animate to pressed state
+      controls.start({
+        scale: 0.95,
+        opacity: 0.7,
+      })
+    }
+
+    const handlePointerUp = (event: PointerEvent) => {
+      event.stopImmediatePropagation()
+      event.stopPropagation()
+
+      // Animate back to normal state
+      controls.start({
+        scale: 1,
+        opacity: 1,
+      })
+    }
+
+    // Capture pointer event before Motion
+    element.addEventListener('pointerdown', handlePointerDown, true)
+    element.addEventListener('pointerup', handlePointerUp, true)
+
+    return () => {
+      element.removeEventListener('pointerdown', handlePointerDown, true)
+      element.removeEventListener('pointerup', handlePointerUp, true)
+    }
+  }, [stopPropagation, controls])
+
+  return (
+    <motion.div
+      ref={ref}
+      data-touchable="true"
+      className="flex w-full"
+      animate={stopPropagation ? controls : undefined}
+      whileTap={stopPropagation ? undefined : {scale: 0.95, opacity: 0.7}}
+      transition={{
+        scale: {type: 'tween', duration: 0.08, ease: 'linear'},
+        opacity: {type: 'tween', duration: 0.08, ease: 'linear'},
+      }}
+      onClick={handleClick}
+      style={{
+        touchAction: stopPropagation ? 'manipulation' : undefined,
+      }}
+      {...props} // TODO: We may need to filter out some props, as we only need motion props
+    >
+      {children}
+    </motion.div>
+  )
+}

package/src/components/commerce/product-card.tsx

@@ -12,12 +12,12 @@ import {
   type Product,
   type ProductVariant,
 } from '../../types/minisSDK.generated.d'
-import {Badge} from '../ui/badge'
-import {Button} from '../ui/button'
-import {Touchable} from '../ui/touchable'
+import {Badge} from '../atoms/badge'
+import {Button} from '../atoms/button'
+import {Touchable} from '../atoms/touchable'
 
 const productCardVariants = cva(
-  'relative overflow-hidden rounded-xl border border-gray-200',
+  'relative w-full overflow-hidden rounded-xl border border-gray-200',
   {
     variants: {
       variant: {
@@ -70,7 +70,13 @@ function ProductCardRoot({
 
   if (touchable && onPress) {
     return (
-      <Touchable onPress={onPress} asChild>
+      <Touchable
+        onClick={onPress}
+        whileTap={{opacity: 0.7}}
+        transition={{
+          opacity: {type: 'tween', duration: 0.08, ease: 'easeInOut'},
+        }}
+      >
         {content}
       </Touchable>
     )
@@ -162,18 +168,21 @@ function ProductCardFavoriteButton({
 }) {
   return (
     <div className={cn('absolute bottom-3 right-3 z-10', className)} {...props}>
-      <Touchable onPress={onPress} asChild>
-        <Button
-          variant="secondary"
-          size="icon"
-          className={cn(
-            'h-8 w-8 rounded-full border-0 shadow-sm',
-            filled ? 'bg-primary' : 'bg-grayscale-l6/60 backdrop-blur-sm'
-          )}
-        >
-          <Heart filled={filled} className="h-4 w-4 text-white" />
-        </Button>
-      </Touchable>
+      <Button
+        onClick={onPress}
+        variant="secondary"
+        size="icon"
+        className={cn(
+          'h-8 w-8 rounded-full border-0 shadow-sm',
+          filled ? 'bg-primary' : 'bg-grayscale-l6/60 backdrop-blur-sm'
+        )}
+        stopPropagation
+      >
+        <Heart
+          fill={filled ? 'currentColor' : 'none'}
+          className="h-4 w-4 text-white"
+        />
+      </Button>
     </div>
   )
 }

package/src/components/commerce/product-link.tsx

@@ -8,14 +8,14 @@ import {useShopNavigation} from '../../hooks/navigation/useShopNavigation'
 import {useSavedProductsActions} from '../../hooks/user/useSavedProductsActions'
 import {cn} from '../../lib/utils'
 import {type Product} from '../../types/minisSDK.generated.d'
-import {Button} from '../ui/button'
-import {Card, CardContent, CardAction} from '../ui/card'
-import {Touchable} from '../ui/touchable'
+import {Button} from '../atoms/button'
+import {Card, CardContent, CardAction} from '../atoms/card'
+import {Touchable} from '../atoms/touchable'
 
 const productLinkVariants = cva('', {
   variants: {
     layout: {
-      horizontal: '!flex-row items-center gap-3 px-4 py-3',
+      horizontal: 'w-full !flex-row items-center gap-3 px-4 py-3',
       vertical: 'flex-col',
     },
     discount: {
@@ -50,7 +50,13 @@ function ProductLinkRoot({
   const Comp = asChild ? SlotPrimitive.Root : Card
 
   return (
-    <Touchable onPress={onPress} asChild>
+    <Touchable
+      onClick={onPress}
+      whileTap={{opacity: 0.7}}
+      transition={{
+        opacity: {type: 'tween', duration: 0.08, ease: 'easeInOut'},
+      }}
+    >
       <Comp
         className={cn(
           productLinkVariants({layout, discount}),
@@ -198,13 +204,21 @@ function ProductLinkActions({
       className={cn('flex-shrink-0 self-center px-0 py-0', className)}
       {...props}
     >
-      <Touchable onPress={onActionPress} asChild>
+      <Touchable
+        stopPropagation
+        onClick={onActionPress}
+        whileTap={{opacity: 0.7, scale: 0.95}}
+        transition={{
+          opacity: {type: 'tween', duration: 0.08, ease: 'easeInOut'},
+          scale: {type: 'tween', duration: 0.08, ease: 'easeInOut'},
+        }}
+      >
         <Button
           variant="borderless"
           size="icon"
           className="h-auto w-auto p-0 hover:bg-transparent"
         >
-          <Heart filled={filled} withBackground className="h-4 w-4" />
+          <Heart fill={filled ? 'currentColor' : 'none'} className="h-4 w-4" />
         </Button>
       </Touchable>
     </CardAction>
@@ -315,7 +329,9 @@ function ProductLink({product}: ProductLinkProps) {
               {Array.from({length: 5}, (_, i) => (
                 <Star
                   key={i}
-                  filled={i < Math.floor(averageRating!)}
+                  fill={
+                    i < Math.floor(averageRating!) ? 'currentColor' : 'none'
+                  }
                   className={cn(
                     'h-3 w-3',
                     i < Math.floor(averageRating!)

package/src/components/index.ts

@@ -1,25 +1,26 @@
+export * from './MinisContainer'
+
 export * from './commerce/product-card'
 export * from './commerce/product-link'
 
-export * from './ui/accordion'
-export * from './ui/alert'
-export * from './ui/alert-dialog'
-export * from './ui/avatar'
-export * from './ui/badge'
-export * from './ui/button'
-export * from './ui/card'
-export * from './ui/carousel'
-export * from './ui/checkbox'
-export * from './ui/dialog'
-export * from './ui/drawer'
-export * from './ui/input'
-export * from './ui/label'
-export * from './ui/progress'
-export * from './ui/radio-group'
-export * from './ui/resizable'
-export * from './ui/scroll-area'
-export * from './ui/select'
-export * from './ui/separator'
-export * from './ui/sheet'
-export * from './ui/sonner'
-export * from './ui/touchable'
+export * from './atoms/accordion'
+export * from './atoms/alert'
+export * from './atoms/alert-dialog'
+export * from './atoms/avatar'
+export * from './atoms/badge'
+export * from './atoms/button'
+export * from './atoms/card'
+export * from './atoms/carousel'
+export * from './atoms/checkbox'
+export * from './atoms/dialog'
+export * from './atoms/drawer'
+export * from './atoms/input'
+export * from './atoms/label'
+export * from './atoms/progress'
+export * from './atoms/radio-group'
+export * from './atoms/resizable'
+export * from './atoms/scroll-area'
+export * from './atoms/select'
+export * from './atoms/separator'
+export * from './atoms/sheet'
+export * from './atoms/sonner'

package/src/dev.tsx

@@ -4,15 +4,13 @@ import ReactDOM from 'react-dom/client'
 import {toast} from 'sonner'
 
 import './index.css'
-import {ProductCard} from './components/commerce/product-card'
-import {ProductLink} from './components/commerce/product-link'
 import {
   Accordion,
   AccordionContent,
   AccordionItem,
   AccordionTrigger,
-} from './components/ui/accordion'
-import {Alert, AlertDescription, AlertTitle} from './components/ui/alert'
+} from './components/atoms/accordion'
+import {Alert, AlertDescription, AlertTitle} from './components/atoms/alert'
 import {
   AlertDialog,
   AlertDialogAction,
@@ -23,10 +21,10 @@ import {
   AlertDialogHeader,
   AlertDialogTitle,
   AlertDialogTrigger,
-} from './components/ui/alert-dialog'
-import {Avatar, AvatarFallback, AvatarImage} from './components/ui/avatar'
-import {Badge} from './components/ui/badge'
-import {Button} from './components/ui/button'
+} from './components/atoms/alert-dialog'
+import {Avatar, AvatarFallback, AvatarImage} from './components/atoms/avatar'
+import {Badge} from './components/atoms/badge'
+import {Button} from './components/atoms/button'
 import {
   Card,
   CardHeader,
@@ -35,15 +33,15 @@ import {
   CardContent,
   CardAction,
   CardFooter,
-} from './components/ui/card'
+} from './components/atoms/card'
 import {
   Carousel,
   CarouselContent,
   CarouselItem,
   CarouselNext,
   CarouselPrevious,
-} from './components/ui/carousel'
-import {Checkbox} from './components/ui/checkbox'
+} from './components/atoms/carousel'
+import {Checkbox} from './components/atoms/checkbox'
 import {
   Dialog,
   DialogContent,
@@ -52,7 +50,7 @@ import {
   DialogHeader,
   DialogTitle,
   DialogTrigger,
-} from './components/ui/dialog'
+} from './components/atoms/dialog'
 import {
   Drawer,
   DrawerClose,
@@ -62,25 +60,25 @@ import {
   DrawerHeader,
   DrawerTitle,
   DrawerTrigger,
-} from './components/ui/drawer'
-import {Input} from './components/ui/input'
-import {Label} from './components/ui/label'
-import {Progress} from './components/ui/progress'
-import {RadioGroup, RadioGroupItem} from './components/ui/radio-group'
+} from './components/atoms/drawer'
+import {Input} from './components/atoms/input'
+import {Label} from './components/atoms/label'
+import {Progress} from './components/atoms/progress'
+import {RadioGroup, RadioGroupItem} from './components/atoms/radio-group'
 import {
   ResizableHandle,
   ResizablePanel,
   ResizablePanelGroup,
-} from './components/ui/resizable'
-import {ScrollArea} from './components/ui/scroll-area'
+} from './components/atoms/resizable'
+import {ScrollArea} from './components/atoms/scroll-area'
 import {
   Select,
   SelectContent,
   SelectItem,
   SelectTrigger,
   SelectValue,
-} from './components/ui/select'
-import {Separator} from './components/ui/separator'
+} from './components/atoms/select'
+import {Separator} from './components/atoms/separator'
 import {
   Sheet,
   SheetClose,
@@ -90,8 +88,10 @@ import {
   SheetHeader,
   SheetTitle,
   SheetTrigger,
-} from './components/ui/sheet'
-import {Toaster} from './components/ui/sonner'
+} from './components/atoms/sheet'
+import {Toaster} from './components/atoms/sonner'
+import {ProductCard} from './components/commerce/product-card'
+import {ProductLink} from './components/commerce/product-link'
 import {CurrencyCode} from './types/minisSDK.generated.d'
 import './mockActions'
 
@@ -424,13 +424,43 @@ function App() {
                 <>
                   <h4 className="text-lg font-medium mb-2">Core Variants</h4>
                   <div className="flex flex-wrap gap-2">
-                    <Button variant="primary">Primary</Button>
-                    <Button variant="secondary">Secondary</Button>
-                    <Button variant="tertiary">Tertiary</Button>
-                    <Button variant="outlined">Outlined</Button>
-                    <Button variant="text">Text</Button>
-                    <Button variant="borderless">Borderless</Button>
-                    <Button variant="borderlessUnbranded">
+                    <Button
+                      variant="primary"
+                      onClick={() => console.log('primary')}
+                    >
+                      Primary
+                    </Button>
+                    <Button
+                      variant="secondary"
+                      onClick={() => console.log('secondary')}
+                    >
+                      Secondary
+                    </Button>
+                    <Button
+                      variant="tertiary"
+                      onClick={() => console.log('tertiary')}
+                    >
+                      Tertiary
+                    </Button>
+                    <Button
+                      variant="outlined"
+                      onClick={() => console.log('outlined')}
+                    >
+                      Outlined
+                    </Button>
+                    <Button variant="text" onClick={() => console.log('text')}>
+                      Text
+                    </Button>
+                    <Button
+                      variant="borderless"
+                      onClick={() => console.log('borderless')}
+                    >
+                      Borderless
+                    </Button>
+                    <Button
+                      variant="borderlessUnbranded"
+                      onClick={() => console.log('borderlessUnbranded')}
+                    >
                       Borderless Unbranded
                     </Button>
                   </div>
@@ -666,32 +696,50 @@ function App() {
             {/* Resizable */}
             <div className="space-y-4">
               <h3 className="text-2xl font-semibold">Resizable</h3>
-              <ResizablePanelGroup
-                direction="horizontal"
-                className="max-w-md rounded-lg border"
-              >
-                <ResizablePanel defaultSize={50}>
-                  <div className="flex h-[200px] items-center justify-center p-6">
-                    <span className="font-semibold">One</span>
-                  </div>
-                </ResizablePanel>
-                <ResizableHandle />
-                <ResizablePanel defaultSize={50}>
-                  <ResizablePanelGroup direction="vertical">
-                    <ResizablePanel defaultSize={25}>
+
+              {/* Horizontal Layout */}
+              <div className="space-y-2">
+                <h4 className="text-lg font-medium">Horizontal</h4>
+                <ResizablePanelGroup
+                  direction="horizontal"
+                  className="max-w-md rounded-lg border"
+                >
+                  <ResizablePanel defaultSize={50}>
+                    <div className="flex h-[120px] items-center justify-center p-6">
+                      <span className="font-semibold">Left</span>
+                    </div>
+                  </ResizablePanel>
+                  <ResizableHandle />
+                  <ResizablePanel defaultSize={50}>
+                    <div className="flex h-[120px] items-center justify-center p-6">
+                      <span className="font-semibold">Right</span>
+                    </div>
+                  </ResizablePanel>
+                </ResizablePanelGroup>
+              </div>
+
+              {/* Vertical Layout */}
+              <div className="space-y-2">
+                <h4 className="text-lg font-medium">Vertical</h4>
+                <div className="max-w-md h-[200px] rounded-lg border overflow-hidden">
+                  <ResizablePanelGroup
+                    direction="vertical"
+                    className="h-full w-full"
+                  >
+                    <ResizablePanel defaultSize={40} minSize={20}>
                       <div className="flex h-full items-center justify-center p-6">
-                        <span className="font-semibold">Two</span>
+                        <span className="font-semibold">Top</span>
                       </div>
                     </ResizablePanel>
                     <ResizableHandle />
-                    <ResizablePanel defaultSize={75}>
+                    <ResizablePanel defaultSize={60} minSize={20}>
                       <div className="flex h-full items-center justify-center p-6">
-                        <span className="font-semibold">Three</span>
+                        <span className="font-semibold">Bottom</span>
                       </div>
                     </ResizablePanel>
                   </ResizablePanelGroup>
-                </ResizablePanel>
-              </ResizablePanelGroup>
+                </div>
+              </div>
             </div>
 
             {/* Scroll Area */}

package/src/index.css

@@ -201,6 +201,11 @@
   }
 }
 
+html,
+body {
+  touch-action: manipulation;
+}
+
 /* Disable text selection */
 body {
   -webkit-user-select: none;

package/src/types/minisSDK.generated.d.ts

@@ -1,6 +1,6 @@
 /* eslint-disable @shopify/typescript/prefer-pascal-case-enums */
 // Auto-generated type definitions for MinisSDK
-// Generated on: 2025-06-12T13:11:51.109Z
+// Generated on: 2025-06-16T14:51:57.942Z
 // Do not edit this file manually - run the generation script instead
 // Source: useShopActionsImplementationV3.ts + shopActionsV3Definitions.ts + shopActionsV3Types.ts
 // Generated using TypeScript compiler API for reliable AST parsing
@@ -668,6 +668,55 @@ export interface GetPopularProductsResponse {
   pageInfo: PaginationInfo
 }
 
+export interface PreviewProductInARParams {
+  id: string
+  fetchPolicy?: DataHookFetchPolicy
+}
+
+export interface GetCuratedProductsParams {
+  handle: string
+  requiredTags: string[]
+  anyOfTags: string[]
+  first?: number
+  after?: string
+  fetchPolicy?: DataHookFetchPolicy
+}
+
+export interface GetCuratedProductsResponse {
+  data: Product[]
+  pageInfo: PaginationInfo
+}
+
+export interface GetProductMediaParams {
+  id: string
+  first?: number
+  after?: string
+  fetchPolicy?: DataHookFetchPolicy
+}
+
+export interface GetProductMediaResponse {
+  data: ProductMedia[]
+  pageInfo: PaginationInfo
+}
+
+export interface GetProductsParams {
+  productIds: string[]
+  fetchPolicy?: DataHookFetchPolicy
+}
+
+export interface GetProductsResponse {
+  data: Product[]
+}
+
+export interface GetProductParams {
+  id: string
+  fetchPolicy?: DataHookFetchPolicy
+}
+
+export interface GetProductResponse {
+  data: Product
+}
+
 export type FetchPolicy =
   | 'cache-first'
   | 'network-only'
@@ -890,18 +939,41 @@ export interface ProductShop {
 export type ProductMedia =
   | {
       id: string
-      image?: ProductImage | null
+      image: ProductImage | null
       mediaContentType: 'IMAGE'
+      alt: string | null
     }
   | {
+      id: string
       mediaContentType: 'MODEL_3D'
-      previewImage?: ProductImage | null
+      previewImage: ProductImage | null
       sources: {
         filesize: number
         format: string
         mimeType: string
         url: string
       }[]
+      alt: string | null
+    }
+  | {
+      id: string
+      mediaContentType: 'VIDEO'
+      previewImage: ProductImage | null
+      sources: {
+        format: string
+        mimeType: string
+        url: string
+        width: number
+        height: number
+      }[]
+      alt: string | null
+    }
+  | {
+      id: string
+      mediaContentType: 'EXTERNAL_VIDEO'
+      previewImage: ProductImage | null
+      embedUrl: string
+      alt: string | null
     }
 
 export interface Product {

package/dist/components/ui/accordion.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"accordion.js","sources":["../../../src/components/ui/accordion.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {ChevronDownIcon} from 'lucide-react'\nimport {Accordion as AccordionPrimitive} from 'radix-ui'\n\nimport {cn} from '../../lib/utils'\n\nfunction Accordion({\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Root>) {\n  return <AccordionPrimitive.Root data-slot=\"accordion\" {...props} />\n}\n\nfunction AccordionItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Item>) {\n  return (\n    <AccordionPrimitive.Item\n      data-slot=\"accordion-item\"\n      className={cn('border-b last:border-b-0', className)}\n      {...props}\n    />\n  )\n}\n\nfunction AccordionTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        data-slot=\"accordion-trigger\"\n        className={cn(\n          'focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180',\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <ChevronDownIcon className=\"text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200\" />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  )\n}\n\nfunction AccordionContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Content>) {\n  return (\n    <AccordionPrimitive.Content\n      data-slot=\"accordion-content\"\n      className=\"data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm\"\n      {...props}\n    >\n      <div className={cn('pt-0 pb-4', className)}>{children}</div>\n    </AccordionPrimitive.Content>\n  )\n}\n\nexport {Accordion, AccordionItem, AccordionTrigger, AccordionContent}\n"],"names":["Accordion","props","AccordionPrimitive.Root","AccordionItem","className","jsx","AccordionPrimitive.Item","cn","AccordionTrigger","children","AccordionPrimitive.Header","jsxs","AccordionPrimitive.Trigger","ChevronDownIcon","AccordionContent","AccordionPrimitive.Content"],"mappings":";;;;AAOA,SAASA,EAAU;AAAA,EACjB,GAAGC;AACL,GAAyD;AACvD,2BAAQC,GAAA,EAAwB,aAAU,aAAa,GAAGD,GAAO;AACnE;AAEA,SAASE,EAAc;AAAA,EACrB,WAAAC;AAAA,EACA,GAAGH;AACL,GAAyD;AAErD,SAAA,gBAAAI;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC,EAAG,4BAA4BH,CAAS;AAAA,MAClD,GAAGH;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASO,EAAiB;AAAA,EACxB,WAAAJ;AAAA,EACA,UAAAK;AAAA,EACA,GAAGR;AACL,GAA4D;AAC1D,SACG,gBAAAI,EAAAK,GAAA,EAA0B,WAAU,QACnC,UAAA,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWL;AAAA,QACT;AAAA,QACAH;AAAA,MACF;AAAA,MACC,GAAGH;AAAA,MAEH,UAAA;AAAA,QAAAQ;AAAA,QACD,gBAAAJ,EAACQ,GAAgB,EAAA,WAAU,8GAA8G,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAE7I;AAEJ;AAEA,SAASC,EAAiB;AAAA,EACxB,WAAAV;AAAA,EACA,UAAAK;AAAA,EACA,GAAGR;AACL,GAA4D;AAExD,SAAA,gBAAAI;AAAA,IAACU;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAU;AAAA,MACT,GAAGd;AAAA,MAEJ,4BAAC,OAAI,EAAA,WAAWM,EAAG,aAAaH,CAAS,GAAI,UAAAK,EAAS,CAAA;AAAA,IAAA;AAAA,EACxD;AAEJ;"}

package/dist/components/ui/alert-dialog.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"alert-dialog.js","sources":["../../../src/components/ui/alert-dialog.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {AlertDialog as AlertDialogPrimitive} from 'radix-ui'\n\nimport {cn} from '../../lib/utils'\n\nimport {buttonVariants} from './button'\n\nfunction AlertDialog({\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />\n}\n\nfunction AlertDialogTrigger({\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {\n  return (\n    <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />\n  )\n}\n\nfunction AlertDialogPortal({\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Portal>) {\n  return (\n    <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n  )\n}\n\nfunction AlertDialogOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>) {\n  return (\n    <AlertDialogPrimitive.Overlay\n      data-slot=\"alert-dialog-overlay\"\n      className={cn(\n        'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Content>) {\n  return (\n    <AlertDialogPortal>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Content\n        data-slot=\"alert-dialog-content\"\n        className={cn(\n          'bg-background 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 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',\n          className\n        )}\n        {...props}\n      />\n    </AlertDialogPortal>\n  )\n}\n\nfunction AlertDialogHeader({className, ...props}: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogFooter({className, ...props}: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(\n        'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n  return (\n    <AlertDialogPrimitive.Title\n      data-slot=\"alert-dialog-title\"\n      className={cn('text-lg font-semibold', className)}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n  return (\n    <AlertDialogPrimitive.Description\n      data-slot=\"alert-dialog-description\"\n      className={cn('text-muted-foreground text-sm', className)}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogAction({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Action>) {\n  return (\n    <AlertDialogPrimitive.Action\n      className={cn(buttonVariants(), className)}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogCancel({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>) {\n  return (\n    <AlertDialogPrimitive.Cancel\n      className={cn(buttonVariants({variant: 'outlined'}), className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  AlertDialog,\n  AlertDialogPortal,\n  AlertDialogOverlay,\n  AlertDialogTrigger,\n  AlertDialogContent,\n  AlertDialogHeader,\n  AlertDialogFooter,\n  AlertDialogTitle,\n  AlertDialogDescription,\n  AlertDialogAction,\n  AlertDialogCancel,\n}\n"],"names":["AlertDialog","props","AlertDialogPrimitive.Root","AlertDialogTrigger","AlertDialogPrimitive.Trigger","AlertDialogPortal","AlertDialogPrimitive.Portal","AlertDialogOverlay","className","jsx","AlertDialogPrimitive.Overlay","cn","AlertDialogContent","AlertDialogPrimitive.Content","AlertDialogHeader","AlertDialogFooter","AlertDialogTitle","AlertDialogPrimitive.Title","AlertDialogDescription","AlertDialogPrimitive.Description","AlertDialogAction","AlertDialogPrimitive.Action","buttonVariants","AlertDialogCancel","AlertDialogPrimitive.Cancel"],"mappings":";;;;AAQA,SAASA,EAAY;AAAA,EACnB,GAAGC;AACL,GAA2D;AACzD,2BAAQC,GAAA,EAA0B,aAAU,gBAAgB,GAAGD,GAAO;AACxE;AAEA,SAASE,EAAmB;AAAA,EAC1B,GAAGF;AACL,GAA8D;AAC5D,2BACGG,GAAA,EAA6B,aAAU,wBAAwB,GAAGH,GAAO;AAE9E;AAEA,SAASI,EAAkB;AAAA,EACzB,GAAGJ;AACL,GAA6D;AAC3D,2BACGK,GAAA,EAA4B,aAAU,uBAAuB,GAAGL,GAAO;AAE5E;AAEA,SAASM,EAAmB;AAAA,EAC1B,WAAAC;AAAA,EACA,GAAGP;AACL,GAA8D;AAE1D,SAAA,gBAAAQ;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC;AAAA,QACT;AAAA,QACAH;AAAA,MACF;AAAA,MACC,GAAGP;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASW,EAAmB;AAAA,EAC1B,WAAAJ;AAAA,EACA,GAAGP;AACL,GAA8D;AAC5D,2BACGI,GACC,EAAA,UAAA;AAAA,IAAA,gBAAAI,EAACF,GAAmB,EAAA;AAAA,IACpB,gBAAAE;AAAA,MAACI;AAAAA,MAAA;AAAA,QACC,aAAU;AAAA,QACV,WAAWF;AAAA,UACT;AAAA,UACAH;AAAA,QACF;AAAA,QACC,GAAGP;AAAA,MAAA;AAAA,IAAA;AAAA,EACN,GACF;AAEJ;AAEA,SAASa,EAAkB,EAAC,WAAAN,GAAW,GAAGP,KAAqC;AAE3E,SAAA,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWE,EAAG,gDAAgDH,CAAS;AAAA,MACtE,GAAGP;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASc,EAAkB,EAAC,WAAAP,GAAW,GAAGP,KAAqC;AAE3E,SAAA,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWE;AAAA,QACT;AAAA,QACAH;AAAA,MACF;AAAA,MACC,GAAGP;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASe,EAAiB;AAAA,EACxB,WAAAR;AAAA,EACA,GAAGP;AACL,GAA4D;AAExD,SAAA,gBAAAQ;AAAA,IAACQ;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWN,EAAG,yBAAyBH,CAAS;AAAA,MAC/C,GAAGP;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASiB,EAAuB;AAAA,EAC9B,WAAAV;AAAA,EACA,GAAGP;AACL,GAAkE;AAE9D,SAAA,gBAAAQ;AAAA,IAACU;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWR,EAAG,iCAAiCH,CAAS;AAAA,MACvD,GAAGP;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASmB,EAAkB;AAAA,EACzB,WAAAZ;AAAA,EACA,GAAGP;AACL,GAA6D;AAEzD,SAAA,gBAAAQ;AAAA,IAACY;AAAAA,IAAA;AAAA,MACC,WAAWV,EAAGW,EAAe,GAAGd,CAAS;AAAA,MACxC,GAAGP;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASsB,EAAkB;AAAA,EACzB,WAAAf;AAAA,EACA,GAAGP;AACL,GAA6D;AAEzD,SAAA,gBAAAQ;AAAA,IAACe;AAAAA,IAAA;AAAA,MACC,WAAWb,EAAGW,EAAe,EAAC,SAAS,WAAU,CAAC,GAAGd,CAAS;AAAA,MAC7D,GAAGP;AAAA,IAAA;AAAA,EACN;AAEJ;"}

package/dist/components/ui/alert.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"alert.js","sources":["../../../src/components/ui/alert.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {cva, type VariantProps} from 'class-variance-authority'\n\nimport {cn} from '../../lib/utils'\n\nconst alertVariants = cva(\n  'relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current',\n  {\n    variants: {\n      variant: {\n        default: 'bg-card text-card-foreground',\n        destructive:\n          'text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  }\n)\n\nfunction Alert({\n  className,\n  variant,\n  ...props\n}: React.ComponentProps<'div'> & VariantProps<typeof alertVariants>) {\n  return (\n    <div\n      data-slot=\"alert\"\n      role=\"alert\"\n      className={cn(alertVariants({variant}), className)}\n      {...props}\n    />\n  )\n}\n\nfunction AlertTitle({className, ...props}: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"alert-title\"\n      className={cn(\n        'col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDescription({className, ...props}: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"alert-description\"\n      className={cn(\n        'text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {Alert, AlertTitle, AlertDescription}\n"],"names":["alertVariants","cva","Alert","className","variant","props","jsx","cn","AlertTitle","AlertDescription"],"mappings":";;;AAMA,MAAMA,IAAgBC;AAAA,EACpB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,aACE;AAAA,MAAA;AAAA,IAEN;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,IAAA;AAAA,EACX;AAEJ;AAEA,SAASC,EAAM;AAAA,EACb,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,GAAqE;AAEjE,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,WAAWC,EAAGP,EAAc,EAAC,SAAAI,EAAQ,CAAA,GAAGD,CAAS;AAAA,MAChD,GAAGE;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASG,EAAW,EAAC,WAAAL,GAAW,GAAGE,KAAqC;AAEpE,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC;AAAA,QACT;AAAA,QACAJ;AAAA,MACF;AAAA,MACC,GAAGE;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASI,EAAiB,EAAC,WAAAN,GAAW,GAAGE,KAAqC;AAE1E,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC;AAAA,QACT;AAAA,QACAJ;AAAA,MACF;AAAA,MACC,GAAGE;AAAA,IAAA;AAAA,EACN;AAEJ;"}

package/dist/components/ui/avatar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"avatar.js","sources":["../../../src/components/ui/avatar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {Avatar as AvatarPrimitive} from 'radix-ui'\n\nimport {cn} from '../../lib/utils'\n\nfunction Avatar({\n  className,\n  ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Root>) {\n  return (\n    <AvatarPrimitive.Root\n      data-slot=\"avatar\"\n      className={cn(\n        'relative flex size-8 shrink-0 overflow-hidden rounded-full',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarImage({\n  className,\n  ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Image>) {\n  return (\n    <AvatarPrimitive.Image\n      data-slot=\"avatar-image\"\n      className={cn('aspect-square size-full', className)}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarFallback({\n  className,\n  ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Fallback>) {\n  return (\n    <AvatarPrimitive.Fallback\n      data-slot=\"avatar-fallback\"\n      className={cn(\n        'bg-muted flex size-full items-center justify-center rounded-full',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {Avatar, AvatarImage, AvatarFallback}\n"],"names":["Avatar","className","props","jsx","AvatarPrimitive.Root","cn","AvatarImage","AvatarPrimitive.Image","AvatarFallback","AvatarPrimitive.Fallback"],"mappings":";;;AAMA,SAASA,EAAO;AAAA,EACd,WAAAC;AAAA,EACA,GAAGC;AACL,GAAsD;AAElD,SAAA,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC;AAAA,QACT;AAAA,QACAJ;AAAA,MACF;AAAA,MACC,GAAGC;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASI,EAAY;AAAA,EACnB,WAAAL;AAAA,EACA,GAAGC;AACL,GAAuD;AAEnD,SAAA,gBAAAC;AAAA,IAACI;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWF,EAAG,2BAA2BJ,CAAS;AAAA,MACjD,GAAGC;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASM,EAAe;AAAA,EACtB,WAAAP;AAAA,EACA,GAAGC;AACL,GAA0D;AAEtD,SAAA,gBAAAC;AAAA,IAACM;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWJ;AAAA,QACT;AAAA,QACAJ;AAAA,MACF;AAAA,MACC,GAAGC;AAAA,IAAA;AAAA,EACN;AAEJ;"}