welcome-ui 10.1.11 → 10.1.13

package/dist/Button.css

@@ -1 +1 @@
-@property --gradient-angle{syntax: "<angle>"; initial-value: -60deg; inherits: true;}@keyframes _rotate-gradient_8wg4f_1{to{--gradient-angle: 300deg}}@layer components{._root_8wg4f_12{position:relative;display:inline-flex;white-space:nowrap;flex-shrink:0;align-items:center;justify-content:center;border-style:solid;cursor:pointer;border-radius:var(--border-radius-md);transition-property:all;transition-duration:var(--duration-medium);transition-timing-function:ease-in-out;outline:transparent solid var(--border-width-md);font-weight:var(--font-weight-semi-bold);font-family:var(--font-family-body);line-height:var(--font-line-height-xs);height:var(--buttonHeight);padding-inline:var(--buttonPaddingInline);font-size:var(--buttonFontSize);color:var(--buttonColor, var(--color-neutral-90));background:var(--buttonBackground);border-width:var(--buttonBorderWidth, 0);border-color:var(--buttonBorderColor, transparent);box-shadow:var(--buttonBoxShadow, none);gap:var(--buttonGap)}._root_8wg4f_12[data-focus-visible],._root_8wg4f_12:focus-visible{outline-width:var(--button-border-width-focused);outline-color:var(--buttonOutlineColorFocus)}@media (hover: hover) and (pointer: fine){._root_8wg4f_12:hover:not(:disabled):not([aria-disabled]){box-shadow:var(--elevation-20);--buttonBackground: var(--buttonBackgroundHover);--buttonBorderColor: var(--buttonBorderColorHover, transparent);--buttonColor: var(--buttonColorHover)}}._root_8wg4f_12:active:not(:disabled):not([aria-disabled]){--buttonBackground: var(--buttonBackgroundActive);--buttonBorderColor: var(--buttonBorderColorActive, transparent);--buttonColor: var(--buttonColorPressed)}._root_8wg4f_12:disabled,._root_8wg4f_12[aria-disabled]{--buttonBorderColor: var(--buttonBorderColorDisabled, transparent);--buttonColor: var(--buttonColorDisabled);--buttonBackground: var(--buttonBackgroundDisabled);cursor:not-allowed}._root_8wg4f_12 i.wui-icon-font,._root_8wg4f_12 svg{font-weight:initial;width:var(--buttonIconSize);height:var(--buttonIconSize);font-size:var(--buttonIconSize)}._root_8wg4f_12:has(svg:only-child),._root_8wg4f_12:has(i._wui-icon-font_8wg4f_66:only-child){width:var(--buttonHeight);--buttonPaddingInline: 0}._size-sm_8wg4f_77{--buttonFontSize: var(--font-size-14);--buttonHeight: var(--button-size-max-height-sm);--buttonPaddingInline: var(--button-padding-inline-sm);--buttonIconSize: var(--button-size-icon-sm);--buttonGap: var(--button-gap-content-sm)}._size-md_8wg4f_84{--buttonFontSize: var(--font-size-14);--buttonHeight: var(--button-size-max-height-md);--buttonPaddingInline: var(--button-padding-inline-md);--buttonIconSize: var(--button-size-icon-md);--buttonGap: var(--button-gap-content-md)}._size-lg_8wg4f_91{--buttonFontSize: var(--font-size-16);--buttonHeight: var(--button-size-max-height-lg);--buttonPaddingInline: var(--button-padding-inline-lg);--buttonIconSize: var(--button-size-icon-lg);--buttonGap: var(--button-gap-content-lg)}._variant-primary_8wg4f_98{--buttonBackground: var(--button-color-background-primary-main-default);--buttonBackgroundActive: var(--button-color-background-primary-main-pressed);--buttonBackgroundHover: var(--button-color-background-primary-main-hover);--buttonOutlineColorFocus: var(--button-color-border-focused);--buttonColorDisabled: var(--button-color-text-primary-main-disabled);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-primary-main-disabled) 2.5px, var(--button-color-background-primary-main-disabled) 5.25px) padding-box}._variant-primary-neutral_8wg4f_106{--buttonBackground: var(--button-color-background-primary-neutral-default);--buttonBackgroundActive: var(--button-color-background-primary-neutral-pressed);--buttonBackgroundHover: var(--button-color-background-primary-neutral-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-primary-neutral-disabled) 2.5px, var(--button-color-background-primary-neutral-disabled) 5.25px) padding-box;--buttonColor: var(--button-color-text-primary-neutral-default);--buttonColorDisabled: var(--button-color-text-primary-neutral-disabled);--buttonColorHover: var(--button-color-text-primary-neutral-hover);--buttonColorPressed: var(--button-color-text-primary-neutral-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused)}._variant-primary-ai_8wg4f_117{--buttonBackground: linear-gradient(var(--button-color-background-primary-ai-default) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundActive: linear-gradient(var(--button-color-background-primary-ai-pressed) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundHover: linear-gradient(var(--button-color-background-primary-ai-hover) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-primary-ai-disabled) 2.5px, var(--button-color-background-primary-ai-disabled) 5.25px) padding-box, linear-gradient( 107.75deg, var(--color-neutral-30) 0%, var(--color-neutral-50) 20%, var(--color-neutral-40) 40%, var(--color-neutral-50) 60%, var(--color-neutral-60) 80%, var(--color-neutral-50) 100% ) border-box;--buttonBorderWidth: var(--button-border-width-ai);--buttonColor: var(--button-color-text-primary-ai-default);--buttonColorDisabled: var(--button-color-text-primary-ai-disabled);--buttonColorHover: var(--button-color-text-primary-ai-hover);--buttonColorPressed: var(--button-color-text-primary-ai-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused);animation:_rotate-gradient_8wg4f_1 3s linear infinite paused}@media (hover: hover) and (pointer: fine){._variant-primary-ai_8wg4f_117:hover:not(:disabled):not([aria-disabled]){animation-play-state:running}}._variant-primary-ai_8wg4f_117:focus-visible{animation-play-state:running}._variant-primary-danger_8wg4f_149{--buttonBackground: var(--button-color-background-primary-danger-default);--buttonBackgroundActive: var(--button-color-background-primary-danger-pressed);--buttonBackgroundHover: var(--button-color-background-primary-danger-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-primary-danger-disabled) 2.5px, var(--button-color-background-primary-danger-disabled) 5.25px) padding-box;--buttonColor: var(--button-color-text-primary-danger-default);--buttonColorDisabled: var(--button-color-text-primary-danger-disabled);--buttonColorHover: var(--button-color-text-primary-danger-hover);--buttonColorPressed: var(--button-color-text-primary-danger-pressed);--buttonBorderWidth: var(--button-border-width-secondary);--buttonOutlineColorFocus: var(--button-color-border-focused)}._variant-secondary_8wg4f_161{--buttonBackground: var(--button-color-background-secondary-main-default);--buttonBackgroundActive: var(--button-color-background-secondary-main-pressed);--buttonBackgroundHover: var(--button-color-background-secondary-main-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-secondary-main-disabled) 2.5px, var(--button-color-background-secondary-main-disabled) 5.25px) padding-box;--buttonColor: var(--button-color-text-secondary-main-default);--buttonColorDisabled: var(--button-color-text-secondary-main-disabled);--buttonColorHover: var(--button-color-text-secondary-main-hover);--buttonColorPressed: var(--button-color-text-secondary-main-pressed);--buttonBorderWidth: var(--button-border-width-secondary);--buttonBorderColor: var(--button-color-border-secondary-main-default);--buttonBorderColorHover: var(--button-color-border-secondary-main-hover);--buttonBorderColorActive: var(--button-color-border-secondary-main-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused)}._variant-secondary-danger_8wg4f_176{--buttonBackground: var(--button-color-background-secondary-danger-default);--buttonBackgroundActive: var(--button-color-background-secondary-danger-pressed);--buttonBackgroundHover: var(--button-color-background-secondary-danger-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-secondary-danger-disabled) 2.5px, var(--button-color-background-secondary-danger-disabled) 5.25px) padding-box;--buttonColor: var(--button-color-text-secondary-danger-default);--buttonColorDisabled: var(--button-color-text-secondary-danger-disabled);--buttonColorHover: var(--button-color-text-secondary-danger-hover);--buttonColorPressed: var(--button-color-text-secondary-danger-pressed);--buttonBorderWidth: var(--button-border-width-secondary);--buttonBorderColor: var(--button-color-border-secondary-danger-default);--buttonBorderColorHover: var(--button-color-border-secondary-danger-hover);--buttonBorderColorActive: var(--button-color-border-secondary-danger-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused)}._variant-tertiary_8wg4f_191{--buttonBackground: var(--button-color-background-tertiary-main-default);--buttonBackgroundActive: var(--button-color-background-tertiary-main-pressed);--buttonBackgroundHover: var(--button-color-background-tertiary-main-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-tertiary-main-disabled) 2.5px, var(--button-color-background-tertiary-main-disabled) 5.25px) padding-box;--buttonColor: var(--button-color-text-tertiary-main-default);--buttonColorDisabled: var(--button-color-text-tertiary-main-disabled);--buttonColorHover: var(--button-color-text-tertiary-main-hover);--buttonColorPressed: var(--button-color-text-tertiary-main-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused)}._variant-tertiary-danger_8wg4f_202{--buttonBackground: var(--button-color-background-tertiary-danger-default);--buttonBackgroundActive: var(--button-color-background-tertiary-danger-pressed);--buttonBackgroundHover: var(--button-color-background-tertiary-danger-hover);--buttonBackgroundDisabled: var(--button-color-background-tertiary-danger-disabled);--buttonColor: var(--button-color-text-tertiary-danger-default);--buttonColorDisabled: var(--button-color-text-tertiary-danger-disabled);--buttonColorHover: var(--button-color-text-tertiary-danger-hover);--buttonColorPressed: var(--button-color-text-tertiary-danger-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused)}._loader_8wg4f_213{display:flex;align-items:center;justify-content:center;position:absolute;bottom:0;left:0;right:0;top:0}._loader-children_8wg4f_223{opacity:0}}
+@property --gradient-angle{syntax: "<angle>"; initial-value: -60deg; inherits: true;}@keyframes _rotate-gradient_k9ec7_1{to{--gradient-angle: 300deg}}@layer components{._root_k9ec7_12{position:relative;display:inline-flex;white-space:nowrap;flex-shrink:0;align-items:center;justify-content:center;border-style:solid;cursor:pointer;border-radius:var(--border-radius-md);transition-property:all;transition-duration:var(--duration-medium);transition-timing-function:ease-in-out;outline:transparent solid var(--border-width-md);font-weight:var(--font-weight-semi-bold);font-family:var(--font-family-body);line-height:var(--font-line-height-xs);height:var(--buttonHeight);padding-inline:var(--buttonPaddingInline);font-size:var(--buttonFontSize);color:var(--buttonColor, var(--color-neutral-90));background:var(--buttonBackground);border-width:var(--buttonBorderWidth, 0);border-color:var(--buttonBorderColor, transparent);box-shadow:var(--buttonBoxShadow, none);gap:var(--buttonGap)}._root_k9ec7_12[data-focus-visible],._root_k9ec7_12:focus-visible{outline-width:var(--button-border-width-focused);outline-color:var(--buttonOutlineColorFocus)}@media (hover: hover) and (pointer: fine){._root_k9ec7_12:hover:not(:disabled):not([aria-disabled]){box-shadow:var(--elevation-20);--buttonBackground: var(--buttonBackgroundHover);--buttonBorderColor: var(--buttonBorderColorHover, transparent);--buttonColor: var(--buttonColorHover)}}._root_k9ec7_12:is(:active,[aria-pressed=true]):not(:disabled):not([aria-disabled]){--buttonBackground: var(--buttonBackgroundActive);--buttonBorderColor: var(--buttonBorderColorActive, transparent);--buttonColor: var(--buttonColorPressed)}._root_k9ec7_12:disabled,._root_k9ec7_12[aria-disabled]{--buttonBorderColor: var(--buttonBorderColorDisabled, transparent);--buttonColor: var(--buttonColorDisabled);--buttonBackground: var(--buttonBackgroundDisabled);cursor:not-allowed}._root_k9ec7_12 i.wui-icon-font,._root_k9ec7_12 svg{font-weight:initial;width:var(--buttonIconSize);height:var(--buttonIconSize);font-size:var(--buttonIconSize)}._root_k9ec7_12:has(svg:only-child),._root_k9ec7_12:has(i._wui-icon-font_k9ec7_66:only-child){width:var(--buttonHeight);--buttonPaddingInline: 0}._size-sm_k9ec7_77{--buttonFontSize: var(--font-size-14);--buttonHeight: var(--button-size-max-height-sm);--buttonPaddingInline: var(--button-padding-inline-sm);--buttonIconSize: var(--button-size-icon-sm);--buttonGap: var(--button-gap-content-sm)}._size-md_k9ec7_84{--buttonFontSize: var(--font-size-14);--buttonHeight: var(--button-size-max-height-md);--buttonPaddingInline: var(--button-padding-inline-md);--buttonIconSize: var(--button-size-icon-md);--buttonGap: var(--button-gap-content-md)}._size-lg_k9ec7_91{--buttonFontSize: var(--font-size-16);--buttonHeight: var(--button-size-max-height-lg);--buttonPaddingInline: var(--button-padding-inline-lg);--buttonIconSize: var(--button-size-icon-lg);--buttonGap: var(--button-gap-content-lg)}._variant-primary_k9ec7_98{--buttonBackground: var(--button-color-background-primary-main-default);--buttonBackgroundActive: var(--button-color-background-primary-main-pressed);--buttonBackgroundHover: var(--button-color-background-primary-main-hover);--buttonOutlineColorFocus: var(--button-color-border-focused);--buttonColorDisabled: var(--button-color-text-primary-main-disabled);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-primary-main-disabled) 2.5px, var(--button-color-background-primary-main-disabled) 5.25px) padding-box}._variant-primary-neutral_k9ec7_106{--buttonBackground: var(--button-color-background-primary-neutral-default);--buttonBackgroundActive: var(--button-color-background-primary-neutral-pressed);--buttonBackgroundHover: var(--button-color-background-primary-neutral-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-primary-neutral-disabled) 2.5px, var(--button-color-background-primary-neutral-disabled) 5.25px) padding-box;--buttonColor: var(--button-color-text-primary-neutral-default);--buttonColorDisabled: var(--button-color-text-primary-neutral-disabled);--buttonColorHover: var(--button-color-text-primary-neutral-hover);--buttonColorPressed: var(--button-color-text-primary-neutral-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused)}._variant-primary-ai_k9ec7_117{--buttonBackground: linear-gradient(var(--button-color-background-primary-ai-default) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundActive: linear-gradient(var(--button-color-background-primary-ai-pressed) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundHover: linear-gradient(var(--button-color-background-primary-ai-hover) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-primary-ai-disabled) 2.5px, var(--button-color-background-primary-ai-disabled) 5.25px) padding-box, linear-gradient( 107.75deg, var(--color-neutral-30) 0%, var(--color-neutral-50) 20%, var(--color-neutral-40) 40%, var(--color-neutral-50) 60%, var(--color-neutral-60) 80%, var(--color-neutral-50) 100% ) border-box;--buttonBorderWidth: var(--button-border-width-ai);--buttonColor: var(--button-color-text-primary-ai-default);--buttonColorDisabled: var(--button-color-text-primary-ai-disabled);--buttonColorHover: var(--button-color-text-primary-ai-hover);--buttonColorPressed: var(--button-color-text-primary-ai-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused);animation:_rotate-gradient_k9ec7_1 3s linear infinite paused}@media (hover: hover) and (pointer: fine){._variant-primary-ai_k9ec7_117:hover:not(:disabled):not([aria-disabled]){animation-play-state:running}}._variant-primary-ai_k9ec7_117:focus-visible{animation-play-state:running}._variant-primary-danger_k9ec7_149{--buttonBackground: var(--button-color-background-primary-danger-default);--buttonBackgroundActive: var(--button-color-background-primary-danger-pressed);--buttonBackgroundHover: var(--button-color-background-primary-danger-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-primary-danger-disabled) 2.5px, var(--button-color-background-primary-danger-disabled) 5.25px) padding-box;--buttonColor: var(--button-color-text-primary-danger-default);--buttonColorDisabled: var(--button-color-text-primary-danger-disabled);--buttonColorHover: var(--button-color-text-primary-danger-hover);--buttonColorPressed: var(--button-color-text-primary-danger-pressed);--buttonBorderWidth: var(--button-border-width-secondary);--buttonOutlineColorFocus: var(--button-color-border-focused)}._variant-secondary_k9ec7_161{--buttonBackground: var(--button-color-background-secondary-main-default);--buttonBackgroundActive: var(--button-color-background-secondary-main-pressed);--buttonBackgroundHover: var(--button-color-background-secondary-main-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-secondary-main-disabled) 2.5px, var(--button-color-background-secondary-main-disabled) 5.25px) padding-box;--buttonColor: var(--button-color-text-secondary-main-default);--buttonColorDisabled: var(--button-color-text-secondary-main-disabled);--buttonColorHover: var(--button-color-text-secondary-main-hover);--buttonColorPressed: var(--button-color-text-secondary-main-pressed);--buttonBorderWidth: var(--button-border-width-secondary);--buttonBorderColor: var(--button-color-border-secondary-main-default);--buttonBorderColorHover: var(--button-color-border-secondary-main-hover);--buttonBorderColorActive: var(--button-color-border-secondary-main-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused)}._variant-secondary-danger_k9ec7_176{--buttonBackground: var(--button-color-background-secondary-danger-default);--buttonBackgroundActive: var(--button-color-background-secondary-danger-pressed);--buttonBackgroundHover: var(--button-color-background-secondary-danger-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-secondary-danger-disabled) 2.5px, var(--button-color-background-secondary-danger-disabled) 5.25px) padding-box;--buttonColor: var(--button-color-text-secondary-danger-default);--buttonColorDisabled: var(--button-color-text-secondary-danger-disabled);--buttonColorHover: var(--button-color-text-secondary-danger-hover);--buttonColorPressed: var(--button-color-text-secondary-danger-pressed);--buttonBorderWidth: var(--button-border-width-secondary);--buttonBorderColor: var(--button-color-border-secondary-danger-default);--buttonBorderColorHover: var(--button-color-border-secondary-danger-hover);--buttonBorderColorActive: var(--button-color-border-secondary-danger-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused)}._variant-tertiary_k9ec7_191{--buttonBackground: var(--button-color-background-tertiary-main-default);--buttonBackgroundActive: var(--button-color-background-tertiary-main-pressed);--buttonBackgroundHover: var(--button-color-background-tertiary-main-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--button-color-background-tertiary-main-disabled) 2.5px, var(--button-color-background-tertiary-main-disabled) 5.25px) padding-box;--buttonColor: var(--button-color-text-tertiary-main-default);--buttonColorDisabled: var(--button-color-text-tertiary-main-disabled);--buttonColorHover: var(--button-color-text-tertiary-main-hover);--buttonColorPressed: var(--button-color-text-tertiary-main-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused)}._variant-tertiary-danger_k9ec7_202{--buttonBackground: var(--button-color-background-tertiary-danger-default);--buttonBackgroundActive: var(--button-color-background-tertiary-danger-pressed);--buttonBackgroundHover: var(--button-color-background-tertiary-danger-hover);--buttonBackgroundDisabled: var(--button-color-background-tertiary-danger-disabled);--buttonColor: var(--button-color-text-tertiary-danger-default);--buttonColorDisabled: var(--button-color-text-tertiary-danger-disabled);--buttonColorHover: var(--button-color-text-tertiary-danger-hover);--buttonColorPressed: var(--button-color-text-tertiary-danger-pressed);--buttonOutlineColorFocus: var(--button-color-border-focused)}._loader_k9ec7_213{display:flex;align-items:center;justify-content:center;position:absolute;bottom:0;left:0;right:0;top:0}._loader-children_k9ec7_223{opacity:0}}

