@customafk/lunas-ui 0.2.74 → 0.2.76

package/dist/cards/grid-product-card.d.mts

@@ -1,2 +1,2 @@
-import { t as GridProductCard } from "../grid-product-card-bpADqDOQ.mjs";
+import { t as GridProductCard } from "../grid-product-card-P5X8ZPQF.mjs";
 export { GridProductCard };

package/dist/cards/grid-product-card.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"grid-product-card.mjs","names":["Image"],"sources":["../../packages/components/cards/grid-product-card.tsx"],"sourcesContent":["import { HeartIcon, ShoppingCartIcon } from 'lucide-react';\n\nimport { Button } from '../ui/button';\nimport { Card } from '../ui/card';\nimport { Image } from '../ui/image';\n\ntype Props = {\n  /** Unique identifier for the product. */\n  id: string;\n  /** URL-friendly slug for the product. */\n  slug: string;\n  /** Display name of the product shown on the card. */\n  name: string;\n  /** URL of the product's thumbnail image. */\n  thumbnail: string;\n  /** Regular price of the product in VND. */\n  price: number;\n  /** Optional sale / discounted price in VND. */\n  salePrice?: number;\n  /** Optional sale discount percentage (0–100). */\n  salePercentage?: number;\n};\n\n/**\n * A horizontal (grid-row) product card displaying a thumbnail, name, price, and add-to-cart / favourite actions.\n *\n * @example\n * ```tsx\n * import { GridProductCard } from '@customafk/lunas-ui/cards/grid-product-card';\n *\n * <GridProductCard\n *   id=\"prod-1\"\n *   slug=\"awesome-widget\"\n *   name=\"Awesome Widget\"\n *   thumbnail=\"/images/widget.png\"\n *   price={299000}\n * />\n * ```\n */\nexport const GridProductCard: React.FC<Props> = ({ name, thumbnail, price }) => {\n  return (\n    <Card className=\"h-36 w-full flex-row gap-4 p-2 pr-4\">\n      <Image className=\"aspect-square h-full flex-0\" src={thumbnail} />\n      <div className=\"flex flex-1 flex-col gap-y-1\">\n        <p className=\"line-clamp-2 h-10 font-semibold text-sm text-text-positive\">{name}</p>\n        <p className=\"font-bold text-base text-success\">\n          {price.toLocaleString('vi-VN')}\n          <small className=\"ml-0.5\">VND</small>\n        </p>\n        <div className=\"mb-3 flex flex-1 items-end justify-end gap-x-1\">\n          <Button size=\"icon\" variant=\"outline\" color=\"muted\" className=\"size-9\">\n            <HeartIcon />\n          </Button>\n          <Button className=\"max-w-52 max-sm:size-9 sm:flex-1\">\n            <ShoppingCartIcon />\n            <p className=\"sr-only sm:not-sr-only\">Thêm vào giỏ</p>\n          </Button>\n        </div>\n      </div>\n    </Card>\n  );\n};\n"],"mappings":"yOAuCA,MAAa,GAAoC,CAAE,OAAM,YAAW,WAEhE,EAAC,EAAD,CAAM,UAAU,+CAAhB,CACE,EAACA,EAAD,CAAO,UAAU,8BAA8B,IAAK,CAAY,CAAA,EAChE,EAAC,MAAD,CAAK,UAAU,wCAAf,CACE,EAAC,IAAD,CAAG,UAAU,sEAA8D,CAAQ,CAAA,EACnF,EAAC,IAAD,CAAG,UAAU,4CAAb,CACG,EAAM,eAAe,OAAO,EAC7B,EAAC,QAAD,CAAO,UAAU,kBAAS,KAAU,CAAA,CACnC,IACH,EAAC,MAAD,CAAK,UAAU,0DAAf,CACE,EAAC,EAAD,CAAQ,KAAK,OAAO,QAAQ,UAAU,MAAM,QAAQ,UAAU,kBAC5D,EAAC,EAAD,CAAY,CAAA,CACN,CAAA,EACR,EAAC,EAAD,CAAQ,UAAU,4CAAlB,CACE,EAAC,EAAD,CAAmB,CAAA,EACnB,EAAC,IAAD,CAAG,UAAU,kCAAyB,cAAe,CAAA,CAC/C,GACL,GACF,GACD"}
+{"version":3,"file":"grid-product-card.mjs","names":["Image"],"sources":["../../packages/components/cards/grid-product-card.tsx"],"sourcesContent":["import { HeartIcon, ShoppingCartIcon } from 'lucide-react';\n\nimport { Button } from '../ui/button';\nimport { Card } from '../ui/card';\nimport { Image } from '../ui/image';\n\ntype Props = {\n  /** Unique identifier for the product. */\n  id: string;\n  /** URL-friendly slug for the product. */\n  slug: string;\n  /** Display name of the product shown on the card. */\n  name: string;\n  /** URL of the product's thumbnail image. */\n  thumbnail: string;\n  /** Regular price of the product in VND. */\n  price: number;\n  /** Optional sale / discounted price in VND. */\n  salePrice?: number;\n  /** Optional sale discount percentage (0–100). */\n  salePercentage?: number;\n};\n\n/**\n * A horizontal (grid-row) product card displaying a thumbnail, name, price, and add-to-cart / favourite actions.\n *\n * @example\n * ```tsx\n * import { GridProductCard } from '@customafk/lunas-ui/cards/grid-product-card';\n *\n * <GridProductCard\n *   id=\"prod-1\"\n *   slug=\"awesome-widget\"\n *   name=\"Awesome Widget\"\n *   thumbnail=\"/images/widget.png\"\n *   price={299000}\n * />\n * ```\n */\nexport const GridProductCard: React.FC<Props> = ({ name, thumbnail, price }) => {\n  return (\n    <Card className=\"h-36 w-full flex-row gap-4 p-2 pr-4\">\n      <Image className=\"aspect-square h-full flex-0\" src={thumbnail} />\n      <div className=\"flex flex-1 flex-col gap-y-1\">\n        <p className=\"line-clamp-2 h-10 font-semibold text-sm text-text-positive\">{name}</p>\n        <p className=\"font-bold text-base text-success\">\n          {price.toLocaleString('vi-VN')}\n          <small className=\"ml-0.5\">VND</small>\n        </p>\n        <div className=\"mb-3 flex flex-1 items-end justify-end gap-x-1\">\n          <Button size=\"icon\" variant=\"outline\" color=\"muted\" className=\"size-9\">\n            <HeartIcon />\n          </Button>\n          <Button className=\"max-w-52 max-sm:size-9 sm:flex-1\">\n            <ShoppingCartIcon />\n            <p className=\"sr-only sm:not-sr-only\">Thêm vào giỏ</p>\n          </Button>\n        </div>\n      </div>\n    </Card>\n  );\n};\n"],"mappings":"yOAuCA,MAAa,GAAoC,CAAE,OAAM,YAAW,WAEhE,EAAC,EAAD,CAAM,UAAU,sCAAhB,SAAA,CACE,EAACA,EAAD,CAAO,UAAU,8BAA8B,IAAK,CAAY,CAAA,EAChE,EAAC,MAAD,CAAK,UAAU,+BAAf,SAAA,CACE,EAAC,IAAD,CAAG,UAAU,6DAA8D,SAAA,CAAQ,CAAA,EACnF,EAAC,IAAD,CAAG,UAAU,mCAAb,SAAA,CACG,EAAM,eAAe,OAAO,EAC7B,EAAC,QAAD,CAAO,UAAU,SAAS,SAAA,KAAU,CAAA,CACnC,IACH,EAAC,MAAD,CAAK,UAAU,iDAAf,SAAA,CACE,EAAC,EAAD,CAAQ,KAAK,OAAO,QAAQ,UAAU,MAAM,QAAQ,UAAU,SAC5D,SAAA,EAAC,EAAD,CAAY,CAAA,CACN,CAAA,EACR,EAAC,EAAD,CAAQ,UAAU,mCAAlB,SAAA,CACE,EAAC,EAAD,CAAmB,CAAA,EACnB,EAAC,IAAD,CAAG,UAAU,yBAAyB,SAAA,cAAe,CAAA,CAC/C,CACL,CAAA,CAAA,GACF,CACD,CAAA,CAAA"}

