daisyui 5.0.0-alpha.2 → 5.0.0-alpha.21

package/components/alert.css

@@ -0,0 +1 @@
+/*! 🌼 daisyUI 5.0.0-alpha.21 – MIT License */ .alert{align-items:center;gap:var(--spacing-4,1rem);border-radius:var(--radius-box,var(--radius-box));border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-base-200,var(--color-base-200));padding-top:var(--spacing-3,.75rem);padding-bottom:var(--spacing-3,.75rem);padding-left:var(--spacing-4,1rem);padding-right:var(--spacing-4,1rem);font-size:var(--font-size-sm,.875rem);line-height:var(--tw-leading,var(--font-size-sm--line-height,1.25rem));color:var(--color-base-content,var(--color-base-content));background-color:var(--alert-color,var(--color-base-200));text-align:start;grid-template-columns:auto minmax(auto,1fr);grid-auto-flow:column;justify-content:start;justify-items:start;width:100%;display:grid;&.alert-outline{color:var(--alert-color);background-color:#0000}&.alert-dash{--tw-border-style:dashed;color:var(--alert-color);background-color:#0000;border-style:dashed}&.alert-soft{color:var(--alert-color,var(--color-base-content));background:color-mix(in oklab,var(--alert-color,var(--color-base-content))8%,var(--color-base-200));border-color:color-mix(in oklab,var(--alert-color,var(--color-base-content))10%,var(--color-base-200))}}.alert-info{border-color:var(--color-info,var(--color-info));color:var(--color-info-content,var(--color-info-content));--alert-color:var(--color-info)}.alert-success{border-color:var(--color-success,var(--color-success));color:var(--color-success-content,var(--color-success-content));--alert-color:var(--color-success)}.alert-warning{border-color:var(--color-warning,var(--color-warning));color:var(--color-warning-content,var(--color-warning-content));--alert-color:var(--color-warning)}.alert-error{border-color:var(--color-error,var(--color-error));color:var(--color-error-content,var(--color-error-content));--alert-color:var(--color-error)}.alert-vertical{text-align:center;grid-template-columns:max-content;grid-auto-flow:row;justify-content:center;justify-items:center}.alert-horizontal{text-align:start;grid-template-columns:auto minmax(auto,1fr);grid-auto-flow:column;justify-content:start;justify-items:start}

package/components/avatar/class.json

@@ -0,0 +1,7 @@
+[
+  "avatar-group",
+  "avatar",
+  "avatar-placeholder",
+  "avatar-online",
+  "avatar-offline"
+]

package/components/avatar/index.js

@@ -0,0 +1,4 @@
+import avatar from './object.js';
+export default ({ addComponents }) => {
+	addComponents({...avatar})
+}

package/components/avatar/object.js

@@ -0,0 +1 @@
+export default {".avatar-group":{"@apply flex overflow-hidden":{},":where(.avatar)":{"@apply border-base-100 overflow-hidden rounded-full border-4":{}}},".avatar":{"@apply relative inline-flex align-middle":{},"&>div":{"@apply block aspect-square overflow-hidden":{}},"img":{"@apply h-full w-full object-cover":{}}},".avatar-placeholder":{"&>div":{"@apply flex items-center justify-center":{}}},".avatar-online":{"&:before":{"content":"\"\"","@apply bg-success outline-base-100 absolute z-10 block rounded-full outline outline-2":{},"width":"15%","height":"15%","top":"7%","right":"7%"}},".avatar-offline":{"&:before":{"content":"\"\"","@apply bg-base-300 outline-base-100 absolute z-10 block rounded-full outline outline-2":{},"width":"15%","height":"15%","top":"7%","right":"7%"}}};

package/components/avatar.css

@@ -0,0 +1 @@
+/*! 🌼 daisyUI 5.0.0-alpha.21 – MIT License */ .avatar-group{display:flex;overflow:hidden;& :where(.avatar){border-style:var(--tw-border-style);border-width:4px;border-color:var(--color-base-100,var(--color-base-100));border-radius:3.40282e38px;overflow:hidden}}.avatar{vertical-align:middle;display:inline-flex;position:relative;&>div{aspect-ratio:1;display:block;overflow:hidden}& img{object-fit:cover;width:100%;height:100%}}.avatar-placeholder{&>div{justify-content:center;align-items:center;display:flex}}.avatar-online{&:before{content:"";z-index:10;background-color:var(--color-success,var(--color-success));outline-style:var(--tw-outline-style);outline-width:1px;outline-style:var(--tw-outline-style);outline-width:2px;outline-color:var(--color-base-100,var(--color-base-100));border-radius:3.40282e38px;width:15%;height:15%;display:block;position:absolute;top:7%;right:7%}}.avatar-offline{&:before{content:"";z-index:10;background-color:var(--color-base-300,var(--color-base-300));outline-style:var(--tw-outline-style);outline-width:1px;outline-style:var(--tw-outline-style);outline-width:2px;outline-color:var(--color-base-100,var(--color-base-100));border-radius:3.40282e38px;width:15%;height:15%;display:block;position:absolute;top:7%;right:7%}}

package/components/badge/class.json

@@ -0,0 +1,19 @@
+[
+  "badge",
+  "badge-outline",
+  "badge-dash",
+  "badge-soft",
+  "badge-primary",
+  "badge-secondary",
+  "badge-accent",
+  "badge-neutral",
+  "badge-info",
+  "badge-success",
+  "badge-warning",
+  "badge-error",
+  "badge-ghost",
+  "badge-xs",
+  "badge-sm",
+  "badge-md",
+  "badge-lg"
+]

package/components/badge/index.js

@@ -1,74 +1,4 @@
-export default {
-  ".badge": {
-    "@apply inline-flex items-center justify-center transition duration-200 ease-out h-5 text-sm leading-5 rounded-badge border text-base-content": {},
-    "width": "fit-content",
-    "paddingLeft": "0.563rem",
-    "paddingRight": "0.563rem",
-    "background": "var(--badge-color, var(--color-base-100))",
-    "borderColor": "var(--badge-color, var(--color-base-200))",
-    "&.badge-outline": {
-      "@apply border-current/50 bg-transparent": {},
-      "color": "var(--badge-color, var(--color-base-content))"
-    }
-  },
-  ".badge-faded": {
-    "color": "color-mix(in xyz, var(--badge-color) 80%, var(--color-base-content))",
-    "background": "color-mix(in xyz, var(--badge-color) 10%, var(--color-base-100))",
-    "borderColor": "color-mix(in xyz, var(--badge-color) 7%, transparent)"
-  },
-  ".badge-primary": {
-    "--badge-color": "var(--color-primary)",
-    "@apply text-primary-content": {}
-  },
-  ".badge-secondary": {
-    "--badge-color": "var(--color-secondary)",
-    "@apply text-secondary-content": {}
-  },
-  ".badge-accent": {
-    "--badge-color": "var(--color-accent)",
-    "@apply text-accent-content": {}
-  },
-  ".badge-neutral": {
-    "--badge-color": "var(--color-neutral)",
-    "@apply text-neutral-content": {}
-  },
-  ".badge-info": {
-    "--badge-color": "var(--color-info)",
-    "@apply text-info-content": {}
-  },
-  ".badge-success": {
-    "--badge-color": "var(--color-success)",
-    "@apply text-success-content": {}
-  },
-  ".badge-warning": {
-    "--badge-color": "var(--color-warning)",
-    "@apply text-warning-content": {}
-  },
-  ".badge-error": {
-    "--badge-color": "var(--color-error)",
-    "@apply text-error-content": {}
-  },
-  ".badge-ghost": {
-    "@apply border-base-200 bg-base-200 text-base-content": {}
-  },
-  ".badge-xs": {
-    "@apply h-3 text-xs leading-3": {},
-    "paddingLeft": "0.313rem",
-    "paddingRight": "0.313rem"
-  },
-  ".badge-sm": {
-    "@apply h-4 text-xs leading-4": {},
-    "paddingLeft": "0.438rem",
-    "paddingRight": "0.438rem"
-  },
-  ".badge-md": {
-    "@apply h-5 text-sm leading-5": {},
-    "paddingLeft": "0.563rem",
-    "paddingRight": "0.563rem"
-  },
-  ".badge-lg": {
-    "@apply h-6 text-base leading-6": {},
-    "paddingLeft": "0.688rem",
-    "paddingRight": "0.688rem"
-  }
-};
+import badge from './object.js';
+export default ({ addComponents }) => {
+	addComponents({...badge})
+}

package/components/badge/object.js

@@ -0,0 +1 @@
+export default {".badge":{"@apply inline-flex items-center justify-center h-5 text-xs leading-5 rounded-badge border text-base-content align-middle box-content gap-2":{},"width":"fit-content","paddingLeft":"0.563rem","paddingRight":"0.563rem","transitionProperty":"color, background-color, box-shadow","background":"var(--badge-color, var(--color-base-100))","borderColor":"var(--badge-color, var(--color-base-200))","&.badge-outline":{"color":"var(--badge-color, var(--color-base-content))","@apply border-current bg-transparent":{}},"&.badge-dash":{"color":"var(--badge-color, var(--color-base-content))","@apply border-current bg-transparent border-dashed":{}},"&.badge-soft":{"color":"var(--badge-color, var(--color-base-content))","background":"color-mix(in oklab, var(--badge-color, var(--color-base-content)) 8%, var(--color-base-100))","borderColor":"color-mix(in oklab, var(--badge-color, var(--color-base-content)) 10%, var(--color-base-100))"}},".badge-primary":{"--badge-color":"var(--color-primary)","@apply text-primary-content":{}},".badge-secondary":{"--badge-color":"var(--color-secondary)","@apply text-secondary-content":{}},".badge-accent":{"--badge-color":"var(--color-accent)","@apply text-accent-content":{}},".badge-neutral":{"--badge-color":"var(--color-neutral)","@apply text-neutral-content":{}},".badge-info":{"--badge-color":"var(--color-info)","@apply text-info-content":{}},".badge-success":{"--badge-color":"var(--color-success)","@apply text-success-content":{}},".badge-warning":{"--badge-color":"var(--color-warning)","@apply text-warning-content":{}},".badge-error":{"--badge-color":"var(--color-error)","@apply text-error-content":{}},".badge-ghost":{"@apply border-base-200 bg-base-200 text-base-content":{}},".badge-xs":{"@apply h-4 px-2":{},"fontSize":"0.625rem"},".badge-sm":{"@apply h-5 px-2.5":{},"fontSize":"0.75rem"},".badge-md":{"@apply h-6 px-3":{},"fontSize":"0.875rem"},".badge-lg":{"@apply h-8 px-4":{},"fontSize":"1rem"}};

package/components/badge.css

@@ -1,109 +1 @@
-.badge {
-    display: inline-flex;
-    height: var(--spacing-5, 1.25rem);
-    align-items: center;
-    justify-content: center;
-    border-radius: var(--radius-badge, 1.9rem);
-    border-style: var(--tw-border-style);
-    border-width: 1px;
-    font-size: var(--font-size-sm, 0.875rem);
-    line-height: var(--tw-leading, var(--font-size-sm--line-height, 1.25rem));
-    --tw-leading: var(--line-height-5, 1.25rem);
-    line-height: var(--line-height-5, 1.25rem);
-    color: var(--color-base-content, oklch(27.8078% 0.029596 256.84795));
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;
-    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
-    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
-    --tw-duration: 200ms;
-    transition-duration: 200ms;
-    --tw-ease: var(--transition-timing-function-out, cubic-bezier(0, 0, 0.2, 1));
-    transition-timing-function: var(--transition-timing-function-out, cubic-bezier(0, 0, 0.2, 1));
-    width: fit-content;
-    padding-left: 0.563rem;
-    padding-right: 0.563rem;
-    background: var(--badge-color, var(--color-base-100));
-    border-color: var(--badge-color, var(--color-base-200));
-    &.badge-outline {
-      border-color: color-mix(in srgb, currentColor 50%, transparent);
-      background-color: transparent;
-      color: var(--badge-color, var(--color-base-content));
-    }
-  }
-  .badge-faded {
-    color: color-mix(in xyz, var(--badge-color) 80%, var(--color-base-content));
-    background: color-mix(in xyz, var(--badge-color) 10%, var(--color-base-100));
-    border-color: color-mix(in xyz, var(--badge-color) 7%, transparent);
-  }
-  .badge-primary {
-    --badge-color: var(--color-primary);
-    color: var(--color-primary-content, oklch(89.824% 0.06192 275.75));
-  }
-  .badge-secondary {
-    --badge-color: var(--color-secondary);
-    color: var(--color-secondary-content, oklch(98.71% 0.0106 342.55));
-  }
-  .badge-accent {
-    --badge-color: var(--color-accent);
-    color: var(--color-accent-content, oklch(15.352% 0.0368 183.61));
-  }
-  .badge-neutral {
-    --badge-color: var(--color-neutral);
-    color: var(--color-neutral-content, oklch(89.4994% 0.011585 252.096176));
-  }
-  .badge-info {
-    --badge-color: var(--color-info);
-    color: var(--color-info-content, oklch(0% 0 0));
-  }
-  .badge-success {
-    --badge-color: var(--color-success);
-    color: var(--color-success-content, oklch(0% 0 0));
-  }
-  .badge-warning {
-    --badge-color: var(--color-warning);
-    color: var(--color-warning-content, oklch(0% 0 0));
-  }
-  .badge-error {
-    --badge-color: var(--color-error);
-    color: var(--color-error-content, oklch(0% 0 0));
-  }
-  .badge-ghost {
-    border-color: var(--color-base-200, oklch(96.1151% 0 0));
-    background-color: var(--color-base-200, oklch(96.1151% 0 0));
-    color: var(--color-base-content, oklch(27.8078% 0.029596 256.84795));
-  }
-  .badge-xs {
-    height: var(--spacing-3, 0.75rem);
-    font-size: var(--font-size-xs, 0.75rem);
-    line-height: var(--tw-leading, var(--font-size-xs--line-height, 1rem));
-    --tw-leading: var(--line-height-3, 0.75rem);
-    line-height: var(--line-height-3, 0.75rem);
-    padding-left: 0.313rem;
-    padding-right: 0.313rem;
-  }
-  .badge-sm {
-    height: var(--spacing-4, 1rem);
-    font-size: var(--font-size-xs, 0.75rem);
-    line-height: var(--tw-leading, var(--font-size-xs--line-height, 1rem));
-    --tw-leading: var(--line-height-4, 1rem);
-    line-height: var(--line-height-4, 1rem);
-    padding-left: 0.438rem;
-    padding-right: 0.438rem;
-  }
-  .badge-md {
-    height: var(--spacing-5, 1.25rem);
-    font-size: var(--font-size-sm, 0.875rem);
-    line-height: var(--tw-leading, var(--font-size-sm--line-height, 1.25rem));
-    --tw-leading: var(--line-height-5, 1.25rem);
-    line-height: var(--line-height-5, 1.25rem);
-    padding-left: 0.563rem;
-    padding-right: 0.563rem;
-  }
-  .badge-lg {
-    height: var(--spacing-6, 1.5rem);
-    font-size: var(--font-size-base, 1rem);
-    line-height: var(--tw-leading, var(--font-size-base--line-height, 1.5rem));
-    --tw-leading: var(--line-height-6, 1.5rem);
-    line-height: var(--line-height-6, 1.5rem);
-    padding-left: 0.688rem;
-    padding-right: 0.688rem;
-  }
+/*! 🌼 daisyUI 5.0.0-alpha.21 – MIT License */ .badge{box-sizing:content-box;height:var(--spacing-5,1.25rem);justify-content:center;align-items:center;gap:var(--spacing-2,.5rem);border-radius:var(--radius-badge,var(--radius-badge));border-style:var(--tw-border-style);vertical-align:middle;font-size:var(--font-size-xs,.75rem);line-height:var(--tw-leading,var(--font-size-xs--line-height,1rem));--tw-leading:var(--line-height-5,1.25rem);line-height:var(--line-height-5,1.25rem);color:var(--color-base-content,var(--color-base-content));background:var(--badge-color,var(--color-base-100));border-width:1px;border-color:var(--badge-color,var(--color-base-200));width:fit-content;padding-left:.563rem;padding-right:.563rem;transition-property:color,background-color,box-shadow;display:inline-flex;&.badge-outline{color:var(--badge-color,var(--color-base-content));background-color:#0000;border-color:currentColor}&.badge-dash{color:var(--badge-color,var(--color-base-content));--tw-border-style:dashed;background-color:#0000;border-style:dashed;border-color:currentColor}&.badge-soft{color:var(--badge-color,var(--color-base-content));background:color-mix(in oklab,var(--badge-color,var(--color-base-content))8%,var(--color-base-100));border-color:color-mix(in oklab,var(--badge-color,var(--color-base-content))10%,var(--color-base-100))}}.badge-primary{--badge-color:var(--color-primary);color:var(--color-primary-content,var(--color-primary-content))}.badge-secondary{--badge-color:var(--color-secondary);color:var(--color-secondary-content,var(--color-secondary-content))}.badge-accent{--badge-color:var(--color-accent);color:var(--color-accent-content,var(--color-accent-content))}.badge-neutral{--badge-color:var(--color-neutral);color:var(--color-neutral-content,var(--color-neutral-content))}.badge-info{--badge-color:var(--color-info);color:var(--color-info-content,var(--color-info-content))}.badge-success{--badge-color:var(--color-success);color:var(--color-success-content,var(--color-success-content))}.badge-warning{--badge-color:var(--color-warning);color:var(--color-warning-content,var(--color-warning-content))}.badge-error{--badge-color:var(--color-error);color:var(--color-error-content,var(--color-error-content))}.badge-ghost{border-color:var(--color-base-200,var(--color-base-200));background-color:var(--color-base-200,var(--color-base-200));color:var(--color-base-content,var(--color-base-content))}.badge-xs{height:var(--spacing-4,1rem);padding-left:var(--spacing-2,.5rem);padding-right:var(--spacing-2,.5rem);font-size:.625rem}.badge-sm{height:var(--spacing-5,1.25rem);padding-left:var(--spacing-2_5,.625rem);padding-right:var(--spacing-2_5,.625rem);font-size:.75rem}.badge-md{height:var(--spacing-6,1.5rem);padding-left:var(--spacing-3,.75rem);padding-right:var(--spacing-3,.75rem);font-size:.875rem}.badge-lg{height:var(--spacing-8,2rem);padding-left:var(--spacing-4,1rem);padding-right:var(--spacing-4,1rem);font-size:1rem}

package/components/button/class.json

@@ -0,0 +1,27 @@
+[
+  "btn",
+  "2",
+  "btn-active",
+  "btn-primary",
+  "btn-secondary",
+  "btn-accent",
+  "btn-neutral",
+  "btn-info",
+  "btn-success",
+  "btn-warning",
+  "btn-error",
+  "glass",
+  "btn-ghost",
+  "btn-link",
+  "btn-outline",
+  "btn-dash",
+  "btn-soft",
+  "btn-square",
+  "btn-xs",
+  "btn-sm",
+  "btn-md",
+  "btn-lg",
+  "btn-circle",
+  "btn-wide",
+  "btn-block"
+]

package/components/button/index.js

@@ -1,170 +1,4 @@
-export default {
-  ".btn": {
-    "@apply text-base-content outline-base-content inline-flex shrink-0 cursor-pointer flex-wrap items-center justify-center gap-2 rounded-[var(--radius-btn)] text-center text-sm/none font-semibold no-underline outline-offset-2 duration-200 ease-out select-none align-middle h-10 px-4": {},
-    "transitionProperty": "color, background-color, border-color, opacity, box-shadow, transform",
-    "backgroundColor": "var(--btn-bg, var(--color-base-200))",
-    "borderWidth": "var(--spacing-button-border)",
-    "borderColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 2%)",
-    "borderBottomColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 4%)",
-    "boxShadow": "0 1px 0 0 color-mix(in oklch, white 3%, transparent) inset,\n    0 1px 1px 0 oklch(0% 0 0/0.07)",
-    "&:hover": {
-      "borderColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 5%)",
-      "borderBottomColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 7%)",
-      "backgroundColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 5%)"
-    },
-    "&.btn-active": {
-      "borderColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 5%)",
-      "borderBottomColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 7%)",
-      "backgroundColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 5%)"
-    },
-    "&:focus-visible": {
-      "@apply outline outline-2": {}
-    },
-    "&:active": {
-      "&:focus": {
-        "transform": "scale(var(--btn-focus-scale, 0.98))",
-        "@apply animate-[button-pop_0s_ease-out]": {},
-        "borderColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 5%)",
-        "borderBottomColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 7%)",
-        "boxShadow": "0 1px 0 0 oklch(0% 0 0/0.07) inset,\n        0 0 0 0 oklch(0% 0 0/0.1)"
-      },
-      "&:hover": {
-        "transform": "scale(var(--btn-focus-scale, 0.97))",
-        "@apply animate-[button-pop_0s_ease-out]": {}
-      }
-    },
-    "&:is(:disabled, [disabled], .btn-disabled)": {
-      "@apply bg-neutral/20 text-base-content/20 pointer-events-none border-transparent": {},
-      "&:hover": {
-        "@apply bg-neutral/20 text-base-content/20 pointer-events-none border-transparent": {}
-      }
-    },
-    "&:is(input[type=checkbox]),\n  &:is(input[type=radio])": {
-      "@apply w-auto appearance-none": {},
-      "&::after": {
-        "@apply content-[attr(aria-label)]": {}
-      },
-      "&:checked": {
-        "@apply border-primary bg-primary text-primary-content": {},
-        "&:focus-visible": {
-          "@apply outline-primary": {}
-        },
-        "&:hover": {
-          "backgroundColor": "color-mix(in oklab, var(--color-primary) 90%, black)",
-          "borderColor": "color-mix(in oklab, var(--color-primary) 90%, black)"
-        }
-      }
-    }
-  },
-  ".btn-primary": {
-    "--btn-bg": "var(--color-primary)",
-    "@apply text-primary-content outline-primary": {}
-  },
-  ".btn-secondary": {
-    "--btn-bg": "var(--color-secondary)",
-    "@apply text-secondary-content outline-secondary": {}
-  },
-  ".btn-accent": {
-    "--btn-bg": "var(--color-accent)",
-    "@apply text-accent-content outline-accent": {}
-  },
-  ".btn-neutral": {
-    "--btn-bg": "var(--color-neutral)",
-    "@apply text-neutral-content outline-neutral": {}
-  },
-  ".btn-info": {
-    "--btn-bg": "var(--color-info)",
-    "@apply text-info-content outline-info": {}
-  },
-  ".btn-success": {
-    "--btn-bg": "var(--color-success)",
-    "@apply text-success-content outline-success": {}
-  },
-  ".btn-warning": {
-    "--btn-bg": "var(--color-warning)",
-    "@apply text-warning-content outline-warning": {}
-  },
-  ".btn-error": {
-    "--btn-bg": "var(--color-error)",
-    "@apply text-error-content outline-error": {}
-  },
-  ".btn.glass": {
-    "@apply shadow-none outline-current hover:[--glass-border-opacity:15%] hover:[--glass-opacity:25%]": {},
-    "&.btn-active": {
-      "--glass-border-opacity": "15%",
-      "--glass-opacity": "25%"
-    }
-  },
-  ".btn-ghost": {
-    "@apply hover:bg-base-content/20 border border-transparent bg-transparent text-current shadow-none outline-current hover:border-transparent": {},
-    "&.btn-active": {
-      "@apply bg-base-content/20 border-transparent": {}
-    }
-  },
-  ".btn-link": {
-    "@apply text-primary border-transparent bg-transparent underline shadow-none outline-current hover:border-transparent hover:bg-transparent hover:underline": {},
-    "&.btn-active": {
-      "@apply border-transparent bg-transparent underline": {}
-    }
-  },
-  ".btn-outline": {
-    "&:not(.btn-active):not(:hover)": {
-      "@apply bg-transparent text-[var(--btn-bg)] shadow-none": {}
-    },
-    "&.btn-active": {
-      "borderColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)) 90%, black)",
-      "backgroundColor": "color-mix(in oklab, var(--btn-bg, var(--color-base-200)) 90%, black)"
-    }
-  },
-  ".btn-xs": {
-    "@apply h-6 px-2": {},
-    "fontSize": "var(--font-size-xs)"
-  },
-  ".btn-sm": {
-    "@apply h-8 px-3": {},
-    "fontSize": "var(--font-size-sm)"
-  },
-  ".btn-md": {
-    "@apply h-10 px-4": {},
-    "fontSize": "var(--font-size-sm)"
-  },
-  ".btn-lg": {
-    "@apply h-14 px-6": {},
-    "fontSize": "var(--font-size-lg)"
-  },
-  ".btn-square": {
-    "@apply px-0 size-12": {},
-    "&.btn-xs": {
-      "@apply size-6": {}
-    },
-    "&.btn-sm": {
-      "@apply size-8": {}
-    },
-    "&.btn-md": {
-      "@apply size-12": {}
-    },
-    "&.btn-lg": {
-      "@apply size-16": {}
-    }
-  },
-  ".btn-circle": {
-    "@apply aspect-square rounded-full px-0": {}
-  },
-  ".btn-wide": {
-    "@apply w-64": {}
-  },
-  ".btn-block": {
-    "@apply w-full": {}
-  },
-  "@keyframes button-pop": {
-    "0%": {
-      "transform": "scale(var(--btn-focus-scale, 0.98))"
-    },
-    "40%": {
-      "transform": "scale(1.02)"
-    },
-    "100%": {
-      "transform": "scale(1)"
-    }
-  }
-};
+import button from './object.js';
+export default ({ addComponents }) => {
+	addComponents({...button})
+}

package/components/button/object.js

@@ -0,0 +1 @@
+export default {".btn":{"@apply text-base-content outline-base-content inline-flex shrink-0 cursor-pointer flex-wrap items-center justify-center gap-2 text-center text-sm/none font-semibold no-underline outline-offset-2 select-none align-middle h-10 px-4":{},"transitionProperty":"color, background-color, background-image, border-color, opacity, box-shadow, scale","transitionTimingFunction":"cubic-bezier(0, 0, 0.2, 1)","transitionDuration":".2s","borderStartStartRadius":"var(--radius-join-start-start, var(--radius-btn))","borderStartEndRadius":"var(--radius-join-start-end, var(--radius-btn))","borderEndStartRadius":"var(--radius-join-end-start, var(--radius-btn))","borderEndEndRadius":"var(--radius-join-end-end, var(--radius-btn))","--btn-color":"var(--btn-bg, var(--color-base-200))","backgroundColor":"var(--btn-color)","borderWidth":"var(--spacing-button-border, 1px)","borderColor":"color-mix(in oklab, var(--btn-color), black 2%)","boxShadow":"0 0 0 0.5px oklch(1 0 0 / 0.01) inset, var(--btn-shadow)","backgroundOrigin":"border-box","backgroundImage":"var(--btn-flare)","--btn-shadow":"0 1px 1px 0 oklch(0% 0 0/0.07)","--btn-flare":"linear-gradient(50deg, transparent 85%, color-mix(in oklab, var(--btn-color), white 5%)),\n    linear-gradient(-50deg, transparent 85%, color-mix(in oklab, var(--btn-color), white 5%)),\n    linear-gradient(0, transparent, var(--btn-color) 5% 95%, transparent),\n    repeating-conic-gradient(oklch(100% 0 0 / .4),\n      transparent 20% 30%,\n      oklch(100% 0 0 / .4) 50%)","&:hover":{"--btn-color":"color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 5%)"},"&.btn-active":{"--btn-color":"color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 5%)","--btn-shadow":"0 0 0 0 oklch(0% 0 0/0.07)"},"&:focus-visible":{"@apply outline outline-2":{}},"&:active":{"&:focus":{"scale":"var(--btn-focus-scale, 0.98)","@apply animate-[button-pop_0s_ease-out]":{},"backgroundColor":"color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 5%)","borderColor":"color-mix(in oklab, var(--btn-bg, var(--color-base-200)), black 7%)","--btn-shadow":"0 0 0 0 oklch(0% 0 0/0.07)"},"&:hover":{"scale":"var(--btn-focus-scale, 0.97)","@apply animate-[button-pop_0s_ease-out]":{}}},"&:is(:disabled, [disabled], .btn-disabled)":{"@apply bg-neutral/20 text-base-content/20 pointer-events-none border-transparent":{},"--btn-flare":"unset","&:hover":{"@apply bg-neutral/20 text-base-content/20 pointer-events-none border-transparent":{}}},"&:is(input[type=checkbox]),\n  &:is(input[type=radio])":{"@apply appearance-none":{},"&:not(.btn-square, .btn-circle)":{"@apply w-auto":{}},"&::after":{"@apply content-[attr(aria-label)]":{}},"&:checked":{"--btn-bg":"var(--color-primary)","@apply border-primary bg-primary text-primary-content":{},"&:focus-visible":{"@apply outline-primary":{}},"&:hover":{"backgroundColor":"color-mix(in oklab, var(--color-primary) 90%, black)","borderColor":"color-mix(in oklab, var(--color-primary) 90%, black)"}}}},".btn-primary":{"--btn-bg":"var(--color-primary)","@apply text-primary-content outline-primary":{}},".btn-secondary":{"--btn-bg":"var(--color-secondary)","@apply text-secondary-content outline-secondary":{}},".btn-accent":{"--btn-bg":"var(--color-accent)","@apply text-accent-content outline-accent":{}},".btn-neutral":{"--btn-bg":"var(--color-neutral)","@apply text-neutral-content outline-neutral":{}},".btn-info":{"--btn-bg":"var(--color-info)","@apply text-info-content outline-info":{}},".btn-success":{"--btn-bg":"var(--color-success)","@apply text-success-content outline-success":{}},".btn-warning":{"--btn-bg":"var(--color-warning)","@apply text-warning-content outline-warning":{}},".btn-error":{"--btn-bg":"var(--color-error)","@apply text-error-content outline-error":{}},".btn.glass":{"@apply shadow-none outline-current hover:[--glass-border-opacity:15%] hover:[--glass-opacity:25%]":{},"&.btn-active":{"--glass-border-opacity":"15%","--glass-opacity":"25%"}},".btn-ghost":{"@apply border border-transparent bg-transparent text-current shadow-none outline-current":{},"--btn-flare":"unset"},".btn-link":{"@apply text-primary border-transparent bg-transparent underline shadow-none outline-current hover:border-transparent hover:bg-transparent hover:underline":{},"--btn-flare":"unset","&.btn-active":{"@apply border-transparent bg-transparent underline":{}}},".btn-outline":{"&:not(.btn-active, :hover, :focus-visible)":{"@apply bg-transparent text-[var(--btn-bg)] shadow-none":{},"--btn-flare":"unset"}},".btn-dash":{"&:not(.btn-active, :hover, :focus-visible)":{"@apply bg-transparent text-[var(--btn-bg)] shadow-none border-dashed":{},"--btn-flare":"unset"}},".btn-soft":{"&:not(.btn-active, :hover, :focus-visible)":{"@apply shadow-none":{},"color":"var(--btn-bg, var(--color-base-content))","background":"color-mix(in oklab, var(--btn-bg, var(--color-base-content)) 8%, var(--color-base-200))","borderColor":"color-mix(in oklab, var(--btn-bg, var(--color-base-content)) 10%, var(--color-base-200))","--btn-flare":"unset"}},".btn-xs":{"@apply h-6 px-2":{},"fontSize":"var(--font-size-xs)"},".btn-sm":{"@apply h-8 px-3":{},"fontSize":"var(--font-size-sm)"},".btn-md":{"@apply h-10 px-4":{},"fontSize":"var(--font-size-sm)"},".btn-lg":{"@apply h-14 px-6":{},"fontSize":"var(--font-size-lg)"},".btn-square":{"@apply px-0 size-12":{},"&.btn-xs":{"@apply size-6":{}},"&.btn-sm":{"@apply size-8":{}},"&.btn-md":{"@apply size-12":{}},"&.btn-lg":{"@apply size-16":{}}},".btn-circle":{"@apply aspect-square rounded-full px-0":{}},".btn-wide":{"@apply w-64":{}},".btn-block":{"@apply w-full":{}},"@keyframes button-pop":{"0%":{"scale":"var(--btn-focus-scale, 0.98)"},"40%":{"scale":"1.02"},"100%":{"scale":"1"}}};