package/dist/Button.js

@@ -7,59 +7,59 @@ import { Loader as x } from "./Loader.js";
 import { c as B } from "./index-PAaZGbyz.js";
 import { f as N } from "./forwardRefWithAs-8eP3ZN15.js";
 import "react";
-const $ = "_root_8wg4f_12", j = "_loader_8wg4f_213", D = {
-  root: $,
-  "wui-icon-font": "_wui-icon-font_8wg4f_66",
-  "size-sm": "_size-sm_8wg4f_77",
-  "size-md": "_size-md_8wg4f_84",
-  "size-lg": "_size-lg_8wg4f_91",
-  "variant-primary": "_variant-primary_8wg4f_98",
-  "variant-primary-neutral": "_variant-primary-neutral_8wg4f_106",
-  "variant-primary-ai": "_variant-primary-ai_8wg4f_117",
-  "rotate-gradient": "_rotate-gradient_8wg4f_1",
-  "variant-primary-danger": "_variant-primary-danger_8wg4f_149",
-  "variant-secondary": "_variant-secondary_8wg4f_161",
-  "variant-secondary-danger": "_variant-secondary-danger_8wg4f_176",
-  "variant-tertiary": "_variant-tertiary_8wg4f_191",
-  "variant-tertiary-danger": "_variant-tertiary-danger_8wg4f_202",
-  loader: j,
-  "loader-children": "_loader-children_8wg4f_223"
-}, t = B(D), S = N(
+const w = "_root_k9ec7_12", $ = "_loader_k9ec7_213", j = {
+  root: w,
+  "wui-icon-font": "_wui-icon-font_k9ec7_66",
+  "size-sm": "_size-sm_k9ec7_77",
+  "size-md": "_size-md_k9ec7_84",
+  "size-lg": "_size-lg_k9ec7_91",
+  "variant-primary": "_variant-primary_k9ec7_98",
+  "variant-primary-neutral": "_variant-primary-neutral_k9ec7_106",
+  "variant-primary-ai": "_variant-primary-ai_k9ec7_117",
+  "rotate-gradient": "_rotate-gradient_k9ec7_1",
+  "variant-primary-danger": "_variant-primary-danger_k9ec7_149",
+  "variant-secondary": "_variant-secondary_k9ec7_161",
+  "variant-secondary-danger": "_variant-secondary-danger_k9ec7_176",
+  "variant-tertiary": "_variant-tertiary_k9ec7_191",
+  "variant-tertiary-danger": "_variant-tertiary-danger_k9ec7_202",
+  loader: $,
+  "loader-children": "_loader-children_k9ec7_223"
+}, e = B(j), D = N(
   ({
     accessibleWhenDisabled: s = !0,
-    as: i,
-    children: e,
+    as: t,
+    children: i,
     className: _ = "",
-    disabled: d = !1,
+    disabled: c = !1,
     isLoading: a = !1,
-    size: l = "lg",
-    variant: m = "primary",
-    ...f
-  }, g) => {
-    const { disabled: c, size: p, variant: v } = h(), u = c || d || a, y = v || m, w = p || l, n = i || "button";
+    size: d = "lg",
+    variant: l = "primary",
+    ...m
+  }, p) => {
+    const { disabled: v, size: u, variant: y } = h(), k = v || c || a, f = y || l, g = u || d, n = t || "button";
     return /* @__PURE__ */ o(
       b,
       {
         ...n === "button" ? { type: "button" } : {},
-        ...f,
+        ...m,
         accessibleWhenDisabled: s,
-        className: t("root", `variant-${y}`, `size-${w}`, _),
-        disabled: u,
-        ref: g,
-        render: i ? /* @__PURE__ */ r(n, {}) : void 0,
+        className: e("root", `variant-${f}`, `size-${g}`, _),
+        disabled: k,
+        ref: p,
+        render: t ? /* @__PURE__ */ r(n, {}) : void 0,
         children: [
           a ? /* @__PURE__ */ o(z, { children: [
-            /* @__PURE__ */ r("div", { className: t("loader"), children: /* @__PURE__ */ r(x, { size: "xs" }) }),
-            /* @__PURE__ */ r("div", { className: t("loader-children"), children: e })
+            /* @__PURE__ */ r("div", { className: e("loader"), children: /* @__PURE__ */ r(x, { size: "xs" }) }),
+            /* @__PURE__ */ r("div", { className: e("loader-children"), children: i })
           ] }) : null,
-          !a && e
+          !a && i
         ]
       }
     );
   }
 );