package/dist/cards/product-card.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"product-card.cjs","names":["Card","Image","Button","ShoppingCartIcon","HeartIcon"],"sources":["../../packages/components/cards/product-card.tsx"],"sourcesContent":["import { HeartIcon, ShoppingCartIcon } from 'lucide-react';\n\nimport { Button } from '../ui/button';\nimport { Card } from '../ui/card';\nimport { Image } from '../ui/image';\n\ntype Props = {\n  /** Unique identifier for the product. */\n  id: string;\n  /** URL-friendly slug for the product. */\n  slug: string;\n  /** Display name of the product shown on the card. */\n  name: string;\n  /** URL of the product's thumbnail image. */\n  thumbnail: string;\n  /** Regular price of the product in VND. */\n  price: number;\n  /** Optional sale / discounted price in VND. */\n  salePrice?: number;\n  /** Optional sale discount percentage (0–100). */\n  salePercentage?: number;\n};\n\n/**\n * A vertical product card displaying a thumbnail, name, price, and add-to-cart / favourite actions.\n *\n * @example\n * ```tsx\n * import { ProductCard } from '@customafk/lunas-ui/cards/product-card';\n *\n * <ProductCard\n *   id=\"prod-1\"\n *   slug=\"awesome-widget\"\n *   name=\"Awesome Widget\"\n *   thumbnail=\"/images/widget.png\"\n *   price={299000}\n * />\n * ```\n */\nexport const ProductCard: React.FC<Props> = ({ name, thumbnail, price }) => {\n  return (\n    <Card className=\"size-full gap-y-2 p-2 pb-4\">\n      <Image src={thumbnail} className=\"aspect-square\" />\n      <div className=\"flex flex-col gap-y-1\">\n        <p className=\"line-clamp-2 h-10 text-sm font-semibold\">{name}</p>\n        <p className=\"text-success text-base font-bold\">\n          {price.toLocaleString('vi-VN')}\n          <small className=\"ml-0.5\">VND</small>\n        </p>\n        <div className=\"mt-1 flex gap-x-1\">\n          <Button className=\"flex-1\">\n            <ShoppingCartIcon />\n            Thêm vào giỏ\n          </Button>\n          <Button size=\"icon\" variant=\"outline\" color=\"muted\" className=\"size-9\">\n            <HeartIcon />\n          </Button>\n        </div>\n      </div>\n    </Card>\n  );\n};\n"],"mappings":"6NAuCA,MAAa,GAAgC,CAAE,OAAM,YAAW,YAE5D,EAAA,EAAA,KAAA,CAACA,EAAAA,KAAD,CAAM,UAAU,sCAAhB,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,IAAK,EAAW,UAAU,eAAiB,CAAA,GAClD,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,EACE,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAU,mDAA2C,CAAQ,CAAA,GAChE,EAAA,EAAA,KAAA,CAAC,IAAD,CAAG,UAAU,4CAAb,CACG,EAAM,eAAe,OAAO,GAC7B,EAAA,EAAA,IAAA,CAAC,QAAD,CAAO,UAAU,kBAAS,KAAU,CAAA,CACnC,KACH,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,6BAAf,EACE,EAAA,EAAA,KAAA,CAACC,EAAAA,OAAD,CAAQ,UAAU,kBAAlB,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,iBAAD,CAAmB,CAAA,EAAC,cAEd,KACR,EAAA,EAAA,IAAA,CAACD,EAAAA,OAAD,CAAQ,KAAK,OAAO,QAAQ,UAAU,MAAM,QAAQ,UAAU,mBAC5D,EAAA,EAAA,IAAA,CAACE,EAAAA,UAAD,CAAY,CAAA,CACN,CAAA,CACL,GACF,GACD"}
+{"version":3,"file":"product-card.cjs","names":["Card","Image","Button","ShoppingCartIcon","HeartIcon"],"sources":["../../packages/components/cards/product-card.tsx"],"sourcesContent":["import { HeartIcon, ShoppingCartIcon } from 'lucide-react';\n\nimport { Button } from '../ui/button';\nimport { Card } from '../ui/card';\nimport { Image } from '../ui/image';\n\ntype Props = {\n  /** Unique identifier for the product. */\n  id: string;\n  /** URL-friendly slug for the product. */\n  slug: string;\n  /** Display name of the product shown on the card. */\n  name: string;\n  /** URL of the product's thumbnail image. */\n  thumbnail: string;\n  /** Regular price of the product in VND. */\n  price: number;\n  /** Optional sale / discounted price in VND. */\n  salePrice?: number;\n  /** Optional sale discount percentage (0–100). */\n  salePercentage?: number;\n};\n\n/**\n * A vertical product card displaying a thumbnail, name, price, and add-to-cart / favourite actions.\n *\n * @example\n * ```tsx\n * import { ProductCard } from '@customafk/lunas-ui/cards/product-card';\n *\n * <ProductCard\n *   id=\"prod-1\"\n *   slug=\"awesome-widget\"\n *   name=\"Awesome Widget\"\n *   thumbnail=\"/images/widget.png\"\n *   price={299000}\n * />\n * ```\n */\nexport const ProductCard: React.FC<Props> = ({ name, thumbnail, price }) => {\n  return (\n    <Card className=\"size-full gap-y-2 p-2 pb-4\">\n      <Image src={thumbnail} className=\"aspect-square\" />\n      <div className=\"flex flex-col gap-y-1\">\n        <p className=\"line-clamp-2 h-10 text-sm font-semibold\">{name}</p>\n        <p className=\"text-success text-base font-bold\">\n          {price.toLocaleString('vi-VN')}\n          <small className=\"ml-0.5\">VND</small>\n        </p>\n        <div className=\"mt-1 flex gap-x-1\">\n          <Button className=\"flex-1\">\n            <ShoppingCartIcon />\n            Thêm vào giỏ\n          </Button>\n          <Button size=\"icon\" variant=\"outline\" color=\"muted\" className=\"size-9\">\n            <HeartIcon />\n          </Button>\n        </div>\n      </div>\n    </Card>\n  );\n};\n"],"mappings":"6NAuCA,MAAa,GAAgC,CAAE,OAAM,YAAW,YAE5D,EAAA,EAAA,KAAA,CAACA,EAAAA,KAAD,CAAM,UAAU,6BAAhB,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,IAAK,EAAW,UAAU,eAAiB,CAAA,GAClD,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,wBAAf,SAAA,EACE,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAU,0CAA2C,SAAA,CAAQ,CAAA,GAChE,EAAA,EAAA,KAAA,CAAC,IAAD,CAAG,UAAU,mCAAb,SAAA,CACG,EAAM,eAAe,OAAO,GAC7B,EAAA,EAAA,IAAA,CAAC,QAAD,CAAO,UAAU,SAAS,SAAA,KAAU,CAAA,CACnC,KACH,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,oBAAf,SAAA,EACE,EAAA,EAAA,KAAA,CAACC,EAAAA,OAAD,CAAQ,UAAU,SAAlB,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,iBAAD,CAAmB,CAAA,EAAC,cAEd,CACR,CAAA,GAAA,EAAA,EAAA,IAAA,CAACD,EAAAA,OAAD,CAAQ,KAAK,OAAO,QAAQ,UAAU,MAAM,QAAQ,UAAU,SAC5D,UAAA,EAAA,EAAA,IAAA,CAACE,EAAAA,UAAD,CAAY,CAAA,CACN,CAAA,CACL,GACF,CACD,CAAA,CAAA"}

package/dist/cards/product-card.d.cts

@@ -1,2 +1,2 @@
-import { t as ProductCard } from "../product-card-CvXLXbpV.cjs";
+import { t as ProductCard } from "../product-card-CYNh0CT5.cjs";
 export { ProductCard };

package/dist/cards/product-card.d.mts

@@ -1,2 +1,2 @@
-import { t as ProductCard } from "../product-card-CvXLXbpV.mjs";
+import { t as ProductCard } from "../product-card-CYNh0CT5.mjs";
 export { ProductCard };

package/dist/cards/product-card.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"product-card.mjs","names":["Image"],"sources":["../../packages/components/cards/product-card.tsx"],"sourcesContent":["import { HeartIcon, ShoppingCartIcon } from 'lucide-react';\n\nimport { Button } from '../ui/button';\nimport { Card } from '../ui/card';\nimport { Image } from '../ui/image';\n\ntype Props = {\n  /** Unique identifier for the product. */\n  id: string;\n  /** URL-friendly slug for the product. */\n  slug: string;\n  /** Display name of the product shown on the card. */\n  name: string;\n  /** URL of the product's thumbnail image. */\n  thumbnail: string;\n  /** Regular price of the product in VND. */\n  price: number;\n  /** Optional sale / discounted price in VND. */\n  salePrice?: number;\n  /** Optional sale discount percentage (0–100). */\n  salePercentage?: number;\n};\n\n/**\n * A vertical product card displaying a thumbnail, name, price, and add-to-cart / favourite actions.\n *\n * @example\n * ```tsx\n * import { ProductCard } from '@customafk/lunas-ui/cards/product-card';\n *\n * <ProductCard\n *   id=\"prod-1\"\n *   slug=\"awesome-widget\"\n *   name=\"Awesome Widget\"\n *   thumbnail=\"/images/widget.png\"\n *   price={299000}\n * />\n * ```\n */\nexport const ProductCard: React.FC<Props> = ({ name, thumbnail, price }) => {\n  return (\n    <Card className=\"size-full gap-y-2 p-2 pb-4\">\n      <Image src={thumbnail} className=\"aspect-square\" />\n      <div className=\"flex flex-col gap-y-1\">\n        <p className=\"line-clamp-2 h-10 text-sm font-semibold\">{name}</p>\n        <p className=\"text-success text-base font-bold\">\n          {price.toLocaleString('vi-VN')}\n          <small className=\"ml-0.5\">VND</small>\n        </p>\n        <div className=\"mt-1 flex gap-x-1\">\n          <Button className=\"flex-1\">\n            <ShoppingCartIcon />\n            Thêm vào giỏ\n          </Button>\n          <Button size=\"icon\" variant=\"outline\" color=\"muted\" className=\"size-9\">\n            <HeartIcon />\n          </Button>\n        </div>\n      </div>\n    </Card>\n  );\n};\n"],"mappings":"yOAuCA,MAAa,GAAgC,CAAE,OAAM,YAAW,WAE5D,EAAC,EAAD,CAAM,UAAU,sCAAhB,CACE,EAACA,EAAD,CAAO,IAAK,EAAW,UAAU,eAAiB,CAAA,EAClD,EAAC,MAAD,CAAK,UAAU,iCAAf,CACE,EAAC,IAAD,CAAG,UAAU,mDAA2C,CAAQ,CAAA,EAChE,EAAC,IAAD,CAAG,UAAU,4CAAb,CACG,EAAM,eAAe,OAAO,EAC7B,EAAC,QAAD,CAAO,UAAU,kBAAS,KAAU,CAAA,CACnC,IACH,EAAC,MAAD,CAAK,UAAU,6BAAf,CACE,EAAC,EAAD,CAAQ,UAAU,kBAAlB,CACE,EAAC,EAAD,CAAmB,CAAA,EAAC,cAEd,IACR,EAAC,EAAD,CAAQ,KAAK,OAAO,QAAQ,UAAU,MAAM,QAAQ,UAAU,kBAC5D,EAAC,EAAD,CAAY,CAAA,CACN,CAAA,CACL,GACF,GACD"}
+{"version":3,"file":"product-card.mjs","names":["Image"],"sources":["../../packages/components/cards/product-card.tsx"],"sourcesContent":["import { HeartIcon, ShoppingCartIcon } from 'lucide-react';\n\nimport { Button } from '../ui/button';\nimport { Card } from '../ui/card';\nimport { Image } from '../ui/image';\n\ntype Props = {\n  /** Unique identifier for the product. */\n  id: string;\n  /** URL-friendly slug for the product. */\n  slug: string;\n  /** Display name of the product shown on the card. */\n  name: string;\n  /** URL of the product's thumbnail image. */\n  thumbnail: string;\n  /** Regular price of the product in VND. */\n  price: number;\n  /** Optional sale / discounted price in VND. */\n  salePrice?: number;\n  /** Optional sale discount percentage (0–100). */\n  salePercentage?: number;\n};\n\n/**\n * A vertical product card displaying a thumbnail, name, price, and add-to-cart / favourite actions.\n *\n * @example\n * ```tsx\n * import { ProductCard } from '@customafk/lunas-ui/cards/product-card';\n *\n * <ProductCard\n *   id=\"prod-1\"\n *   slug=\"awesome-widget\"\n *   name=\"Awesome Widget\"\n *   thumbnail=\"/images/widget.png\"\n *   price={299000}\n * />\n * ```\n */\nexport const ProductCard: React.FC<Props> = ({ name, thumbnail, price }) => {\n  return (\n    <Card className=\"size-full gap-y-2 p-2 pb-4\">\n      <Image src={thumbnail} className=\"aspect-square\" />\n      <div className=\"flex flex-col gap-y-1\">\n        <p className=\"line-clamp-2 h-10 text-sm font-semibold\">{name}</p>\n        <p className=\"text-success text-base font-bold\">\n          {price.toLocaleString('vi-VN')}\n          <small className=\"ml-0.5\">VND</small>\n        </p>\n        <div className=\"mt-1 flex gap-x-1\">\n          <Button className=\"flex-1\">\n            <ShoppingCartIcon />\n            Thêm vào giỏ\n          </Button>\n          <Button size=\"icon\" variant=\"outline\" color=\"muted\" className=\"size-9\">\n            <HeartIcon />\n          </Button>\n        </div>\n      </div>\n    </Card>\n  );\n};\n"],"mappings":"yOAuCA,MAAa,GAAgC,CAAE,OAAM,YAAW,WAE5D,EAAC,EAAD,CAAM,UAAU,6BAAhB,SAAA,CACE,EAACA,EAAD,CAAO,IAAK,EAAW,UAAU,eAAiB,CAAA,EAClD,EAAC,MAAD,CAAK,UAAU,wBAAf,SAAA,CACE,EAAC,IAAD,CAAG,UAAU,0CAA2C,SAAA,CAAQ,CAAA,EAChE,EAAC,IAAD,CAAG,UAAU,mCAAb,SAAA,CACG,EAAM,eAAe,OAAO,EAC7B,EAAC,QAAD,CAAO,UAAU,SAAS,SAAA,KAAU,CAAA,CACnC,IACH,EAAC,MAAD,CAAK,UAAU,oBAAf,SAAA,CACE,EAAC,EAAD,CAAQ,UAAU,SAAlB,SAAA,CACE,EAAC,EAAD,CAAmB,CAAA,EAAC,cAEd,CACR,CAAA,EAAA,EAAC,EAAD,CAAQ,KAAK,OAAO,QAAQ,UAAU,MAAM,QAAQ,UAAU,SAC5D,SAAA,EAAC,EAAD,CAAY,CAAA,CACN,CAAA,CACL,GACF,CACD,CAAA,CAAA"}

