@discourser/design-system 0.11.0 → 0.13.0

package/dist/index.cjs

@@ -1,755 +1,154 @@
 'use strict';
 
-var chunkESTQ62GZ_cjs = require('./chunk-ESTQ62GZ.cjs');
-var chunkX4PNKWSA_cjs = require('./chunk-X4PNKWSA.cjs');
+var chunkXSX6TKJZ_cjs = require('./chunk-XSX6TKJZ.cjs');
+var chunkMIBEMJNS_cjs = require('./chunk-MIBEMJNS.cjs');
 require('./chunk-EARF7VDF.cjs');
-var dev = require('@pandacss/dev');
 var clsx = require('clsx');
 
-var buttonRecipe = dev.defineRecipe({
-  className: "button",
-  description: "Material Design 3 button component",
-  base: {
-    display: "inline-flex",
-    alignItems: "center",
-    justifyContent: "center",
-    gap: "sm",
-    fontFamily: "body",
-    fontWeight: "500",
-    borderRadius: "full",
-    cursor: "pointer",
-    transition: "all",
-    transitionDuration: "fast",
-    transitionTimingFunction: "standard",
-    outline: "none",
-    border: "none",
-    textDecoration: "none",
-    _disabled: {
-      opacity: 0.38,
-      cursor: "not-allowed",
-      pointerEvents: "none"
-    },
-    _focusVisible: {
-      outline: "2px solid",
-      outlineColor: "primary",
-      outlineOffset: "2px"
-    }
-  },
-  variants: {
-    variant: {
-      filled: {
-        bg: "primary",
-        color: "onPrimary",
-        _hover: {
-          opacity: 0.92,
-          shadow: "level1"
-        },
-        _active: {
-          opacity: 0.88
-        }
-      },
-      outlined: {
-        bg: "transparent",
-        color: "primary",
-        borderWidth: "1px",
-        borderStyle: "solid",
-        borderColor: "outline",
-        _hover: {
-          bg: "primary",
-          bgOpacity: 0.08
-        },
-        _active: {
-          bg: "primary",
-          bgOpacity: 0.12
-        }
-      },
-      text: {
-        bg: "transparent",
-        color: "primary",
-        _hover: {
-          bg: "primary",
-          bgOpacity: 0.08
-        },
-        _active: {
-          bg: "primary",
-          bgOpacity: 0.12
-        }
-      },
-      elevated: {
-        bg: "surfaceContainerLow",
-        color: "primary",
-        shadow: "level1",
-        _hover: {
-          shadow: "level2",
-          bg: "surfaceContainerLow"
-        },
-        _active: {
-          shadow: "level1"
-        }
-      },
-      tonal: {
-        bg: "secondaryContainer",
-        color: "onSecondaryContainer",
-        _hover: {
-          shadow: "level1"
-        },
-        _active: {
-          shadow: "none"
-        }
-      }
-    },
-    size: {
-      sm: {
-        height: "32px",
-        px: "md",
-        fontSize: "labelMedium",
-        lineHeight: "labelMedium"
-      },
-      md: {
-        height: "40px",
-        px: "lg",
-        fontSize: "labelLarge",
-        lineHeight: "labelLarge"
-      },
-      lg: {
-        height: "48px",
-        px: "xl",
-        fontSize: "labelLarge",
-        lineHeight: "labelLarge"
-      }
-    }
-  },
-  defaultVariants: {
-    variant: "filled",
-    size: "md"
-  }
-});
-var cardRecipe = dev.defineRecipe({
-  className: "card",
-  description: "Material Design 3 card component",
-  base: {
-    display: "flex",
-    flexDirection: "column",
-    borderRadius: "medium",
-    overflow: "hidden",
-    transition: "all",
-    transitionDuration: "fast",
-    transitionTimingFunction: "standard"
-  },
-  variants: {
-    variant: {
-      elevated: {
-        bg: "surfaceContainerLow",
-        shadow: "level1",
-        _hover: {
-          shadow: "level2"
-        }
-      },
-      filled: {
-        bg: "surfaceContainerHighest"
-      },
-      outlined: {
-        bg: "surface",
-        borderWidth: "1px",
-        borderStyle: "solid",
-        borderColor: "outlineVariant"
-      }
-    },
-    interactive: {
-      true: {
-        cursor: "pointer",
-        _hover: {
-          opacity: 0.96
-        },
-        _active: {
-          opacity: 0.92
-        }
-      }
-    }
-  },
-  defaultVariants: {
-    variant: "elevated",
-    interactive: false
-  }
-});
-var iconButtonRecipe = dev.defineRecipe({
-  className: "icon-button",
-  description: "Material Design 3 icon button component",
-  base: {
-    display: "inline-flex",
-    alignItems: "center",
-    justifyContent: "center",
-    borderRadius: "full",
-    cursor: "pointer",
-    transition: "all",
-    transitionDuration: "fast",
-    transitionTimingFunction: "standard",
-    outline: "none",
-    border: "none",
-    p: "0",
-    _disabled: {
-      opacity: 0.38,
-      cursor: "not-allowed",
-      pointerEvents: "none"
-    },
-    _focusVisible: {
-      outline: "2px solid",
-      outlineColor: "primary",
-      outlineOffset: "2px"
-    }
-  },
-  variants: {
-    variant: {
-      standard: {
-        bg: "transparent",
-        color: "onSurfaceVariant",
-        _hover: {
-          bg: "onSurfaceVariant",
-          bgOpacity: 0.08
-        }
-      },
-      filled: {
-        bg: "primary",
-        color: "onPrimary",
-        _hover: {
-          opacity: 0.92
-        }
-      },
-      tonal: {
-        bg: "secondaryContainer",
-        color: "onSecondaryContainer",
-        _hover: {
-          opacity: 0.92
-        }
-      },
-      outlined: {
-        bg: "transparent",
-        color: "onSurfaceVariant",
-        borderWidth: "1px",
-        borderStyle: "solid",
-        borderColor: "outline",
-        _hover: {
-          bg: "onSurfaceVariant",
-          bgOpacity: 0.08
-        }
-      }
-    },
-    size: {
-      sm: {
-        width: "32px",
-        height: "32px",
-        "& svg": {
-          width: "18px",
-          height: "18px"
-        }
-      },
-      md: {
-        width: "40px",
-        height: "40px",
-        "& svg": {
-          width: "24px",
-          height: "24px"
-        }
-      },
-      lg: {
-        width: "48px",
-        height: "48px",
-        "& svg": {
-          width: "24px",
-          height: "24px"
-        }
-      }
-    }
-  },
-  defaultVariants: {
-    variant: "standard",
-    size: "md"
-  }
-});
-var inputRecipe = dev.defineRecipe({
-  className: "input",
-  description: "Material Design 3 text field component",
-  base: {
-    width: "100%",
-    fontFamily: "body",
-    fontSize: "bodyLarge",
-    lineHeight: "bodyLarge",
-    color: "onSurface",
-    bg: "transparent",
-    borderRadius: "extraSmall",
-    px: "md",
-    transition: "all",
-    transitionDuration: "fast",
-    outline: "none",
-    _placeholder: {
-      color: "onSurfaceVariant",
-      opacity: 0.6
-    },
-    _focus: {
-      outline: "none"
-    },
-    _disabled: {
-      opacity: 0.38,
-      cursor: "not-allowed"
-    }
-  },
-  variants: {
-    variant: {
-      filled: {
-        bg: "surfaceContainerHighest",
-        borderBottomWidth: "1px",
-        borderBottomStyle: "solid",
-        borderBottomColor: "onSurfaceVariant",
-        borderTopLeftRadius: "extraSmall",
-        borderTopRightRadius: "extraSmall",
-        borderBottomLeftRadius: "0",
-        borderBottomRightRadius: "0",
-        _hover: {
-          bg: "surfaceContainerHigh"
-        },
-        _focus: {
-          borderBottomWidth: "2px",
-          borderBottomColor: "primary"
-        }
-      },
-      outlined: {
-        bg: "transparent",
-        borderWidth: "1px",
-        borderStyle: "solid",
-        borderColor: "outline",
-        _hover: {
-          borderColor: "onSurface"
-        },
-        _focus: {
-          borderWidth: "2px",
-          borderColor: "primary"
-        }
-      }
-    },
-    size: {
-      sm: {
-        height: "40px",
-        fontSize: "bodySmall",
-        lineHeight: "bodySmall"
-      },
-      md: {
-        height: "56px",
-        fontSize: "bodyLarge",
-        lineHeight: "bodyLarge"
-      }
-    },
-    state: {
-      error: {
-        borderColor: "error",
-        _focus: {
-          borderColor: "error"
-        }
-      },
-      disabled: {
-        opacity: 0.38,
-        cursor: "not-allowed",
-        pointerEvents: "none"
-      }
-    }
-  },
-  defaultVariants: {
-    variant: "outlined",
-    size: "md"
-  }
-});
-var dialogRecipe = dev.defineSlotRecipe({
-  className: "dialog",
-  description: "Material Design 3 dialog component",
-  slots: ["backdrop", "positioner", "content", "title", "description", "closeTrigger"],
-  base: {
-    backdrop: {
-      position: "fixed",
-      inset: "0",
-      bg: "scrim",
-      opacity: 0.4,
-      zIndex: "modal",
-      animation: "fadeIn",
-      _open: {
-        animation: "fadeIn"
-      },
-      _closed: {
-        animation: "fadeOut"
-      }
-    },
-    positioner: {
-      position: "fixed",
-      inset: "0",
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      zIndex: "modal",
-      p: "lg"
-    },
-    content: {
-      position: "relative",
-      bg: "surfaceContainerHigh",
-      color: "onSurface",
-      borderRadius: "extraLarge",
-      boxShadow: "level3",
-      display: "flex",
-      flexDirection: "column",
-      maxWidth: "90vw",
-      maxHeight: "90vh",
-      overflow: "hidden",
-      animation: "scaleIn",
-      _open: {
-        animation: "scaleIn"
-      },
-      _closed: {
-        animation: "scaleOut"
-      }
-    },
-    title: {
-      fontFamily: "headline",
-      fontSize: "headlineSmall",
-      fontWeight: "regular",
-      color: "onSurface",
-      px: "xl",
-      pt: "xl",
-      pb: "md"
-    },
-    description: {
-      fontFamily: "body",
-      fontSize: "bodyMedium",
-      color: "onSurfaceVariant",
-      px: "xl",
-      pb: "xl",
-      flex: "1",
-      overflow: "auto"
-    },
-    closeTrigger: {
-      position: "absolute",
-      top: "md",
-      right: "md",
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      width: "40px",
-      height: "40px",
-      borderRadius: "full",
-      cursor: "pointer",
-      color: "onSurfaceVariant",
-      bg: "transparent",
-      border: "none",
-      transition: "all",
-      transitionDuration: "fast",
-      _hover: {
-        bg: "surfaceContainerHighest"
-      },
-      _focus: {
-        outline: "none",
-        bg: "surfaceContainerHighest"
-      }
-    }
-  },
-  variants: {
-    size: {
-      sm: {
-        content: {
-          width: "280px",
-          minHeight: "140px"
-        }
-      },
-      md: {
-        content: {
-          width: "560px",
-          minHeight: "200px"
-        }
-      },
-      lg: {
-        content: {
-          width: "800px",
-          minHeight: "300px"
-        }
-      },
-      fullscreen: {
-        content: {
-          width: "100vw",
-          height: "100vh",
-          maxWidth: "100vw",
-          maxHeight: "100vh",
-          borderRadius: "none"
-        },
-        positioner: {
-          p: "0"
-        }
-      }
-    }
-  },
-  defaultVariants: {
-    size: "md"
-  }
-});
-var switchRecipe = dev.defineSlotRecipe({
-  className: "switchControl",
-  description: "Material Design 3 switch component",
-  slots: ["root", "control", "thumb", "label"],
-  base: {
-    root: {
-      display: "inline-flex",
-      alignItems: "center",
-      gap: "sm",
-      cursor: "pointer",
-      userSelect: "none",
-      _disabled: {
-        cursor: "not-allowed",
-        opacity: 0.38
-      }
-    },
-    control: {
-      position: "relative",
-      display: "inline-flex",
-      alignItems: "center",
-      width: "52px",
-      height: "32px",
-      borderRadius: "full",
-      bg: "surfaceContainerHighest",
-      border: "2px solid",
-      borderColor: "outline",
-      transition: "all",
-      transitionDuration: "fast",
-      flexShrink: 0,
-      _checked: {
-        bg: "primary",
-        borderColor: "primary"
-      },
-      _disabled: {
-        bg: "surfaceVariant",
-        borderColor: "onSurface",
-        opacity: 0.12
-      }
-    },
-    thumb: {
-      position: "absolute",
-      left: "4px",
-      width: "16px",
-      height: "16px",
-      borderRadius: "full",
-      bg: "outline",
-      transition: "all",
-      transitionDuration: "fast",
-      _checked: {
-        left: "28px",
-        width: "24px",
-        height: "24px",
-        bg: "onPrimary"
-      },
-      _disabled: {
-        bg: "onSurface",
-        opacity: 0.38
-      }
-    },
-    label: {
-      fontFamily: "body",
-      fontSize: "bodyMedium",
-      color: "onSurface",
-      userSelect: "none",
-      _disabled: {
-        opacity: 0.38
-      }
-    }
-  },
-  variants: {
-    size: {
-      sm: {
-        control: {
-          width: "44px",
-          height: "24px"
-        },
-        thumb: {
-          width: "12px",
-          height: "12px",
-          left: "4px",
-          _checked: {
-            left: "24px",
-            width: "16px",
-            height: "16px"
-          }
-        },
-        label: {
-          fontSize: "bodySmall"
-        }
-      },
-      md: {
-        control: {
-          width: "52px",
-          height: "32px"
-        },
-        thumb: {
-          width: "16px",
-          height: "16px",
-          left: "4px",
-          _checked: {
-            left: "28px",
-            width: "24px",
-            height: "24px"
-          }
-        },
-        label: {
-          fontSize: "bodyMedium"
-        }
-      }
-    }
-  },
-  defaultVariants: {
-    size: "md"
-  }
-});
 function cn(...inputs) {
   return clsx.clsx(inputs);
 }
 
 Object.defineProperty(exports, "activeLanguage", {
   enumerable: true,
-  get: function () { return chunkESTQ62GZ_cjs.material3Language; }
+  get: function () { return chunkXSX6TKJZ_cjs.material3Language; }
 });
 Object.defineProperty(exports, "discourserPandaPreset", {
   enumerable: true,
-  get: function () { return chunkESTQ62GZ_cjs.discourserPandaPreset; }
+  get: function () { return chunkXSX6TKJZ_cjs.discourserPandaPreset; }
 });
 Object.defineProperty(exports, "transformToPandaTheme", {
   enumerable: true,
-  get: function () { return chunkESTQ62GZ_cjs.transformToPandaTheme; }
+  get: function () { return chunkXSX6TKJZ_cjs.transformToPandaTheme; }
 });
 Object.defineProperty(exports, "AbsoluteCenter", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.AbsoluteCenter_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.AbsoluteCenter_exports; }
 });
 Object.defineProperty(exports, "Accordion", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Accordion_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Accordion_exports; }
 });
 Object.defineProperty(exports, "Avatar", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Avatar_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Avatar_exports; }
 });
 Object.defineProperty(exports, "Badge", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Badge; }
