suus-component-library 0.1.5 → 0.1.7

package/dist/suus-component-library.css

@@ -1,2 +1,2 @@
-:root{--colors-gold-brand-secondary-bright:#f9db86;--colors-gold-brand-secondary-light:#eec348;--colors-gold-brand-secondary:#d9ab29;--colors-gold-brand-secondary-midnight:#97771d;--colors-gold-brand-secondary-dark:#b58f24;--colors-gray-brand-white:#fff;--colors-gray-brand-bright-gray:#eee;--colors-gray-brand-light-gray:#dfdfdf;--colors-gray-brand-gray:#c2bfbf;--colors-gray-brand-dark-gray:#5b5a5a;--colors-gray-brand-black:#272727;--colors-gray-brand-white-transparent-40:#fff6;--colors-gray-brand-white-transparent-70:#ffffffb3;--colors-status-error:#de6565;--colors-green-brand-primary-bright:#e5fc5a;--colors-green-brand-primary-light:#d0e646;--colors-green-brand-primary:#afc33b;--colors-green-brand-primary-dark:#8fa02a;--colors-green-brand-primary-midnight:#5c6814;--colors-juice-sugarcane:#9bad30;--colors-juice-tamarind:#da8e33;--colors-juice-guava:#7b4e80;--colors-juice-icetea:#d83a4f;--spacing-tiny:8px;--spacing-small:16px;--spacing-default:24px;--spacing-large:40px;--spacing-huge:60px;--radius-small:8px;--radius-default:16px;--radius-large:24px;--radius-huge:50px;--borders-thin:.5px;--borders-default:1px;--borders-thick:2px;--typeface-font-family-sans-serif:sora;--typeface-font-family-header:sora;--typeface-font-family-body:sora;--typeface-font-family-statement:sora;--typeface-font-family-form:sora;--typeface-font-weight-regular-400:400;--typeface-font-weight-regular-500:500;--typeface-font-weight-bold-700:700;--typeface-font-size-small-16:.889rem;--typeface-font-size-default-20:1.111rem;--typeface-font-size-large-24:1.333rem;--typeface-font-size-huge-48:2.667rem;--typeface-font-size-extra-huge-72:4rem;--typeface-font-size-extra-large-36:2rem;--typeface-letter-spacing-default:.006rem;--typeface-letter-spacing-large:.011rem;--typeface-line-height-default-120:6.667rem;--typeface-line-height-large-150:8.333rem;--colors-status-success:var(--colors-green-brand-primary);--colors-status-warning:var(--colors-gold-brand-secondary);--colors-status-info:var(--colors-green-brand-primary);--panel-background-transparent:var(--colors-gray-brand-white-transparent-70);--panel-background-white:var(--colors-gray-brand-white);--panel-background-gray:var(--colors-gray-brand-gray);--panel-background-gradient-top-left-green:var(--colors-green-brand-primary-light);--panel-background-gradient-bottom-right-green:var(--colors-green-brand-primary-midnight);--panel-background-gradient-top-left-white:var(--colors-gray-brand-white-transparent-70);--panel-background-gradient-bottom-right-white:var(--colors-gray-brand-white-transparent-40);--panel-text-title:var(--colors-green-brand-primary-dark);--panel-text-title-glassy:var(--colors-gray-brand-white);--panel-border-color:var(--colors-gray-brand-light-gray);--panel-border-width:var(--borders-default);--panel-radius-desktop:var(--radius-large);--panel-radius-mobile:var(--radius-small);--panel-padding-top-bottom-desktop:var(--spacing-large);--panel-padding-right-left-desktop:var(--spacing-large);--panel-padding-top-bottom-mobile:var(--spacing-default);--panel-padding-right-left-mobile:var(--spacing-default);--tile-background-default:var(--colors-gray-brand-white);--tile-text-title:var(--colors-gray-brand-dark-gray);--tile-text-content:var(--colors-gray-brand-dark-gray);--tile-border-color:var(--colors-gray-brand-gray);--tile-border-width-default:var(--borders-default);--tile-border-width-thick:var(--borders-thick);--tile-radius-default:var(--radius-default);--button-background-disabled:var(--colors-gray-brand-light-gray);--button-background-enabled:var(--colors-green-brand-primary);--button-background-enabled-gradient-from:var(--colors-green-brand-primary-light);--button-background-enabled-gradient-middle:var(--colors-green-brand-primary-dark);--button-background-enabled-gradient-to:var(--colors-green-brand-primary-midnight);--button-background-inverse:var(--colors-gray-brand-white);--button-background-hover:var(--colors-green-brand-primary-dark);--button-text-primary:var(--colors-gray-brand-white);--button-text-primary-disabled:var(--colors-gray-brand-gray);--button-text-secondary:var(--colors-green-brand-primary-dark);--button-text-secondary-disabled:var(--colors-green-brand-primary);--button-border-color-default:var(--colors-green-brand-primary);--button-border-color-disabled:var(--colors-gray-brand-gray);--button-border-color-selected:var(--colors-green-brand-primary-dark);--button-border-color-hover:var(--colors-green-brand-primary-dark);--button-border-width-default:var(--borders-default);--button-radius:var(--radius-huge);--form-background-white:var(--colors-gray-brand-white);--form-background-glassy:var(--colors-gray-brand-white-transparent-40);--form-background-disabled:var(--colors-gray-brand-bright-gray);--form-background-gray:var(--colors-gray-brand-light-gray);--form-border-color-disabled:var(--colors-gray-brand-light-gray);--form-border-color-selected-dark:var(--colors-green-brand-primary-dark);--form-border-color-error:var(--colors-status-error);--form-border-color-default:var(--colors-green-brand-primary-dark);--form-border-color-selected-glassy:var(--colors-gray-brand-white);--form-border-color-selected-light:var(--colors-green-brand-primary);--form-border-width-default:var(--borders-default);--form-border-width-selected:var(--borders-default);--form-radius-default:var(--radius-default);--form-text-label:var(--colors-gray-brand-dark-gray);--form-text-placeholder:var(--colors-gray-brand-gray);--form-text-content:var(--colors-gray-brand-dark-gray);--form-text-disabled:var(--colors-gray-brand-light-gray);--form-text-error:var(--colors-status-error);--form-text-label-glassy:var(--colors-gray-brand-white);--form-text-placeholder-glassy:var(--colors-gray-brand-light-gray);--form-text-content-glassy:var(--colors-gray-brand-white);--snackbar-background-error:var(--colors-status-error);--snackbar-border-color-error:var(--colors-status-error);--snackbar-border-width-default:var(--borders-thick);--snackbar-text-default:var(--colors-gray-brand-white);--icon-inverse-selected:var(--colors-green-brand-primary-dark);--icon-default:var(--colors-green-brand-primary-dark);--icon-inverse:var(--colors-gray-brand-white);--icon-default-selected:var(--colors-gray-brand-white);--icon-text-default:var(--colors-green-brand-primary-dark);--icon-text-glassy:var(--colors-gray-brand-white);--text-title-default:var(--colors-gray-brand-dark-gray);--text-title-glassy:var(--colors-gray-brand-white);--text-content-text:var(--colors-gray-brand-dark-gray);--text-content-text-light:var(--colors-gray-brand-light-gray);--text-content-text-white:var(--colors-gray-brand-white);--text-messages-error:var(--colors-status-error);--menu-hover:var(--colors-green-brand-primary-light);--menu-text-selected:var(--colors-green-brand-primary-light);--menu-flyout-gradient-to:var(--colors-green-brand-primary-midnight);--menu-flyout-gradient-from:var(--colors-green-brand-primary-light);--menu-background:var(--colors-gray-brand-white);--menu-dark:var(--colors-green-brand-primary-midnight);--illustrations-default:var(--colors-green-brand-primary);--illustrations-light:var(--colors-green-brand-primary-bright);--stepper-dot:var(--colors-green-brand-primary);--stepper-border-dot:var(--colors-gray-brand-light-gray);--stepper-border-dot-selected:var(--colors-green-brand-primary-dark);--stepper-line:var(--colors-green-brand-primary);--stepper-line-disabled:var(--colors-gray-brand-light-gray);--form-border-color-success:var(--colors-status-success);--form-border-color-warning:var(--colors-status-warning);--form-text-success:var(--colors-status-success);--form-text-warning:var(--colors-status-warning);--form-text-info:var(--colors-status-info);--snackbar-background-warning:var(--colors-status-warning);--snackbar-background-info:var(--colors-status-info);--snackbar-background-success:var(--colors-status-success);--snackbar-border-color-success:var(--colors-status-success);--snackbar-border-color-warning:var(--colors-status-warning);--snackbar-border-color-info:var(--colors-status-info);--icon-disabled:var(--form-text-disabled);--text-messages-info:var(--colors-status-info);--text-messages-warning:var(--colors-status-warning);--text-messages-success:var(--colors-status-success);--menu-white:var(--form-text-label-glassy);--stepper-label:var(--form-text-label);--stepper-dot-number:var(--text-content-text-white)}._suusButton_1q9to_1{--button-background-color:var(--colors-juice-sugarcane);min-height:3rem;font-family:var(--typeface-font-family-sans-serif), sans-serif;letter-spacing:.01em;text-transform:uppercase;white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border:0 solid #0000;border-radius:50px;outline:none;justify-content:center;align-items:center;gap:.75rem;padding:0 2rem;font-size:1rem;font-weight:700;line-height:1;transition:transform .18s,box-shadow .18s,background .18s,border-color .18s,color .18s,opacity .18s;display:inline-flex}@media (width<=480px){._suusButton_1q9to_1{width:100%;min-width:0}}._icon_1q9to_45{color:currentColor;flex-shrink:0;justify-content:center;align-items:center;width:1.4rem;height:1.4rem;display:inline-flex}._icon_1q9to_45 svg{width:100%;height:100%;display:block}._label_1q9to_62{display:inline-block}._primary_1q9to_69{color:var(--button-text-primary);background:linear-gradient(180deg, color-mix(in srgb, var(--button-background-color) 85%, white 15%) 0%, var(--button-background-color) 60%, color-mix(in srgb, var(--button-background-color) 75%, black 25%) 100%);box-shadow:inset 0 3px 6px color-mix(in srgb, var(--button-background-color) 50%, white 50%), inset 0 -2px 4px color-mix(in srgb, var(--button-background-color) 60%, black 40%), 0 10px 18px #00000026;border-color:#0000}._primary_1q9to_69:hover:not(:disabled){transform:translateY(-1px);box-shadow:inset 0 2px #fff3,inset 0 -2px #00000024,0 12px 22px #0000002e}._primary_1q9to_69:focus-visible:not(:disabled){box-shadow:inset 0 0 0 3px color-mix(in srgb, var(--button-background-color) 72%, white 28%), inset 0 2px 0 #ffffff2e, inset 0 -2px 0 #0000001f, 0 0 0 4px #ffffffe6}._primary_1q9to_69:active:not(:disabled){transform:translateY(1px);box-shadow:inset 0 2px 6px #0000001f,inset 0 1px #ffffff1f}._secondary_1q9to_113{color:var(--button-text-secondary);border:2px solid var(--button-border-color-default);background:color-mix(in srgb, var(--button-background-inverse) 8%, white 92%);box-shadow:inset 0 1px #fffc,0 4px 12px #0000000f}._secondary_1q9to_113:hover:not(:disabled){background:color-mix(in srgb, var(--button-background-hover) 8%, white 92%);transform:translateY(-1px);box-shadow:inset 0 1px #ffffffe6,0 8px 18px #00000014}._secondary_1q9to_113:focus-visible:not(:disabled){box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--button-background-inverse) 18%, white 82%), 0 0 0 4px #fffffff2}._secondary_1q9to_113:active:not(:disabled){background:color-mix(in srgb, var(--button-background-inverse) 12%, white 88%);transform:translateY(1px);box-shadow:inset 0 2px 6px #00000014}._suusButton_1q9to_1:disabled{cursor:not-allowed;transform:none}._primary_1q9to_69:disabled{background:var(--button-background-disabled);color:var(--button-text-primary-disabled);box-shadow:none;border-color:#0000}._secondary_1q9to_113:disabled{color:var(--button-text-secondary);border-color:var(--button-border-color-disabled);box-shadow:none;background:#fff}._loading_1q9to_169{pointer-events:none}._loader_1q9to_173{border:2px solid #ffffff59;border-top-color:#fff;border-radius:999px;width:1.2rem;height:1.2rem;animation:.7s linear infinite _btn-spin_1q9to_1}._loaderSecondary_1q9to_182{border:2px solid color-mix(in srgb, var(--button-background-color) 20%, white 80%);border-top-color:var(--button-background-color)}@keyframes _btn-spin_1q9to_1{to{transform:rotate(360deg)}}
+:root{--colors-gold-brand-secondary-bright:#f9db86;--colors-gold-brand-secondary-light:#eec348;--colors-gold-brand-secondary:#d9ab29;--colors-gold-brand-secondary-midnight:#97771d;--colors-gold-brand-secondary-dark:#b58f24;--colors-gray-brand-white:#fff;--colors-gray-brand-bright-gray:#eee;--colors-gray-brand-light-gray:#dfdfdf;--colors-gray-brand-gray:#c2bfbf;--colors-gray-brand-dark-gray:#5b5a5a;--colors-gray-brand-black:#272727;--colors-gray-brand-white-transparent-40:#fff6;--colors-gray-brand-white-transparent-70:#ffffffb3;--colors-status-error:#de6565;--colors-green-brand-primary-bright:#e5fc5a;--colors-green-brand-primary-light:#d0e646;--colors-green-brand-primary:#afc33b;--colors-green-brand-primary-dark:#8fa02a;--colors-green-brand-primary-midnight:#5c6814;--colors-juice-sugarcane:#9bad30;--colors-juice-tamarind:#da8e33;--colors-juice-guava:#7b4e80;--colors-juice-icetea:#d83a4f;--spacing-tiny:8px;--spacing-small:16px;--spacing-default:24px;--spacing-large:40px;--spacing-huge:60px;--radius-small:8px;--radius-default:16px;--radius-large:24px;--radius-huge:50px;--borders-thin:.5px;--borders-default:1px;--borders-thick:2px;--typeface-font-family-sans-serif:sora;--typeface-font-family-header:sora;--typeface-font-family-body:sora;--typeface-font-family-statement:sora;--typeface-font-family-form:sora;--typeface-font-weight-regular-400:400;--typeface-font-weight-regular-500:500;--typeface-font-weight-bold-700:700;--typeface-font-size-small-16:.889rem;--typeface-font-size-default-20:1.111rem;--typeface-font-size-large-24:1.333rem;--typeface-font-size-huge-48:2.667rem;--typeface-font-size-extra-huge-72:4rem;--typeface-font-size-extra-large-36:2rem;--typeface-letter-spacing-default:.006rem;--typeface-letter-spacing-large:.011rem;--typeface-line-height-default-120:6.667rem;--typeface-line-height-large-150:8.333rem;--colors-status-success:var(--colors-green-brand-primary);--colors-status-warning:var(--colors-gold-brand-secondary);--colors-status-info:var(--colors-green-brand-primary);--panel-background-transparent:var(--colors-gray-brand-white-transparent-70);--panel-background-white:var(--colors-gray-brand-white);--panel-background-gray:var(--colors-gray-brand-gray);--panel-background-gradient-top-left-green:var(--colors-green-brand-primary-light);--panel-background-gradient-bottom-right-green:var(--colors-green-brand-primary-midnight);--panel-background-gradient-top-left-white:var(--colors-gray-brand-white-transparent-70);--panel-background-gradient-bottom-right-white:var(--colors-gray-brand-white-transparent-40);--panel-text-title:var(--colors-green-brand-primary-dark);--panel-text-title-glassy:var(--colors-gray-brand-white);--panel-border-color:var(--colors-gray-brand-light-gray);--panel-border-width:var(--borders-default);--panel-radius-desktop:var(--radius-large);--panel-radius-mobile:var(--radius-small);--panel-padding-top-bottom-desktop:var(--spacing-large);--panel-padding-right-left-desktop:var(--spacing-large);--panel-padding-top-bottom-mobile:var(--spacing-default);--panel-padding-right-left-mobile:var(--spacing-default);--tile-background-default:var(--colors-gray-brand-white);--tile-text-title:var(--colors-gray-brand-dark-gray);--tile-text-content:var(--colors-gray-brand-dark-gray);--tile-border-color:var(--colors-gray-brand-gray);--tile-border-width-default:var(--borders-default);--tile-border-width-thick:var(--borders-thick);--tile-radius-default:var(--radius-default);--button-background-disabled:var(--colors-gray-brand-light-gray);--button-background-enabled:var(--colors-green-brand-primary);--button-background-enabled-gradient-from:var(--colors-green-brand-primary-light);--button-background-enabled-gradient-middle:var(--colors-green-brand-primary-dark);--button-background-enabled-gradient-to:var(--colors-green-brand-primary-midnight);--button-background-inverse:var(--colors-gray-brand-white);--button-background-hover:var(--colors-green-brand-primary-dark);--button-text-primary:var(--colors-gray-brand-white);--button-text-primary-disabled:var(--colors-gray-brand-gray);--button-text-secondary:var(--colors-green-brand-primary-dark);--button-text-secondary-disabled:var(--colors-green-brand-primary);--button-border-color-default:var(--colors-green-brand-primary);--button-border-color-disabled:var(--colors-gray-brand-gray);--button-border-color-selected:var(--colors-green-brand-primary-dark);--button-border-color-hover:var(--colors-green-brand-primary-dark);--button-border-width-default:var(--borders-default);--button-radius:var(--radius-huge);--form-background-white:var(--colors-gray-brand-white);--form-background-glassy:var(--colors-gray-brand-white-transparent-40);--form-background-disabled:var(--colors-gray-brand-bright-gray);--form-background-gray:var(--colors-gray-brand-light-gray);--form-border-color-disabled:var(--colors-gray-brand-light-gray);--form-border-color-selected-dark:var(--colors-green-brand-primary-dark);--form-border-color-error:var(--colors-status-error);--form-border-color-default:var(--colors-green-brand-primary-dark);--form-border-color-selected-glassy:var(--colors-gray-brand-white);--form-border-color-selected-light:var(--colors-green-brand-primary);--form-border-width-default:var(--borders-default);--form-border-width-selected:var(--borders-default);--form-radius-default:var(--radius-default);--form-text-label:var(--colors-gray-brand-dark-gray);--form-text-placeholder:var(--colors-gray-brand-gray);--form-text-content:var(--colors-gray-brand-dark-gray);--form-text-disabled:var(--colors-gray-brand-light-gray);--form-text-error:var(--colors-status-error);--form-text-label-glassy:var(--colors-gray-brand-white);--form-text-placeholder-glassy:var(--colors-gray-brand-light-gray);--form-text-content-glassy:var(--colors-gray-brand-white);--snackbar-background-error:var(--colors-status-error);--snackbar-border-color-error:var(--colors-status-error);--snackbar-border-width-default:var(--borders-thick);--snackbar-text-default:var(--colors-gray-brand-white);--icon-inverse-selected:var(--colors-green-brand-primary-dark);--icon-default:var(--colors-green-brand-primary-dark);--icon-inverse:var(--colors-gray-brand-white);--icon-default-selected:var(--colors-gray-brand-white);--icon-text-default:var(--colors-green-brand-primary-dark);--icon-text-glassy:var(--colors-gray-brand-white);--text-title-default:var(--colors-gray-brand-dark-gray);--text-title-glassy:var(--colors-gray-brand-white);--text-content-text:var(--colors-gray-brand-dark-gray);--text-content-text-light:var(--colors-gray-brand-light-gray);--text-content-text-white:var(--colors-gray-brand-white);--text-messages-error:var(--colors-status-error);--menu-hover:var(--colors-green-brand-primary-light);--menu-text-selected:var(--colors-green-brand-primary-light);--menu-flyout-gradient-to:var(--colors-green-brand-primary-midnight);--menu-flyout-gradient-from:var(--colors-green-brand-primary-light);--menu-background:var(--colors-gray-brand-white);--menu-dark:var(--colors-green-brand-primary-midnight);--illustrations-default:var(--colors-green-brand-primary);--illustrations-light:var(--colors-green-brand-primary-bright);--stepper-dot:var(--colors-green-brand-primary);--stepper-border-dot:var(--colors-gray-brand-light-gray);--stepper-border-dot-selected:var(--colors-green-brand-primary-dark);--stepper-line:var(--colors-green-brand-primary);--stepper-line-disabled:var(--colors-gray-brand-light-gray);--form-border-color-success:var(--colors-status-success);--form-border-color-warning:var(--colors-status-warning);--form-text-success:var(--colors-status-success);--form-text-warning:var(--colors-status-warning);--form-text-info:var(--colors-status-info);--snackbar-background-warning:var(--colors-status-warning);--snackbar-background-info:var(--colors-status-info);--snackbar-background-success:var(--colors-status-success);--snackbar-border-color-success:var(--colors-status-success);--snackbar-border-color-warning:var(--colors-status-warning);--snackbar-border-color-info:var(--colors-status-info);--icon-disabled:var(--form-text-disabled);--text-messages-info:var(--colors-status-info);--text-messages-warning:var(--colors-status-warning);--text-messages-success:var(--colors-status-success);--menu-white:var(--form-text-label-glassy);--stepper-label:var(--form-text-label);--stepper-dot-number:var(--text-content-text-white);font-family:var(--typeface-font-family-body), sans-serif}html,body{font-family:var(--typeface-font-family-sans-serif), sans-serif}button,input,select,textarea{font:inherit}._suusButton_1q9to_1{--button-background-color:var(--colors-juice-sugarcane);min-height:3rem;font-family:var(--typeface-font-family-sans-serif), sans-serif;letter-spacing:.01em;text-transform:uppercase;white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border:0 solid #0000;border-radius:50px;outline:none;justify-content:center;align-items:center;gap:.75rem;padding:0 2rem;font-size:1rem;font-weight:700;line-height:1;transition:transform .18s,box-shadow .18s,background .18s,border-color .18s,color .18s,opacity .18s;display:inline-flex}@media (width<=480px){._suusButton_1q9to_1{width:100%;min-width:0}}._icon_1q9to_45{color:currentColor;flex-shrink:0;justify-content:center;align-items:center;width:1.4rem;height:1.4rem;display:inline-flex}._icon_1q9to_45 svg{width:100%;height:100%;display:block}._label_1q9to_62{display:inline-block}._primary_1q9to_69{color:var(--button-text-primary);background:linear-gradient(180deg, color-mix(in srgb, var(--button-background-color) 85%, white 15%) 0%, var(--button-background-color) 60%, color-mix(in srgb, var(--button-background-color) 75%, black 25%) 100%);box-shadow:inset 0 3px 6px color-mix(in srgb, var(--button-background-color) 50%, white 50%), inset 0 -2px 4px color-mix(in srgb, var(--button-background-color) 60%, black 40%), 0 10px 18px #00000026;border-color:#0000}._primary_1q9to_69:hover:not(:disabled){transform:translateY(-1px);box-shadow:inset 0 2px #fff3,inset 0 -2px #00000024,0 12px 22px #0000002e}._primary_1q9to_69:focus-visible:not(:disabled){box-shadow:inset 0 0 0 3px color-mix(in srgb, var(--button-background-color) 72%, white 28%), inset 0 2px 0 #ffffff2e, inset 0 -2px 0 #0000001f, 0 0 0 4px #ffffffe6}._primary_1q9to_69:active:not(:disabled){transform:translateY(1px);box-shadow:inset 0 2px 6px #0000001f,inset 0 1px #ffffff1f}._secondary_1q9to_113{color:var(--button-text-secondary);border:2px solid var(--button-border-color-default);background:color-mix(in srgb, var(--button-background-inverse) 8%, white 92%);box-shadow:inset 0 1px #fffc,0 4px 12px #0000000f}._secondary_1q9to_113:hover:not(:disabled){background:color-mix(in srgb, var(--button-background-hover) 8%, white 92%);transform:translateY(-1px);box-shadow:inset 0 1px #ffffffe6,0 8px 18px #00000014}._secondary_1q9to_113:focus-visible:not(:disabled){box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--button-background-inverse) 18%, white 82%), 0 0 0 4px #fffffff2}._secondary_1q9to_113:active:not(:disabled){background:color-mix(in srgb, var(--button-background-inverse) 12%, white 88%);transform:translateY(1px);box-shadow:inset 0 2px 6px #00000014}._suusButton_1q9to_1:disabled{cursor:not-allowed;transform:none}._primary_1q9to_69:disabled{background:var(--button-background-disabled);color:var(--button-text-primary-disabled);box-shadow:none;border-color:#0000}._secondary_1q9to_113:disabled{color:var(--button-text-secondary);border-color:var(--button-border-color-disabled);box-shadow:none;background:#fff}._loading_1q9to_169{pointer-events:none}._loader_1q9to_173{border:2px solid #ffffff59;border-top-color:#fff;border-radius:999px;width:1.2rem;height:1.2rem;animation:.7s linear infinite _btn-spin_1q9to_1}._loaderSecondary_1q9to_182{border:2px solid color-mix(in srgb, var(--button-background-color) 20%, white 80%);border-top-color:var(--button-background-color)}@keyframes _btn-spin_1q9to_1{to{transform:rotate(360deg)}}
 /*$vite$:1*/

package/dist/suus-component-library.js

@@ -11,7 +11,7 @@ var r = {
 	loaderSecondary: "_loaderSecondary_1q9to_182"
 };
 //#endregion
-//#region src/components/form/buttons/input-button/InputButton.tsx
+//#region src/components/form/button/Button.tsx
 function i({ label: i, onClick: a, type: o = "button", disabled: s = !1, loading: c = !1, variant: l = "primary", colorToken: u = "--colors-juice-sugarcane", icon: d, ...f }) {
 	return /* @__PURE__ */ t("button", {
 		type: o,
@@ -38,4 +38,4 @@ function i({ label: i, onClick: a, type: o = "button", disabled: s = !1, loading
 	});
 }
 //#endregion
-export { i as InputButton };
+export { i as Button };

package/dist/suus-component-library.umd.cjs

@@ -1 +1 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react/jsx-runtime`)):typeof define==`function`&&define.amd?define([`exports`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`SUUS Component Library`]={},e.jsxRuntime))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n={suusButton:`_suusButton_1q9to_1`,icon:`_icon_1q9to_45`,label:`_label_1q9to_62`,primary:`_primary_1q9to_69`,secondary:`_secondary_1q9to_113`,loading:`_loading_1q9to_169`,loader:`_loader_1q9to_173`,"btn-spin":`_btn-spin_1q9to_1`,loaderSecondary:`_loaderSecondary_1q9to_182`};function r({label:e,onClick:r,type:i=`button`,disabled:a=!1,loading:o=!1,variant:s=`primary`,colorToken:c=`--colors-juice-sugarcane`,icon:l,...u}){return(0,t.jsx)(`button`,{type:i,onClick:r,disabled:a||o,style:{"--button-background-color":`var(${c})`},className:[n.suusButton,n[s],o?n.loading:``].filter(Boolean).join(` `),"aria-busy":o,...u,children:o?(0,t.jsx)(`span`,{className:`${n.loader} ${s===`primary`?``:n.loaderSecondary}`,"aria-hidden":`true`}):(0,t.jsxs)(t.Fragment,{children:[l?(0,t.jsx)(`span`,{className:n.icon,children:l}):null,(0,t.jsx)(`span`,{className:n.label,children:e})]})})}e.InputButton=r});
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react/jsx-runtime`)):typeof define==`function`&&define.amd?define([`exports`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`SUUS Component Library`]={},e.jsxRuntime))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n={suusButton:`_suusButton_1q9to_1`,icon:`_icon_1q9to_45`,label:`_label_1q9to_62`,primary:`_primary_1q9to_69`,secondary:`_secondary_1q9to_113`,loading:`_loading_1q9to_169`,loader:`_loader_1q9to_173`,"btn-spin":`_btn-spin_1q9to_1`,loaderSecondary:`_loaderSecondary_1q9to_182`};function r({label:e,onClick:r,type:i=`button`,disabled:a=!1,loading:o=!1,variant:s=`primary`,colorToken:c=`--colors-juice-sugarcane`,icon:l,...u}){return(0,t.jsx)(`button`,{type:i,onClick:r,disabled:a||o,style:{"--button-background-color":`var(${c})`},className:[n.suusButton,n[s],o?n.loading:``].filter(Boolean).join(` `),"aria-busy":o,...u,children:o?(0,t.jsx)(`span`,{className:`${n.loader} ${s===`primary`?``:n.loaderSecondary}`,"aria-hidden":`true`}):(0,t.jsxs)(t.Fragment,{children:[l?(0,t.jsx)(`span`,{className:n.icon,children:l}):null,(0,t.jsx)(`span`,{className:n.label,children:e})]})})}e.Button=r});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "suus-component-library",
-  "version": "0.1.5",
+  "version": "0.1.7",
   "type": "module",
   "main": "./dist/suus-component-library.umd.cjs",
   "module": "./dist/suus-component-library.js",