package/dist/cards/simple-card.d.cts

@@ -1,2 +1,2 @@
-import { t as SimpleCard } from "../simple-card-6P377r4A.cjs";
+import { t as SimpleCard } from "../simple-card-Dhf9UXBg.cjs";
 export { SimpleCard };

package/dist/cards/simple-card.d.mts

@@ -1,2 +1,2 @@
-import { t as SimpleCard } from "../simple-card-6P377r4A.mjs";
+import { t as SimpleCard } from "../simple-card-Dhf9UXBg.mjs";
 export { SimpleCard };

package/dist/{carousel-BniJSLfd.d.mts → carousel-D7VXWJ3S.d.mts}

@@ -1,6 +1,5 @@
-import { t as Button } from "./button-CKRN3ZQT.mjs";
+import { t as Button } from "./button-BnoPktln.mjs";
 import useEmblaCarousel, { UseEmblaCarouselType } from "embla-carousel-react";
-
 //#region packages/components/ui/carousel.d.ts
 type CarouselApi = UseEmblaCarouselType[1];
 type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
@@ -32,39 +31,15 @@ type CarouselProps = {
  * </Carousel>
  * ```
  */
-declare function Carousel({
-  orientation,
-  opts,
-  setApi,
-  plugins,
-  className,
-  children,
-  ...props
-}: React.ComponentProps<'div'> & CarouselProps): import("react").JSX.Element;
+declare function Carousel({ orientation, opts, setApi, plugins, className, children, ...props }: React.ComponentProps<'div'> & CarouselProps): import("react").JSX.Element;
 /** The scrollable track that holds all CarouselItem elements. */
-declare function CarouselContent({
-  className,
-  ...props
-}: React.ComponentProps<'div'>): import("react").JSX.Element;
+declare function CarouselContent({ className, ...props }: React.ComponentProps<'div'>): import("react").JSX.Element;
 /** A single slide within a CarouselContent; occupies the full width (or height for vertical carousels). */
-declare function CarouselItem({
-  className,
-  ...props
-}: React.ComponentProps<'div'>): import("react").JSX.Element;
+declare function CarouselItem({ className, ...props }: React.ComponentProps<'div'>): import("react").JSX.Element;
 /** Circular button positioned to the left (or top for vertical) that scrolls to the previous slide. */
-declare function CarouselPrevious({
-  className,
-  variant,
-  size,
-  ...props
-}: React.ComponentProps<typeof Button>): import("react").JSX.Element;
+declare function CarouselPrevious({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): import("react").JSX.Element;
 /** Circular button positioned to the right (or bottom for vertical) that scrolls to the next slide. */
-declare function CarouselNext({
-  className,
-  variant,
-  size,
-  ...props
-}: React.ComponentProps<typeof Button>): import("react").JSX.Element;
+declare function CarouselNext({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): import("react").JSX.Element;
 //#endregion
 export { CarouselNext as a, CarouselItem as i, CarouselApi as n, CarouselPrevious as o, CarouselContent as r, Carousel as t };
-//# sourceMappingURL=carousel-BniJSLfd.d.mts.map
+//# sourceMappingURL=carousel-D7VXWJ3S.d.mts.map

package/dist/{carousel-D4--8HfP.d.cts → carousel-bBvM31sh.d.cts}

@@ -1,6 +1,5 @@
-import { t as Button } from "./button-CKRN3ZQT.cjs";
+import { t as Button } from "./button-BnoPktln.cjs";
 import useEmblaCarousel, { UseEmblaCarouselType } from "embla-carousel-react";
-
 //#region packages/components/ui/carousel.d.ts
 type CarouselApi = UseEmblaCarouselType[1];
 type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
@@ -32,39 +31,15 @@ type CarouselProps = {
  * </Carousel>
  * ```
  */
-declare function Carousel({
-  orientation,
-  opts,
-  setApi,
-  plugins,
-  className,
-  children,
-  ...props
-}: React.ComponentProps<'div'> & CarouselProps): import("react").JSX.Element;
+declare function Carousel({ orientation, opts, setApi, plugins, className, children, ...props }: React.ComponentProps<'div'> & CarouselProps): import("react").JSX.Element;
 /** The scrollable track that holds all CarouselItem elements. */
-declare function CarouselContent({
-  className,
-  ...props
-}: React.ComponentProps<'div'>): import("react").JSX.Element;
+declare function CarouselContent({ className, ...props }: React.ComponentProps<'div'>): import("react").JSX.Element;
 /** A single slide within a CarouselContent; occupies the full width (or height for vertical carousels). */
-declare function CarouselItem({
-  className,
-  ...props
-}: React.ComponentProps<'div'>): import("react").JSX.Element;
+declare function CarouselItem({ className, ...props }: React.ComponentProps<'div'>): import("react").JSX.Element;
 /** Circular button positioned to the left (or top for vertical) that scrolls to the previous slide. */
-declare function CarouselPrevious({
-  className,
-  variant,
-  size,
-  ...props
-}: React.ComponentProps<typeof Button>): import("react").JSX.Element;
+declare function CarouselPrevious({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): import("react").JSX.Element;
 /** Circular button positioned to the right (or bottom for vertical) that scrolls to the next slide. */
-declare function CarouselNext({
-  className,
-  variant,
-  size,
-  ...props
-}: React.ComponentProps<typeof Button>): import("react").JSX.Element;
+declare function CarouselNext({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): import("react").JSX.Element;
 //#endregion
 export { CarouselNext as a, CarouselItem as i, CarouselApi as n, CarouselPrevious as o, CarouselContent as r, Carousel as t };
-//# sourceMappingURL=carousel-D4--8HfP.d.cts.map
+//# sourceMappingURL=carousel-bBvM31sh.d.cts.map

package/dist/{chart-sYFksFMk.d.cts → chart-D8tNf0_6.d.cts}

@@ -1,5 +1,4 @@
 import { LegendPayload, ResponsiveContainer, Tooltip, TooltipContentProps } from "recharts";
-
 //#region packages/components/ui/chart.d.ts
 declare const THEMES: {
   readonly light: "";
@@ -14,7 +13,7 @@ type ChartConfig = { [k in string]: {
 } | {
   color?: never;
   theme: Record<keyof typeof THEMES, string>;
-}) };
+}); };
 type ChartContextProps = {
   config: ChartConfig;
 };
@@ -23,17 +22,8 @@ type ChartContainerProps = React.ComponentProps<'div'> & {
   config: ChartConfig;
   children: React.ComponentProps<typeof ResponsiveContainer>['children'];
 };
-declare const ChartContainer: ({
-  id,
-  className,
-  children,
-  config,
-  ...props
-}: ChartContainerProps) => import("react").JSX.Element;
-declare const ChartStyle: ({
-  id,
-  config
-}: {
+declare const ChartContainer: ({ id, className, children, config, ...props }: ChartContainerProps) => import("react").JSX.Element;
+declare const ChartStyle: ({ id, config }: {
   id: string;
   config: ChartConfig;
 }) => import("react").JSX.Element | null;
@@ -46,21 +36,7 @@ type ChartTooltipContentProps = React.ComponentProps<'div'> & Partial<Pick<Toolt
   labelKey?: string;
   labelClassName?: string;
 };
-declare const ChartTooltipContent: ({
-  active,
-  payload,
-  className,
-  indicator,
-  hideLabel,
-  hideIndicator,
-  label,
-  labelFormatter,
-  labelClassName,
-  formatter,
-  color,
-  nameKey,
-  labelKey
-}: ChartTooltipContentProps) => import("react").JSX.Element | null;
+declare const ChartTooltipContent: ({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey }: ChartTooltipContentProps) => import("react").JSX.Element | null;
 declare const ChartLegend: import("react").MemoExoticComponent<(outsideProps: import("recharts").LegendProps) => React.ReactPortal | null>;
 type ChartLegendContentProps = React.ComponentProps<'div'> & {
   payload?: readonly LegendPayload[];
@@ -68,13 +44,7 @@ type ChartLegendContentProps = React.ComponentProps<'div'> & {
   hideIcon?: boolean;
   nameKey?: string;
 };
-declare const ChartLegendContent: ({
-  className,
-  hideIcon,
-  payload,
-  verticalAlign,
-  nameKey
-}: ChartLegendContentProps) => import("react").JSX.Element | null;
+declare const ChartLegendContent: ({ className, hideIcon, payload, verticalAlign, nameKey }: ChartLegendContentProps) => import("react").JSX.Element | null;
 //#endregion
 export { ChartLegendContent as a, ChartTooltip as c, useChart as d, ChartLegend as i, ChartTooltipContent as l, ChartContainer as n, ChartLegendContentProps as o, ChartContainerProps as r, ChartStyle as s, ChartConfig as t, ChartTooltipContentProps as u };
-//# sourceMappingURL=chart-sYFksFMk.d.cts.map
+//# sourceMappingURL=chart-D8tNf0_6.d.cts.map

package/dist/{chart-sYFksFMk.d.mts → chart-D8tNf0_6.d.mts}

@@ -1,5 +1,4 @@
 import { LegendPayload, ResponsiveContainer, Tooltip, TooltipContentProps } from "recharts";
-
 //#region packages/components/ui/chart.d.ts
 declare const THEMES: {
   readonly light: "";
@@ -14,7 +13,7 @@ type ChartConfig = { [k in string]: {
 } | {
   color?: never;
   theme: Record<keyof typeof THEMES, string>;
-}) };
+}); };
 type ChartContextProps = {
   config: ChartConfig;
 };
@@ -23,17 +22,8 @@ type ChartContainerProps = React.ComponentProps<'div'> & {
   config: ChartConfig;
   children: React.ComponentProps<typeof ResponsiveContainer>['children'];
 };