-S.displayName = "Button";
+D.displayName = "Button";
 export {
-  S as Button,
-  D as buttonClasses
+  D as Button,
+  j as buttonClasses
 };

package/dist/Checkbox.js

@@ -1,50 +1,50 @@
 "use client";
 import './Checkbox.css';
-import { jsxs as k, jsx as s } from "react/jsx-runtime";
+import { jsxs as b, jsx as s } from "react/jsx-runtime";
 import { a as x } from "./I7KWAPMF-CuA_ygsc.js";
-import { forwardRef as w, useState as l } from "react";
-import { useField as C } from "./Field.js";
-import { VisuallyHidden as g } from "./VisuallyHidden.js";
+import { forwardRef as w, useState as h } from "react";
+import { useField as g } from "./Field.js";
+import { VisuallyHidden as C } from "./VisuallyHidden.js";
 import { c as V } from "./index-PAaZGbyz.js";
-import { Icon as d } from "./Icon.js";
-const y = "_root_uppw9_2", F = "_indeterminate_uppw9_67", I = {
-  root: y,
+import { Icon as l } from "./Icon.js";
+const k = "_root_uppw9_2", y = "_indeterminate_uppw9_67", F = {
+  root: k,
   "variant-danger": "_variant-danger_uppw9_49",
   "variant-warning": "_variant-warning_uppw9_55",
   "variant-success": "_variant-success_uppw9_61",
-  indeterminate: F
-}, N = V(I), j = w(
-  ({ checked: m = !1, className: u, indeterminate: a = !1, onChange: i, variant: p, ...o }, f) => {
-    const [e, _] = l(m), [h, t] = l(!1), { getInputProps: n, variant: v } = C(), r = v || p, { disabled: c } = n(o), b = () => {
-      _(!e), i && i(!e);
+  indeterminate: y
+}, N = V(F), j = w(
+  ({ checked: a = !1, className: m, indeterminate: i = !1, onChange: e, variant: u, ...o }, p) => {
+    const [d, n] = h(!1), { getInputProps: t, variant: f } = g(), r = f || u, { disabled: c } = t(o), _ = (v) => {
+      e && e(!a, v);
     };
-    return /* @__PURE__ */ k(
+    return /* @__PURE__ */ b(
       "div",
       {
-        "aria-checked": e,
+        "aria-checked": a,
         "aria-disabled": c,
         className: N(
           "root",
           r && `variant-${r}`,
-          a && "indeterminate",
+          i && "indeterminate",
           "field-input",
-          u
+          m
         ),
-        "data-focus-visible": h || void 0,
-        onClick: c ? void 0 : b,
+        "data-focus-visible": d || void 0,
+        onClick: c ? void 0 : _,
         children: [
-          /* @__PURE__ */ s(g, { children: /* @__PURE__ */ s(
+          /* @__PURE__ */ s(C, { children: /* @__PURE__ */ s(
             x,
             {
-              ...n(o),
-              checked: e,
-              onBlur: () => t(!1),
-              onFocusVisible: () => t(!0),
-              ref: f
+              ...t(o),
+              checked: a,
+              onBlur: () => n(!1),
+              onFocusVisible: () => n(!0),
+              ref: p
             }
           ) }),
-          e ? /* @__PURE__ */ s(d, { name: "check", size: "sm" }) : null,
-          !e && a ? /* @__PURE__ */ s(d, { name: "minus", size: "sm" }) : null
+          a ? /* @__PURE__ */ s(l, { name: "check", size: "sm" }) : null,
+          !a && i ? /* @__PURE__ */ s(l, { name: "minus", size: "sm" }) : null
         ]
       }
     );
@@ -53,5 +53,5 @@ const y = "_root_uppw9_2", F = "_indeterminate_uppw9_67", I = {
 j.displayName = "Checkbox";
 export {
   j as Checkbox,
-  I as checkboxClasses
+  F as checkboxClasses
 };

package/dist/types/components/Checkbox/types.d.ts

@@ -4,6 +4,6 @@ export interface CheckboxOptions {
     variant?: Variant;
 }
 export type CheckboxProps = CheckboxOptions & Omit<ComponentProps<'input'>, 'onChange'> & {
-    onChange?: (isChecked: boolean) => void;
+    onChange?: (isChecked: boolean, e: React.MouseEvent<HTMLDivElement>) => void;
 };
 export type Variant = 'danger' | 'success' | 'warning';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "welcome-ui",
-  "version": "10.1.11",
+  "version": "10.1.13",
   "description": "Customizable design system with react, typescript, tailwindcss and ariakit.",
   "files": [
     "dist"