@webiny/admin-ui 0.0.0-unstable.e53eceafb5 → 0.0.0-unstable.e6f0dc8ca7

package/Card/components/CardBody.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","cn","cva","useCardProps","cardBodyVariants","variants","padding","none","sm","md","lg","variant","default","accent","defaultVariants","CardBody","bodyPadding","children","createElement","className"],"sources":["CardBody.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"~/utils.js\";\nimport { cva } from \"~/utils.js\";\nimport { useCardProps } from \"./CardPropsProvider.js\";\n\nconst cardBodyVariants = cva(\"flex-1\", {\n    variants: {\n        padding: {\n            none: \"\",\n            sm: \"px-md\",\n            md: \"px-lg\",\n            lg: \"px-xl\"\n        },\n        variant: {\n            default: \"\",\n            accent: \"pt-lg pb-sm\"\n        }\n    },\n    defaultVariants: {\n        padding: \"md\"\n    }\n});\n\nexport const CardBody = () => {\n    const { padding, variant, bodyPadding, children } = useCardProps();\n    return (\n        <div\n            data-card=\"body\"\n            className={cn(\n                cardBodyVariants({\n                    padding: bodyPadding !== false ? padding : \"none\",\n                    variant\n                })\n            )}\n        >\n            {children}\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE;AACX,SAASC,GAAG;AACZ,SAASC,YAAY;AAErB,MAAMC,gBAAgB,GAAGF,GAAG,CAAC,QAAQ,EAAE;EACnCG,QAAQ,EAAE;IACNC,OAAO,EAAE;MACLC,IAAI,EAAE,EAAE;MACRC,EAAE,EAAE,OAAO;MACXC,EAAE,EAAE,OAAO;MACXC,EAAE,EAAE;IACR,CAAC;IACDC,OAAO,EAAE;MACLC,OAAO,EAAE,EAAE;MACXC,MAAM,EAAE;IACZ;EACJ,CAAC;EACDC,eAAe,EAAE;IACbR,OAAO,EAAE;EACb;AACJ,CAAC,CAAC;AAEF,OAAO,MAAMS,QAAQ,GAAGA,CAAA,KAAM;EAC1B,MAAM;IAAET,OAAO;IAAEK,OAAO;IAAEK,WAAW;IAAEC;EAAS,CAAC,GAAGd,YAAY,CAAC,CAAC;EAClE,oBACIH,KAAA,CAAAkB,aAAA;IACI,aAAU,MAAM;IAChBC,SAAS,EAAElB,EAAE,CACTG,gBAAgB,CAAC;MACbE,OAAO,EAAEU,WAAW,KAAK,KAAK,GAAGV,OAAO,GAAG,MAAM;MACjDK;IACJ,CAAC,CACL;EAAE,GAEDM,QACA,CAAC;AAEd,CAAC","ignoreList":[]}

package/Card/components/CardContent.d.ts

@@ -0,0 +1,16 @@
+import * as React from "react";
+import { type VariantProps } from "../../utils.js";
+declare const cardContentVariants: (props?: ({
+    cornerSize?: "md" | "lg" | null | undefined;
+    variant?: "accent" | "default" | null | undefined;
+    elevation?: "none" | "small" | "medium" | "large" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface CardContentProps extends VariantProps<typeof cardContentVariants> {
+    className?: string;
+    children: React.ReactNode;
+}
+declare const CardContent: {
+    ({ children }: CardContentProps): React.JSX.Element;
+    displayName: string;
+};
+export { CardContent };

package/Card/components/CardContent.js

@@ -0,0 +1,49 @@
+import * as React from "react";
+import { cn, cva } from "../../utils.js";
+import { useCardProps } from "./CardPropsProvider.js";
+const cardContentVariants = cva(["border-md border-solid bg-neutral-base text-md text-neutral-strong overflow-hidden"], {
+  variants: {
+    cornerSize: {
+      md: "rounded-lg",
+      lg: "rounded-xl"
+    },
+    variant: {
+      default: "border-transparent",
+      accent: "border-accent-dimmed"
+    },
+    elevation: {
+      none: "",
+      small: "shadow-sm",
+      medium: "shadow-md",
+      large: "shadow-lg"
+    }
+  },
+  defaultVariants: {
+    cornerSize: "lg",
+    variant: "default"
+  }
+});
+const CardContent = ({
+  children
+}) => {
+  const {
+    cornerSize,
+    variant,
+    elevation,
+    className
+  } = useCardProps();
+  return /*#__PURE__*/React.createElement("div", {
+    "data-card": "content",
+    className: cn(cardContentVariants({
+      cornerSize,
+      variant,
+      elevation
+    }), className)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "flex flex-col justify-between w-full max-w-full h-full relative"
+  }, children));
+};
+CardContent.displayName = "CardContent";
+export { CardContent };
+
+//# sourceMappingURL=CardContent.js.map

package/Card/components/CardContent.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","cn","cva","useCardProps","cardContentVariants","variants","cornerSize","md","lg","variant","default","accent","elevation","none","small","medium","large","defaultVariants","CardContent","children","className","createElement","displayName"],"sources":["CardContent.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn, cva, type VariantProps } from \"~/utils.js\";\nimport { useCardProps } from \"~/Card/components/CardPropsProvider.js\";\n\nconst cardContentVariants = cva(\n    [\"border-md border-solid bg-neutral-base text-md text-neutral-strong overflow-hidden\"],\n    {\n        variants: {\n            cornerSize: {\n                md: \"rounded-lg\",\n                lg: \"rounded-xl\"\n            },\n            variant: {\n                default: \"border-transparent\",\n                accent: \"border-accent-dimmed\"\n            },\n            elevation: {\n                none: \"\",\n                small: \"shadow-sm\",\n                medium: \"shadow-md\",\n                large: \"shadow-lg\"\n            }\n        },\n        defaultVariants: {\n            cornerSize: \"lg\",\n            variant: \"default\"\n        }\n    }\n);\n\nexport interface CardContentProps extends VariantProps<typeof cardContentVariants> {\n    className?: string;\n    children: React.ReactNode;\n}\n\nconst CardContent = ({ children }: CardContentProps) => {\n    const { cornerSize, variant, elevation, className } = useCardProps();\n\n    return (\n        <div\n            data-card=\"content\"\n            className={cn(cardContentVariants({ cornerSize, variant, elevation }), className)}\n        >\n            <div className={\"flex flex-col justify-between w-full max-w-full h-full relative\"}>\n                {children}\n            </div>\n        </div>\n    );\n};\n\nCardContent.displayName = \"CardContent\";\n\nexport { CardContent };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE,EAAEC,GAAG;AAChB,SAASC,YAAY;AAErB,MAAMC,mBAAmB,GAAGF,GAAG,CAC3B,CAAC,oFAAoF,CAAC,EACtF;EACIG,QAAQ,EAAE;IACNC,UAAU,EAAE;MACRC,EAAE,EAAE,YAAY;MAChBC,EAAE,EAAE;IACR,CAAC;IACDC,OAAO,EAAE;MACLC,OAAO,EAAE,oBAAoB;MAC7BC,MAAM,EAAE;IACZ,CAAC;IACDC,SAAS,EAAE;MACPC,IAAI,EAAE,EAAE;MACRC,KAAK,EAAE,WAAW;MAClBC,MAAM,EAAE,WAAW;MACnBC,KAAK,EAAE;IACX;EACJ,CAAC;EACDC,eAAe,EAAE;IACbX,UAAU,EAAE,IAAI;IAChBG,OAAO,EAAE;EACb;AACJ,CACJ,CAAC;AAOD,MAAMS,WAAW,GAAGA,CAAC;EAAEC;AAA2B,CAAC,KAAK;EACpD,MAAM;IAAEb,UAAU;IAAEG,OAAO;IAAEG,SAAS;IAAEQ;EAAU,CAAC,GAAGjB,YAAY,CAAC,CAAC;EAEpE,oBACIH,KAAA,CAAAqB,aAAA;IACI,aAAU,SAAS;IACnBD,SAAS,EAAEnB,EAAE,CAACG,mBAAmB,CAAC;MAAEE,UAAU;MAAEG,OAAO;MAAEG;IAAU,CAAC,CAAC,EAAEQ,SAAS;EAAE,gBAElFpB,KAAA,CAAAqB,aAAA;IAAKD,SAAS,EAAE;EAAkE,GAC7ED,QACA,CACJ,CAAC;AAEd,CAAC;AAEDD,WAAW,CAACI,WAAW,GAAG,aAAa;AAEvC,SAASJ,WAAW","ignoreList":[]}