-declare const ChartContainer: ({
-  id,
-  className,
-  children,
-  config,
-  ...props
-}: ChartContainerProps) => import("react").JSX.Element;
-declare const ChartStyle: ({
-  id,
-  config
-}: {
+declare const ChartContainer: ({ id, className, children, config, ...props }: ChartContainerProps) => import("react").JSX.Element;
+declare const ChartStyle: ({ id, config }: {
   id: string;
   config: ChartConfig;
 }) => import("react").JSX.Element | null;
@@ -46,21 +36,7 @@ type ChartTooltipContentProps = React.ComponentProps<'div'> & Partial<Pick<Toolt
   labelKey?: string;
   labelClassName?: string;
 };
-declare const ChartTooltipContent: ({
-  active,
-  payload,
-  className,
-  indicator,
-  hideLabel,
-  hideIndicator,
-  label,
-  labelFormatter,
-  labelClassName,
-  formatter,
-  color,
-  nameKey,
-  labelKey
-}: ChartTooltipContentProps) => import("react").JSX.Element | null;
+declare const ChartTooltipContent: ({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey }: ChartTooltipContentProps) => import("react").JSX.Element | null;
 declare const ChartLegend: import("react").MemoExoticComponent<(outsideProps: import("recharts").LegendProps) => React.ReactPortal | null>;
 type ChartLegendContentProps = React.ComponentProps<'div'> & {
   payload?: readonly LegendPayload[];
@@ -68,13 +44,7 @@ type ChartLegendContentProps = React.ComponentProps<'div'> & {
   hideIcon?: boolean;
   nameKey?: string;
 };
-declare const ChartLegendContent: ({
-  className,
-  hideIcon,
-  payload,
-  verticalAlign,
-  nameKey
-}: ChartLegendContentProps) => import("react").JSX.Element | null;
+declare const ChartLegendContent: ({ className, hideIcon, payload, verticalAlign, nameKey }: ChartLegendContentProps) => import("react").JSX.Element | null;
 //#endregion
 export { ChartLegendContent as a, ChartTooltip as c, useChart as d, ChartLegend as i, ChartTooltipContent as l, ChartContainer as n, ChartLegendContentProps as o, ChartContainerProps as r, ChartStyle as s, ChartConfig as t, ChartTooltipContentProps as u };
-//# sourceMappingURL=chart-sYFksFMk.d.mts.map
+//# sourceMappingURL=chart-D8tNf0_6.d.mts.map

package/dist/{checkbox-XfLNnG0S.d.cts → checkbox-Cuc-_UcF.d.cts}

@@ -1,5 +1,4 @@
 import { Checkbox } from "radix-ui";
-
 //#region packages/components/ui/checkbox.d.ts
 /**
  * Accessible checkbox input built on Radix UI's Checkbox primitive with checked, indeterminate, focus, invalid, and read-only states.
@@ -15,10 +14,7 @@ import { Checkbox } from "radix-ui";
  * </div>
  * ```
  */
-declare function Checkbox$1({
-  className,
-  ...props
-}: React.ComponentProps<typeof Checkbox.Root>): import("react").JSX.Element;
+declare function Checkbox$1({ className, ...props }: React.ComponentProps<typeof Checkbox.Root>): import("react").JSX.Element;
 //#endregion
 export { Checkbox$1 as t };
-//# sourceMappingURL=checkbox-XfLNnG0S.d.cts.map
+//# sourceMappingURL=checkbox-Cuc-_UcF.d.cts.map

package/dist/{checkbox-XfLNnG0S.d.mts → checkbox-Cuc-_UcF.d.mts}

@@ -1,5 +1,4 @@
 import { Checkbox } from "radix-ui";
-
 //#region packages/components/ui/checkbox.d.ts
 /**
  * Accessible checkbox input built on Radix UI's Checkbox primitive with checked, indeterminate, focus, invalid, and read-only states.
@@ -15,10 +14,7 @@ import { Checkbox } from "radix-ui";
  * </div>
  * ```
  */
-declare function Checkbox$1({
-  className,
-  ...props
-}: React.ComponentProps<typeof Checkbox.Root>): import("react").JSX.Element;
+declare function Checkbox$1({ className, ...props }: React.ComponentProps<typeof Checkbox.Root>): import("react").JSX.Element;
 //#endregion
 export { Checkbox$1 as t };
-//# sourceMappingURL=checkbox-XfLNnG0S.d.mts.map
+//# sourceMappingURL=checkbox-Cuc-_UcF.d.mts.map

package/dist/{checkbox-field-Csro0Nla.mjs → checkbox-field-BN3Vd9qq.mjs}

@@ -1,2 +1,2 @@
-import{Checkbox as e}from"./ui/checkbox.mjs";import{G as t}from"./tanstack-form-AGwPfwiM.mjs";import{Field as n,FieldContent as r,FieldContentMain as i,FieldDescription as a,FieldGroup as o,FieldLabel as s,FieldNote as c,FieldSeparator as l,FieldTooltip as u}from"./field-V2DoD8qL.mjs";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{useStore as p}from"@tanstack/react-form";const m=({label:m,description:h,options:g,tooltip:_,helperText:v,orientation:y})=>{let b=t(),x=p(b.form.store,({isSubmitting:e})=>e);return f(o,{className:`gap-y-4 px-4`,children:[f(n,{orientation:y,children:[f(r,{children:[f(s,{children:[m,_&&d(u,{tooltip:_})]}),d(a,{children:h}),d(c,{isShow:!!v,children:v})]}),d(i,{children:d(o,{className:`flex flex-col gap-y-2`,children:g.map(t=>f(n,{orientation:`horizontal`,children:[d(e,{id:`${b.name}-${t.value}`,name:b.name,checked:b.state.value?.includes(t.value)??!1,disabled:x,onCheckedChange:e=>{if(e&&b.state.value!==null)b.pushValue(t.value);else if(e&&b.state.value===null)b.setValue([t.value]);else if(!e&&b.state.value!==null){let e=b.state.value.indexOf(t.value);e>-1&&b.removeValue(e)}else b.setValue(null)}}),d(s,{htmlFor:`${b.name}-${t.value}`,className:`text-text-positive`,children:t.label})]},t.value))})})]}),d(l,{})]})};export{m as CheckboxField};
-//# sourceMappingURL=checkbox-field-Csro0Nla.mjs.map
+import{Checkbox as e}from"./ui/checkbox.mjs";import{G as t}from"./tanstack-form-q9hDCc0Y.mjs";import{Field as n,FieldContent as r,FieldContentMain as i,FieldDescription as a,FieldGroup as o,FieldLabel as s,FieldNote as c,FieldSeparator as l,FieldTooltip as u}from"./field-V2DoD8qL.mjs";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{useStore as p}from"@tanstack/react-form";const m=({label:m,description:h,options:g,tooltip:_,helperText:v,orientation:y})=>{let b=t(),x=p(b.form.store,({isSubmitting:e})=>e);return f(o,{className:`gap-y-4 px-4`,children:[f(n,{orientation:y,children:[f(r,{children:[f(s,{children:[m,_&&d(u,{tooltip:_})]}),d(a,{children:h}),d(c,{isShow:!!v,children:v})]}),d(i,{children:d(o,{className:`flex flex-col gap-y-2`,children:g.map(t=>f(n,{orientation:`horizontal`,children:[d(e,{id:`${b.name}-${t.value}`,name:b.name,checked:b.state.value?.includes(t.value)??!1,disabled:x,onCheckedChange:e=>{if(e&&b.state.value!==null)b.pushValue(t.value);else if(e&&b.state.value===null)b.setValue([t.value]);else if(!e&&b.state.value!==null){let e=b.state.value.indexOf(t.value);e>-1&&b.removeValue(e)}else b.setValue(null)}}),d(s,{htmlFor:`${b.name}-${t.value}`,className:`text-text-positive`,children:t.label})]},t.value))})})]}),d(l,{})]})};export{m as CheckboxField};
+//# sourceMappingURL=checkbox-field-BN3Vd9qq.mjs.map

package/dist/{checkbox-field-Csro0Nla.mjs.map → checkbox-field-BN3Vd9qq.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"checkbox-field-Csro0Nla.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/fields/checkbox-field.tsx"],"sourcesContent":["'use client';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { Field, FieldContent, FieldContentMain, FieldDescription, FieldGroup, FieldLabel, FieldNote, FieldSeparator, FieldTooltip } from '../ui/field';\nimport { Checkbox } from '@/components/ui/checkbox';\n\nimport type { CheckboxFieldProps as Props } from '../../types';\n\n/**\n * A TanStack Form-connected checkbox group field that manages an array of selected string values,\n * supporting multi-selection and submission-state disabling.\n *\n * @example\n * import { CheckboxField } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <form.Field name=\"roles\">\n *   {() => (\n *     <CheckboxField\n *       label=\"Roles\"\n *       options={[\n *         { value: 'admin', label: 'Admin' },\n *         { value: 'editor', label: 'Editor' },\n *       ]}\n *       helperText=\"Select one or more roles\"\n *     />\n *   )}\n * </form.Field>\n */\nexport const CheckboxField: React.FC<Props> = ({ label, description, options, tooltip, helperText, orientation }) => {\n  const field = useTanStackFieldContext<string[] | null>();\n  const isSubmitting = useStore(field.form.store, ({ isSubmitting }) => isSubmitting);\n\n  return (\n    <FieldGroup className=\"gap-y-4 px-4\">\n      <Field orientation={orientation}>\n        <FieldContent>\n          <FieldLabel>\n            {label}\n            {tooltip && <FieldTooltip tooltip={tooltip} />}\n          </FieldLabel>\n          <FieldDescription>{description}</FieldDescription>\n          <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n        </FieldContent>\n        <FieldContentMain>\n          <FieldGroup className=\"flex flex-col gap-y-2\">\n            {options.map(option => {\n              return (\n                <Field key={option.value} orientation=\"horizontal\">\n                  <Checkbox\n                    id={`${field.name}-${option.value}`}\n                    name={field.name}\n                    checked={field.state.value?.includes(option.value) ?? false}\n                    disabled={isSubmitting}\n                    onCheckedChange={checked => {\n                      if (checked && field.state.value !== null) {\n                        field.pushValue(option.value);\n                      } else if (checked && field.state.value === null) {\n                        field.setValue([option.value]);\n                      } else if (!checked && field.state.value !== null) {\n                        const index = field.state.value.indexOf(option.value);\n                        if (index > -1) field.removeValue(index);\n                      } else {\n                        field.setValue(null);\n                      }\n                    }}\n                  />\n                  <FieldLabel htmlFor={`${field.name}-${option.value}`} className=\"text-text-positive\">\n                    {option.label}\n                  </FieldLabel>\n                </Field>\n              );\n            })}\n          </FieldGroup>\n        </FieldContentMain>\n      </Field>\n      <FieldSeparator />\n    </FieldGroup>\n  );\n};\n"],"mappings":"gYA8BA,MAAa,GAAkC,CAAE,QAAO,cAAa,UAAS,UAAS,aAAY,iBAAkB,CACnH,IAAM,EAAQ,EAAyC,EACjD,EAAe,EAAS,EAAM,KAAK,OAAQ,CAAE,kBAAmB,CAAY,EAElF,OACE,EAAC,EAAD,CAAY,UAAU,wBAAtB,CACE,EAAC,EAAD,CAAoB,uBAApB,CACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAA,SAAA,CACG,EACA,GAAW,EAAC,EAAD,CAAuB,SAAU,CAAA,CACnC,CAAA,CAAA,EACZ,EAAC,EAAD,CAAA,SAAmB,CAA8B,CAAA,EACjD,EAAC,EAAD,CAAW,OAAQ,CAAC,CAAC,WAAa,CAAsB,CAAA,CAC5C,CAAA,CAAA,EACd,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAY,UAAU,iCACnB,EAAQ,IAAI,GAET,EAAC,EAAD,CAA0B,YAAY,sBAAtC,CACE,EAAC,EAAD,CACE,GAAI,GAAG,EAAM,KAAK,GAAG,EAAO,QAC5B,KAAM,EAAM,KACZ,QAAS,EAAM,MAAM,OAAO,SAAS,EAAO,KAAK,GAAK,GACtD,SAAU,EACV,gBAAiB,GAAW,CAC1B,GAAI,GAAW,EAAM,MAAM,QAAU,KACnC,EAAM,UAAU,EAAO,KAAK,OACvB,GAAI,GAAW,EAAM,MAAM,QAAU,KAC1C,EAAM,SAAS,CAAC,EAAO,KAAK,CAAC,OACxB,GAAI,CAAC,GAAW,EAAM,MAAM,QAAU,KAAM,CACjD,IAAM,EAAQ,EAAM,MAAM,MAAM,QAAQ,EAAO,KAAK,EAChD,EAAQ,IAAI,EAAM,YAAY,CAAK,CACzC,MACE,EAAM,SAAS,IAAI,CAEvB,CACD,CAAA,EACD,EAAC,EAAD,CAAY,QAAS,GAAG,EAAM,KAAK,GAAG,EAAO,QAAS,UAAU,8BAC7D,EAAO,KACE,CAAA,CACP,GAtBK,EAAO,KAsBZ,CAEV,CACS,CAAA,CACI,CAAA,CACb,IACP,EAAC,EAAD,CAAiB,CAAA,CACP,GAEhB"}
+{"version":3,"file":"checkbox-field-BN3Vd9qq.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/fields/checkbox-field.tsx"],"sourcesContent":["'use client';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { Field, FieldContent, FieldContentMain, FieldDescription, FieldGroup, FieldLabel, FieldNote, FieldSeparator, FieldTooltip } from '../ui/field';\nimport { Checkbox } from '@/components/ui/checkbox';\n\nimport type { CheckboxFieldProps as Props } from '../../types';\n\n/**\n * A TanStack Form-connected checkbox group field that manages an array of selected string values,\n * supporting multi-selection and submission-state disabling.\n *\n * @example\n * import { CheckboxField } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <form.Field name=\"roles\">\n *   {() => (\n *     <CheckboxField\n *       label=\"Roles\"\n *       options={[\n *         { value: 'admin', label: 'Admin' },\n *         { value: 'editor', label: 'Editor' },\n *       ]}\n *       helperText=\"Select one or more roles\"\n *     />\n *   )}\n * </form.Field>\n */\nexport const CheckboxField: React.FC<Props> = ({ label, description, options, tooltip, helperText, orientation }) => {\n  const field = useTanStackFieldContext<string[] | null>();\n  const isSubmitting = useStore(field.form.store, ({ isSubmitting }) => isSubmitting);\n\n  return (\n    <FieldGroup className=\"gap-y-4 px-4\">\n      <Field orientation={orientation}>\n        <FieldContent>\n          <FieldLabel>\n            {label}\n            {tooltip && <FieldTooltip tooltip={tooltip} />}\n          </FieldLabel>\n          <FieldDescription>{description}</FieldDescription>\n          <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n        </FieldContent>\n        <FieldContentMain>\n          <FieldGroup className=\"flex flex-col gap-y-2\">\n            {options.map(option => {\n              return (\n                <Field key={option.value} orientation=\"horizontal\">\n                  <Checkbox\n                    id={`${field.name}-${option.value}`}\n                    name={field.name}\n                    checked={field.state.value?.includes(option.value) ?? false}\n                    disabled={isSubmitting}\n                    onCheckedChange={checked => {\n                      if (checked && field.state.value !== null) {\n                        field.pushValue(option.value);\n                      } else if (checked && field.state.value === null) {\n                        field.setValue([option.value]);\n                      } else if (!checked && field.state.value !== null) {\n                        const index = field.state.value.indexOf(option.value);\n                        if (index > -1) field.removeValue(index);\n                      } else {\n                        field.setValue(null);\n                      }\n                    }}\n                  />\n                  <FieldLabel htmlFor={`${field.name}-${option.value}`} className=\"text-text-positive\">\n                    {option.label}\n                  </FieldLabel>\n                </Field>\n              );\n            })}\n          </FieldGroup>\n        </FieldContentMain>\n      </Field>\n      <FieldSeparator />\n    </FieldGroup>\n  );\n};\n"],"mappings":"gYA8BA,MAAa,GAAkC,CAAE,QAAO,cAAa,UAAS,UAAS,aAAY,iBAAkB,CACnH,IAAM,EAAQ,EAAyC,EACjD,EAAe,EAAS,EAAM,KAAK,OAAQ,CAAE,kBAAmB,CAAY,EAElF,OACE,EAAC,EAAD,CAAY,UAAU,eAAtB,SAAA,CACE,EAAC,EAAD,CAAoB,cAApB,SAAA,CACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAA,SAAA,CACG,EACA,GAAW,EAAC,EAAD,CAAuB,SAAU,CAAA,CACnC,CAAA,CAAA,EACZ,EAAC,EAAD,CAAA,SAAmB,CAA8B,CAAA,EACjD,EAAC,EAAD,CAAW,OAAQ,CAAC,CAAC,EAAa,SAAA,CAAsB,CAAA,CAC5C,CAAA,CAAA,EACd,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAY,UAAU,wBACnB,SAAA,EAAQ,IAAI,GAET,EAAC,EAAD,CAA0B,YAAY,aAAtC,SAAA,CACE,EAAC,EAAD,CACE,GAAI,GAAG,EAAM,KAAK,GAAG,EAAO,QAC5B,KAAM,EAAM,KACZ,QAAS,EAAM,MAAM,OAAO,SAAS,EAAO,KAAK,GAAK,GACtD,SAAU,EACV,gBAAiB,GAAW,CAC1B,GAAI,GAAW,EAAM,MAAM,QAAU,KACnC,EAAM,UAAU,EAAO,KAAK,OACvB,GAAI,GAAW,EAAM,MAAM,QAAU,KAC1C,EAAM,SAAS,CAAC,EAAO,KAAK,CAAC,OACxB,GAAI,CAAC,GAAW,EAAM,MAAM,QAAU,KAAM,CACjD,IAAM,EAAQ,EAAM,MAAM,MAAM,QAAQ,EAAO,KAAK,EAChD,EAAQ,IAAI,EAAM,YAAY,CAAK,CACzC,MACE,EAAM,SAAS,IAAI,CAEvB,CACD,CAAA,EACD,EAAC,EAAD,CAAY,QAAS,GAAG,EAAM,KAAK,GAAG,EAAO,QAAS,UAAU,qBAC7D,SAAA,EAAO,KACE,CAAA,CACP,CAtBK,EAAA,EAAO,KAsBZ,CAEV,CACS,CAAA,CACI,CAAA,CACb,CACP,CAAA,EAAA,EAAC,EAAD,CAAiB,CAAA,CACP,GAEhB"}