@@ -18,10 +18,13 @@
   },
   "scripts": {
     "build-component-library": "tsc -b && vite build",
-    "pack-component-library-for-local-testing": "npm pack",
     "publish-component-library": "npm version patch && npm publish",
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build"
+    "build-component-library-for-local-testing": "npm pack",
+    "build-storybook": "storybook build",
+    "build-storybook:github": "STORYBOOK_BASE=/suus-component-library/ storybook build",
+    "build-storybook:local": "STORYBOOK_BASE=/ storybook build",
+    "run-storybook-static": "npx http-server storybook-static -p 63342",
+    "run-storybook-local": "storybook dev -p 6006"
   },
   "peerDependencies": {
     "react": "^18.3.0 || ^19.0.0",
@@ -46,6 +49,7 @@
     "vite-plugin-dts": "latest"
   },
   "dependencies": {
+    "msw": "^2.14.6",
     "suus-design-tokens": "^1.0.13"
   }
 }

package/dist/components/form/buttons/input-button/InputButton.d.ts

@@ -1,14 +0,0 @@
-import { ButtonHTMLAttributes, MouseEvent, ReactNode } from 'react';
-export type ProductColorToken = "--colors-juice-sugarcane" | "--colors-juice-tamarind" | "--colors-juice-guava" | "--colors-juice-icetea";
-export type ButtonProps = {
-    label: string;
-    onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
-    type?: "button" | "submit" | "reset";
-    disabled?: boolean;
-    loading?: boolean;
-    variant?: "primary" | "secondary";
-    colorToken?: ProductColorToken;
-    icon?: ReactNode;
-} & Omit<ButtonHTMLAttributes<HTMLButtonElement>, "type" | "onClick" | "disabled">;
-export default function InputButton({ label, onClick, type, disabled, loading, variant, colorToken, icon, ...rest }: ButtonProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=InputButton.d.ts.map

package/dist/components/form/buttons/input-button/InputButton.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InputButton.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/buttons/input-button/InputButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAiB,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxF,MAAM,MAAM,iBAAiB,GACvB,0BAA0B,GAC1B,yBAAyB,GACzB,sBAAsB,GACtB,uBAAuB,CAAC;AAE9B,MAAM,MAAM,WAAW,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACzD,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAC;IAClC,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B,IAAI,CAAC,EAAE,SAAS,CAAC;CACpB,GAAG,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,UAAU,CAAC,CAAC;AAEnF,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EACI,KAAK,EACL,OAAO,EACP,IAAe,EACf,QAAgB,EAChB,OAAe,EACf,OAAmB,EACnB,UAAuC,EACvC,IAAI,EACJ,GAAG,IAAI,EACV,EAAE,WAAW,2CAoCjD"}

package/dist/components/form/buttons/input-button/InputButton.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InputButton.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/buttons/input-button/InputButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,WAAW,MAAM,eAAe,CAAC;AAExC,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;CA4B0B,CAAC;AAErC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAYvB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KA+BlB,CAAC"}

package/dist/components/form/buttons/input-button/index.d.ts

@@ -1,3 +0,0 @@
-export { default } from './InputButton';
-export type { ButtonProps, ProductColorToken } from './InputButton';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/form/buttons/input-button/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/buttons/input-button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,YAAY,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC"}