package/Card/components/CardDescription.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+export type CardDescriptionProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const CardDescription: ({ className, ...props }: CardDescriptionProps) => React.JSX.Element;

package/Card/components/CardDescription.js

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { cn } from "../../utils.js";
+export const CardDescription = ({
+  className,
+  ...props
+}) => /*#__PURE__*/React.createElement("div", Object.assign({}, props, {
+  className: cn("text-sm text-neutral-strong text-left", className)
+}));
+
+//# sourceMappingURL=CardDescription.js.map

package/Card/components/CardDescription.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","cn","CardDescription","className","props","createElement","Object","assign"],"sources":["CardDescription.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"~/utils.js\";\n\nexport type CardDescriptionProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const CardDescription = ({ className, ...props }: CardDescriptionProps) => (\n    <div {...props} className={cn(\"text-sm text-neutral-strong text-left\", className)} />\n);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE;AAIX,OAAO,MAAMC,eAAe,GAAGA,CAAC;EAAEC,SAAS;EAAE,GAAGC;AAA4B,CAAC,kBACzEJ,KAAA,CAAAK,aAAA,QAAAC,MAAA,CAAAC,MAAA,KAASH,KAAK;EAAED,SAAS,EAAEF,EAAE,CAAC,uCAAuC,EAAEE,SAAS;AAAE,EAAE,CACvF","ignoreList":[]}

package/Card/components/CardFooter.d.ts

@@ -1,5 +1,2 @@
-import React from "react";
-import type { CardProps } from "..";
-type CardFooterProps = Pick<CardProps, "actions">;
-declare const CardFooter: ({ actions }: CardFooterProps) => React.JSX.Element | null;
-export { CardFooter, type CardFooterProps };
+import * as React from "react";
+export declare const CardFooter: () => React.JSX.Element;

package/Card/components/CardFooter.js

@@ -1,14 +1,53 @@
-import React from "react";
-const CardFooter = ({
-  actions
-}) => {
-  if (!actions) {
-    return null;
+import * as React from "react";
+import { cva } from "../../utils.js";
+import { useCardProps } from "./CardPropsProvider.js";
+const cardFooterVariants = cva("flex justify-between", {
+  variants: {
+    padding: {
+      sm: "p-md",
+      md: "py-md-extra px-lg",
+      lg: "pt-lg pb-xl px-xl"
+    }
+  },
+  defaultVariants: {
+    padding: "md"
+  }
+});
+const emptyCardFooterVariants = cva("", {
+  variants: {
+    padding: {
+      sm: "h-lg",
+      md: "h-lg",
+      lg: "h-xl"
+    }
+  },
+  defaultVariants: {
+    padding: "md"
+  }
+});
+export const CardFooter = () => {
+  const {
+    actionsPosition,
+    actions,
+    info,
+    padding
+  } = useCardProps();
+  if (!actions && !info) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: emptyCardFooterVariants({
+        padding
+      })
+    });
   }
   return /*#__PURE__*/React.createElement("div", {
-    className: "wby-flex wby-justify-end wby-gap-sm"
-  }, actions);
+    className: cardFooterVariants({
+      padding
+    })
+  }, info && /*#__PURE__*/React.createElement("div", {
+    className: "text-sm flex items-center"
+  }, /*#__PURE__*/React.createElement("div", null, info)), actions && actionsPosition !== "header" && /*#__PURE__*/React.createElement("div", {
+    className: "flex gap-x-sm ml-auto"
+  }, actions));
 };
-export { CardFooter };
 
 //# sourceMappingURL=CardFooter.js.map

