@solid-design-system/components 1.0.2 → 1.2.0
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.
- package/dist/components/es/accordion-group.js +1 -0
- package/dist/components/es/accordion.js +1 -0
- package/dist/components/es/button.js +12 -12
- package/dist/components/es/divider.js +1 -0
- package/dist/components/es/if-defined.js +2 -7
- package/dist/components/es/link.js +1 -1
- package/dist/components/es/query.js +6 -0
- package/dist/components/es/solid-components2.js +1 -1
- package/dist/components/es/solid-element.js +1 -1
- package/dist/components/umd/solid-components.js +46 -46
- package/dist/custom-elements.json +1 -1
- package/dist/package/components/accordion/accordion.d.ts +23 -0
- package/dist/package/components/accordion/accordion.js +152 -0
- package/dist/package/components/accordion-group/accordion-group.d.ts +16 -0
- package/dist/package/components/accordion-group/accordion-group.js +63 -0
- package/dist/package/components/divider/divider.d.ts +13 -0
- package/dist/package/components/divider/divider.js +50 -0
- package/dist/package/internal/animate.d.ts +10 -0
- package/dist/package/internal/animate.js +41 -0
- package/dist/package/internal/event.d.ts +1 -0
- package/dist/package/internal/event.js +14 -0
- package/dist/package/solid-components.d.ts +3 -0
- package/dist/package/solid-components.js +16 -10
- package/dist/package/styles/tailwind.css.js +1 -1
- package/dist/package/utilities/animation-registry.d.ts +14 -0
- package/dist/package/utilities/animation-registry.js +35 -0
- package/dist/versioned-components/es/accordion-group.js +1 -0
- package/dist/versioned-components/es/accordion.js +1 -0
- package/dist/versioned-components/es/button.js +28 -28
- package/dist/versioned-components/es/divider.js +1 -0
- package/dist/versioned-components/es/icon.js +1 -1
- package/dist/versioned-components/es/if-defined.js +2 -7
- package/dist/versioned-components/es/include.js +1 -1
- package/dist/versioned-components/es/link.js +1 -1
- package/dist/versioned-components/es/query.js +6 -0
- package/dist/versioned-components/es/solid-components2.js +1 -1
- package/dist/versioned-components/es/solid-element.js +1 -1
- package/dist/versioned-components/es/spinner.js +1 -1
- package/dist/versioned-package/components/accordion/accordion.d.ts +23 -0
- package/dist/versioned-package/components/accordion/accordion.js +152 -0
- package/dist/versioned-package/components/accordion-group/accordion-group.d.ts +16 -0
- package/dist/versioned-package/components/accordion-group/accordion-group.js +63 -0
- package/dist/versioned-package/components/button/button.d.ts +1 -1
- package/dist/versioned-package/components/button/button.js +18 -18
- package/dist/versioned-package/components/divider/divider.d.ts +13 -0
- package/dist/versioned-package/components/divider/divider.js +50 -0
- package/dist/versioned-package/components/icon/icon.d.ts +1 -1
- package/dist/versioned-package/components/icon/icon.js +1 -1
- package/dist/versioned-package/components/include/include.d.ts +1 -1
- package/dist/versioned-package/components/include/include.js +1 -1
- package/dist/versioned-package/components/link/link.d.ts +1 -1
- package/dist/versioned-package/components/link/link.js +2 -2
- package/dist/versioned-package/components/spinner/spinner.d.ts +1 -1
- package/dist/versioned-package/components/spinner/spinner.js +1 -1
- package/dist/versioned-package/internal/animate.d.ts +10 -0
- package/dist/versioned-package/internal/animate.js +41 -0
- package/dist/versioned-package/internal/event.d.ts +1 -0
- package/dist/versioned-package/internal/event.js +14 -0
- package/dist/versioned-package/internal/form.js +1 -1
- package/dist/versioned-package/solid-components.d.ts +3 -0
- package/dist/versioned-package/solid-components.js +16 -10
- package/dist/versioned-package/styles/tailwind.css.js +1 -1
- package/dist/versioned-package/utilities/animation-registry.d.ts +14 -0
- package/dist/versioned-package/utilities/animation-registry.js +35 -0
- package/dist/vscode.html-custom-data.json +111 -5
- package/dist/web-types.json +312 -6
- package/package.json +10 -5
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const tailwind = '/*! tailwindcss v3.3.2 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid;box-sizing:border-box}:after,:before{--tw-content:""}html{-webkit-text-size-adjust:100%;font-feature-settings:normal;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#9ca3af;opacity:1}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(147,197,253,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(147,197,253,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.left-1\\/2{left:50%}.top-1\\/2{top:50%}.ml-1{margin-left:var(--sd-spacing-1,.25rem)}.ml-2{margin-left:var(--sd-spacing-2,.5rem)}.ml-\\[0\\.25em\\]{margin-left:.25em}.ml-\\[0\\.5em\\]{margin-left:.5em}.mr-1{margin-right:var(--sd-spacing-1,.25rem)}.mr-2{margin-right:var(--sd-spacing-2,.5rem)}.mr-\\[0\\.25em\\]{margin-right:.25em}.mr-\\[0\\.5em\\]{margin-right:.5em}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.h-varspacing{height:var(--tw-varspacing)}.w-full{width:100%}.w-varspacing{width:var(--tw-varspacing)}.flex-auto{flex:1 1 auto}.-translate-x-1\\/2{--tw-translate-x:-50%}.-translate-x-1\\/2,.-translate-y-1\\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-\\[inherit\\]{cursor:inherit}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.cursor-wait{cursor:wait}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize{resize:both}.items-start{align-items:flex-start}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-center{justify-content:center}.whitespace-nowrap{white-space:nowrap}.rounded-md{border-radius:var(--sd-border-radius-md,.375rem)}.border{border-width:1px}.border-primary{--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-border-opacity))}.border-transparent{border-color:transparent}.border-white{--tw-border-opacity:1;border-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-border-opacity))}.bg-accent{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-accent,67 176 42)/var(--tw-bg-opacity))}.bg-primary{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity))}.px-0{padding-left:var(--sd-spacing-0,0);padding-right:var(--sd-spacing-0,0)}.px-4{padding-left:var(--sd-spacing-4,1rem);padding-right:var(--sd-spacing-4,1rem)}.align-middle{vertical-align:middle}.text-base{font-size:var(--sd-font-size-base,1rem)}.text-sm{font-size:var(--sd-font-size-sm,.875rem)}.leading-\\[calc\\(var\\(--tw-varspacing\\)-2px\\)\\]{line-height:calc(var(--tw-varspacing) - 2px)}.text-neutral-500{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-text-opacity))}.text-neutral-600{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-600,136 136 136)/var(--tw-text-opacity))}.text-primary{--tw-text-opacity:1;color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.underline{text-decoration-line:underline}.no-underline{text-decoration-line:none}.underline-offset-2{text-underline-offset:2px}.opacity-20{opacity:var(--sd-opacity-20,.2)}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.ring{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.blur{--tw-blur:blur(8px)}.blur,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.varspacing-10{--tw-varspacing:var(--sd-spacing-10,2.5rem)}.varspacing-12{--tw-varspacing:var(--sd-spacing-12,3rem)}.varspacing-8{--tw-varspacing:var(--sd-spacing-8,2rem)}.focus-visible\\:focus-outline:focus-visible{outline-color:rgb(var(--sd-color-primary,0 53 142)/1);outline-offset:2px;outline-style:solid;outline-width:2px}.focus-visible\\:focus-outline-inverted:focus-visible{outline-color:rgb(var(--sd-color-white,255 255 255)/1);outline-offset:2px;outline-style:solid;outline-width:2px}.disabled\\:border-neutral-500:disabled{--tw-border-opacity:1;border-color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-border-opacity))}.disabled\\:border-neutral-600:disabled{--tw-border-opacity:1;border-color:rgb(var(--sd-color-neutral-600,136 136 136)/var(--tw-border-opacity))}.disabled\\:bg-neutral-500:disabled{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-bg-opacity))}.disabled\\:bg-neutral-600:disabled{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-600,136 136 136)/var(--tw-bg-opacity))}.disabled\\:text-neutral-500:disabled{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-text-opacity))}.disabled\\:text-neutral-600:disabled{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-600,136 136 136)/var(--tw-text-opacity))}.disabled\\:text-white:disabled{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.hover\\:border-primary-100:hover:not([disabled]){--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-border-opacity))}.hover\\:border-primary-500:hover:not([disabled]){--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary-500,70 109 175)/var(--tw-border-opacity))}.hover\\:bg-accent-300:hover:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-accent-300,108 194 84)/var(--tw-bg-opacity))}.hover\\:bg-primary-100:hover:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-bg-opacity))}.hover\\:bg-primary-500:hover:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-500,70 109 175)/var(--tw-bg-opacity))}.hover\\:text-primary-100:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-text-opacity))}.hover\\:text-primary-200:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-text-opacity))}.hover\\:text-primary-500:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-500,70 109 175)/var(--tw-text-opacity))}.active\\:border-primary-200:active:not([disabled]){--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-border-opacity))}.active\\:border-primary-800:active:not([disabled]){--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary-800,5 21 48)/var(--tw-border-opacity))}.active\\:bg-accent-500:active:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-accent-500,66 147 50)/var(--tw-bg-opacity))}.active\\:bg-primary-200:active:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-bg-opacity))}.active\\:bg-primary-800:active:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-800,5 21 48)/var(--tw-bg-opacity))}.active\\:text-primary-200:active:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-text-opacity))}.active\\:text-primary-400:active:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-400,153 171 208)/var(--tw-text-opacity))}.active\\:text-primary-800:active:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-800,5 21 48)/var(--tw-text-opacity))}';
|
|
1
|
+
const tailwind = '/*! tailwindcss v3.3.2 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid;box-sizing:border-box}:after,:before{--tw-content:""}html{-webkit-text-size-adjust:100%;font-feature-settings:normal;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#9ca3af;opacity:1}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(147,197,253,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(147,197,253,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.collapse{visibility:collapse}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.left-1\\/2{left:50%}.top-1\\/2{top:50%}.ml-1{margin-left:var(--sd-spacing-1,.25rem)}.ml-2{margin-left:var(--sd-spacing-2,.5rem)}.ml-\\[0\\.25em\\]{margin-left:.25em}.ml-\\[0\\.5em\\]{margin-left:.5em}.mr-1{margin-right:var(--sd-spacing-1,.25rem)}.mr-2{margin-right:var(--sd-spacing-2,.5rem)}.mr-\\[0\\.25em\\]{margin-right:.25em}.mr-\\[0\\.5em\\]{margin-right:.5em}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.h-full{height:100%}.h-varspacing{height:var(--tw-varspacing)}.w-full{width:100%}.w-varspacing{width:var(--tw-varspacing)}.flex-auto{flex:1 1 auto}.flex-shrink-0{flex-shrink:0}.flex-grow-0{flex-grow:0}.-translate-x-1\\/2{--tw-translate-x:-50%}.-translate-x-1\\/2,.-translate-y-1\\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%}.rotate-180{--tw-rotate:180deg}.rotate-180,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-\\[inherit\\]{cursor:inherit}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.cursor-wait{cursor:wait}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize{resize:both}.items-start{align-items:flex-start}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-center{justify-content:center}.gap-4{gap:var(--sd-spacing-4,1rem)}.overflow-hidden{overflow:hidden}.whitespace-nowrap{white-space:nowrap}.rounded-md{border-radius:var(--sd-border-radius-md,.375rem)}.border{border-width:1px}.border-l{border-left-width:1px}.border-t{border-top-width:1px}.border-neutral-400{--tw-border-opacity:1;border-color:rgb(var(--sd-color-neutral-400,195 195 195)/var(--tw-border-opacity))}.border-primary{--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-border-opacity))}.border-primary-400{--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary-400,153 171 208)/var(--tw-border-opacity))}.border-transparent{border-color:transparent}.border-white{--tw-border-opacity:1;border-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-border-opacity))}.bg-accent{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-accent,67 176 42)/var(--tw-bg-opacity))}.bg-neutral-100{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-100,246 246 246)/var(--tw-bg-opacity))}.bg-primary{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity))}.px-0{padding-left:var(--sd-spacing-0,0);padding-right:var(--sd-spacing-0,0)}.px-4{padding-left:var(--sd-spacing-4,1rem);padding-right:var(--sd-spacing-4,1rem)}.py-3{padding-bottom:var(--sd-spacing-3,.75rem);padding-top:var(--sd-spacing-3,.75rem)}.py-6{padding-bottom:var(--sd-spacing-6,1.5rem);padding-top:var(--sd-spacing-6,1.5rem)}.text-left{text-align:left}.align-middle{vertical-align:middle}.text-base{font-size:var(--sd-font-size-base,1rem)}.text-sm{font-size:var(--sd-font-size-sm,.875rem)}.text-xl{font-size:var(--sd-font-size-xl,1.5rem)}.font-bold{font-weight:700}.leading-\\[calc\\(var\\(--tw-varspacing\\)-2px\\)\\]{line-height:calc(var(--tw-varspacing) - 2px)}.text-accent{--tw-text-opacity:1;color:rgb(var(--sd-color-accent,67 176 42)/var(--tw-text-opacity))}.text-neutral-500{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-text-opacity))}.text-neutral-600{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-600,136 136 136)/var(--tw-text-opacity))}.text-primary{--tw-text-opacity:1;color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.underline{text-decoration-line:underline}.no-underline{text-decoration-line:none}.underline-offset-2{text-underline-offset:2px}.opacity-20{opacity:var(--sd-opacity-20,.2)}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline{outline-style:solid}.outline-1{outline-width:1px}.-outline-offset-1{outline-offset:-1px}.outline-neutral-400{outline-color:rgb(var(--sd-color-neutral-400,195 195 195)/1)}.ring{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.blur{--tw-blur:blur(8px)}.blur,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.varspacing-10{--tw-varspacing:var(--sd-spacing-10,2.5rem)}.varspacing-12{--tw-varspacing:var(--sd-spacing-12,3rem)}.varspacing-8{--tw-varspacing:var(--sd-spacing-8,2rem)}.focus-visible\\:focus-outline:focus-visible{outline-color:rgb(var(--sd-color-primary,0 53 142)/1);outline-offset:2px;outline-style:solid;outline-width:2px}.focus-visible\\:focus-outline-inverted:focus-visible{outline-color:rgb(var(--sd-color-white,255 255 255)/1);outline-offset:2px;outline-style:solid;outline-width:2px}.focus\\:outline:focus{outline-style:solid}.focus\\:outline-2:focus{outline-width:2px}.focus\\:outline-offset-2:focus{outline-offset:2px}.focus\\:outline-primary:focus{outline-color:rgb(var(--sd-color-primary,0 53 142)/1)}.disabled\\:border-neutral-500:disabled{--tw-border-opacity:1;border-color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-border-opacity))}.disabled\\:border-neutral-600:disabled{--tw-border-opacity:1;border-color:rgb(var(--sd-color-neutral-600,136 136 136)/var(--tw-border-opacity))}.disabled\\:bg-neutral-500:disabled{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-bg-opacity))}.disabled\\:bg-neutral-600:disabled{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-600,136 136 136)/var(--tw-bg-opacity))}.disabled\\:text-neutral-500:disabled{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-text-opacity))}.disabled\\:text-neutral-600:disabled{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-600,136 136 136)/var(--tw-text-opacity))}.disabled\\:text-white:disabled{--tw-text-opacity:1;color:rgb(var(--sd-color-white,255 255 255)/var(--tw-text-opacity))}.hover\\:border-primary-100:hover:not([disabled]){--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-border-opacity))}.hover\\:border-primary-500:hover:not([disabled]){--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary-500,70 109 175)/var(--tw-border-opacity))}.hover\\:bg-accent-300:hover:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-accent-300,108 194 84)/var(--tw-bg-opacity))}.hover\\:bg-neutral-200:hover:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-200,233 233 233)/var(--tw-bg-opacity))}.hover\\:bg-primary-100:hover:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-bg-opacity))}.hover\\:bg-primary-500:hover:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-500,70 109 175)/var(--tw-bg-opacity))}.hover\\:text-primary-100:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-text-opacity))}.hover\\:text-primary-200:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-text-opacity))}.hover\\:text-primary-500:hover:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-500,70 109 175)/var(--tw-text-opacity))}.active\\:border-primary-200:active:not([disabled]){--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-border-opacity))}.active\\:border-primary-800:active:not([disabled]){--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary-800,5 21 48)/var(--tw-border-opacity))}.active\\:bg-accent-500:active:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-accent-500,66 147 50)/var(--tw-bg-opacity))}.active\\:bg-primary-200:active:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-bg-opacity))}.active\\:bg-primary-800:active:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-800,5 21 48)/var(--tw-bg-opacity))}.active\\:text-primary-200:active:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-200,224 233 243)/var(--tw-text-opacity))}.active\\:text-primary-400:active:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-400,153 171 208)/var(--tw-text-opacity))}.active\\:text-primary-800:active:not([disabled]){--tw-text-opacity:1;color:rgb(var(--sd-color-primary-800,5 21 48)/var(--tw-text-opacity))}';
|
|
2
2
|
export {
|
|
3
3
|
tailwind as default
|
|
4
4
|
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export interface ElementAnimation {
|
|
2
|
+
keyframes: Keyframe[];
|
|
3
|
+
rtlKeyframes?: Keyframe[];
|
|
4
|
+
options?: KeyframeAnimationOptions;
|
|
5
|
+
}
|
|
6
|
+
export interface ElementAnimationMap {
|
|
7
|
+
[animationName: string]: ElementAnimation;
|
|
8
|
+
}
|
|
9
|
+
export interface GetAnimationOptions {
|
|
10
|
+
dir: string;
|
|
11
|
+
}
|
|
12
|
+
export declare function setDefaultAnimation(animationName: string, animation: ElementAnimation | null): void;
|
|
13
|
+
export declare function setAnimation(el: Element, animationName: string, animation: ElementAnimation | null): void;
|
|
14
|
+
export declare function getAnimation(el: Element, animationName: string, options: GetAnimationOptions): ElementAnimation;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
const defaultAnimationRegistry = /* @__PURE__ */ new Map();
|
|
2
|
+
const customAnimationRegistry = /* @__PURE__ */ new WeakMap();
|
|
3
|
+
function ensureAnimation(animation) {
|
|
4
|
+
return animation ?? { keyframes: [], options: { duration: 0 } };
|
|
5
|
+
}
|
|
6
|
+
function getLogicalAnimation(animation, dir) {
|
|
7
|
+
if (dir.toLowerCase() === "rtl") {
|
|
8
|
+
return {
|
|
9
|
+
keyframes: animation.rtlKeyframes || animation.keyframes,
|
|
10
|
+
options: animation.options
|
|
11
|
+
};
|
|
12
|
+
}
|
|
13
|
+
return animation;
|
|
14
|
+
}
|
|
15
|
+
function setDefaultAnimation(animationName, animation) {
|
|
16
|
+
defaultAnimationRegistry.set(animationName, ensureAnimation(animation));
|
|
17
|
+
}
|
|
18
|
+
function getAnimation(el, animationName, options) {
|
|
19
|
+
const customAnimation = customAnimationRegistry.get(el);
|
|
20
|
+
if (customAnimation == null ? void 0 : customAnimation[animationName]) {
|
|
21
|
+
return getLogicalAnimation(customAnimation[animationName], options.dir);
|
|
22
|
+
}
|
|
23
|
+
const defaultAnimation = defaultAnimationRegistry.get(animationName);
|
|
24
|
+
if (defaultAnimation) {
|
|
25
|
+
return getLogicalAnimation(defaultAnimation, options.dir);
|
|
26
|
+
}
|
|
27
|
+
return {
|
|
28
|
+
keyframes: [],
|
|
29
|
+
options: { duration: 0 }
|
|
30
|
+
};
|
|
31
|
+
}
|
|
32
|
+
export {
|
|
33
|
+
getAnimation,
|
|
34
|
+
setDefaultAnimation
|
|
35
|
+
};
|
|
@@ -1,6 +1,35 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 1.1,
|
|
3
3
|
"tags": [
|
|
4
|
+
{
|
|
5
|
+
"name": "sd-accordion-group",
|
|
6
|
+
"description": "Short summary of the component's intended use.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - The default slot where `<sd-accordion>` elements are placed.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
7
|
+
"attributes": [
|
|
8
|
+
{
|
|
9
|
+
"name": "close-others",
|
|
10
|
+
"description": "Closes other accordions.",
|
|
11
|
+
"values": []
|
|
12
|
+
}
|
|
13
|
+
],
|
|
14
|
+
"references": []
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"name": "sd-accordion",
|
|
18
|
+
"description": "Accordion shows a brief summary and expands to show additional content.\n\n\n---\n\n\n\n\n### **Events:**\n - **sd-show** - Emitted when the accordion opens.\n- **sd-after-show** - Emitted after the accordion opens and all animations are complete.\n- **sd-hide** - Emitted when the accordion closes.\n- **sd-after-hide** - Emitted after the accordion closes and all animations are complete.\n\n### **Methods:**\n - **show()** - Shows the accordion.\n- **hide()** - Hides the accordion\n\n### **Slots:**\n - _default_ - The accordion main content.\n- **summary** - The accordion summary. Alternatively, you can use the `summary` attribute.\n- **expand-icon** - Optional expand icon to use instead of the default. Works best with `<sd-icon>`.\n- **collapse-icon** - Optional collapse icon to use instead of the default. Works best with `<sd-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The header that wraps both the summary and the expand/collapse icon.\n- **summary** - The container that wraps the summary.\n- **summary-icon** - The container that wraps the expand/collapse icons.\n- **content** - The accordion content.",
|
|
19
|
+
"attributes": [
|
|
20
|
+
{
|
|
21
|
+
"name": "open",
|
|
22
|
+
"description": "Indicates whether or not the accordion is open. You can toggle this attribute to show and hide the accordion, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the accordion' open state.",
|
|
23
|
+
"values": []
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
"name": "summary",
|
|
27
|
+
"description": "The summary to show in the header. If you need to display HTML, use the `summary` slot instead.",
|
|
28
|
+
"values": []
|
|
29
|
+
}
|
|
30
|
+
],
|
|
31
|
+
"references": []
|
|
32
|
+
},
|
|
4
33
|
{
|
|
5
34
|
"name": "sd-button",
|
|
6
35
|
"description": "Buttons represent actions that are available to the user.\n\n\n---\n\n\n\n\n### **Events:**\n - **sd-blur** - Emitted when the button loses focus.\n- **sd-focus** - Emitted when the button gains focus.\n\n### **Methods:**\n - **click()** - Simulates a click on the button.\n- **focus(options: _FocusOptions_)** - Sets focus on the button.\n- **blur()** - Removes focus from the button.\n- **checkValidity()** - Checks for validity but does not show the browser's validation message.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - _default_ - The button's label.\n- **icon-left** - A prefix icon or similar element.\n- **icon-right** - A suffix icon or similar element.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **icon-left** - The container that wraps the left icon area.\n- **label** - The button's label.\n- **icon-right** - The container that wraps the right icon area.",
|
|
@@ -173,6 +202,30 @@
|
|
|
173
202
|
],
|
|
174
203
|
"references": []
|
|
175
204
|
},
|
|
205
|
+
{
|
|
206
|
+
"name": "sd-divider",
|
|
207
|
+
"description": "Dividers are used to visually separate or group elements.\n\n\n---\n\n\n",
|
|
208
|
+
"attributes": [
|
|
209
|
+
{
|
|
210
|
+
"name": "orientation",
|
|
211
|
+
"description": "Determines the orientation of the divider.",
|
|
212
|
+
"values": [
|
|
213
|
+
{
|
|
214
|
+
"name": "horizontal"
|
|
215
|
+
},
|
|
216
|
+
{
|
|
217
|
+
"name": "vertical"
|
|
218
|
+
}
|
|
219
|
+
]
|
|
220
|
+
},
|
|
221
|
+
{
|
|
222
|
+
"name": "inverted",
|
|
223
|
+
"description": "This inverts the divider.",
|
|
224
|
+
"values": []
|
|
225
|
+
}
|
|
226
|
+
],
|
|
227
|
+
"references": []
|
|
228
|
+
},
|
|
176
229
|
{
|
|
177
230
|
"name": "sd-icon",
|
|
178
231
|
"description": "Icons are symbols that can be used to represent various options within an application.\n\n\n---\n\n\n\n\n### **Events:**\n - **sd-load** - Emitted when the icon has loaded.\n- **sd-error** - Emitted when the icon fails to load due to an error.",
|
|
@@ -330,7 +383,36 @@
|
|
|
330
383
|
"references": []
|
|
331
384
|
},
|
|
332
385
|
{
|
|
333
|
-
"name": "sd-1-0-
|
|
386
|
+
"name": "sd-1-2-0-accordion-group",
|
|
387
|
+
"description": "Short summary of the component's intended use.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - The default slot where `<sd-accordion>` elements are placed.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
388
|
+
"attributes": [
|
|
389
|
+
{
|
|
390
|
+
"name": "close-others",
|
|
391
|
+
"description": "Closes other accordions.",
|
|
392
|
+
"values": []
|
|
393
|
+
}
|
|
394
|
+
],
|
|
395
|
+
"references": []
|
|
396
|
+
},
|
|
397
|
+
{
|
|
398
|
+
"name": "sd-1-2-0-accordion",
|
|
399
|
+
"description": "Accordion shows a brief summary and expands to show additional content.\n\n\n---\n\n\n\n\n### **Events:**\n - **sd-show** - Emitted when the accordion opens.\n- **sd-after-show** - Emitted after the accordion opens and all animations are complete.\n- **sd-hide** - Emitted when the accordion closes.\n- **sd-after-hide** - Emitted after the accordion closes and all animations are complete.\n\n### **Methods:**\n - **show()** - Shows the accordion.\n- **hide()** - Hides the accordion\n\n### **Slots:**\n - _default_ - The accordion main content.\n- **summary** - The accordion summary. Alternatively, you can use the `summary` attribute.\n- **expand-icon** - Optional expand icon to use instead of the default. Works best with `<sd-icon>`.\n- **collapse-icon** - Optional collapse icon to use instead of the default. Works best with `<sd-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The header that wraps both the summary and the expand/collapse icon.\n- **summary** - The container that wraps the summary.\n- **summary-icon** - The container that wraps the expand/collapse icons.\n- **content** - The accordion content.",
|
|
400
|
+
"attributes": [
|
|
401
|
+
{
|
|
402
|
+
"name": "open",
|
|
403
|
+
"description": "Indicates whether or not the accordion is open. You can toggle this attribute to show and hide the accordion, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the accordion' open state.",
|
|
404
|
+
"values": []
|
|
405
|
+
},
|
|
406
|
+
{
|
|
407
|
+
"name": "summary",
|
|
408
|
+
"description": "The summary to show in the header. If you need to display HTML, use the `summary` slot instead.",
|
|
409
|
+
"values": []
|
|
410
|
+
}
|
|
411
|
+
],
|
|
412
|
+
"references": []
|
|
413
|
+
},
|
|
414
|
+
{
|
|
415
|
+
"name": "sd-1-2-0-button",
|
|
334
416
|
"description": "Buttons represent actions that are available to the user.\n\n\n---\n\n\n\n\n### **Events:**\n - **sd-blur** - Emitted when the button loses focus.\n- **sd-focus** - Emitted when the button gains focus.\n\n### **Methods:**\n - **click()** - Simulates a click on the button.\n- **focus(options: _FocusOptions_)** - Sets focus on the button.\n- **blur()** - Removes focus from the button.\n- **checkValidity()** - Checks for validity but does not show the browser's validation message.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - _default_ - The button's label.\n- **icon-left** - A prefix icon or similar element.\n- **icon-right** - A suffix icon or similar element.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **icon-left** - The container that wraps the left icon area.\n- **label** - The button's label.\n- **icon-right** - The container that wraps the right icon area.",
|
|
335
417
|
"attributes": [
|
|
336
418
|
{
|
|
@@ -502,7 +584,31 @@
|
|
|
502
584
|
"references": []
|
|
503
585
|
},
|
|
504
586
|
{
|
|
505
|
-
"name": "sd-1-0-
|
|
587
|
+
"name": "sd-1-2-0-divider",
|
|
588
|
+
"description": "Dividers are used to visually separate or group elements.\n\n\n---\n\n\n",
|
|
589
|
+
"attributes": [
|
|
590
|
+
{
|
|
591
|
+
"name": "orientation",
|
|
592
|
+
"description": "Determines the orientation of the divider.",
|
|
593
|
+
"values": [
|
|
594
|
+
{
|
|
595
|
+
"name": "horizontal"
|
|
596
|
+
},
|
|
597
|
+
{
|
|
598
|
+
"name": "vertical"
|
|
599
|
+
}
|
|
600
|
+
]
|
|
601
|
+
},
|
|
602
|
+
{
|
|
603
|
+
"name": "inverted",
|
|
604
|
+
"description": "This inverts the divider.",
|
|
605
|
+
"values": []
|
|
606
|
+
}
|
|
607
|
+
],
|
|
608
|
+
"references": []
|
|
609
|
+
},
|
|
610
|
+
{
|
|
611
|
+
"name": "sd-1-2-0-icon",
|
|
506
612
|
"description": "Icons are symbols that can be used to represent various options within an application.\n\n\n---\n\n\n\n\n### **Events:**\n - **sd-load** - Emitted when the icon has loaded.\n- **sd-error** - Emitted when the icon fails to load due to an error.",
|
|
507
613
|
"attributes": [
|
|
508
614
|
{
|
|
@@ -544,7 +650,7 @@
|
|
|
544
650
|
"references": []
|
|
545
651
|
},
|
|
546
652
|
{
|
|
547
|
-
"name": "sd-1-0-
|
|
653
|
+
"name": "sd-1-2-0-include",
|
|
548
654
|
"description": "Includes give you the power to embed external HTML files into the page.\n\n\n---\n\n\n\n\n### **Events:**\n - **sd-load** - Emitted when the included file is loaded.\n- **sd-error** - Emitted when the included file fails to load due to an error.",
|
|
549
655
|
"attributes": [
|
|
550
656
|
{
|
|
@@ -576,7 +682,7 @@
|
|
|
576
682
|
"references": []
|
|
577
683
|
},
|
|
578
684
|
{
|
|
579
|
-
"name": "sd-1-0-
|
|
685
|
+
"name": "sd-1-2-0-link",
|
|
580
686
|
"description": "A link component.\n\n\n---\n\n\n\n\n### **Events:**\n - **sd-blur** - Emitted when the link loses focus.\n- **sd-focus** - Emitted when the link gains focus.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the button.\n- **blur()** - Removes focus from the button.\n\n### **Slots:**\n - _default_ - The default slot.\n- **icon-left** - The icon to display on the left side of the link.\n- **icon-right** - The icon to display on the right side of the link.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **icon-left** - The container that wraps the left icon area.\n- **label** - The link's label.\n- **icon-right** - The container that wraps the right icon area.",
|
|
581
687
|
"attributes": [
|
|
582
688
|
{
|
|
@@ -636,7 +742,7 @@
|
|
|
636
742
|
"references": []
|
|
637
743
|
},
|
|
638
744
|
{
|
|
639
|
-
"name": "sd-1-0-
|
|
745
|
+
"name": "sd-1-2-0-spinner",
|
|
640
746
|
"description": "Spinners are used to show the progress of an indeterminate operation.\n\n\n---\n\n\n",
|
|
641
747
|
"attributes": [
|
|
642
748
|
{
|
package/dist/web-types.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "http://json.schemastore.org/web-types",
|
|
3
3
|
"name": "@solid-design-system/components",
|
|
4
|
-
"version": "1.0
|
|
4
|
+
"version": "1.2.0",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"framework-config": {
|
|
7
7
|
"enable-when": {
|
|
@@ -13,6 +13,119 @@
|
|
|
13
13
|
"contributions": {
|
|
14
14
|
"html": {
|
|
15
15
|
"elements": [
|
|
16
|
+
{
|
|
17
|
+
"name": "sd-accordion-group",
|
|
18
|
+
"description": "",
|
|
19
|
+
"doc-url": "https://solid.union-investment.com/[storybook-link]/accordion-group",
|
|
20
|
+
"js": {
|
|
21
|
+
"properties": [
|
|
22
|
+
{
|
|
23
|
+
"name": "closeOthers",
|
|
24
|
+
"description": "Closes other accordions.",
|
|
25
|
+
"value": {
|
|
26
|
+
"type": "boolean"
|
|
27
|
+
}
|
|
28
|
+
},
|
|
29
|
+
{
|
|
30
|
+
"name": "handleAccordionShow",
|
|
31
|
+
"value": {}
|
|
32
|
+
}
|
|
33
|
+
],
|
|
34
|
+
"events": []
|
|
35
|
+
},
|
|
36
|
+
"attributes": [
|
|
37
|
+
{
|
|
38
|
+
"name": "close-others",
|
|
39
|
+
"description": "Closes other accordions.",
|
|
40
|
+
"value": {
|
|
41
|
+
"type": "boolean"
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
]
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
"name": "sd-accordion",
|
|
48
|
+
"description": "",
|
|
49
|
+
"doc-url": "https://solid.union-investment.com/[storybook-link]/accordion",
|
|
50
|
+
"js": {
|
|
51
|
+
"properties": [
|
|
52
|
+
{
|
|
53
|
+
"name": "localize",
|
|
54
|
+
"value": {}
|
|
55
|
+
},
|
|
56
|
+
{
|
|
57
|
+
"name": "open",
|
|
58
|
+
"description": "Indicates whether or not the accordion is open. You can toggle this attribute to show and hide the accordion, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the accordion' open state.",
|
|
59
|
+
"value": {
|
|
60
|
+
"type": "boolean"
|
|
61
|
+
}
|
|
62
|
+
},
|
|
63
|
+
{
|
|
64
|
+
"name": "summary",
|
|
65
|
+
"description": "The summary to show in the header. If you need to display HTML, use the `summary` slot instead.",
|
|
66
|
+
"value": {
|
|
67
|
+
"type": "string"
|
|
68
|
+
}
|
|
69
|
+
},
|
|
70
|
+
{
|
|
71
|
+
"name": "handleSummaryClick",
|
|
72
|
+
"value": {}
|
|
73
|
+
},
|
|
74
|
+
{
|
|
75
|
+
"name": "handleSummaryKeyDown",
|
|
76
|
+
"value": {}
|
|
77
|
+
},
|
|
78
|
+
{
|
|
79
|
+
"name": "handleOpenChange",
|
|
80
|
+
"value": {}
|
|
81
|
+
},
|
|
82
|
+
{
|
|
83
|
+
"name": "show",
|
|
84
|
+
"description": "Shows the accordion.",
|
|
85
|
+
"value": {}
|
|
86
|
+
},
|
|
87
|
+
{
|
|
88
|
+
"name": "hide",
|
|
89
|
+
"description": "Hides the accordion",
|
|
90
|
+
"value": {}
|
|
91
|
+
}
|
|
92
|
+
],
|
|
93
|
+
"events": [
|
|
94
|
+
{
|
|
95
|
+
"name": "sd-show",
|
|
96
|
+
"description": "Emitted when the accordion opens."
|
|
97
|
+
},
|
|
98
|
+
{
|
|
99
|
+
"name": "sd-after-show",
|
|
100
|
+
"description": "Emitted after the accordion opens and all animations are complete."
|
|
101
|
+
},
|
|
102
|
+
{
|
|
103
|
+
"name": "sd-hide",
|
|
104
|
+
"description": "Emitted when the accordion closes."
|
|
105
|
+
},
|
|
106
|
+
{
|
|
107
|
+
"name": "sd-after-hide",
|
|
108
|
+
"description": "Emitted after the accordion closes and all animations are complete."
|
|
109
|
+
}
|
|
110
|
+
]
|
|
111
|
+
},
|
|
112
|
+
"attributes": [
|
|
113
|
+
{
|
|
114
|
+
"name": "open",
|
|
115
|
+
"description": "Indicates whether or not the accordion is open. You can toggle this attribute to show and hide the accordion, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the accordion' open state.",
|
|
116
|
+
"value": {
|
|
117
|
+
"type": "boolean"
|
|
118
|
+
}
|
|
119
|
+
},
|
|
120
|
+
{
|
|
121
|
+
"name": "summary",
|
|
122
|
+
"description": "The summary to show in the header. If you need to display HTML, use the `summary` slot instead.",
|
|
123
|
+
"value": {
|
|
124
|
+
"type": "string"
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
]
|
|
128
|
+
},
|
|
16
129
|
{
|
|
17
130
|
"name": "sd-button",
|
|
18
131
|
"description": "",
|
|
@@ -352,6 +465,46 @@
|
|
|
352
465
|
}
|
|
353
466
|
]
|
|
354
467
|
},
|
|
468
|
+
{
|
|
469
|
+
"name": "sd-divider",
|
|
470
|
+
"description": "",
|
|
471
|
+
"doc-url": "https://solid.union-investment.com/[storybook-link]/divider",
|
|
472
|
+
"js": {
|
|
473
|
+
"properties": [
|
|
474
|
+
{
|
|
475
|
+
"name": "orientation",
|
|
476
|
+
"description": "Determines the orientation of the divider.",
|
|
477
|
+
"value": {
|
|
478
|
+
"type": "'horizontal' | 'vertical'"
|
|
479
|
+
}
|
|
480
|
+
},
|
|
481
|
+
{
|
|
482
|
+
"name": "inverted",
|
|
483
|
+
"description": "This inverts the divider.",
|
|
484
|
+
"value": {
|
|
485
|
+
"type": "boolean"
|
|
486
|
+
}
|
|
487
|
+
}
|
|
488
|
+
],
|
|
489
|
+
"events": []
|
|
490
|
+
},
|
|
491
|
+
"attributes": [
|
|
492
|
+
{
|
|
493
|
+
"name": "orientation",
|
|
494
|
+
"description": "Determines the orientation of the divider.",
|
|
495
|
+
"value": {
|
|
496
|
+
"type": "'horizontal' | 'vertical'"
|
|
497
|
+
}
|
|
498
|
+
},
|
|
499
|
+
{
|
|
500
|
+
"name": "inverted",
|
|
501
|
+
"description": "This inverts the divider.",
|
|
502
|
+
"value": {
|
|
503
|
+
"type": "boolean"
|
|
504
|
+
}
|
|
505
|
+
}
|
|
506
|
+
]
|
|
507
|
+
},
|
|
355
508
|
{
|
|
356
509
|
"name": "sd-icon",
|
|
357
510
|
"description": "",
|
|
@@ -768,7 +921,120 @@
|
|
|
768
921
|
]
|
|
769
922
|
},
|
|
770
923
|
{
|
|
771
|
-
"name": "sd-1-0-
|
|
924
|
+
"name": "sd-1-2-0-accordion-group",
|
|
925
|
+
"description": "",
|
|
926
|
+
"doc-url": "https://solid.union-investment.com/[storybook-link]/accordion-group",
|
|
927
|
+
"js": {
|
|
928
|
+
"properties": [
|
|
929
|
+
{
|
|
930
|
+
"name": "closeOthers",
|
|
931
|
+
"description": "Closes other accordions.",
|
|
932
|
+
"value": {
|
|
933
|
+
"type": "boolean"
|
|
934
|
+
}
|
|
935
|
+
},
|
|
936
|
+
{
|
|
937
|
+
"name": "handleAccordionShow",
|
|
938
|
+
"value": {}
|
|
939
|
+
}
|
|
940
|
+
],
|
|
941
|
+
"events": []
|
|
942
|
+
},
|
|
943
|
+
"attributes": [
|
|
944
|
+
{
|
|
945
|
+
"name": "close-others",
|
|
946
|
+
"description": "Closes other accordions.",
|
|
947
|
+
"value": {
|
|
948
|
+
"type": "boolean"
|
|
949
|
+
}
|
|
950
|
+
}
|
|
951
|
+
]
|
|
952
|
+
},
|
|
953
|
+
{
|
|
954
|
+
"name": "sd-1-2-0-accordion",
|
|
955
|
+
"description": "",
|
|
956
|
+
"doc-url": "https://solid.union-investment.com/[storybook-link]/accordion",
|
|
957
|
+
"js": {
|
|
958
|
+
"properties": [
|
|
959
|
+
{
|
|
960
|
+
"name": "localize",
|
|
961
|
+
"value": {}
|
|
962
|
+
},
|
|
963
|
+
{
|
|
964
|
+
"name": "open",
|
|
965
|
+
"description": "Indicates whether or not the accordion is open. You can toggle this attribute to show and hide the accordion, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the accordion' open state.",
|
|
966
|
+
"value": {
|
|
967
|
+
"type": "boolean"
|
|
968
|
+
}
|
|
969
|
+
},
|
|
970
|
+
{
|
|
971
|
+
"name": "summary",
|
|
972
|
+
"description": "The summary to show in the header. If you need to display HTML, use the `summary` slot instead.",
|
|
973
|
+
"value": {
|
|
974
|
+
"type": "string"
|
|
975
|
+
}
|
|
976
|
+
},
|
|
977
|
+
{
|
|
978
|
+
"name": "handleSummaryClick",
|
|
979
|
+
"value": {}
|
|
980
|
+
},
|
|
981
|
+
{
|
|
982
|
+
"name": "handleSummaryKeyDown",
|
|
983
|
+
"value": {}
|
|
984
|
+
},
|
|
985
|
+
{
|
|
986
|
+
"name": "handleOpenChange",
|
|
987
|
+
"value": {}
|
|
988
|
+
},
|
|
989
|
+
{
|
|
990
|
+
"name": "show",
|
|
991
|
+
"description": "Shows the accordion.",
|
|
992
|
+
"value": {}
|
|
993
|
+
},
|
|
994
|
+
{
|
|
995
|
+
"name": "hide",
|
|
996
|
+
"description": "Hides the accordion",
|
|
997
|
+
"value": {}
|
|
998
|
+
}
|
|
999
|
+
],
|
|
1000
|
+
"events": [
|
|
1001
|
+
{
|
|
1002
|
+
"name": "sd-show",
|
|
1003
|
+
"description": "Emitted when the accordion opens."
|
|
1004
|
+
},
|
|
1005
|
+
{
|
|
1006
|
+
"name": "sd-after-show",
|
|
1007
|
+
"description": "Emitted after the accordion opens and all animations are complete."
|
|
1008
|
+
},
|
|
1009
|
+
{
|
|
1010
|
+
"name": "sd-hide",
|
|
1011
|
+
"description": "Emitted when the accordion closes."
|
|
1012
|
+
},
|
|
1013
|
+
{
|
|
1014
|
+
"name": "sd-after-hide",
|
|
1015
|
+
"description": "Emitted after the accordion closes and all animations are complete."
|
|
1016
|
+
}
|
|
1017
|
+
]
|
|
1018
|
+
},
|
|
1019
|
+
"attributes": [
|
|
1020
|
+
{
|
|
1021
|
+
"name": "open",
|
|
1022
|
+
"description": "Indicates whether or not the accordion is open. You can toggle this attribute to show and hide the accordion, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the accordion' open state.",
|
|
1023
|
+
"value": {
|
|
1024
|
+
"type": "boolean"
|
|
1025
|
+
}
|
|
1026
|
+
},
|
|
1027
|
+
{
|
|
1028
|
+
"name": "summary",
|
|
1029
|
+
"description": "The summary to show in the header. If you need to display HTML, use the `summary` slot instead.",
|
|
1030
|
+
"value": {
|
|
1031
|
+
"type": "string"
|
|
1032
|
+
}
|
|
1033
|
+
}
|
|
1034
|
+
]
|
|
1035
|
+
},
|
|
1036
|
+
{
|
|
1037
|
+
"name": "sd-1-2-0-button",
|
|
772
1038
|
"description": "",
|
|
773
1039
|
"doc-url": "https://solid.union-investment.com/[storybook-link]/button",
|
|
774
1040
|
"js": {
|
|
@@ -1107,7 +1373,47 @@
|
|
|
1107
1373
|
]
|
|
1108
1374
|
},
|
|
1109
1375
|
{
|
|
1110
|
-
"name": "sd-1-0-
|
|
1376
|
+
"name": "sd-1-2-0-divider",
|
|
1377
|
+
"description": "",
|
|
1378
|
+
"doc-url": "https://solid.union-investment.com/[storybook-link]/divider",
|
|
1379
|
+
"js": {
|
|
1380
|
+
"properties": [
|
|
1381
|
+
{
|
|
1382
|
+
"name": "orientation",
|
|
1383
|
+
"description": "Determines the orientation of the divider.",
|
|
1384
|
+
"value": {
|
|
1385
|
+
"type": "'horizontal' | 'vertical'"
|
|
1386
|
+
}
|
|
1387
|
+
},
|
|
1388
|
+
{
|
|
1389
|
+
"name": "inverted",
|
|
1390
|
+
"description": "This inverts the divider.",
|
|
1391
|
+
"value": {
|
|
1392
|
+
"type": "boolean"
|
|
1393
|
+
}
|
|
1394
|
+
}
|
|
1395
|
+
],
|
|
1396
|
+
"events": []
|
|
1397
|
+
},
|
|
1398
|
+
"attributes": [
|
|
1399
|
+
{
|
|
1400
|
+
"name": "orientation",
|
|
1401
|
+
"description": "Determines the orientation of the divider.",
|
|
1402
|
+
"value": {
|
|
1403
|
+
"type": "'horizontal' | 'vertical'"
|
|
1404
|
+
}
|
|
1405
|
+
},
|
|
1406
|
+
{
|
|
1407
|
+
"name": "inverted",
|
|
1408
|
+
"description": "This inverts the divider.",
|
|
1409
|
+
"value": {
|
|
1410
|
+
"type": "boolean"
|
|
1411
|
+
}
|
|
1412
|
+
}
|
|
1413
|
+
]
|
|
1414
|
+
},
|
|
1415
|
+
{
|
|
1416
|
+
"name": "sd-1-2-0-icon",
|
|
1111
1417
|
"description": "",
|
|
1112
1418
|
"doc-url": "https://solid.union-investment.com/[storybook-link]/icon",
|
|
1113
1419
|
"js": {
|
|
@@ -1216,7 +1522,7 @@
|
|
|
1216
1522
|
]
|
|
1217
1523
|
},
|
|
1218
1524
|
{
|
|
1219
|
-
"name": "sd-1-0-
|
|
1525
|
+
"name": "sd-1-2-0-include",
|
|
1220
1526
|
"description": "",
|
|
1221
1527
|
"doc-url": "https://solid.union-investment.com/[storybook-link]/include",
|
|
1222
1528
|
"js": {
|
|
@@ -1287,7 +1593,7 @@
|
|
|
1287
1593
|
]
|
|
1288
1594
|
},
|
|
1289
1595
|
{
|
|
1290
|
-
"name": "sd-1-0-
|
|
1596
|
+
"name": "sd-1-2-0-link",
|
|
1291
1597
|
"description": "",
|
|
1292
1598
|
"doc-url": "https://solid.union-investment.com/[storybook-link]/link",
|
|
1293
1599
|
"js": {
|
|
@@ -1414,7 +1720,7 @@
|
|
|
1414
1720
|
]
|
|
1415
1721
|
},
|
|
1416
1722
|
{
|
|
1417
|
-
"name": "sd-1-0-
|
|
1723
|
+
"name": "sd-1-2-0-spinner",
|
|
1418
1724
|
"description": "",
|
|
1419
1725
|
"doc-url": "https://solid.union-investment.com/[storybook-link]/spinner",
|
|
1420
1726
|
"js": {
|