+  get: function () { return chunkMIBEMJNS_cjs.Badge; }
 });
 Object.defineProperty(exports, "Button", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Button; }
+  get: function () { return chunkMIBEMJNS_cjs.Button; }
 });
 Object.defineProperty(exports, "ButtonGroup", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.ButtonGroup; }
+  get: function () { return chunkMIBEMJNS_cjs.ButtonGroup; }
 });
 Object.defineProperty(exports, "Card", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Card_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Card_exports; }
 });
 Object.defineProperty(exports, "Checkbox", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Checkbox_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Checkbox_exports; }
 });
 Object.defineProperty(exports, "CloseButton", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.CloseButton_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.CloseButton_exports; }
 });
 Object.defineProperty(exports, "Dialog", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Dialog_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Dialog_exports; }
 });
 Object.defineProperty(exports, "Drawer", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Drawer_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Drawer_exports; }
 });
 Object.defineProperty(exports, "Group", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Group_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Group_exports; }
 });
 Object.defineProperty(exports, "Heading", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Heading; }
+  get: function () { return chunkMIBEMJNS_cjs.Heading; }
 });
 Object.defineProperty(exports, "Icon", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Icon_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Icon_exports; }
 });
 Object.defineProperty(exports, "IconButton", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.IconButton; }
+  get: function () { return chunkMIBEMJNS_cjs.IconButton; }
 });
 Object.defineProperty(exports, "Input", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Input; }
