@nayhoo/ui 0.20.2 → 0.21.0

package/dist/providers/index.js

@@ -276,32 +276,50 @@ var Spinner = ({ asChild, ...props }) => {
 
 // src/theme/recipes/button.css.ts
 var import_createRuntimeFn2 = require("homemade-recipes/createRuntimeFn");
+var buttonIconRecipe = (0, import_createRuntimeFn2.createRuntimeFn)((function() {
+  var x = { defaultClassName: "button__hi3ya0r", variantClassNames: { size: { "1": "button_size_1__hi3ya0s", "2": "button_size_2__hi3ya0t", "3": "button_size_3__hi3ya0u" } }, defaultVariants: {}, compoundVariants: [], responsiveVariantClassNames: { initial: void 0 }, conditionNames: [], conditions: { xs: "520px", sm: "768px", md: "1024px", lg: "1280px", xl: "1640px" }, identifier: "homemade-recipe__lb053z0", cssCache: [] };
+  x.responsiveVariantClassNames.initial = x.variantClassNames;
+  return x;
+})());
 var buttonRecipe = (0, import_createRuntimeFn2.createRuntimeFn)((function() {
   var x = { defaultClassName: "button__hi3ya00", variantClassNames: { fullWidth: { true: "button_fullWidth_true__hi3ya01", false: "button_fullWidth_false__hi3ya02" }, loading: { true: "button_loading_true__hi3ya03" }, size: { "1": "button_size_1__hi3ya04", "2": "button_size_2__hi3ya05", "3": "button_size_3__hi3ya06" }, variant: { primary: "button_variant_primary__hi3ya07", secondary: "button_variant_secondary__hi3ya08", outline: "button_variant_outline__hi3ya09", ghost: "button_variant_ghost__hi3ya0a", error: "button_variant_error__hi3ya0b", success: "button_variant_success__hi3ya0c" }, round: { true: "button_round_true__hi3ya0d" } }, defaultVariants: { size: "2", variant: "primary" }, compoundVariants: [], responsiveVariantClassNames: { initial: void 0, sm: { fullWidth: { true: "button_fullWidth_sm_true__hi3ya0e", false: "button_fullWidth_sm_false__hi3ya0f" }, loading: { true: "button_loading_sm_true__hi3ya0g" }, size: { "1": "button_size_sm_1__hi3ya0h", "2": "button_size_sm_2__hi3ya0i", "3": "button_size_sm_3__hi3ya0j" }, variant: { primary: "button_variant_sm_primary__hi3ya0k", secondary: "button_variant_sm_secondary__hi3ya0l", outline: "button_variant_sm_outline__hi3ya0m", ghost: "button_variant_sm_ghost__hi3ya0n", error: "button_variant_sm_error__hi3ya0o", success: "button_variant_sm_success__hi3ya0p" }, round: { true: "button_round_sm_true__hi3ya0q" } } }, conditionNames: ["sm"], conditions: { xs: "520px", sm: "768px", md: "1024px", lg: "1280px", xl: "1640px" }, identifier: "homemade-recipe__lb053z0", cssCache: [] };
   x.responsiveVariantClassNames.initial = x.variantClassNames;
   return x;
 })());
+var buttonSpinner = "button_buttonSpinner__hi3ya0v";
 
 // src/components/button.tsx
 var import_react_slot2 = require("@radix-ui/react-slot");
 var import_jsx_runtime3 = require("react/jsx-runtime");
 var defaultElement2 = "button";
-var Button = ({ asChild, ...props }) => {
+var Button = ({
+  asChild,
+  leftIcon,
+  rightIcon,
+  ...props
+}) => {
   const [variants, rest] = extractVariantsFromProps(
     props,
     ...buttonRecipe.variants()
   );
   const button = buttonRecipe(variants);
   const Comp = asChild ? import_react_slot2.Slot : defaultElement2;
+  const buttonIcon = buttonIconRecipe({
+    size: variants.size
+  });
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
     Comp,
     {
       ...rest,
       className: mergeClasses(button, rest.className),
       disabled: rest.disabled || Boolean(variants.loading),
+      ...leftIcon && { "data-left-icon": "" },
+      ...rightIcon && { "data-right-icon": "" },
       children: [
+        leftIcon && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_slot2.Slot, { className: buttonIcon, children: leftIcon }),
         rest.children,
-        variants.loading && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Spinner, { style: { position: "absolute" } })
+        rightIcon && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_slot2.Slot, { className: buttonIcon, children: rightIcon }),
+        variants.loading && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Spinner, { className: buttonSpinner })
       ]
     }
   );