package/Card/components/CardFooter.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","CardFooter","actions","createElement","className"],"sources":["CardFooter.tsx"],"sourcesContent":["import React from \"react\";\nimport type { CardProps } from \"~/Card\";\n\ntype CardFooterProps = Pick<CardProps, \"actions\">;\n\nconst CardFooter = ({ actions }: CardFooterProps) => {\n    if (!actions) {\n        return null;\n    }\n\n    return <div className={\"wby-flex wby-justify-end wby-gap-sm\"}>{actions}</div>;\n};\n\nexport { CardFooter, type CardFooterProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAKzB,MAAMC,UAAU,GAAGA,CAAC;EAAEC;AAAyB,CAAC,KAAK;EACjD,IAAI,CAACA,OAAO,EAAE;IACV,OAAO,IAAI;EACf;EAEA,oBAAOF,KAAA,CAAAG,aAAA;IAAKC,SAAS,EAAE;EAAsC,GAAEF,OAAa,CAAC;AACjF,CAAC;AAED,SAASD,UAAU","ignoreList":[]}
+{"version":3,"names":["React","cva","useCardProps","cardFooterVariants","variants","padding","sm","md","lg","defaultVariants","emptyCardFooterVariants","CardFooter","actionsPosition","actions","info","createElement","className"],"sources":["CardFooter.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cva } from \"~/utils.js\";\nimport { useCardProps } from \"./CardPropsProvider.js\";\n\nconst cardFooterVariants = cva(\"flex justify-between\", {\n    variants: {\n        padding: {\n            sm: \"p-md\",\n            md: \"py-md-extra px-lg\",\n            lg: \"pt-lg pb-xl px-xl\"\n        }\n    },\n    defaultVariants: {\n        padding: \"md\"\n    }\n});\n\nconst emptyCardFooterVariants = cva(\"\", {\n    variants: {\n        padding: {\n            sm: \"h-lg\",\n            md: \"h-lg\",\n            lg: \"h-xl\"\n        }\n    },\n    defaultVariants: {\n        padding: \"md\"\n    }\n});\n\nexport const CardFooter = () => {\n    const { actionsPosition, actions, info, padding } = useCardProps();\n\n    if (!actions && !info) {\n        return <div className={emptyCardFooterVariants({ padding })} />;\n    }\n\n    return (\n        <div className={cardFooterVariants({ padding })}>\n            {info && (\n                <div className={\"text-sm flex items-center\"}>\n                    <div>{info}</div>\n                </div>\n            )}\n            {actions && actionsPosition !== \"header\" && (\n                <div className={\"flex gap-x-sm ml-auto\"}>{actions}</div>\n            )}\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,GAAG;AACZ,SAASC,YAAY;AAErB,MAAMC,kBAAkB,GAAGF,GAAG,CAAC,sBAAsB,EAAE;EACnDG,QAAQ,EAAE;IACNC,OAAO,EAAE;MACLC,EAAE,EAAE,MAAM;MACVC,EAAE,EAAE,mBAAmB;MACvBC,EAAE,EAAE;IACR;EACJ,CAAC;EACDC,eAAe,EAAE;IACbJ,OAAO,EAAE;EACb;AACJ,CAAC,CAAC;AAEF,MAAMK,uBAAuB,GAAGT,GAAG,CAAC,EAAE,EAAE;EACpCG,QAAQ,EAAE;IACNC,OAAO,EAAE;MACLC,EAAE,EAAE,MAAM;MACVC,EAAE,EAAE,MAAM;MACVC,EAAE,EAAE;IACR;EACJ,CAAC;EACDC,eAAe,EAAE;IACbJ,OAAO,EAAE;EACb;AACJ,CAAC,CAAC;AAEF,OAAO,MAAMM,UAAU,GAAGA,CAAA,KAAM;EAC5B,MAAM;IAAEC,eAAe;IAAEC,OAAO;IAAEC,IAAI;IAAET;EAAQ,CAAC,GAAGH,YAAY,CAAC,CAAC;EAElE,IAAI,CAACW,OAAO,IAAI,CAACC,IAAI,EAAE;IACnB,oBAAOd,KAAA,CAAAe,aAAA;MAAKC,SAAS,EAAEN,uBAAuB,CAAC;QAAEL;MAAQ,CAAC;IAAE,CAAE,CAAC;EACnE;EAEA,oBACIL,KAAA,CAAAe,aAAA;IAAKC,SAAS,EAAEb,kBAAkB,CAAC;MAAEE;IAAQ,CAAC;EAAE,GAC3CS,IAAI,iBACDd,KAAA,CAAAe,aAAA;IAAKC,SAAS,EAAE;EAA4B,gBACxChB,KAAA,CAAAe,aAAA,cAAMD,IAAU,CACf,CACR,EACAD,OAAO,IAAID,eAAe,KAAK,QAAQ,iBACpCZ,KAAA,CAAAe,aAAA;IAAKC,SAAS,EAAE;EAAwB,GAAEH,OAAa,CAE1D,CAAC;AAEd,CAAC","ignoreList":[]}

package/Card/components/CardHeader.d.ts

@@ -1,5 +1,2 @@
-import React from "react";
-import type { CardProps } from "..";
-type CardHeaderProps = Pick<CardProps, "title" | "description" | "options">;
-declare const CardHeader: ({ title, description, options }: CardHeaderProps) => React.JSX.Element | null;
-export { CardHeader, type CardHeaderProps };
+import * as React from "react";
+export declare const CardHeader: () => React.JSX.Element | null;

package/Card/components/CardHeader.js

@@ -1,26 +1,59 @@
-import React from "react";
-import { Heading } from "../../Heading";
-import { Text } from "../../Text";
-const CardHeader = ({
-  title,
-  description,
-  options
-}) => {
-  if (!title && !description && !options) {
+import * as React from "react";
+import { cn, cva } from "../../utils.js";
+import { CardTitle } from "./CardTitle.js";
+import { CardDescription } from "./CardDescription.js";
+import { useCardProps } from "./CardPropsProvider.js";
+const cardHeaderVariants = cva("text-neutral-primary", {
+  variants: {
+    padding: {
+      sm: "pt-sm-extra pl-md pr-sm-plus",
+      md: "pt-md pl-lg pr-md",
+      lg: "pt-lg pl-xl pr-lg"
+    },
+    variant: {
+      default: "",
+      accent: "bg-primary-subtle"
+    }
+  },
+  defaultVariants: {
+    padding: "md",
+    variant: "default"
+  }
+});
+export const CardHeader = () => {
+  const {
+    actionsPosition,
+    actions,
+    title,
+    icon,
+    description,
+    padding,
+    variant,
+    size,
+    className
+  } = useCardProps();
+  const nothingToRender = React.useMemo(() => {
+    return !title && !description && !icon;
+  }, [title, description, icon]);
+  if (nothingToRender) {
     return null;
   }
   return /*#__PURE__*/React.createElement("div", {
-    className: "wby-flex wby-flex-row wby-justify-between"
+    className: cn(cardHeaderVariants({
+      padding,
+      variant
+    }), className)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "flex justify-between"
   }, /*#__PURE__*/React.createElement("div", {
-    className: "wby-flex wby-flex-col wby-gap-y-xs"
-  }, typeof title === "string" ? /*#__PURE__*/React.createElement(Heading, {
-    level: 6,
-    as: "h1"
-  }, title) : title, typeof description === "string" ? /*#__PURE__*/React.createElement(Text, {
-    size: "sm",
-    className: "wby-text-neutral-strong"
-  }, description) : description), /*#__PURE__*/React.createElement("div", null, options));
+    className: "flex flex-col gap-xs mb-sm text-sm text-neutral-strong pb-md"
+  }, /*#__PURE__*/React.createElement(CardTitle, {
+    padding: padding,
+    size: size,
+    variant: variant
+  }, icon, title), description && /*#__PURE__*/React.createElement(CardDescription, null, description)), actions && actionsPosition === "header" && /*#__PURE__*/React.createElement("div", {
+    className: "flex gap-sm"
+  }, actions)));
 };