package/dist/{checkbox-field-Ck_VADFe.cjs → checkbox-field-DBUjQC_4.cjs}

@@ -1,2 +1,2 @@
-const e=require("./ui/checkbox.cjs"),t=require("./tanstack-form-Bae0TOEr.cjs"),n=require("./field-BSLi-P0Q.cjs");let r=require("react/jsx-runtime"),i=require("@tanstack/react-form");const a=({label:a,description:o,options:s,tooltip:c,helperText:l,orientation:u})=>{let d=t.G(),f=(0,i.useStore)(d.form.store,({isSubmitting:e})=>e);return(0,r.jsxs)(n.FieldGroup,{className:`gap-y-4 px-4`,children:[(0,r.jsxs)(n.Field,{orientation:u,children:[(0,r.jsxs)(n.FieldContent,{children:[(0,r.jsxs)(n.FieldLabel,{children:[a,c&&(0,r.jsx)(n.FieldTooltip,{tooltip:c})]}),(0,r.jsx)(n.FieldDescription,{children:o}),(0,r.jsx)(n.FieldNote,{isShow:!!l,children:l})]}),(0,r.jsx)(n.FieldContentMain,{children:(0,r.jsx)(n.FieldGroup,{className:`flex flex-col gap-y-2`,children:s.map(t=>(0,r.jsxs)(n.Field,{orientation:`horizontal`,children:[(0,r.jsx)(e.Checkbox,{id:`${d.name}-${t.value}`,name:d.name,checked:d.state.value?.includes(t.value)??!1,disabled:f,onCheckedChange:e=>{if(e&&d.state.value!==null)d.pushValue(t.value);else if(e&&d.state.value===null)d.setValue([t.value]);else if(!e&&d.state.value!==null){let e=d.state.value.indexOf(t.value);e>-1&&d.removeValue(e)}else d.setValue(null)}}),(0,r.jsx)(n.FieldLabel,{htmlFor:`${d.name}-${t.value}`,className:`text-text-positive`,children:t.label})]},t.value))})})]}),(0,r.jsx)(n.FieldSeparator,{})]})};exports.CheckboxField=a;
-//# sourceMappingURL=checkbox-field-Ck_VADFe.cjs.map
+const e=require("./ui/checkbox.cjs"),t=require("./tanstack-form-BxqS40rB.cjs"),n=require("./field-BSLi-P0Q.cjs");let r=require("react/jsx-runtime"),i=require("@tanstack/react-form");const a=({label:a,description:o,options:s,tooltip:c,helperText:l,orientation:u})=>{let d=t.G(),f=(0,i.useStore)(d.form.store,({isSubmitting:e})=>e);return(0,r.jsxs)(n.FieldGroup,{className:`gap-y-4 px-4`,children:[(0,r.jsxs)(n.Field,{orientation:u,children:[(0,r.jsxs)(n.FieldContent,{children:[(0,r.jsxs)(n.FieldLabel,{children:[a,c&&(0,r.jsx)(n.FieldTooltip,{tooltip:c})]}),(0,r.jsx)(n.FieldDescription,{children:o}),(0,r.jsx)(n.FieldNote,{isShow:!!l,children:l})]}),(0,r.jsx)(n.FieldContentMain,{children:(0,r.jsx)(n.FieldGroup,{className:`flex flex-col gap-y-2`,children:s.map(t=>(0,r.jsxs)(n.Field,{orientation:`horizontal`,children:[(0,r.jsx)(e.Checkbox,{id:`${d.name}-${t.value}`,name:d.name,checked:d.state.value?.includes(t.value)??!1,disabled:f,onCheckedChange:e=>{if(e&&d.state.value!==null)d.pushValue(t.value);else if(e&&d.state.value===null)d.setValue([t.value]);else if(!e&&d.state.value!==null){let e=d.state.value.indexOf(t.value);e>-1&&d.removeValue(e)}else d.setValue(null)}}),(0,r.jsx)(n.FieldLabel,{htmlFor:`${d.name}-${t.value}`,className:`text-text-positive`,children:t.label})]},t.value))})})]}),(0,r.jsx)(n.FieldSeparator,{})]})};exports.CheckboxField=a;
+//# sourceMappingURL=checkbox-field-DBUjQC_4.cjs.map

