@nayhoo/ui 0.15.0 → 0.16.1

package/dist/components/dialog.mjs

@@ -0,0 +1,129 @@
+import {
+  dialogContentRecipe,
+  dialogDescription,
+  dialogFooter,
+  dialogHeader,
+  dialogOverlayRecipe,
+  dialogTitle
+} from "../chunk-Z6RQ453R.mjs";
+import "../chunk-KH7OG63I.mjs";
+import "../chunk-C4NLMHMQ.mjs";
+import "../chunk-DXKT5AFF.mjs";
+import "../chunk-Y6BNWBLR.mjs";
+import "../chunk-O62XWWJU.mjs";
+import "../chunk-NOIOHUNH.mjs";
+import "../chunk-JGZLOTH3.mjs";
+import "../chunk-HGLO5LDS.mjs";
+import "../chunk-P3OUEGR4.mjs";
+import "../chunk-5WJ4KGIE.mjs";
+import "../chunk-WUVNL3DI.mjs";
+import {
+  Flex
+} from "../chunk-M7HASIMW.mjs";
+import "../chunk-S6KKPOPH.mjs";
+import "../chunk-AXOHCT5Q.mjs";
+import "../chunk-KE7EIF6L.mjs";
+import "../chunk-JZBPCPSP.mjs";
+import "../chunk-HNVVD3WS.mjs";
+import "../chunk-DOHVBMXO.mjs";
+import "../chunk-P2VEMZGS.mjs";
+import "../chunk-EXKRRQYL.mjs";
+import {
+  theme
+} from "../chunk-N535ABFC.mjs";
+import "../chunk-GHCXVMQR.mjs";
+import {
+  Box
+} from "../chunk-LSB5JVS2.mjs";
+import "../chunk-OI24WXH6.mjs";
+import "../chunk-4A7WL3BM.mjs";
+import "../chunk-47YGQSLM.mjs";
+import "../chunk-6RSPMV3B.mjs";
+import "../chunk-IFN22XIN.mjs";
+import "../chunk-5ZOT2LOO.mjs";
+import "../chunk-PUW3KNR3.mjs";
+import {
+  extractVariantsFromProps
+} from "../chunk-UPZYS6TE.mjs";
+import {
+  mergeClasses
+} from "../chunk-7EGQM3ZL.mjs";
+
+// src/components/dialog.tsx
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Dialog = DialogPrimitive.Root;
+var DialogClose = DialogPrimitive.Close;
+var DialogContent = ({
+  children,
+  components,
+  disableOverlayBlur = false,
+  ...props
+}) => {
+  const dialogOverlay = dialogOverlayRecipe({ disableOverlayBlur });
+  const [variants, rest] = extractVariantsFromProps(
+    props,
+    ...dialogContentRecipe.variants()
+  );
+  const dialogContent = dialogContentRecipe(variants);
+  return /* @__PURE__ */ jsxs(DialogPrimitive.Portal, { children: [
+    /* @__PURE__ */ jsx(DialogPrimitive.Overlay, { className: dialogOverlay }),
+    /* @__PURE__ */ jsxs(
+      DialogPrimitive.Content,
+      {
+        ...rest,
+        className: mergeClasses(dialogContent, rest.className),
+        children: [
+          components?.Header,
+          /* @__PURE__ */ jsx(Box, { style: { padding: theme.space[5] }, children }),
+          components?.Footer
+        ]
+      }
+    )
+  ] });
+};
+var DialogDescription = ({ ...props }) => {
+  return /* @__PURE__ */ jsx(
+    DialogPrimitive.Description,
+    {
+      ...props,
+      className: mergeClasses(dialogDescription, props.className)
+    }
+  );
+};
+var DialogFooter = ({ children }) => {
+  return /* @__PURE__ */ jsx(
+    Flex,
+    {
+      className: dialogFooter,
+      direction: { initial: "column", sm: "row" },
+      gap: "2",
+      justify: "end",
+      children
+    }
+  );
+};
+var DialogHeader = ({ children }) => {
+  return /* @__PURE__ */ jsx(Flex, { className: dialogHeader, children });
+};
+var DialogTitle = ({ ...props }) => {
+  return /* @__PURE__ */ jsx(
+    DialogPrimitive.Title,
+    {
+      ...props,
+      className: mergeClasses(dialogTitle, props.className)
+    }
+  );
+};
+var DialogTrigger = DialogPrimitive.Trigger;
+export {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger
+};
+//# sourceMappingURL=dialog.mjs.map

