@smart-wizard/ui 0.0.0-stage → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../src/core.scss","../src/base/_reset.scss","../src/base/_root.scss","../src/base/_presets.scss","../src/components/_wizard.scss","../src/components/_navigation.scss","../src/components/_content.scss","../src/components/_toolbar.scss","../src/components/_progress.scss","../src/components/_loader.scss","../src/components/_buttons.scss","../src/components/_badges.scss","../src/layouts/_vertical.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACCA;EACI;;AAEA;AAAA;AAAA;EAGI;EACA;EACA;;;AC6BR;EACI;EAGA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EAGA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMJ;AAAA;AAAA;EA9EI;EAGA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EAGA;EAGA;;;AA8DJ;EACI;IArFA;IAGA;IACA;IACA;IACA;IACA;IAGA;IACA;IACA;IAGA;IACA;IAGA;IAGA;;;AChCJ;AAAA;AAAA;AAAA;AAOI;EACI;EAGA;;AAIJ;EACI;EAGA;;AAIJ;EACI;EAGA;;AAIJ;EACI;EAGA;;AAIJ;EACI;EAGA;;AAIJ;EACI;EAGA;;AAIJ;EACI;EAGA;;AAIJ;EACI;EAGA;;AAIJ;EACI;EAGA;;AAIJ;EACI;EAGA;;;ACjFR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;ACLA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAIA;EACI;;AAIR;EA3BJ;IA4BQ;IACA;IACA;;EAEA;IACI;;EAEA;IACI;;EAIA;IACI;IACA;IACA;IACA;IACA;IACA;IACA;IACA;;;AAOhB;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGI;EACI;;AAWR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAMR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAGI;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;;AAEA;EACI;EACA;;AAGJ;EACI;;AAMR;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAIR;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EACI;EACA;;AAGJ;EAEI;EACA;EACA;;AAKR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;EACA;;AAEA;EACI;;AAIR;EACI;EACA;;AAEA;EACI;;AAIR;EACI;EACA;EACA;;AAOR;EACI;;AAOA;EACI;;;AC1SZ;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAIJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EACI;;AAIR;EACI;EACA;EACA;;AAEA;EALJ;IAMQ;;;AAIR;EACI;EACA;;;ACzEZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;;ACtCZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;;ACdR;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;IACI;;;;ACpCZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAGJ;EAEI;EACA;EACA;;AAIR;EACI;EACA;EACA;EAEA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EAEA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EAEA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EAEA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EAEA;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;;ACvFJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;;ACvCR;EACI;EACA;EACA;EACA;;AAEA;EANJ;IAOQ;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EAXJ;IAYQ;IACA;IACA;;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAKZ;EACI;EACA;;AAEA;EAJJ;IAKQ;;;AAIR;EACI","file":"smartwizard.css"}
@@ -0,0 +1,7 @@
1
+ @charset "UTF-8";
2
+ /*! SmartWizard
3
+ * A modern, framework-agnostic wizard/stepper component
4
+ * https://github.com/techlab/smart-wizard
5
+ *
6
+ * Licensed under the terms of the MIT License
7
+ */.sw{box-sizing:border-box}.sw>*,.sw>:after,.sw>:before{box-sizing:border-box;margin:0;padding:0}.sw{color-scheme:light;--sw-bg:#fff;--sw-surface:#f8fafc;--sw-surface-2:#f1f5f9;--sw-border:#e2e8f0;--sw-border-strong:#8a96a8;--sw-text:#0f172a;--sw-text-muted:#475569;--sw-text-disabled:#94a3b8;--sw-primary:#4f46e5;--sw-on-primary:#fff;--sw-success:#22c55e;--sw-warning:#f59e0b;--sw-danger:#ef4444;--sw-info:#0ea5e9;--sw-on-status:#0b1220;--sw-radius:.4rem;--sw-radius-lg:.75rem;--sw-border-width:1px;--sw-shadow:0 4px 20px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.04);--sw-transition:.2s cubic-bezier(.4,0,.2,1);--sw-panel-padding:24px;--sw-nav-padding:14px 20px;--sw-btn-padding:8px 18px;--sw-disabled-opacity:.45;--_sw-mix:#000;--_sw-primary-hover:color-mix(in srgb,var(--sw-primary) 88%,var(--_sw-mix));--_sw-primary-active:color-mix(in srgb,var(--sw-primary) 76%,var(--_sw-mix));--_sw-primary-tint:color-mix(in srgb,var(--sw-primary) 14%,transparent);--_sw-primary-tint-strong:color-mix(in srgb,var(--sw-primary) 22%,transparent);--_sw-ring:color-mix(in srgb,var(--sw-primary) 45%,transparent);--_sw-overlay:color-mix(in srgb,var(--sw-bg) 70%,transparent)}.dark .sw,.sw[data-color-scheme=dark],[data-color-scheme=dark] .sw{color-scheme:dark;--sw-bg:#11151d;--sw-surface:#1b2130;--sw-surface-2:#252c3d;--sw-border:#31384b;--sw-border-strong:#6b7689;--sw-text:#f1f5f9;--sw-text-muted:#94a3b8;--sw-text-disabled:#5f6778;--sw-primary:#818cf8;--sw-on-primary:#0f1226;--sw-shadow:0 4px 20px rgba(0,0,0,.5),0 0 0 1px hsla(0,0%,100%,.06);--_sw-mix:#fff}@media (prefers-color-scheme:dark){.sw[data-color-scheme=auto]{color-scheme:dark;--sw-bg:#11151d;--sw-surface:#1b2130;--sw-surface-2:#252c3d;--sw-border:#31384b;--sw-border-strong:#6b7689;--sw-text:#f1f5f9;--sw-text-muted:#94a3b8;--sw-text-disabled:#5f6778;--sw-primary:#818cf8;--sw-on-primary:#0f1226;--sw-shadow:0 4px 20px rgba(0,0,0,.5),0 0 0 1px hsla(0,0%,100%,.06);--_sw-mix:#fff}}.sw[data-color=ocean]{--sw-primary:#0288d1;--sw-on-primary:#fff}.sw[data-color=forest]{--sw-primary:#388e3c;--sw-on-primary:#f1f8e9}.sw[data-color=violet]{--sw-primary:#7b1fa2;--sw-on-primary:#f3e5f5}.sw[data-color=crimson]{--sw-primary:#c2185b;--sw-on-primary:#fce4ec}.sw[data-color=amber]{--sw-primary:#ffa000;--sw-on-primary:#fff}.sw[data-color=indigo]{--sw-primary:#3949ab;--sw-on-primary:#fff}.sw[data-color=slate]{--sw-primary:#1e40af;--sw-on-primary:#fff}.sw[data-color=teal]{--sw-primary:#0097a7;--sw-on-primary:#fff}.sw[data-color=purple]{--sw-primary:#7c3aed;--sw-on-primary:#fff}.sw[data-color=green]{--sw-primary:#16a34a;--sw-on-primary:#fff}.sw{border:var(--sw-border-width) solid var(--sw-border);border-radius:var(--sw-radius-lg);box-shadow:var(--sw-shadow);font-family:inherit;overflow:hidden}.sw,.sw>.sw-nav{background:var(--sw-bg);position:relative}.sw>.sw-nav{align-items:stretch;border-bottom:var(--sw-border-width) solid var(--sw-border);display:flex;flex-wrap:nowrap;gap:0;list-style:none;margin:0;overflow-x:auto;overflow-y:hidden;padding:0;scroll-behavior:smooth;scrollbar-width:none;-webkit-overflow-scrolling:touch}.sw>.sw-nav::-webkit-scrollbar{display:none}.sw>.sw-nav:hover>.sw-nav-scroll-btn{opacity:.8}@media screen and (max-width:640px){.sw>.sw-nav{border-bottom:none;flex:1 auto;flex-direction:column!important}.sw>.sw-nav>.sw-nav-item{border-bottom:var(--sw-border-width) solid var(--sw-border)}.sw>.sw-nav>.sw-nav-item:last-child{border-bottom:none}.sw>.sw-nav>.sw-nav-item.active:before{background:var(--sw-on-primary);bottom:0;content:"";left:0;opacity:.5;position:absolute;top:0;width:4px}}.sw>.sw-nav .sw-nav-item-group{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;list-style:none;position:relative;text-decoration:none;transition:var(--sw-transition);-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap;width:100%;z-index:1}.sw>.sw-nav .sw-nav-item-group:has(.sw-nav-item.active) .sw-group-header{color:var(--sw-primary)!important}.sw>.sw-nav .sw-nav-item-group>.sw-group-header{align-items:center;background:var(--sw-surface-2);color:var(--sw-text-muted);display:flex;flex-basis:100%;font-weight:700;justify-content:center;padding:5px}.sw>.sw-nav .sw-nav-item-group>.sw-nav-item{flex:1}.sw>.sw-nav .sw-nav-item{align-items:center;background:transparent;border-bottom:2px solid transparent;color:var(--sw-text-muted);cursor:default;display:flex;gap:10px;list-style:none;padding:var(--sw-nav-padding);position:relative;text-decoration:none;transition:var(--sw-transition);-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap;width:100%;z-index:1}.sw>.sw-nav .sw-nav-item:active,.sw>.sw-nav .sw-nav-item:focus,.sw>.sw-nav .sw-nav-item:hover{text-decoration:none}.sw>.sw-nav .sw-nav-item:focus-visible{box-shadow:inset 0 0 0 2px var(--_sw-ring);outline:none;z-index:10}.sw>.sw-nav .sw-nav-item:hover:not(.disabled) .badge{transform:scale(1.05)}.sw>.sw-nav .sw-nav-item::-moz-focus-inner{border:0}.sw>.sw-nav .sw-nav-item>.badge{align-items:center;background:var(--sw-bg);border:1px solid var(--sw-border);border-radius:50%;clear:both;color:var(--sw-text-muted);display:flex;flex-shrink:0;font-size:1em;height:28px;justify-content:center;line-height:1;pointer-events:none;transition:var(--sw-transition);width:28px}.sw>.sw-nav .sw-nav-item>.info{display:flex;flex-direction:column}.sw>.sw-nav .sw-nav-item>.info>.title{font-size:1em;font-weight:700}.sw>.sw-nav .sw-nav-item>.info>.desc{font-size:.8em}.sw>.sw-nav .sw-nav-item.active{background:var(--sw-primary);color:var(--sw-on-primary);cursor:pointer}.sw>.sw-nav .sw-nav-item.active .badge{background:var(--_sw-primary-active);border-color:var(--_sw-primary-hover);box-shadow:0 0 0 4px var(--_sw-primary-tint);color:var(--sw-on-primary)}.sw>.sw-nav .sw-nav-item.completed{background:var(--_sw-primary-tint);color:var(--sw-primary);cursor:pointer}.sw>.sw-nav .sw-nav-item.completed .badge{background:var(--sw-primary);border-color:transparent;color:var(--sw-on-primary)}.sw>.sw-nav .sw-nav-item.error{background:var(--sw-danger);color:var(--sw-on-status);cursor:pointer}.sw>.sw-nav .sw-nav-item.error .badge{background:var(--sw-danger);border-color:transparent;color:var(--sw-on-status)}.sw>.sw-nav .sw-nav-item.warning{background:var(--sw-warning);color:var(--sw-on-status);cursor:pointer}.sw>.sw-nav .sw-nav-item.warning .badge{background:var(--sw-warning);border-color:transparent;color:var(--sw-on-status)}.sw>.sw-nav .sw-nav-item.hidden{display:none;visibility:hidden}.sw>.sw-nav .sw-nav-item.disabled,.sw>.sw-nav .sw-nav-item:disabled{cursor:not-allowed;opacity:var(--sw-disabled-opacity);pointer-events:none}.sw>.sw-nav>.sw-nav-scroll-btn{align-items:center;background:var(--sw-bg);border:none;color:var(--sw-text);cursor:pointer;display:flex;flex-shrink:0;font-size:2em;justify-content:center;opacity:.5;padding:0;position:sticky;transition:var(--sw-transition);width:40px;z-index:20}.sw>.sw-nav>.sw-nav-scroll-btn:before{content:" ";display:inline-block;transition:transform .2s ease}.sw>.sw-nav>.sw-nav-scroll-btn:first-child{border-right:var(--sw-border-width) solid var(--sw-border);left:0}.sw>.sw-nav>.sw-nav-scroll-btn:first-child:before{content:"‹"}.sw>.sw-nav>.sw-nav-scroll-btn:last-child{border-left:var(--sw-border-width) solid var(--sw-border);right:0}.sw>.sw-nav>.sw-nav-scroll-btn:last-child:before{content:"›"}.sw>.sw-nav>.sw-nav-scroll-btn:hover{background:var(--sw-surface-2);color:var(--sw-text);opacity:1}.sw.sw-justified>.sw-nav{justify-content:space-between}.sw[dir=rtl]>.sw-nav .sw-nav-item>.badge{float:right}.sw>.sw-panels{min-height:140px;position:relative;transition:height .5s ease}.sw>.sw-panels,.sw>.sw-panels>.sw-panel{background:var(--sw-surface);color:var(--sw-text);padding:var(--sw-panel-padding)}.sw>.sw-panels>.sw-panel{display:none;width:100%}.sw>.sw-panels>.sw-panel.active{display:block}.sw>.sw-panels>.sw-panel .sw-title{color:var(--sw-text);font-size:1.5rem;font-weight:700;margin-bottom:.5rem}.sw>.sw-panels>.sw-panel .sw-desc{color:var(--sw-text);font-size:1rem;margin-bottom:1.5rem}.sw>.sw-panels>.sw-panel .sw-label{color:var(--sw-text);display:block;margin-bottom:1rem}.sw>.sw-panels>.sw-panel .sw-input{background:var(--sw-bg);border:var(--sw-border-width) solid var(--sw-border);border-radius:var(--sw-radius);color:var(--sw-text);margin-bottom:1.25rem;outline:none;padding:.5rem;transition:var(--sw-transition);width:100%}.sw>.sw-panels>.sw-panel .sw-input:focus{border-color:var(--sw-primary);box-shadow:0 0 0 2px var(--_sw-ring)}.sw>.sw-panels>.sw-panel .sw-input::-moz-placeholder{color:var(--sw-text-muted)}.sw>.sw-panels>.sw-panel .sw-input::placeholder{color:var(--sw-text-muted)}.sw>.sw-panels>.sw-panel .sw-field-row{display:grid;gap:0 1.5rem;grid-template-columns:1fr 1fr}@media screen and (max-width:640px){.sw>.sw-panels>.sw-panel .sw-field-row{grid-template-columns:1fr}}.sw>.sw-panels>.sw-panel .sw-field{display:flex;flex-direction:column}.sw .sw-toolbar{align-items:center;background:var(--sw-surface);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;padding:1rem}.sw .sw-toolbar-top{border-bottom:var(--sw-border-width) solid var(--sw-border);border-top:none}.sw .sw-toolbar-bottom{border-bottom:none;border-top:var(--sw-border-width) solid var(--sw-border)}.sw .sw-toolbar-divider{background:var(--sw-border);height:24px;margin:0 .5rem;width:1px}.sw .sw-toolbar-group{align-items:center;display:flex;flex:auto;gap:.5rem;justify-content:center}.sw .sw-toolbar-group:first-child{justify-content:flex-start}.sw .sw-toolbar-group:last-child{justify-content:flex-end}.sw .sw-progress{background:var(--sw-border);border:0;border-radius:var(--sw-radius);height:4px;margin:0;overflow:hidden;padding:0;width:100%}.sw .sw-progress .sw-progress-bar{background:var(--sw-primary);height:100%;transition:width var(--sw-transition);width:0}.sw.sw-loading{-webkit-user-select:none;-moz-user-select:none;user-select:none}.sw.sw-loading:after{align-items:center;background:var(--_sw-overlay);content:"";display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1000}.sw.sw-loading:before{animation:sw-spinner .8s linear infinite;border:4px solid var(--sw-border);border-radius:50%;border-top-color:var(--sw-primary);content:"";height:40px;left:50%;margin-left:-20px;margin-top:-20px;position:absolute;top:50%;width:40px;z-index:1001}@keyframes sw-spinner{to{transform:rotate(1turn)}}.sw .sw-btn{align-items:center;background:var(--sw-btn-default-bg);border:var(--sw-border-width) solid var(--sw-btn-default-border);border-radius:var(--sw-radius);color:var(--sw-btn-default-text);cursor:pointer;display:flex;font-weight:600;gap:6px;padding:var(--sw-btn-padding);transition:var(--sw-transition)}.sw .sw-btn:hover{box-shadow:0 0 0 2px var(--sw-surface-2)}.sw .sw-btn:focus-visible{box-shadow:0 0 0 2px var(--_sw-ring);outline:none}.sw .sw-btn:disabled,.sw .sw-btn[disabled]{cursor:not-allowed;opacity:.45;pointer-events:none}.sw .sw-btn-primary{--sw-btn-default-bg:var(--sw-primary);--sw-btn-default-border:var(--sw-primary);--sw-btn-default-text:var(--sw-on-primary);--sw-btn-hover-bg:var(--_sw-primary-hover);--sw-btn-hover-border:var(--_sw-primary-hover);--sw-btn-hover-text:var(--sw-on-primary)}.sw .sw-btn-success{--sw-btn-default-bg:var(--sw-success);--sw-btn-default-border:var(--sw-success);--sw-btn-default-text:var(--sw-on-status);--sw-btn-hover-bg:var(--sw-success);--sw-btn-hover-border:var(--sw-success);--sw-btn-hover-text:var(--sw-on-status)}.sw .sw-btn-danger{--sw-btn-default-bg:var(--sw-danger);--sw-btn-default-border:var(--sw-danger);--sw-btn-default-text:var(--sw-on-status);--sw-btn-hover-bg:var(--sw-danger);--sw-btn-hover-border:var(--sw-danger);--sw-btn-hover-text:var(--sw-on-status)}.sw .sw-btn-warning{--sw-btn-default-bg:var(--sw-warning);--sw-btn-default-border:var(--sw-warning);--sw-btn-default-text:var(--sw-on-status);--sw-btn-hover-bg:var(--sw-warning);--sw-btn-hover-border:var(--sw-warning);--sw-btn-hover-text:var(--sw-on-status)}.sw .sw-btn-info{--sw-btn-default-bg:var(--sw-info);--sw-btn-default-border:var(--sw-info);--sw-btn-default-text:var(--sw-on-status);--sw-btn-hover-bg:var(--sw-info);--sw-btn-hover-border:var(--sw-info);--sw-btn-hover-text:var(--sw-on-status)}.sw .sw-btn-sm{--sw-btn-padding:5px 12px;font-size:12.5px}.sw .sw-btn-lg{--sw-btn-padding:11px 28px;font-size:15px}.sw .sw-badge{align-items:center;background:var(--sw-badge-default-bg);border:1px solid var(--sw-badge-default-border);border-radius:var(--sw-radius-lg);color:var(--sw-badge-default-text);display:inline-flex;font-size:.75rem;font-weight:600;gap:4px;padding:4px 8px}.sw .sw-badge-primary{--sw-badge-default-bg:var(--sw-primary);--sw-badge-default-text:var(--sw-on-primary);--sw-badge-default-border:var(--_sw-primary-hover)}.sw .sw-badge-success{--sw-badge-default-bg:var(--sw-success);--sw-badge-default-text:var(--sw-on-status);--sw-badge-default-border:var(--sw-success)}.sw .sw-badge-danger{--sw-badge-default-bg:var(--sw-danger);--sw-badge-default-text:var(--sw-on-status);--sw-badge-default-border:var(--sw-danger)}.sw .sw-badge-warning{--sw-badge-default-bg:var(--sw-warning);--sw-badge-default-text:var(--sw-on-status);--sw-badge-default-border:var(--sw-warning)}.sw .sw-badge-info{--sw-badge-default-bg:var(--sw-info);--sw-badge-default-text:var(--sw-on-status);--sw-badge-default-border:var(--sw-info)}.sw-layout-vertical{display:grid;gap:0;grid-auto-rows:auto;grid-template-columns:280px 1fr}@media screen and (max-width:640px){.sw-layout-vertical{grid-template-columns:1fr}}.sw-layout-vertical>.sw-nav{border-right:var(--sw-border-width) solid var(--sw-border);flex-direction:column;flex-shrink:0;grid-column:1;height:-moz-fit-content;height:fit-content;overflow-y:auto;position:sticky;top:0}@media screen and (max-width:640px){.sw-layout-vertical>.sw-nav{border-bottom:var(--sw-border-width) solid var(--sw-border);border-right:none;position:relative}}.sw-layout-vertical>.sw-nav .sw-nav-item-group{align-items:stretch;display:flex;flex-direction:column;width:100%}.sw-layout-vertical>.sw-nav .sw-nav-item-group>.sw-group-header{background:transparent;border-right:none;color:var(--sw-text);font-size:.75em;justify-content:flex-start;padding:15px 20px 5px}.sw-layout-vertical>.sw-nav .sw-nav-item-group>.sw-nav-item{padding-left:35px}.sw-layout-vertical>.sw-nav>.sw-nav-scroll-btn{width:100%}.sw-layout-vertical>.sw-nav>.sw-nav-scroll-btn:before{transform:rotate(90deg)}.sw-layout-vertical>.sw-nav>.sw-nav-scroll-btn:first-child{border-bottom:var(--sw-border-width) solid var(--sw-border);border-right:none;left:auto;top:0}.sw-layout-vertical>.sw-nav>.sw-nav-scroll-btn:last-child{border-left:none;border-top:var(--sw-border-width) solid var(--sw-border);bottom:0;right:auto}.sw-layout-vertical>.sw-panels{grid-column:2;min-width:0}@media screen and (max-width:640px){.sw-layout-vertical>.sw-panels{grid-column:1}}.sw-layout-vertical>:not(.sw-nav):not(.sw-panels){grid-column:1/-1}
@@ -0,0 +1,98 @@
1
+ .sw-theme-arrows {
2
+ --sw-arrow-height: 56px;
3
+ --sw-arrow-tip: 20px;
4
+ --sw-arrow-gap: 0px;
5
+ --sw-min-step-width: 120px;
6
+ border: 1px solid var(--sw-border);
7
+ }
8
+ .sw-theme-arrows > .sw-nav .sw-nav-item-group:last-of-type .sw-nav-item:last-of-type {
9
+ margin-right: 0;
10
+ clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 20px 50%);
11
+ }
12
+ .sw-theme-arrows > .sw-nav .sw-nav-item-group:first-of-type .sw-nav-item:first-of-type {
13
+ margin-right: calc(-1 * var(--sw-arrow-tip));
14
+ padding-left: 14px;
15
+ clip-path: polygon(0% 0%, calc(100% - 20px) 0%, 100% 50%, calc(100% - 20px) 100%, 0% 100%);
16
+ }
17
+ .sw-theme-arrows > .sw-nav > *:not(.sw-nav-item-group):last-of-type {
18
+ margin-right: 0;
19
+ clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 20px 50%);
20
+ }
21
+ .sw-theme-arrows > .sw-nav > *:not(.sw-nav-item-group):first-of-type {
22
+ margin-right: calc(-1 * var(--sw-arrow-tip));
23
+ padding-left: 14px;
24
+ clip-path: polygon(0% 0%, calc(100% - 20px) 0%, 100% 50%, calc(100% - 20px) 100%, 0% 100%);
25
+ }
26
+ .sw-theme-arrows > .sw-nav .sw-nav-item {
27
+ flex: 1 0 var(--sw-min-step-width);
28
+ margin-right: calc(-1 * var(--sw-arrow-tip));
29
+ gap: 10px;
30
+ min-height: var(--sw-arrow-height);
31
+ padding: 10px 20px 10px calc(var(--sw-arrow-tip) + 14px);
32
+ clip-path: polygon(0% 0%, calc(100% - 20px) 0%, 100% 50%, calc(100% - 20px) 100%, 0% 100%, 20px 50%);
33
+ }
34
+ @media screen and (max-width: 640px) {
35
+ .sw-theme-arrows > .sw-nav .sw-nav-item {
36
+ min-height: unset;
37
+ overflow: hidden;
38
+ text-align: left !important;
39
+ margin-right: 0 !important;
40
+ margin-left: 0 !important;
41
+ flex: 1 0 auto;
42
+ clip-path: none !important;
43
+ padding: 10px 14px !important;
44
+ }
45
+ }
46
+ .sw-theme-arrows > .sw-nav .sw-nav-item:only-of-type {
47
+ margin-right: 0;
48
+ clip-path: none;
49
+ border-radius: var(--sw-radius);
50
+ }
51
+ .sw-theme-arrows.sw-layout-vertical > .sw-nav .sw-nav-item {
52
+ clip-path: none !important;
53
+ margin-right: 0 !important;
54
+ padding: 10px calc(var(--sw-arrow-tip) + 14px) !important;
55
+ }
56
+ .sw-theme-arrows.sw-layout-vertical > .sw-nav .sw-nav-item-group .sw-nav-item:first-of-type,
57
+ .sw-theme-arrows.sw-layout-vertical > .sw-nav .sw-nav-item-group .sw-nav-item:last-of-type {
58
+ clip-path: none !important;
59
+ margin-right: 0 !important;
60
+ padding-left: calc(var(--sw-arrow-tip) + 14px) !important;
61
+ }
62
+ .sw-theme-arrows.sw-layout-vertical > .sw-nav > .sw-nav-item:first-of-type, .sw-theme-arrows.sw-layout-vertical > .sw-nav > .sw-nav-item:last-of-type {
63
+ clip-path: none !important;
64
+ margin-right: 0 !important;
65
+ padding-left: calc(var(--sw-arrow-tip) + 14px) !important;
66
+ }
67
+ .sw-theme-arrows[dir=rtl] > .sw-nav .sw-nav-item {
68
+ margin-right: 0;
69
+ margin-left: calc(-1 * var(--sw-arrow-tip));
70
+ padding: 10px calc(var(--sw-arrow-tip) + 14px) 10px 20px;
71
+ clip-path: polygon(100% 0%, var(--sw-arrow-tip) 0%, 0% 50%, var(--sw-arrow-tip) 100%, 100% 100%, calc(100% - var(--sw-arrow-tip)) 50%);
72
+ }
73
+ @media screen and (max-width: 640px) {
74
+ .sw-theme-arrows[dir=rtl] > .sw-nav .sw-nav-item {
75
+ text-align: right !important;
76
+ margin-right: 0 !important;
77
+ margin-left: 0 !important;
78
+ flex: 1 0 auto;
79
+ clip-path: none !important;
80
+ padding: 10px 14px !important;
81
+ }
82
+ }
83
+ .sw-theme-arrows[dir=rtl] > .sw-nav .sw-nav-item:first-of-type {
84
+ margin-left: calc(-1 * var(--sw-arrow-tip));
85
+ padding-right: 14px;
86
+ clip-path: polygon(var(--sw-arrow-tip) 0%, 100% 0%, 100% 100%, var(--sw-arrow-tip) 100%, 0% 50%);
87
+ }
88
+ .sw-theme-arrows[dir=rtl] > .sw-nav .sw-nav-item:last-of-type {
89
+ margin-left: 0;
90
+ clip-path: polygon(0% 0%, 100% 0%, calc(100% - var(--sw-arrow-tip)) 50%, 100% 100%, 0% 100%);
91
+ }
92
+ .sw-theme-arrows[dir=rtl] > .sw-nav .sw-nav-item:only-of-type {
93
+ margin-left: 0;
94
+ clip-path: none;
95
+ border-radius: var(--sw-radius);
96
+ }
97
+
98
+ /*# sourceMappingURL=arrows.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../src/themes/arrows.scss","../../src/base/_mixins.scss"],"names":[],"mappings":"AAIA;EAEI;EACA;EACA;EACA;EAEA;;AASY;EACI;ECAhB;;ADSgB;EACI;EACA;ECnBpB;;AD4BQ;EACI;ECrBZ;;AD0BQ;EACI;EACA;ECpCZ;;AD0CI;EACI;EACA;EACA;EACA;EACA;ECxDR;;AD2DQ;EARJ;IASQ;IACA;IACA;IACA;IACA;IACA;IAEA;IACA;;;AAGJ;EACI;EAEA;EACA;;AAUR;EACI;EACA;EACA;;AAKA;AAAA;EAEI;EACA;EACA;;AAKR;EAEI;EACA;EACA;;AAOJ;EACI;EACA;EACA;EACA;;AAOA;EAXJ;IAYQ;IACA;IACA;IACA;IACA;IACA;;;AAIJ;EACI;EACA;EACA;;AAQJ;EACI;EACA;;AAOJ;EACI;EACA;EACA","file":"arrows.css"}
@@ -0,0 +1 @@
1
+ .sw-theme-arrows{--sw-arrow-height:56px;--sw-arrow-tip:20px;--sw-arrow-gap:0px;--sw-min-step-width:120px;border:1px solid var(--sw-border)}.sw-theme-arrows>.sw-nav .sw-nav-item-group:last-of-type .sw-nav-item:last-of-type{clip-path:polygon(0 0,100% 0,100% 100%,0 100%,20px 50%);margin-right:0}.sw-theme-arrows>.sw-nav .sw-nav-item-group:first-of-type .sw-nav-item:first-of-type{clip-path:polygon(0 0,calc(100% - 20px) 0,100% 50%,calc(100% - 20px) 100%,0 100%);margin-right:calc(var(--sw-arrow-tip)*-1);padding-left:14px}.sw-theme-arrows>.sw-nav>:not(.sw-nav-item-group):last-of-type{clip-path:polygon(0 0,100% 0,100% 100%,0 100%,20px 50%);margin-right:0}.sw-theme-arrows>.sw-nav>:not(.sw-nav-item-group):first-of-type{clip-path:polygon(0 0,calc(100% - 20px) 0,100% 50%,calc(100% - 20px) 100%,0 100%);margin-right:calc(var(--sw-arrow-tip)*-1);padding-left:14px}.sw-theme-arrows>.sw-nav .sw-nav-item{clip-path:polygon(0 0,calc(100% - 20px) 0,100% 50%,calc(100% - 20px) 100%,0 100%,20px 50%);flex:1 0 var(--sw-min-step-width);gap:10px;margin-right:calc(var(--sw-arrow-tip)*-1);min-height:var(--sw-arrow-height);padding:10px 20px 10px calc(var(--sw-arrow-tip) + 14px)}@media screen and (max-width:640px){.sw-theme-arrows>.sw-nav .sw-nav-item{clip-path:none!important;flex:1 0 auto;margin-left:0!important;margin-right:0!important;min-height:unset;overflow:hidden;padding:10px 14px!important;text-align:left!important}}.sw-theme-arrows>.sw-nav .sw-nav-item:only-of-type{border-radius:var(--sw-radius);clip-path:none;margin-right:0}.sw-theme-arrows.sw-layout-vertical>.sw-nav .sw-nav-item{clip-path:none!important;margin-right:0!important;padding:10px calc(var(--sw-arrow-tip) + 14px)!important}.sw-theme-arrows.sw-layout-vertical>.sw-nav .sw-nav-item-group .sw-nav-item:first-of-type,.sw-theme-arrows.sw-layout-vertical>.sw-nav .sw-nav-item-group .sw-nav-item:last-of-type,.sw-theme-arrows.sw-layout-vertical>.sw-nav>.sw-nav-item:first-of-type,.sw-theme-arrows.sw-layout-vertical>.sw-nav>.sw-nav-item:last-of-type{clip-path:none!important;margin-right:0!important;padding-left:calc(var(--sw-arrow-tip) + 14px)!important}.sw-theme-arrows[dir=rtl]>.sw-nav .sw-nav-item{clip-path:polygon(100% 0,var(--sw-arrow-tip) 0,0 50%,var(--sw-arrow-tip) 100%,100% 100%,calc(100% - var(--sw-arrow-tip)) 50%);margin-left:calc(var(--sw-arrow-tip)*-1);margin-right:0;padding:10px calc(var(--sw-arrow-tip) + 14px) 10px 20px}@media screen and (max-width:640px){.sw-theme-arrows[dir=rtl]>.sw-nav .sw-nav-item{clip-path:none!important;flex:1 0 auto;margin-left:0!important;margin-right:0!important;padding:10px 14px!important;text-align:right!important}}.sw-theme-arrows[dir=rtl]>.sw-nav .sw-nav-item:first-of-type{clip-path:polygon(var(--sw-arrow-tip) 0,100% 0,100% 100%,var(--sw-arrow-tip) 100%,0 50%);margin-left:calc(var(--sw-arrow-tip)*-1);padding-right:14px}.sw-theme-arrows[dir=rtl]>.sw-nav .sw-nav-item:last-of-type{clip-path:polygon(0 0,100% 0,calc(100% - var(--sw-arrow-tip)) 50%,100% 100%,0 100%);margin-left:0}.sw-theme-arrows[dir=rtl]>.sw-nav .sw-nav-item:only-of-type{border-radius:var(--sw-radius);clip-path:none;margin-left:0}
@@ -0,0 +1,22 @@
1
+ .sw-theme-pills > .sw-nav {
2
+ padding: 8px 10px;
3
+ gap: 8px;
4
+ }
5
+ .sw-theme-pills > .sw-nav .sw-nav-item {
6
+ clip-path: none !important;
7
+ border-radius: 999px;
8
+ border: 2px solid transparent;
9
+ padding: 10px 18px !important;
10
+ }
11
+ .sw-theme-pills > .sw-nav .sw-nav-item.active {
12
+ border-color: color-mix(in srgb, var(--sw-primary) 50%, transparent);
13
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--sw-primary) 38%, transparent);
14
+ }
15
+ .sw-theme-pills > .sw-nav .sw-nav-item.completed {
16
+ border-color: color-mix(in srgb, var(--_sw-primary-tint) 50%, transparent);
17
+ }
18
+ .sw-theme-pills.sw-layout-vertical > .sw-nav .sw-nav-item-group > .sw-nav-item {
19
+ margin: 5px 0 !important;
20
+ }
21
+
22
+ /*# sourceMappingURL=pills.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../src/themes/pills.scss"],"names":[],"mappings":"AAMI;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EACI;;AAOR;EACI","file":"pills.css"}
@@ -0,0 +1 @@
1
+ .sw-theme-pills>.sw-nav{gap:8px;padding:8px 10px}.sw-theme-pills>.sw-nav .sw-nav-item{border:2px solid transparent;border-radius:999px;clip-path:none!important;padding:10px 18px!important}.sw-theme-pills>.sw-nav .sw-nav-item.active{border-color:color-mix(in srgb,var(--sw-primary) 50%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--sw-primary) 38%,transparent)}.sw-theme-pills>.sw-nav .sw-nav-item.completed{border-color:color-mix(in srgb,var(--_sw-primary-tint) 50%,transparent)}.sw-theme-pills.sw-layout-vertical>.sw-nav .sw-nav-item-group>.sw-nav-item{margin:5px 0!important}
package/package.json CHANGED
@@ -1,6 +1,73 @@
1
1
  {
2
2
  "name": "@smart-wizard/ui",
3
- "version": "0.0.0-stage",
4
- "stub": true,
5
- "description": "Temporary package placeholder for staged publishing"
3
+ "version": "1.0.1",
4
+ "description": "Core styles for SmartWizard - framework-agnostic wizard component",
5
+ "style": "dist/smartwizard.css",
6
+ "main": "dist/smartwizard.css",
7
+ "publishConfig": {
8
+ "access": "public"
9
+ },
10
+ "exports": {
11
+ ".": {
12
+ "import": "./dist/smartwizard.css",
13
+ "style": "./dist/smartwizard.css",
14
+ "default": "./dist/smartwizard.css"
15
+ },
16
+ "./full": {
17
+ "import": "./dist/smartwizard-full.css",
18
+ "style": "./dist/smartwizard-full.css",
19
+ "default": "./dist/smartwizard-full.css"
20
+ },
21
+ "./themes/*": {
22
+ "import": "./dist/themes/*.css",
23
+ "style": "./dist/themes/*.css",
24
+ "default": "./dist/themes/*.css"
25
+ }
26
+ },
27
+ "files": [
28
+ "dist",
29
+ "README.md",
30
+ "LICENSE"
31
+ ],
32
+ "sideEffects": [
33
+ "*.css"
34
+ ],
35
+ "keywords": [
36
+ "wizard",
37
+ "stepper",
38
+ "form",
39
+ "multi-step",
40
+ "styles",
41
+ "css",
42
+ "scss"
43
+ ],
44
+ "author": {
45
+ "name": "Dipu Rajendran",
46
+ "email": "hello.techlab@gmail.com",
47
+ "url": "https://github.com/techlab"
48
+ },
49
+ "license": "MIT",
50
+ "devDependencies": {
51
+ "autoprefixer": "^10.5.0",
52
+ "cssnano": "^7.1.9",
53
+ "postcss": "^8.5.14",
54
+ "postcss-cli": "^11.0.1",
55
+ "sass": "^1.70.0"
56
+ },
57
+ "repository": {
58
+ "type": "git",
59
+ "url": "https://github.com/techlab/smart-wizard.git",
60
+ "directory": "packages/ui"
61
+ },
62
+ "homepage": "https://github.com/techlab/smart-wizard#readme",
63
+ "bugs": {
64
+ "url": "https://github.com/techlab/smart-wizard/issues"
65
+ },
66
+ "scripts": {
67
+ "build:core": "sass src/core.scss dist/smartwizard.css && postcss dist/smartwizard.css -u autoprefixer cssnano -o dist/smartwizard.min.css --no-map",
68
+ "build:full": "sass src/full.scss dist/smartwizard-full.css && postcss dist/smartwizard-full.css -u autoprefixer cssnano -o dist/smartwizard-full.min.css --no-map",
69
+ "build:themes": "sass --load-path=src src/themes:dist/themes && postcss \"dist/themes/*.css\" !\"dist/themes/*.min.css\" -u autoprefixer cssnano --dir dist/themes --ext .min.css --no-map",
70
+ "build": "pnpm run build:core && pnpm run build:full && pnpm run build:themes",
71
+ "dev": "sass --watch src/core.scss:dist/smartwizard.css src/full.scss:dist/smartwizard-full.css src/themes:dist/themes"
72
+ }
6
73
  }