-export { CardHeader };
 
 //# sourceMappingURL=CardHeader.js.map

package/Card/components/CardHeader.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Heading","Text","CardHeader","title","description","options","createElement","className","level","as","size"],"sources":["CardHeader.tsx"],"sourcesContent":["import React from \"react\";\nimport { Heading } from \"~/Heading\";\nimport { Text } from \"~/Text\";\nimport type { CardProps } from \"~/Card\";\n\ntype CardHeaderProps = Pick<CardProps, \"title\" | \"description\" | \"options\">;\n\nconst CardHeader = ({ title, description, options }: CardHeaderProps) => {\n    if (!title && !description && !options) {\n        return null;\n    }\n\n    return (\n        <div className={\"wby-flex wby-flex-row wby-justify-between\"}>\n            <div className={\"wby-flex wby-flex-col wby-gap-y-xs\"}>\n                {typeof title === \"string\" ? (\n                    <Heading level={6} as={\"h1\"}>\n                        {title}\n                    </Heading>\n                ) : (\n                    title\n                )}\n                {typeof description === \"string\" ? (\n                    <Text size=\"sm\" className={\"wby-text-neutral-strong\"}>\n                        {description}\n                    </Text>\n                ) : (\n                    description\n                )}\n            </div>\n            <div>{options}</div>\n        </div>\n    );\n};\n\nexport { CardHeader, type CardHeaderProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,OAAO;AAChB,SAASC,IAAI;AAKb,MAAMC,UAAU,GAAGA,CAAC;EAAEC,KAAK;EAAEC,WAAW;EAAEC;AAAyB,CAAC,KAAK;EACrE,IAAI,CAACF,KAAK,IAAI,CAACC,WAAW,IAAI,CAACC,OAAO,EAAE;IACpC,OAAO,IAAI;EACf;EAEA,oBACIN,KAAA,CAAAO,aAAA;IAAKC,SAAS,EAAE;EAA4C,gBACxDR,KAAA,CAAAO,aAAA;IAAKC,SAAS,EAAE;EAAqC,GAChD,OAAOJ,KAAK,KAAK,QAAQ,gBACtBJ,KAAA,CAAAO,aAAA,CAACN,OAAO;IAACQ,KAAK,EAAE,CAAE;IAACC,EAAE,EAAE;EAAK,GACvBN,KACI,CAAC,GAEVA,KACH,EACA,OAAOC,WAAW,KAAK,QAAQ,gBAC5BL,KAAA,CAAAO,aAAA,CAACL,IAAI;IAACS,IAAI,EAAC,IAAI;IAACH,SAAS,EAAE;EAA0B,GAChDH,WACC,CAAC,GAEPA,WAEH,CAAC,eACNL,KAAA,CAAAO,aAAA,cAAMD,OAAa,CAClB,CAAC;AAEd,CAAC;AAED,SAASH,UAAU","ignoreList":[]}
+{"version":3,"names":["React","cn","cva","CardTitle","CardDescription","useCardProps","cardHeaderVariants","variants","padding","sm","md","lg","variant","default","accent","defaultVariants","CardHeader","actionsPosition","actions","title","icon","description","size","className","nothingToRender","useMemo","createElement"],"sources":["CardHeader.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn, cva } from \"~/utils.js\";\nimport { CardTitle } from \"./CardTitle.js\";\nimport { CardDescription } from \"./CardDescription.js\";\nimport { useCardProps } from \"./CardPropsProvider.js\";\n\nconst cardHeaderVariants = cva(\"text-neutral-primary\", {\n    variants: {\n        padding: {\n            sm: \"pt-sm-extra pl-md pr-sm-plus\",\n            md: \"pt-md pl-lg pr-md\",\n            lg: \"pt-lg pl-xl pr-lg\"\n        },\n        variant: {\n            default: \"\",\n            accent: \"bg-primary-subtle\"\n        }\n    },\n    defaultVariants: {\n        padding: \"md\",\n        variant: \"default\"\n    }\n});\n\nexport const CardHeader = () => {\n    const {\n        actionsPosition,\n        actions,\n        title,\n        icon,\n        description,\n        padding,\n        variant,\n        size,\n        className\n    } = useCardProps();\n\n    const nothingToRender = React.useMemo(() => {\n        return !title && !description && !icon;\n    }, [title, description, icon]);\n\n    if (nothingToRender) {\n        return null;\n    }\n\n    return (\n        <div className={cn(cardHeaderVariants({ padding, variant }), className)}>\n            <div className={\"flex justify-between\"}>\n                <div className=\"flex flex-col gap-xs mb-sm text-sm text-neutral-strong pb-md\">\n                    <CardTitle padding={padding} size={size} variant={variant}>\n                        {icon}\n                        {title}\n                    </CardTitle>\n                    {description && <CardDescription>{description}</CardDescription>}\n                </div>\n                {actions && actionsPosition === \"header\" && (\n                    <div className={\"flex gap-sm\"}>{actions}</div>\n                )}\n            </div>\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE,EAAEC,GAAG;AAChB,SAASC,SAAS;AAClB,SAASC,eAAe;AACxB,SAASC,YAAY;AAErB,MAAMC,kBAAkB,GAAGJ,GAAG,CAAC,sBAAsB,EAAE;EACnDK,QAAQ,EAAE;IACNC,OAAO,EAAE;MACLC,EAAE,EAAE,8BAA8B;MAClCC,EAAE,EAAE,mBAAmB;MACvBC,EAAE,EAAE;IACR,CAAC;IACDC,OAAO,EAAE;MACLC,OAAO,EAAE,EAAE;MACXC,MAAM,EAAE;IACZ;EACJ,CAAC;EACDC,eAAe,EAAE;IACbP,OAAO,EAAE,IAAI;IACbI,OAAO,EAAE;EACb;AACJ,CAAC,CAAC;AAEF,OAAO,MAAMI,UAAU,GAAGA,CAAA,KAAM;EAC5B,MAAM;IACFC,eAAe;IACfC,OAAO;IACPC,KAAK;IACLC,IAAI;IACJC,WAAW;IACXb,OAAO;IACPI,OAAO;IACPU,IAAI;IACJC;EACJ,CAAC,GAAGlB,YAAY,CAAC,CAAC;EAElB,MAAMmB,eAAe,GAAGxB,KAAK,CAACyB,OAAO,CAAC,MAAM;IACxC,OAAO,CAACN,KAAK,IAAI,CAACE,WAAW,IAAI,CAACD,IAAI;EAC1C,CAAC,EAAE,CAACD,KAAK,EAAEE,WAAW,EAAED,IAAI,CAAC,CAAC;EAE9B,IAAII,eAAe,EAAE;IACjB,OAAO,IAAI;EACf;EAEA,oBACIxB,KAAA,CAAA0B,aAAA;IAAKH,SAAS,EAAEtB,EAAE,CAACK,kBAAkB,CAAC;MAAEE,OAAO;MAAEI;IAAQ,CAAC,CAAC,EAAEW,SAAS;EAAE,gBACpEvB,KAAA,CAAA0B,aAAA;IAAKH,SAAS,EAAE;EAAuB,gBACnCvB,KAAA,CAAA0B,aAAA;IAAKH,SAAS,EAAC;EAA8D,gBACzEvB,KAAA,CAAA0B,aAAA,CAACvB,SAAS;IAACK,OAAO,EAAEA,OAAQ;IAACc,IAAI,EAAEA,IAAK;IAACV,OAAO,EAAEA;EAAQ,GACrDQ,IAAI,EACJD,KACM,CAAC,EACXE,WAAW,iBAAIrB,KAAA,CAAA0B,aAAA,CAACtB,eAAe,QAAEiB,WAA6B,CAC9D,CAAC,EACLH,OAAO,IAAID,eAAe,KAAK,QAAQ,iBACpCjB,KAAA,CAAA0B,aAAA;IAAKH,SAAS,EAAE;EAAc,GAAEL,OAAa,CAEhD,CACJ,CAAC;AAEd,CAAC","ignoreList":[]}

package/Card/components/CardPropsProvider.d.ts

@@ -0,0 +1,6 @@
+import { type CardProps } from "../Card.js";
+declare const CardPropsProvider: import("react").FunctionComponent<{
+    props: CardProps;
+    children: React.ReactNode;
+}>, useCardProps: () => CardProps;
+export { CardPropsProvider, useCardProps };

package/Card/components/CardPropsProvider.js

@@ -0,0 +1,5 @@
+import { createComponentPropsProvider } from "../../utils.js";
+const [CardPropsProvider, useCardProps] = createComponentPropsProvider();
+export { CardPropsProvider, useCardProps };
+
+//# sourceMappingURL=CardPropsProvider.js.map

package/Card/components/CardPropsProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createComponentPropsProvider","CardPropsProvider","useCardProps"],"sources":["CardPropsProvider.ts"],"sourcesContent":["import { createComponentPropsProvider } from \"~/utils.js\";\nimport { type CardProps } from \"../Card.js\";\n\nconst [CardPropsProvider, useCardProps] = createComponentPropsProvider<CardProps>();\n\nexport { CardPropsProvider, useCardProps };\n"],"mappings":"AAAA,SAASA,4BAA4B;AAGrC,MAAM,CAACC,iBAAiB,EAAEC,YAAY,CAAC,GAAGF,4BAA4B,CAAY,CAAC;AAEnF,SAASC,iBAAiB,EAAEC,YAAY","ignoreList":[]}