package/dist/components/dialog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/dialog.tsx"],"sourcesContent":["import { Box } from \"@/components/box\";\nimport { Flex } from \"@/components/flex\";\nimport { theme } from \"@/theme\";\nimport {\n  DialogContentVariants,\n  dialogContentRecipe,\n  dialogOverlayRecipe,\n} from \"@/theme/recipes/dialog.css\";\nimport {\n  dialogDescription,\n  dialogFooter,\n  dialogHeader,\n  dialogTitle,\n} from \"@/theme/styles/dialog.css\";\nimport { extractVariantsFromProps, mergeClasses } from \"@/utils\";\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\";\n\nexport type DialogProps = DialogPrimitive.DialogProps;\n\n/**\n * @see https://github.com/nayhoo/ui/blob/main/apps/react-cosmos/src/dialog.fixture.tsx\n */\nexport const Dialog = DialogPrimitive.Root;\n\nexport type DialogCloseProps = DialogPrimitive.DialogCloseProps;\n\nexport const DialogClose = DialogPrimitive.Close;\n\nexport type DialogContentProps = DialogPrimitive.DialogContentProps &\n  DialogContentVariants & {\n    components?: { Footer?: React.ReactNode; Header?: React.ReactNode };\n    disableOverlayBlur?: boolean;\n  };\n\nexport const DialogContent = ({\n  children,\n  components,\n  disableOverlayBlur = false,\n  ...props\n}: DialogContentProps) => {\n  const dialogOverlay = dialogOverlayRecipe({ disableOverlayBlur });\n  const [variants, rest] = extractVariantsFromProps(\n    props,\n    ...dialogContentRecipe.variants(),\n  );\n  const dialogContent = dialogContentRecipe(variants);\n\n  return (\n    <DialogPrimitive.Portal>\n      <DialogPrimitive.Overlay className={dialogOverlay} />\n      <DialogPrimitive.Content\n        {...rest}\n        className={mergeClasses(dialogContent, rest.className)}\n      >\n        {components?.Header}\n\n        <Box style={{ padding: theme.space[5] }}>{children}</Box>\n\n        {components?.Footer}\n      </DialogPrimitive.Content>\n    </DialogPrimitive.Portal>\n  );\n};\n\nexport type DialogDescriptionProps = DialogPrimitive.DialogDescriptionProps;\n\nexport const DialogDescription = ({ ...props }: DialogDescriptionProps) => {\n  return (\n    <DialogPrimitive.Description\n      {...props}\n      className={mergeClasses(dialogDescription, props.className)}\n    />\n  );\n};\n\nexport type DialogFooterProps = { children: React.ReactNode };\n\nexport const DialogFooter = ({ children }: DialogFooterProps) => {\n  return (\n    <Flex\n      className={dialogFooter}\n      direction={{ initial: \"column\", sm: \"row\" }}\n      gap=\"2\"\n      justify=\"end\"\n    >\n      {children}\n    </Flex>\n  );\n};\n\nexport type DialogHeaderProps = { children: React.ReactNode };\n\nexport const DialogHeader = ({ children }: DialogHeaderProps) => {\n  return <Flex className={dialogHeader}>{children}</Flex>;\n};\n\nexport type DialogTitleProps = DialogPrimitive.DialogTitleProps;\n\nexport const DialogTitle = ({ ...props }: DialogTitleProps) => {\n  return (\n    <DialogPrimitive.Title\n      {...props}\n      className={mergeClasses(dialogTitle, props.className)}\n    />\n  );\n};\n\nexport type DialogTriggerProps = DialogPrimitive.DialogTriggerProps;\n\nexport const DialogTrigger = DialogPrimitive.Trigger;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,YAAY,qBAAqB;AAkC3B,cACA,YADA;AA3BC,IAAM,SAAyB;AAI/B,IAAM,cAA8B;AAQpC,IAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA,qBAAqB;AAAA,EACrB,GAAG;AACL,MAA0B;AACxB,QAAM,gBAAgB,oBAAoB,EAAE,mBAAmB,CAAC;AAChE,QAAM,CAAC,UAAU,IAAI,IAAI;AAAA,IACvB;AAAA,IACA,GAAG,oBAAoB,SAAS;AAAA,EAClC;AACA,QAAM,gBAAgB,oBAAoB,QAAQ;AAElD,SACE,qBAAiB,wBAAhB,EACC;AAAA,wBAAiB,yBAAhB,EAAwB,WAAW,eAAe;AAAA,IACnD;AAAA,MAAiB;AAAA,MAAhB;AAAA,QACE,GAAG;AAAA,QACJ,WAAW,aAAa,eAAe,KAAK,SAAS;AAAA,QAEpD;AAAA,sBAAY;AAAA,UAEb,oBAAC,OAAI,OAAO,EAAE,SAAS,MAAM,MAAM,CAAC,EAAE,GAAI,UAAS;AAAA,UAElD,YAAY;AAAA;AAAA;AAAA,IACf;AAAA,KACF;AAEJ;AAIO,IAAM,oBAAoB,CAAC,EAAE,GAAG,MAAM,MAA8B;AACzE,SACE;AAAA,IAAiB;AAAA,IAAhB;AAAA,MACE,GAAG;AAAA,MACJ,WAAW,aAAa,mBAAmB,MAAM,SAAS;AAAA;AAAA,EAC5D;AAEJ;AAIO,IAAM,eAAe,CAAC,EAAE,SAAS,MAAyB;AAC/D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACX,WAAW,EAAE,SAAS,UAAU,IAAI,MAAM;AAAA,MAC1C,KAAI;AAAA,MACJ,SAAQ;AAAA,MAEP;AAAA;AAAA,EACH;AAEJ;AAIO,IAAM,eAAe,CAAC,EAAE,SAAS,MAAyB;AAC/D,SAAO,oBAAC,QAAK,WAAW,cAAe,UAAS;AAClD;AAIO,IAAM,cAAc,CAAC,EAAE,GAAG,MAAM,MAAwB;AAC7D,SACE;AAAA,IAAiB;AAAA,IAAhB;AAAA,MACE,GAAG;AAAA,MACJ,WAAW,aAAa,aAAa,MAAM,SAAS;AAAA;AAAA,EACtD;AAEJ;AAIO,IAAM,gBAAgC;","names":[]}