package/dist/{checkbox-field-Ck_VADFe.cjs.map → checkbox-field-DBUjQC_4.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"checkbox-field-Ck_VADFe.cjs","names":["useTanStackFieldContext","FieldGroup","Field","FieldContent","FieldLabel","FieldTooltip","FieldDescription","FieldNote","FieldContentMain","Checkbox","FieldSeparator"],"sources":["../packages/components/features/tanstack-form/components/fields/checkbox-field.tsx"],"sourcesContent":["'use client';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { Field, FieldContent, FieldContentMain, FieldDescription, FieldGroup, FieldLabel, FieldNote, FieldSeparator, FieldTooltip } from '../ui/field';\nimport { Checkbox } from '@/components/ui/checkbox';\n\nimport type { CheckboxFieldProps as Props } from '../../types';\n\n/**\n * A TanStack Form-connected checkbox group field that manages an array of selected string values,\n * supporting multi-selection and submission-state disabling.\n *\n * @example\n * import { CheckboxField } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <form.Field name=\"roles\">\n *   {() => (\n *     <CheckboxField\n *       label=\"Roles\"\n *       options={[\n *         { value: 'admin', label: 'Admin' },\n *         { value: 'editor', label: 'Editor' },\n *       ]}\n *       helperText=\"Select one or more roles\"\n *     />\n *   )}\n * </form.Field>\n */\nexport const CheckboxField: React.FC<Props> = ({ label, description, options, tooltip, helperText, orientation }) => {\n  const field = useTanStackFieldContext<string[] | null>();\n  const isSubmitting = useStore(field.form.store, ({ isSubmitting }) => isSubmitting);\n\n  return (\n    <FieldGroup className=\"gap-y-4 px-4\">\n      <Field orientation={orientation}>\n        <FieldContent>\n          <FieldLabel>\n            {label}\n            {tooltip && <FieldTooltip tooltip={tooltip} />}\n          </FieldLabel>\n          <FieldDescription>{description}</FieldDescription>\n          <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n        </FieldContent>\n        <FieldContentMain>\n          <FieldGroup className=\"flex flex-col gap-y-2\">\n            {options.map(option => {\n              return (\n                <Field key={option.value} orientation=\"horizontal\">\n                  <Checkbox\n                    id={`${field.name}-${option.value}`}\n                    name={field.name}\n                    checked={field.state.value?.includes(option.value) ?? false}\n                    disabled={isSubmitting}\n                    onCheckedChange={checked => {\n                      if (checked && field.state.value !== null) {\n                        field.pushValue(option.value);\n                      } else if (checked && field.state.value === null) {\n                        field.setValue([option.value]);\n                      } else if (!checked && field.state.value !== null) {\n                        const index = field.state.value.indexOf(option.value);\n                        if (index > -1) field.removeValue(index);\n                      } else {\n                        field.setValue(null);\n                      }\n                    }}\n                  />\n                  <FieldLabel htmlFor={`${field.name}-${option.value}`} className=\"text-text-positive\">\n                    {option.label}\n                  </FieldLabel>\n                </Field>\n              );\n            })}\n          </FieldGroup>\n        </FieldContentMain>\n      </Field>\n      <FieldSeparator />\n    </FieldGroup>\n  );\n};\n"],"mappings":"sLA8BA,MAAa,GAAkC,CAAE,QAAO,cAAa,UAAS,UAAS,aAAY,iBAAkB,CACnH,IAAM,EAAQA,EAAAA,EAAyC,EACjD,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAM,KAAK,OAAQ,CAAE,kBAAmB,CAAY,EAElF,OACE,EAAA,EAAA,KAAA,CAACC,EAAAA,WAAD,CAAY,UAAU,wBAAtB,EACE,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAoB,uBAApB,EACE,EAAA,EAAA,KAAA,CAACC,EAAAA,aAAD,CAAA,SAAA,EACE,EAAA,EAAA,KAAA,CAACC,EAAAA,WAAD,CAAA,SAAA,CACG,EACA,IAAW,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAuB,SAAU,CAAA,CACnC,CAAA,CAAA,GACZ,EAAA,EAAA,IAAA,CAACC,EAAAA,iBAAD,CAAA,SAAmB,CAA8B,CAAA,GACjD,EAAA,EAAA,IAAA,CAACC,EAAAA,UAAD,CAAW,OAAQ,CAAC,CAAC,WAAa,CAAsB,CAAA,CAC5C,CAAA,CAAA,GACd,EAAA,EAAA,IAAA,CAACC,EAAAA,iBAAD,CAAA,UACE,EAAA,EAAA,IAAA,CAACP,EAAAA,WAAD,CAAY,UAAU,iCACnB,EAAQ,IAAI,IAET,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAA0B,YAAY,sBAAtC,EACE,EAAA,EAAA,IAAA,CAACO,EAAAA,SAAD,CACE,GAAI,GAAG,EAAM,KAAK,GAAG,EAAO,QAC5B,KAAM,EAAM,KACZ,QAAS,EAAM,MAAM,OAAO,SAAS,EAAO,KAAK,GAAK,GACtD,SAAU,EACV,gBAAiB,GAAW,CAC1B,GAAI,GAAW,EAAM,MAAM,QAAU,KACnC,EAAM,UAAU,EAAO,KAAK,OACvB,GAAI,GAAW,EAAM,MAAM,QAAU,KAC1C,EAAM,SAAS,CAAC,EAAO,KAAK,CAAC,OACxB,GAAI,CAAC,GAAW,EAAM,MAAM,QAAU,KAAM,CACjD,IAAM,EAAQ,EAAM,MAAM,MAAM,QAAQ,EAAO,KAAK,EAChD,EAAQ,IAAI,EAAM,YAAY,CAAK,CACzC,MACE,EAAM,SAAS,IAAI,CAEvB,CACD,CAAA,GACD,EAAA,EAAA,IAAA,CAACL,EAAAA,WAAD,CAAY,QAAS,GAAG,EAAM,KAAK,GAAG,EAAO,QAAS,UAAU,8BAC7D,EAAO,KACE,CAAA,CACP,GAtBK,EAAO,KAsBZ,CAEV,CACS,CAAA,CACI,CAAA,CACb,KACP,EAAA,EAAA,IAAA,CAACM,EAAAA,eAAD,CAAiB,CAAA,CACP,GAEhB"}
+{"version":3,"file":"checkbox-field-DBUjQC_4.cjs","names":["useTanStackFieldContext","FieldGroup","Field","FieldContent","FieldLabel","FieldTooltip","FieldDescription","FieldNote","FieldContentMain","Checkbox","FieldSeparator"],"sources":["../packages/components/features/tanstack-form/components/fields/checkbox-field.tsx"],"sourcesContent":["'use client';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { Field, FieldContent, FieldContentMain, FieldDescription, FieldGroup, FieldLabel, FieldNote, FieldSeparator, FieldTooltip } from '../ui/field';\nimport { Checkbox } from '@/components/ui/checkbox';\n\nimport type { CheckboxFieldProps as Props } from '../../types';\n\n/**\n * A TanStack Form-connected checkbox group field that manages an array of selected string values,\n * supporting multi-selection and submission-state disabling.\n *\n * @example\n * import { CheckboxField } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <form.Field name=\"roles\">\n *   {() => (\n *     <CheckboxField\n *       label=\"Roles\"\n *       options={[\n *         { value: 'admin', label: 'Admin' },\n *         { value: 'editor', label: 'Editor' },\n *       ]}\n *       helperText=\"Select one or more roles\"\n *     />\n *   )}\n * </form.Field>\n */\nexport const CheckboxField: React.FC<Props> = ({ label, description, options, tooltip, helperText, orientation }) => {\n  const field = useTanStackFieldContext<string[] | null>();\n  const isSubmitting = useStore(field.form.store, ({ isSubmitting }) => isSubmitting);\n\n  return (\n    <FieldGroup className=\"gap-y-4 px-4\">\n      <Field orientation={orientation}>\n        <FieldContent>\n          <FieldLabel>\n            {label}\n            {tooltip && <FieldTooltip tooltip={tooltip} />}\n          </FieldLabel>\n          <FieldDescription>{description}</FieldDescription>\n          <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n        </FieldContent>\n        <FieldContentMain>\n          <FieldGroup className=\"flex flex-col gap-y-2\">\n            {options.map(option => {\n              return (\n                <Field key={option.value} orientation=\"horizontal\">\n                  <Checkbox\n                    id={`${field.name}-${option.value}`}\n                    name={field.name}\n                    checked={field.state.value?.includes(option.value) ?? false}\n                    disabled={isSubmitting}\n                    onCheckedChange={checked => {\n                      if (checked && field.state.value !== null) {\n                        field.pushValue(option.value);\n                      } else if (checked && field.state.value === null) {\n                        field.setValue([option.value]);\n                      } else if (!checked && field.state.value !== null) {\n                        const index = field.state.value.indexOf(option.value);\n                        if (index > -1) field.removeValue(index);\n                      } else {\n                        field.setValue(null);\n                      }\n                    }}\n                  />\n                  <FieldLabel htmlFor={`${field.name}-${option.value}`} className=\"text-text-positive\">\n                    {option.label}\n                  </FieldLabel>\n                </Field>\n              );\n            })}\n          </FieldGroup>\n        </FieldContentMain>\n      </Field>\n      <FieldSeparator />\n    </FieldGroup>\n  );\n};\n"],"mappings":"sLA8BA,MAAa,GAAkC,CAAE,QAAO,cAAa,UAAS,UAAS,aAAY,iBAAkB,CACnH,IAAM,EAAQA,EAAAA,EAAyC,EACjD,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAM,KAAK,OAAQ,CAAE,kBAAmB,CAAY,EAElF,OACE,EAAA,EAAA,KAAA,CAACC,EAAAA,WAAD,CAAY,UAAU,eAAtB,SAAA,EACE,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAoB,cAApB,SAAA,EACE,EAAA,EAAA,KAAA,CAACC,EAAAA,aAAD,CAAA,SAAA,EACE,EAAA,EAAA,KAAA,CAACC,EAAAA,WAAD,CAAA,SAAA,CACG,EACA,IAAW,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAuB,SAAU,CAAA,CACnC,CAAA,CAAA,GACZ,EAAA,EAAA,IAAA,CAACC,EAAAA,iBAAD,CAAA,SAAmB,CAA8B,CAAA,GACjD,EAAA,EAAA,IAAA,CAACC,EAAAA,UAAD,CAAW,OAAQ,CAAC,CAAC,EAAa,SAAA,CAAsB,CAAA,CAC5C,CAAA,CAAA,GACd,EAAA,EAAA,IAAA,CAACC,EAAAA,iBAAD,CAAA,UACE,EAAA,EAAA,IAAA,CAACP,EAAAA,WAAD,CAAY,UAAU,wBACnB,SAAA,EAAQ,IAAI,IAET,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAA0B,YAAY,aAAtC,SAAA,EACE,EAAA,EAAA,IAAA,CAACO,EAAAA,SAAD,CACE,GAAI,GAAG,EAAM,KAAK,GAAG,EAAO,QAC5B,KAAM,EAAM,KACZ,QAAS,EAAM,MAAM,OAAO,SAAS,EAAO,KAAK,GAAK,GACtD,SAAU,EACV,gBAAiB,GAAW,CAC1B,GAAI,GAAW,EAAM,MAAM,QAAU,KACnC,EAAM,UAAU,EAAO,KAAK,OACvB,GAAI,GAAW,EAAM,MAAM,QAAU,KAC1C,EAAM,SAAS,CAAC,EAAO,KAAK,CAAC,OACxB,GAAI,CAAC,GAAW,EAAM,MAAM,QAAU,KAAM,CACjD,IAAM,EAAQ,EAAM,MAAM,MAAM,QAAQ,EAAO,KAAK,EAChD,EAAQ,IAAI,EAAM,YAAY,CAAK,CACzC,MACE,EAAM,SAAS,IAAI,CAEvB,CACD,CAAA,GACD,EAAA,EAAA,IAAA,CAACL,EAAAA,WAAD,CAAY,QAAS,GAAG,EAAM,KAAK,GAAG,EAAO,QAAS,UAAU,qBAC7D,SAAA,EAAO,KACE,CAAA,CACP,CAtBK,EAAA,EAAO,KAsBZ,CAEV,CACS,CAAA,CACI,CAAA,CACb,CACP,CAAA,GAAA,EAAA,EAAA,IAAA,CAACM,EAAAA,eAAD,CAAiB,CAAA,CACP,GAEhB"}