package/Card/components/CardTitle.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { type VariantProps } from "../../utils.js";
+declare const cardTitleVariants: (props?: ({
+    padding?: "sm" | "md" | "lg" | null | undefined;
+    size?: "sm" | "md" | null | undefined;
+    variant?: "accent" | "default" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type CardTitleProps = React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof cardTitleVariants>;
+export declare const CardTitle: ({ className, padding, size, variant, ...props }: CardTitleProps) => React.JSX.Element;
+export {};

package/Card/components/CardTitle.js

@@ -0,0 +1,38 @@
+import * as React from "react";
+import { cn, cva } from "../../utils.js";
+const cardTitleVariants = cva("flex items-center gap-sm text-neutral-primary font-semibold", {
+  variants: {
+    padding: {
+      sm: "text-h6",
+      md: "text-h5",
+      lg: "text-h5"
+    },
+    size: {
+      sm: "",
+      md: "pt-xs"
+    },
+    variant: {
+      default: "",
+      accent: "bg-primary-subtle text-accent-primary"
+    }
+  },
+  defaultVariants: {
+    padding: "md",
+    size: "md"
+  }
+});
+export const CardTitle = ({
+  className,
+  padding,
+  size,
+  variant,
+  ...props
+}) => /*#__PURE__*/React.createElement("div", Object.assign({}, props, {
+  className: cn(cardTitleVariants({
+    padding,
+    size,
+    variant
+  }), className)
+}));
+
+//# sourceMappingURL=CardTitle.js.map

package/Card/components/CardTitle.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","cn","cva","cardTitleVariants","variants","padding","sm","md","lg","size","variant","default","accent","defaultVariants","CardTitle","className","props","createElement","Object","assign"],"sources":["CardTitle.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn, cva, type VariantProps } from \"~/utils.js\";\n\nconst cardTitleVariants = cva(\"flex items-center gap-sm text-neutral-primary font-semibold\", {\n    variants: {\n        padding: {\n            sm: \"text-h6\",\n            md: \"text-h5\",\n            lg: \"text-h5\"\n        },\n        size: {\n            sm: \"\",\n            md: \"pt-xs\"\n        },\n        variant: {\n            default: \"\",\n            accent: \"bg-primary-subtle text-accent-primary\"\n        }\n    },\n    defaultVariants: {\n        padding: \"md\",\n        size: \"md\"\n    }\n});\n\nexport type CardTitleProps = React.HTMLAttributes<HTMLDivElement> &\n    VariantProps<typeof cardTitleVariants>;\n\nexport const CardTitle = ({ className, padding, size, variant, ...props }: CardTitleProps) => (\n    <div {...props} className={cn(cardTitleVariants({ padding, size, variant }), className)} />\n);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE,EAAEC,GAAG;AAEhB,MAAMC,iBAAiB,GAAGD,GAAG,CAAC,6DAA6D,EAAE;EACzFE,QAAQ,EAAE;IACNC,OAAO,EAAE;MACLC,EAAE,EAAE,SAAS;MACbC,EAAE,EAAE,SAAS;MACbC,EAAE,EAAE;IACR,CAAC;IACDC,IAAI,EAAE;MACFH,EAAE,EAAE,EAAE;MACNC,EAAE,EAAE;IACR,CAAC;IACDG,OAAO,EAAE;MACLC,OAAO,EAAE,EAAE;MACXC,MAAM,EAAE;IACZ;EACJ,CAAC;EACDC,eAAe,EAAE;IACbR,OAAO,EAAE,IAAI;IACbI,IAAI,EAAE;EACV;AACJ,CAAC,CAAC;AAKF,OAAO,MAAMK,SAAS,GAAGA,CAAC;EAAEC,SAAS;EAAEV,OAAO;EAAEI,IAAI;EAAEC,OAAO;EAAE,GAAGM;AAAsB,CAAC,kBACrFhB,KAAA,CAAAiB,aAAA,QAAAC,MAAA,CAAAC,MAAA,KAASH,KAAK;EAAED,SAAS,EAAEd,EAAE,CAACE,iBAAiB,CAAC;IAAEE,OAAO;IAAEI,IAAI;IAAEC;EAAQ,CAAC,CAAC,EAAEK,SAAS;AAAE,EAAE,CAC7F","ignoreList":[]}

package/{Dialog/components/ConfirmButton.d.ts → Card/components/ConfirmAction.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { ButtonProps } from "../../Button";
-export declare const ConfirmButton: ((props: ButtonProps) => React.JSX.Element) & {
+import { ButtonProps } from "../../Button/index.js";
+export declare const ConfirmAction: ((props: ButtonProps) => React.JSX.Element) & {
     original: (props: ButtonProps) => React.JSX.Element;
     originalName: string;
     displayName: string;
@@ -13,7 +13,7 @@ export declare const ConfirmButton: ((props: ButtonProps) => React.JSX.Element)
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: ButtonProps) => React.JSX.Element) & {
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: ButtonProps) => React.JSX.Element) & {
         original: (props: ButtonProps) => React.JSX.Element;
         originalName: string;
         displayName: string;

package/Card/components/ConfirmAction.js

@@ -0,0 +1,18 @@
+import * as React from "react";
+import { makeDecoratable } from "../../utils.js";
+import { Button } from "../../Button/index.js";
+import { useCardProps } from "./CardPropsProvider.js";
+const ConfirmActionBase = props => {
+  const {
+    actionsSize
+  } = useCardProps();
+  return /*#__PURE__*/React.createElement(Button, Object.assign({
+    text: "Confirm"
+  }, props, {
+    variant: "primary",
+    size: actionsSize
+  }));
+};
+export const ConfirmAction = makeDecoratable("ConfirmAction", ConfirmActionBase);
+
+//# sourceMappingURL=ConfirmAction.js.map

package/Card/components/ConfirmAction.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","makeDecoratable","Button","useCardProps","ConfirmActionBase","props","actionsSize","createElement","Object","assign","text","variant","size","ConfirmAction"],"sources":["ConfirmAction.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable } from \"~/utils.js\";\nimport { Button, ButtonProps } from \"~/Button/index.js\";\nimport { useCardProps } from \"./CardPropsProvider.js\";\n\nconst ConfirmActionBase = (props: ButtonProps) => {\n    const { actionsSize } = useCardProps();\n\n    return <Button text={\"Confirm\"} {...props} variant=\"primary\" size={actionsSize} />;\n};\nexport const ConfirmAction = makeDecoratable(\"ConfirmAction\", ConfirmActionBase);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe;AACxB,SAASC,MAAM;AACf,SAASC,YAAY;AAErB,MAAMC,iBAAiB,GAAIC,KAAkB,IAAK;EAC9C,MAAM;IAAEC;EAAY,CAAC,GAAGH,YAAY,CAAC,CAAC;EAEtC,oBAAOH,KAAA,CAAAO,aAAA,CAACL,MAAM,EAAAM,MAAA,CAAAC,MAAA;IAACC,IAAI,EAAE;EAAU,GAAKL,KAAK;IAAEM,OAAO,EAAC,SAAS;IAACC,IAAI,EAAEN;EAAY,EAAE,CAAC;AACtF,CAAC;AACD,OAAO,MAAMO,aAAa,GAAGZ,eAAe,CAAC,eAAe,EAAEG,iBAAiB,CAAC","ignoreList":[]}