package/dist/dialog.css-noIN2HKB.d.mts

@@ -0,0 +1,35 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const dialogContentRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    fullWidth: {
+        true: {
+            width: "100%";
+        };
+    };
+    size: {
+        "1": {
+            maxWidth: "430px";
+        };
+        "2": {
+            maxWidth: "715px";
+        };
+        "3": {
+            maxWidth: "1145px";
+        };
+        "4": {
+            maxWidth: "none";
+        };
+    };
+}>;
+type DialogContentVariants = RecipeVariants<typeof dialogContentRecipe>;
+declare const dialogOverlayRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    disableOverlayBlur: {
+        true: {
+            backdropFilter: "blur(0px)";
+        };
+    };
+}>;
+type DialogOverlayVariants = RecipeVariants<typeof dialogOverlayRecipe>;
+
+export { type DialogContentVariants as D, dialogOverlayRecipe as a, type DialogOverlayVariants as b, dialogContentRecipe as d };

package/dist/dialog.css-noIN2HKB.d.ts

@@ -0,0 +1,35 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const dialogContentRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    fullWidth: {
+        true: {
+            width: "100%";
+        };
+    };
+    size: {
+        "1": {
+            maxWidth: "430px";
+        };
+        "2": {
+            maxWidth: "715px";
+        };
+        "3": {
+            maxWidth: "1145px";
+        };
+        "4": {
+            maxWidth: "none";
+        };
+    };
+}>;
+type DialogContentVariants = RecipeVariants<typeof dialogContentRecipe>;
+declare const dialogOverlayRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    disableOverlayBlur: {
+        true: {
+            backdropFilter: "blur(0px)";
+        };
+    };
+}>;
+type DialogOverlayVariants = RecipeVariants<typeof dialogOverlayRecipe>;
+
+export { type DialogContentVariants as D, dialogOverlayRecipe as a, type DialogOverlayVariants as b, dialogContentRecipe as d };