package/dist/close-BYHgEZvZ.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"close-BYHgEZvZ.cjs","names":["XIcon"],"sources":["../packages/components/ui/buttons/close.tsx"],"sourcesContent":["import { XIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nexport const CloseButton: React.FC<React.ComponentProps<'button'>> = ({ className, ...props }) => {\n  return (\n    <button\n      className={cn(\n        'flex cursor-pointer items-center justify-center rounded-[100px] p-2 text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive active:bg-muted-weak active:text-text-positive-strong disabled:pointer-events-none disabled:opacity-60',\n        className\n      )}\n      {...props}\n    >\n      <XIcon size={24} />\n    </button>\n  );\n};\n"],"mappings":"yGAIA,MAAa,GAAyD,CAAE,YAAW,GAAG,MAElF,EAAA,EAAA,IAAA,CAAC,SAAD,CACE,WAAA,EAAA,EAAA,GAAA,CACE,qQACA,CACF,EACA,GAAI,YAEJ,EAAA,EAAA,IAAA,CAACA,EAAAA,MAAD,CAAO,KAAM,EAAK,CAAA,CACZ,CAAA"}
+{"version":3,"file":"close-BYHgEZvZ.cjs","names":["XIcon"],"sources":["../packages/components/ui/buttons/close.tsx"],"sourcesContent":["import { XIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nexport const CloseButton: React.FC<React.ComponentProps<'button'>> = ({ className, ...props }) => {\n  return (\n    <button\n      className={cn(\n        'flex cursor-pointer items-center justify-center rounded-[100px] p-2 text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive active:bg-muted-weak active:text-text-positive-strong disabled:pointer-events-none disabled:opacity-60',\n        className\n      )}\n      {...props}\n    >\n      <XIcon size={24} />\n    </button>\n  );\n};\n"],"mappings":"yGAIA,MAAa,GAAyD,CAAE,YAAW,GAAG,MAElF,EAAA,EAAA,IAAA,CAAC,SAAD,CACE,WAAA,EAAA,EAAA,GAAA,CACE,qQACA,CACF,EACA,GAAI,EAEJ,UAAA,EAAA,EAAA,IAAA,CAACA,EAAAA,MAAD,CAAO,KAAM,EAAK,CAAA,CACZ,CAAA"}

package/dist/close-DYJZ8fkh.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"close-DYJZ8fkh.mjs","names":[],"sources":["../packages/components/ui/buttons/close.tsx"],"sourcesContent":["import { XIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nexport const CloseButton: React.FC<React.ComponentProps<'button'>> = ({ className, ...props }) => {\n  return (\n    <button\n      className={cn(\n        'flex cursor-pointer items-center justify-center rounded-[100px] p-2 text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive active:bg-muted-weak active:text-text-positive-strong disabled:pointer-events-none disabled:opacity-60',\n        className\n      )}\n      {...props}\n    >\n      <XIcon size={24} />\n    </button>\n  );\n};\n"],"mappings":"iIAIA,MAAa,GAAyD,CAAE,YAAW,GAAG,KAElF,EAAC,SAAD,CACE,UAAW,EACT,qQACA,CACF,EACA,GAAI,WAEJ,EAAC,EAAD,CAAO,KAAM,EAAK,CAAA,CACZ,CAAA"}
+{"version":3,"file":"close-DYJZ8fkh.mjs","names":[],"sources":["../packages/components/ui/buttons/close.tsx"],"sourcesContent":["import { XIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nexport const CloseButton: React.FC<React.ComponentProps<'button'>> = ({ className, ...props }) => {\n  return (\n    <button\n      className={cn(\n        'flex cursor-pointer items-center justify-center rounded-[100px] p-2 text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive active:bg-muted-weak active:text-text-positive-strong disabled:pointer-events-none disabled:opacity-60',\n        className\n      )}\n      {...props}\n    >\n      <XIcon size={24} />\n    </button>\n  );\n};\n"],"mappings":"iIAIA,MAAa,GAAyD,CAAE,YAAW,GAAG,KAElF,EAAC,SAAD,CACE,UAAW,EACT,qQACA,CACF,EACA,GAAI,EAEJ,SAAA,EAAC,EAAD,CAAO,KAAM,EAAK,CAAA,CACZ,CAAA"}

package/dist/cms-layout-Cr0FjyGt.cjs