+  get: function () { return chunkMIBEMJNS_cjs.Input; }
 });
 Object.defineProperty(exports, "InputAddon", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.InputAddon; }
+  get: function () { return chunkMIBEMJNS_cjs.InputAddon; }
 });
 Object.defineProperty(exports, "InputGroup", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.InputGroup; }
+  get: function () { return chunkMIBEMJNS_cjs.InputGroup; }
 });
 Object.defineProperty(exports, "Popover", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Popover_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Popover_exports; }
 });
 Object.defineProperty(exports, "Progress", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Progress_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Progress_exports; }
 });
 Object.defineProperty(exports, "RadioGroup", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.RadioGroup_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.RadioGroup_exports; }
 });
 Object.defineProperty(exports, "Select", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Select_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Select_exports; }
 });
 Object.defineProperty(exports, "Skeleton", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Skeleton_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Skeleton_exports; }
 });
 Object.defineProperty(exports, "Slider", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Slider_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Slider_exports; }
 });
 Object.defineProperty(exports, "Spinner", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Spinner; }
+  get: function () { return chunkMIBEMJNS_cjs.Spinner; }
 });
 Object.defineProperty(exports, "Stepper", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Stepper; }
+  get: function () { return chunkMIBEMJNS_cjs.Stepper; }
 });
 Object.defineProperty(exports, "Switch", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Switch_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Switch_exports; }
 });
 Object.defineProperty(exports, "Tabs", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Tabs_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Tabs_exports; }
 });
 Object.defineProperty(exports, "Textarea", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Textarea; }
+  get: function () { return chunkMIBEMJNS_cjs.Textarea; }
 });
 Object.defineProperty(exports, "Toaster", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Toaster; }
+  get: function () { return chunkMIBEMJNS_cjs.Toaster; }
 });
 Object.defineProperty(exports, "Tooltip", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.Tooltip_exports; }
+  get: function () { return chunkMIBEMJNS_cjs.Tooltip_exports; }
 });
 Object.defineProperty(exports, "toaster", {
   enumerable: true,
-  get: function () { return chunkX4PNKWSA_cjs.toaster; }
+  get: function () { return chunkMIBEMJNS_cjs.toaster; }
 });
-exports.buttonRecipe = buttonRecipe;
-exports.cardRecipe = cardRecipe;
 exports.cn = cn;
-exports.dialogRecipe = dialogRecipe;
-exports.iconButtonRecipe = iconButtonRecipe;
-exports.inputRecipe = inputRecipe;
-exports.switchRecipe = switchRecipe;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map