package/Card/components/Icon.d.ts

@@ -0,0 +1,23 @@
+import * as React from "react";
+import type { IconProps as IconComponentProps } from "../../Icon/index.js";
+type IconProps = IconComponentProps;
+export declare const Icon: ((props: IconProps) => React.JSX.Element) & {
+    original: (props: IconProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: ((props: IconProps) => React.JSX.Element) & {
+        original: (props: IconProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<((props: IconProps) => React.JSX.Element) & {
+        original: (props: IconProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export {};

package/Card/components/Icon.js

@@ -0,0 +1,12 @@
+import * as React from "react";
+import { Icon as IconComponent } from "../../Icon/index.js";
+import { makeDecoratable } from "../../utils.js";
+const IconBase = props => {
+  return /*#__PURE__*/React.createElement(IconComponent, Object.assign({
+    size: "md",
+    color: "neutral-strong"
+  }, props));
+};
+export const Icon = makeDecoratable("Icon", IconBase);
+
+//# sourceMappingURL=Icon.js.map

package/Card/components/Icon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Icon","IconComponent","makeDecoratable","IconBase","props","createElement","Object","assign","size","color"],"sources":["Icon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { IconProps as IconComponentProps } from \"~/Icon/index.js\";\nimport { Icon as IconComponent } from \"~/Icon/index.js\";\nimport { makeDecoratable } from \"~/utils.js\";\n\ntype IconProps = IconComponentProps;\n\nconst IconBase = (props: IconProps) => {\n    return <IconComponent size={\"md\"} color={\"neutral-strong\"} {...props} />;\n};\n\nexport const Icon = makeDecoratable(\"Icon\", IconBase);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,IAAI,IAAIC,aAAa;AAC9B,SAASC,eAAe;AAIxB,MAAMC,QAAQ,GAAIC,KAAgB,IAAK;EACnC,oBAAOL,KAAA,CAAAM,aAAA,CAACJ,aAAa,EAAAK,MAAA,CAAAC,MAAA;IAACC,IAAI,EAAE,IAAK;IAACC,KAAK,EAAE;EAAiB,GAAKL,KAAK,CAAG,CAAC;AAC5E,CAAC;AAED,OAAO,MAAMJ,IAAI,GAAGE,eAAe,CAAC,MAAM,EAAEC,QAAQ,CAAC","ignoreList":[]}

package/Card/index.d.ts

@@ -1 +1 @@
-export * from "./Card";
+export * from "./Card.js";

package/Card/index.js

@@ -1,3 +1,3 @@
-export * from "./Card";
+export * from "./Card.js";
 
 //# sourceMappingURL=index.js.map

package/Card/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Card\";\n"],"mappings":"AAAA","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Card.js\";\n"],"mappings":"AAAA","ignoreList":[]}

package/Checkbox/Checkbox.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import type { CheckboxPrimitiveProps } from "./primitives/";
-import type { FormComponentProps } from "../FormComponent";
+import type { CheckboxPrimitiveProps } from "./primitives/index.js";
+import type { FormComponentProps } from "../FormComponent/index.js";
 type CheckboxProps = CheckboxPrimitiveProps & FormComponentProps;
 declare const Checkbox: (({ description, note, validation, ...props }: CheckboxProps) => React.JSX.Element) & {
     original: ({ description, note, validation, ...props }: CheckboxProps) => React.JSX.Element;
@@ -15,7 +15,7 @@ declare const Checkbox: (({ description, note, validation, ...props }: CheckboxP
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(({ description, note, validation, ...props }: CheckboxProps) => React.JSX.Element) & {
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ description, note, validation, ...props }: CheckboxProps) => React.JSX.Element) & {
         original: ({ description, note, validation, ...props }: CheckboxProps) => React.JSX.Element;
         originalName: string;
         displayName: string;

package/Checkbox/Checkbox.js

@@ -1,7 +1,7 @@
 import React, { useMemo } from "react";
-import { makeDecoratable } from "../utils";
-import { CheckboxPrimitive } from "./primitives/";
-import { FormComponentDescription, FormComponentErrorMessage, FormComponentNote } from "../FormComponent";
+import { makeDecoratable } from "../utils.js";
+import { CheckboxPrimitive } from "./primitives/index.js";
+import { FormComponentDescription, FormComponentErrorMessage, FormComponentNote } from "../FormComponent/index.js";
 const DecoratableCheckbox = ({
   description,
   note,
@@ -14,7 +14,7 @@ const DecoratableCheckbox = ({
   } = validation || {};
   const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);
   return /*#__PURE__*/React.createElement("div", {
-    className: "wby-w-full"
+    className: "w-full"
   }, /*#__PURE__*/React.createElement(FormComponentDescription, {
     text: description,
     disabled: props.disabled

package/Checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","makeDecoratable","CheckboxPrimitive","FormComponentDescription","FormComponentErrorMessage","FormComponentNote","DecoratableCheckbox","description","note","validation","props","isValid","validationIsValid","message","validationMessage","invalid","createElement","className","text","disabled","Checkbox"],"sources":["Checkbox.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { makeDecoratable } from \"~/utils\";\nimport type { CheckboxPrimitiveProps } from \"./primitives/\";\nimport { CheckboxPrimitive } from \"./primitives/\";\nimport type { FormComponentProps } from \"~/FormComponent\";\nimport {\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    FormComponentNote\n} from \"~/FormComponent\";\n\ntype CheckboxProps = CheckboxPrimitiveProps & FormComponentProps;\n\nconst DecoratableCheckbox = ({ description, note, validation, ...props }: CheckboxProps) => {\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n    const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);\n\n    return (\n        <div className={\"wby-w-full\"}>\n            <FormComponentDescription text={description} disabled={props.disabled} />\n            <CheckboxPrimitive {...props} />\n            <FormComponentErrorMessage\n                text={validationMessage}\n                invalid={invalid}\n                disabled={props.disabled}\n            />\n            <FormComponentNote text={note} disabled={props.disabled} />\n        </div>\n    );\n};\nconst Checkbox = makeDecoratable(\"Checkbox\", DecoratableCheckbox);\n\nexport { Checkbox };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,eAAe;AAExB,SAASC,iBAAiB;AAE1B,SACIC,wBAAwB,EACxBC,yBAAyB,EACzBC,iBAAiB;AAKrB,MAAMC,mBAAmB,GAAGA,CAAC;EAAEC,WAAW;EAAEC,IAAI;EAAEC,UAAU;EAAE,GAAGC;AAAqB,CAAC,KAAK;EACxF,MAAM;IAAEC,OAAO,EAAEC,iBAAiB;IAAEC,OAAO,EAAEC;EAAkB,CAAC,GAAGL,UAAU,IAAI,CAAC,CAAC;EACnF,MAAMM,OAAO,GAAGf,OAAO,CAAC,MAAMY,iBAAiB,KAAK,KAAK,EAAE,CAACA,iBAAiB,CAAC,CAAC;EAE/E,oBACIb,KAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAE;EAAa,gBACzBlB,KAAA,CAAAiB,aAAA,CAACb,wBAAwB;IAACe,IAAI,EAAEX,WAAY;IAACY,QAAQ,EAAET,KAAK,CAACS;EAAS,CAAE,CAAC,eACzEpB,KAAA,CAAAiB,aAAA,CAACd,iBAAiB,EAAKQ,KAAQ,CAAC,eAChCX,KAAA,CAAAiB,aAAA,CAACZ,yBAAyB;IACtBc,IAAI,EAAEJ,iBAAkB;IACxBC,OAAO,EAAEA,OAAQ;IACjBI,QAAQ,EAAET,KAAK,CAACS;EAAS,CAC5B,CAAC,eACFpB,KAAA,CAAAiB,aAAA,CAACX,iBAAiB;IAACa,IAAI,EAAEV,IAAK;IAACW,QAAQ,EAAET,KAAK,CAACS;EAAS,CAAE,CACzD,CAAC;AAEd,CAAC;AACD,MAAMC,QAAQ,GAAGnB,eAAe,CAAC,UAAU,EAAEK,mBAAmB,CAAC;AAEjE,SAASc,QAAQ","ignoreList":[]}
+{"version":3,"names":["React","useMemo","makeDecoratable","CheckboxPrimitive","FormComponentDescription","FormComponentErrorMessage","FormComponentNote","DecoratableCheckbox","description","note","validation","props","isValid","validationIsValid","message","validationMessage","invalid","createElement","className","text","disabled","Checkbox"],"sources":["Checkbox.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { makeDecoratable } from \"~/utils.js\";\nimport type { CheckboxPrimitiveProps } from \"./primitives/index.js\";\nimport { CheckboxPrimitive } from \"./primitives/index.js\";\nimport type { FormComponentProps } from \"~/FormComponent/index.js\";\nimport {\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    FormComponentNote\n} from \"~/FormComponent/index.js\";\n\ntype CheckboxProps = CheckboxPrimitiveProps & FormComponentProps;\n\nconst DecoratableCheckbox = ({ description, note, validation, ...props }: CheckboxProps) => {\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n    const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);\n\n    return (\n        <div className={\"w-full\"}>\n            <FormComponentDescription text={description} disabled={props.disabled} />\n            <CheckboxPrimitive {...props} />\n            <FormComponentErrorMessage\n                text={validationMessage}\n                invalid={invalid}\n                disabled={props.disabled}\n            />\n            <FormComponentNote text={note} disabled={props.disabled} />\n        </div>\n    );\n};\nconst Checkbox = makeDecoratable(\"Checkbox\", DecoratableCheckbox);\n\nexport { Checkbox };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,eAAe;AAExB,SAASC,iBAAiB;AAE1B,SACIC,wBAAwB,EACxBC,yBAAyB,EACzBC,iBAAiB;AAKrB,MAAMC,mBAAmB,GAAGA,CAAC;EAAEC,WAAW;EAAEC,IAAI;EAAEC,UAAU;EAAE,GAAGC;AAAqB,CAAC,KAAK;EACxF,MAAM;IAAEC,OAAO,EAAEC,iBAAiB;IAAEC,OAAO,EAAEC;EAAkB,CAAC,GAAGL,UAAU,IAAI,CAAC,CAAC;EACnF,MAAMM,OAAO,GAAGf,OAAO,CAAC,MAAMY,iBAAiB,KAAK,KAAK,EAAE,CAACA,iBAAiB,CAAC,CAAC;EAE/E,oBACIb,KAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAE;EAAS,gBACrBlB,KAAA,CAAAiB,aAAA,CAACb,wBAAwB;IAACe,IAAI,EAAEX,WAAY;IAACY,QAAQ,EAAET,KAAK,CAACS;EAAS,CAAE,CAAC,eACzEpB,KAAA,CAAAiB,aAAA,CAACd,iBAAiB,EAAKQ,KAAQ,CAAC,eAChCX,KAAA,CAAAiB,aAAA,CAACZ,yBAAyB;IACtBc,IAAI,EAAEJ,iBAAkB;IACxBC,OAAO,EAAEA,OAAQ;IACjBI,QAAQ,EAAET,KAAK,CAACS;EAAS,CAC5B,CAAC,eACFpB,KAAA,CAAAiB,aAAA,CAACX,iBAAiB;IAACa,IAAI,EAAEV,IAAK;IAACW,QAAQ,EAAET,KAAK,CAACS;EAAS,CAAE,CACzD,CAAC;AAEd,CAAC;AACD,MAAMC,QAAQ,GAAGnB,eAAe,CAAC,UAAU,EAAEK,mBAAmB,CAAC;AAEjE,SAASc,QAAQ","ignoreList":[]}