@@ -0,0 +1,2 @@
+const e=require("./dist-DzA--RwW.cjs"),t=require("./ui/button.cjs");require("./ui/skeleton.cjs");const n=require("./ui/tooltip.cjs"),r=require("./ui/avatar.cjs"),i=require("./features/logo/index.cjs"),a=require("./ui/dropdown-menu.cjs"),o=require("./ui/input.cjs"),s=require("./ui/separator.cjs"),c=require("./ui/sheet.cjs");let l=require("lucide-react"),u=require("react"),d=require("@customafk/react-toolkit/utils"),f=require("class-variance-authority"),p=require("react/jsx-runtime"),m=require("@customafk/react-toolkit/color-hash"),h=require("@customafk/react-toolkit/hooks/useMobile");const g=(0,u.createContext)(null);function _(){let e=(0,u.useContext)(g);if(!e)throw Error(`useSidebar must be used within a SidebarProvider.`);return e}function v({defaultOpen:e=!0,open:t,onOpenChange:r,className:i,style:a,children:o,...s}){let c=(0,h.useIsMobile)(),[l,f]=(0,u.useState)(!1),[m,_]=(0,u.useState)(e),v=t??m,y=(0,u.useCallback)(e=>{let t=typeof e==`function`?e(v):e;r?r(t):_(t),document.cookie=`sidebar_state=${t}; path=/; max-age=604800`},[r,v]),b=(0,u.useCallback)(()=>c?f(e=>!e):y(e=>!e),[c,y]);(0,u.useEffect)(()=>{let e=e=>{e.key===`b`&&(e.metaKey||e.ctrlKey)&&(e.preventDefault(),b())};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[b]);let x=v?`expanded`:`collapsed`,S=(0,u.useMemo)(()=>({state:x,open:v,setOpen:y,isMobile:c,openMobile:l,setOpenMobile:f,toggleSidebar:b}),[x,v,y,c,l,b]);return(0,p.jsx)(g.Provider,{value:S,children:(0,p.jsx)(n.TooltipProvider,{delayDuration:0,children:(0,p.jsx)(`section`,{"data-slot":`layout-wrapper`,style:{"--sidebar-width":`16rem`,"--sidebar-width-icon":`3rem`,...a},className:(0,d.cn)(`relative group/sidebar-wrapper flex h-dvh bg-sidebar`,i),...s,children:o})})})}const y=(0,u.memo)(({side:e=`left`,variant:n=`sidebar`,collapsible:r=`offcanvas`,className:a,children:o,...s})=>{let{isMobile:f,state:m,openMobile:h,setOpenMobile:g,toggleSidebar:v}=_(),y=(0,u.useCallback)(e=>{v(),e.preventDefault(),e.stopPropagation()},[v]);return r===`none`?(0,p.jsx)(`aside`,{"data-slot":`sidebar`,className:(0,d.cn)(`flex w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground`,a),...s,children:o}):f?(0,p.jsx)(c.Sheet,{open:h,onOpenChange:g,...s,children:(0,p.jsxs)(c.SheetContent,{"data-sidebar":`sidebar`,"data-slot":`sidebar`,"data-mobile":`true`,style:{"--sidebar-width":`18rem`},side:e,className:`w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground sm:max-w-3xs [&>button]:hidden`,children:[(0,p.jsxs)(c.SheetHeader,{className:`sr-only`,children:[(0,p.jsx)(c.SheetTitle,{children:`Sidebar`}),(0,p.jsx)(c.SheetDescription,{children:`Displays the mobile sidebar.`})]}),(0,p.jsxs)(`div`,{className:`flex size-full flex-col`,children:[(0,p.jsxs)(`div`,{className:`flex flex-0 items-center gap-x-2 border-b border-border-weak p-2 pr-4`,children:[(0,p.jsxs)(t.Button,{"data-sidebar":`trigger`,"data-slot":`sidebar-trigger`,variant:`ghost`,color:`muted`,size:`icon`,className:(0,d.cn)(`size-10 rounded-full`,a),onClick:y,children:[(0,p.jsx)(l.MenuIcon,{className:`size-6!`}),(0,p.jsx)(`span`,{className:`sr-only`,children:`Toggle Sidebar`})]}),(0,p.jsx)(i.LunasLogo,{variant:`horizontal`,size:`xs`,className:`ml-2`})]}),(0,p.jsx)(`div`,{className:`flex flex-1 flex-col p-2`,children:o})]})]})}):(0,p.jsxs)(`aside`,{className:`group peer hidden bg-card text-sidebar-foreground md:block`,"data-state":m,"data-collapsible":m===`collapsed`?r:``,"data-variant":n,"data-side":e,"data-slot":`sidebar`,children:[(0,p.jsx)(`div`,{"data-slot":`sidebar-gap`,className:(0,d.cn)(`bg-transparent`,`transition-[width] duration-200 ease-linear`,`h-(--header-height) sm:h-(--header-height)`,`w-(--sidebar-width)`,`group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]`)}),(0,p.jsx)(`div`,{"data-slot":`sidebar-container`,className:(0,d.cn)(`hidden md:flex shadow-nav`,`fixed left-0 inset-y-0 p-2`,`top-(--header-height) z-10`,`w-(--sidebar-width)`,`transition-all duration-200 ease-linear`,`group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]`,a),...s,children:(0,p.jsx)(`div`,{"data-sidebar":`sidebar`,"data-slot":`sidebar-inner`,className:`relative flex size-full flex-col`,children:o})})]})});y.displayName=`CMSLayoutSidebar`;const b=(0,u.memo)(({className:e,children:t,...n})=>(0,p.jsxs)(`main`,{"data-slot":`sidebar-inset`,className:(0,d.cn)(`relative flex w-full flex-1 flex-col`,e),...n,children:[(0,p.jsx)(`div`,{className:`h-(-header-height) sm:h-var(--header-height)`}),(0,p.jsx)(`div`,{className:`relative flex-1 size-full overflow-auto`,children:t})]}));b.displayName=`CMSLayoutMain`;const x=(0,u.memo)(({className:e,...t})=>(0,p.jsx)(o.Input,{"data-slot":`sidebar-input`,"data-sidebar":`input`,className:(0,d.cn)(`h-8 w-full bg-background shadow-none`,e),...t}));x.displayName=`SidebarInput`;const S=(0,u.memo)(({className:e,...t})=>(0,p.jsx)(`div`,{"data-slot":`sidebar-header`,"data-sidebar":`header`,className:(0,d.cn)(`flex flex-col gap-2 p-2`,e),...t}));S.displayName=`SidebarHeader`;const C=(0,u.memo)(({className:e,...t})=>(0,p.jsx)(`div`,{"data-slot":`sidebar-footer`,"data-sidebar":`footer`,className:(0,d.cn)(`flex flex-col gap-2`,e),...t}));C.displayName=`SidebarFooter`;const w=(0,u.memo)(({className:e,...t})=>(0,p.jsx)(s.Separator,{"data-slot":`sidebar-separator`,"data-sidebar":`separator`,className:(0,d.cn)(`mx-2 w-auto bg-sidebar-border`,e),...t}));w.displayName=`SidebarSeparator`;const T=(0,u.memo)(({className:e,...t})=>(0,p.jsx)(`div`,{"data-slot":`sidebar-content`,"data-sidebar":`content`,className:(0,d.cn)(`flex flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden`,e),...t}));T.displayName=`SidebarContent`;const E=(0,u.memo)(({className:e,...t})=>(0,p.jsx)(`div`,{"data-slot":`sidebar-group`,"data-sidebar":`group`,className:(0,d.cn)(`relative flex w-full flex-col`,e),...t}));E.displayName=`SidebarGroup`;const D=(0,u.memo)(({className:t,asChild:n=!1,...r})=>(0,p.jsx)(n?e.t:`div`,{"data-slot":`sidebar-group-label`,"data-sidebar":`group-label`,className:(0,d.cn)(`flex h-8 shrink-0 items-center rounded-md px-2 font-medium text-sidebar-foreground/70 text-xs outline-hidden ring-sidebar-ring transition-[margin,opacity,color] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0`,`group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0`,t),...r}));D.displayName=`SidebarGroupLabel`;const O=(0,u.memo)(({className:e,...t})=>(0,p.jsx)(`div`,{"data-slot":`sidebar-group-content`,"data-sidebar":`group-content`,className:(0,d.cn)(`w-full text-sm`,e),...t}));O.displayName=`SidebarGroupContent`;const k=(0,u.memo)(({className:e,...t})=>(0,p.jsx)(`ul`,{"data-slot":`sidebar-menu`,"data-sidebar":`menu`,className:(0,d.cn)(`flex w-full min-w-0 flex-col gap-1`,e),...t}));k.displayName=`SidebarMenu`;const A=(0,u.memo)(({className:e,...t})=>(0,p.jsx)(`li`,{"data-slot":`sidebar-menu-item`,"data-sidebar":`menu-item`,className:(0,d.cn)(`group/menu-item relative`,e),...t}));A.displayName=`SidebarMenuItem`;const j=(0,f.cva)([`peer/menu-button`,`cursor-pointer`,`flex w-full items-center gap-2`,`overflow-hidden rounded-md p-2 outline-hidden`,`truncate text-left font-normal`,`transition-[color,background-color,width,height,padding]`,`active:bg-sidebar-accent active:text-sidebar-accent-foreground`,`disabled:pointer-events-none disabled:opacity-50`,`group-has-data-[sidebar=menu-action]/menu-item:pr-8`,`aria-disabled:pointer-events-none aria-disabled:opacity-50`,`data-[active=true]:bg-sidebar-primary-muted data-[active=true]:text-sidebar-primary`,`data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground`,`group-data-[collapsible=icon]:size-12! group-data-[collapsible=icon]:p-3! group-data-[collapsible=icon]:gap-3!`,`[&>svg]:size-6 [&>svg]:shrink-0`,`[&>span:last-child]:truncate`],{variants:{variant:{default:`hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground`,outline:`bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]`},size:{default:`h-10 text-sm`,sm:`h-7 text-xs`,lg:`h-12 text-sm group-data-[collapsible=icon]:p-0!`}},defaultVariants:{variant:`default`,size:`default`}}),M=(0,u.memo)(({asChild:t=!1,isActive:r=!1,variant:i=`default`,size:a=`default`,tooltip:o,className:s,...c})=>{let l=t?e.t:`button`,{isMobile:u,state:f}=_(),m=(0,p.jsx)(l,{"data-slot":`sidebar-menu-button`,"data-sidebar":`menu-button`,"data-size":a,"data-active":r,className:(0,d.cn)(j({variant:i,size:a}),s),...c});return o?(typeof o==`string`&&(o={children:o}),(0,p.jsxs)(n.Tooltip,{children:[(0,p.jsx)(n.TooltipTrigger,{asChild:!0,children:m}),(0,p.jsx)(n.TooltipContent,{side:`right`,align:`center`,hidden:f!==`collapsed`||u,...o})]})):m});M.displayName=`SidebarMenuButton`;const N=({i18nText:e,onChangeToEnLocale:n,onChangeToViLocale:o,user:s,onLogout:c,logoutLabel:f=`Log out`,logo:h})=>{let{toggleSidebar:g}=_(),v=(0,u.useCallback)(e=>{e.preventDefault(),e.stopPropagation(),g()},[g]),y=(0,u.useCallback)(e=>{e.preventDefault(),e.stopPropagation(),n?.()},[n]),b=(0,u.useCallback)(e=>{e.preventDefault(),e.stopPropagation(),o?.()},[o]),x=s?m.colorHashLight.hex(s.name):void 0;return(0,p.jsxs)(`header`,{"data-slot":`cms-layout-header`,className:(0,d.cn)(`bg-card`,`h-(--header-height)`,`sm:h-(--header-height) sm:px-4 sm:pr-6`,`absolute inset-x-0 top-0 z-20 gap-2 px-2 pr-4.5`,`flex items-center shadow-nav`,`transition-[height] ease-linear`),children:[(0,p.jsxs)(t.Button,{"data-sidebar":`trigger`,"data-slot":`sidebar-trigger`,variant:`ghost`,color:`muted`,size:`icon`,className:`size-10 rounded-full transition-all hover:text-text-positive`,onClick:v,children:[(0,p.jsx)(l.MenuIcon,{className:`size-6!`}),(0,p.jsx)(`span`,{className:`sr-only`,children:`Toggle Sidebar`})]}),(0,p.jsx)(`div`,{className:`flex flex-1 items-center sm:ml-2.5`,children:h??(0,p.jsx)(i.LunasLogo,{variant:`horizontal`,size:`xs`})}),(0,p.jsxs)(`div`,{className:`flex items-center gap-1`,children:[s&&(0,p.jsxs)(a.DropdownMenu,{children:[(0,p.jsx)(a.DropdownMenuTrigger,{asChild:!0,children:(0,p.jsxs)(t.Button,{variant:`ghost`,color:`muted`,className:`h-9 gap-2.5 rounded-full px-2 transition-all`,children:[(0,p.jsxs)(r.Avatar,{className:`size-7 shrink-0`,children:[(0,p.jsx)(r.AvatarImage,{src:s.avatarUrl,alt:s.name}),(0,p.jsx)(r.AvatarFallback,{style:{backgroundColor:x},children:(0,p.jsx)(l.UserRoundIcon,{size:14,className:`text-white`})})]}),(0,p.jsxs)(`div`,{className:`hidden flex-col items-start sm:flex`,children:[(0,p.jsx)(`span`,{className:`max-w-36 truncate text-xs font-semibold leading-tight text-text-positive`,children:s.name}),s.email&&(0,p.jsx)(`span`,{className:`max-w-36 truncate text-xs leading-tight text-text-positive-weak`,children:s.email})]})]})}),(0,p.jsxs)(a.DropdownMenuContent,{align:`end`,className:`w-60`,children:[(0,p.jsxs)(`div`,{className:`flex flex-col items-center gap-2 px-4 py-4 text-center`,children:[(0,p.jsxs)(r.Avatar,{className:`size-12`,children:[(0,p.jsx)(r.AvatarImage,{src:s.avatarUrl,alt:s.name}),(0,p.jsx)(r.AvatarFallback,{style:{backgroundColor:x},children:(0,p.jsx)(l.UserRoundIcon,{size:22,className:`text-white`})})]}),(0,p.jsxs)(`div`,{className:`flex min-w-0 w-full flex-col items-center gap-0.5`,children:[(0,p.jsx)(`p`,{className:`truncate text-sm font-semibold text-text-positive`,children:s.name}),s.email&&(0,p.jsx)(`p`,{className:`truncate text-xs text-text-positive-weak`,children:s.email}),s.role&&(0,p.jsx)(`span`,{className:`mt-1 w-fit rounded-sm border border-border bg-secondary-muted px-2 py-0.5 text-xs font-medium text-text-positive-weak`,children:s.role})]})]}),c&&(0,p.jsxs)(p.Fragment,{children:[(0,p.jsx)(a.DropdownMenuSeparator,{}),(0,p.jsx)(a.DropdownMenuGroup,{children:(0,p.jsxs)(a.DropdownMenuItem,{className:`text-danger focus:text-danger`,onClick:c,children:[(0,p.jsx)(l.LogOutIcon,{className:`size-4`}),f]})})]})]})]}),s&&(n||o)&&(0,p.jsx)(`div`,{className:`mx-1 h-5 w-px bg-border`}),(n||o)&&(0,p.jsxs)(a.DropdownMenu,{children:[(0,p.jsx)(a.DropdownMenuTrigger,{asChild:!0,children:(0,p.jsxs)(t.Button,{"data-slot":`locale-trigger`,variant:`ghost`,color:`muted`,className:`gap-x-1 rounded-full transition-all hover:text-text-positive`,children:[(0,p.jsx)(l.EarthIcon,{className:`size-6!`}),e]})}),(0,p.jsx)(a.DropdownMenuContent,{align:`end`,children:(0,p.jsxs)(a.DropdownMenuGroup,{children:[(0,p.jsx)(a.DropdownMenuItem,{onClick:y,children:`EN - English`}),(0,p.jsx)(a.DropdownMenuItem,{onClick:b,children:`VI - Vietnamese`})]})})]})]})]})},P=(0,u.memo)(({id:e,label:t,icon:n,activeNavItemId:r,onClick:i,renderAs:a})=>(0,p.jsx)(A,{children:a?(0,p.jsx)(M,{asChild:!0,isActive:e===r,children:a({icon:n,label:t})}):(0,p.jsxs)(M,{isActive:e===r,onClick:i,children:[n,t]})}));P.displayName=`SidebarContentGroupItem`;const F=(0,u.memo)(({id:e,label:t,children:n})=>(0,p.jsxs)(E,{children:[(0,p.jsx)(D,{children:t}),(0,p.jsx)(O,{children:(0,p.jsx)(k,{children:n})})]}));F.displayName=`SidebarContentGroup`;const I=({i18nText:e,activeNavItemId:t,sidebar:n,children:r,onChangeToEnLocale:i,onChangeToViLocale:a,onLogout:o,logoutLabel:s=`Log out`,copyright:c=`Copyright © ${new Date().getFullYear()}, Lunas.`,user:u})=>{let d=n?.groupcontent??[];return(0,p.jsxs)(v,{children:[(0,p.jsx)(N,{i18nText:e,onChangeToEnLocale:i,onChangeToViLocale:a,user:u,onLogout:o,logoutLabel:s}),(0,p.jsxs)(y,{variant:`inset`,collapsible:`icon`,children:[(0,p.jsx)(T,{children:d.map(e=>(0,p.jsx)(F,{id:e.id,label:e.label,children:e.items.map(e=>(0,p.jsx)(P,{id:e.id,activeNavItemId:t,label:e.label,icon:e.icon,renderAs:e.renderAs,onClick:e.onClick},e.id))},e.id))}),(0,p.jsx)(C,{children:(0,p.jsxs)(k,{children:[(0,p.jsx)(A,{children:(0,p.jsxs)(M,{className:`border border-border`,onClick:o,children:[(0,p.jsx)(l.LogOutIcon,{className:`text-text-positive-weak`}),s]})}),(0,p.jsx)(A,{className:`mt-2 border-t border-t-border`,children:(0,p.jsx)(`p`,{className:`pt-2 text-center text-xs text-text-positive-subtle`,children:c})})]})})]}),(0,p.jsx)(b,{children:r})]})};Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return I}});
+//# sourceMappingURL=cms-layout-Cr0FjyGt.cjs.map