athameui 0.0.10 → 0.0.12

package/dist/athameui.mjs

@@ -2159,7 +2159,8 @@ const buttonVariants = {
     outline: "ath-button-outline",
     ghost: "ath-button-ghost"
   },
-  dark: "ath-button-dark"
+  dark: "ath-button-dark",
+  wrap: "ath-button-wrap"
 };
 
 const Button = /*#__PURE__*/forwardRef(({
@@ -2174,6 +2175,7 @@ const Button = /*#__PURE__*/forwardRef(({
   type = "button",
   textPosition = "center",
   variant = "secondary",
+  wrap = false,
   onBlur,
   onClick,
   onFocus,
@@ -2183,7 +2185,7 @@ const Button = /*#__PURE__*/forwardRef(({
   ...other
 }, ref) => {
   const isIconOnly = icon && !children;
-  const sharedClasses = cx("ath-button", buttonVariants.size[size], buttonVariants.variant[variant], isIconOnly ? "ath-button-icon-only" : "", dark ? buttonVariants.dark : "");
+  const sharedClasses = cx("ath-button", buttonVariants.size[size], buttonVariants.variant[variant], isIconOnly ? "ath-button-icon-only" : "", dark ? buttonVariants.dark : "", wrap ? buttonVariants.wrap : "");
   const buttonClasses = cx(sharedClasses, buttonVariants.textPosition[textPosition], typeof className === "object" && className !== null ? className.button : className);
   const onClickHandler = e => {
     onClick?.(e);
@@ -2562,7 +2564,7 @@ const ButtonGroup = ({
 const Carousel = ({
   children,
   className,
-  emptyMessage,
+  emptyMessage = "Nothing here yet",
   sx
 }) => {
   const [isHovered, setIsHovered] = useState(false);
@@ -2608,7 +2610,10 @@ const Carousel = ({
           icon: Qt,
           size: 36
         })
-      }), hasItems ? children : emptyMessage, jsx(Button, {
+      }), hasItems ? children : jsx("div", {
+        className: "ath-carousel-empty",
+        children: emptyMessage
+      }), jsx(Button, {
         className: {
           button: "ath-carousel-arrow ath-carousel-right-arrow"
         },
@@ -2748,7 +2753,7 @@ const FormField = ({
   ...other
 }) => {
   const textAreaRef = useRef(null);
-  const containerClasses = cx("ath-form-input-container", (labelPosition === "left" || labelPosition === "right") && "ath-form-input-container-horizontal", className?.container ? className.container : "");
+  const containerClasses = cx("ath-form-input-container", readOnly && "ath-form-input-container-readonly", (labelPosition === "left" || labelPosition === "right") && "ath-form-input-container-horizontal", className?.container ? className.container : "");
   const inputSharedClasses = cx(`ath-form-input-${size}`, disabled && "ath-form-input-shared-disabled", readOnly && "ath-form-input-shared-readonly", dark && "ath-form-input-shared-dark", className?.input ? className.input : "");
   const inputClasses = cx("ath-form-input", inputSharedClasses, error && "ath-form-input-error");
   const textAreaClasses = cx("ath-form-textarea", inputSharedClasses, autoResize && "ath-form-textarea-auto-resize", error && "ath-form-textarea-error");
@@ -3199,6 +3204,24 @@ const breakpoints = {
   "3xl": 1280,
   "4xl": 1536
 };
+const minWidth = width => `@media (min-width: ${width}px)`;
+const maxWidth = width => `@media (max-width: ${width - 1}px)`;
+const minXs = minWidth(breakpoints.xs);
+const minSm = minWidth(breakpoints.sm);
+const minMd = minWidth(breakpoints.md);
+const minLg = minWidth(breakpoints.lg);
+const minXl = minWidth(breakpoints.xl);
+const min2xl = minWidth(breakpoints["2xl"]);
+const min3xl = minWidth(breakpoints["3xl"]);
+const min4xl = minWidth(breakpoints["4xl"]);
+const maxXs = maxWidth(breakpoints.xs);
+const maxSm = maxWidth(breakpoints.sm);
+const maxMd = maxWidth(breakpoints.md);
+const maxLg = maxWidth(breakpoints.lg);
+const maxXl = maxWidth(breakpoints.xl);
+const max2xl = maxWidth(breakpoints["2xl"]);
+const max3xl = maxWidth(breakpoints["3xl"]);
+const max4xl = maxWidth(breakpoints["4xl"]);
 
 const tokens = {
   font: {
@@ -3370,5 +3393,5 @@ const tokens = {
   }
 };
 
-export { Accordion, AccordionItem, Avatar, Block, Button, ButtonGroup, Carousel, ContainerScalingText, Dropdown, Footer, FormField, FormLabel, FormTextInput, Header, List, ListItem, Main, Modal, ScrollToTopButton, Search, SlideOut, breakpoints, cx, tokens };
+export { Accordion, AccordionItem, Avatar, Block, Button, ButtonGroup, Carousel, ContainerScalingText, Dropdown, Footer, FormField, FormLabel, FormTextInput, Header, List, ListItem, Main, Modal, ScrollToTopButton, Search, SlideOut, breakpoints, cx, max2xl, max3xl, max4xl, maxLg, maxMd, maxSm, maxXl, maxXs, min2xl, min3xl, min4xl, minLg, minMd, minSm, minXl, minXs, tokens };
 //# sourceMappingURL=athameui.mjs.map