@pantoken/components 1.0.3 → 1.1.1

package/dist/alert.css

@@ -1 +1 @@
-@property --timeout{syntax:"<integer>";inherits:false;initial-value:5}@scope(.instui-alert){&{--timeout:0;min-inline-size:12rem;padding:var(--instui-component-alert-content-padding-vertical) var(--instui-component-alert-content-padding-horizontal);background:var(--instui-component-alert-background);color:var(--instui-component-alert-color);border:var(--instui-component-alert-border-width) var(--instui-component-alert-border-style) var(--instui-component-alert-info-border-color);border-radius:var(--instui-component-alert-border-radius);box-shadow:var(--instui-elevation-above);font-family:var(--instui-component-alert-content-font-family);font-size:var(--instui-component-alert-content-font-size);font-weight:var(--instui-component-alert-content-font-weight);line-height:var(--instui-component-alert-content-line-height);--pantoken-alert-icon-bg:var(--instui-component-alert-info-icon-background);--pantoken-alert-glyph:var(--instui-icon-info);padding-inline-start:calc(2.5rem + var(--instui-component-alert-content-padding-horizontal));position:relative;&>.instui-close-button{position:absolute;inset-block-start:var(--instui-spacing-space-xs);inset-inline-end:var(--instui-spacing-space-xs)}}&:before{content:"";inset-block:calc(-1 * var(--instui-component-alert-border-width));background:var(--pantoken-alert-icon-bg);inline-size:2.5rem;border-start-start-radius:var(--instui-component-alert-border-radius);border-end-start-radius:var(--instui-component-alert-border-radius);position:absolute;inset-inline-start:calc(-1 * var(--instui-component-alert-border-width))}&:after{content:"";background:var(--instui-component-alert-icon-color);inline-size:2.5rem;-webkit-mask:var(--pantoken-alert-glyph) center / 1.125rem no-repeat;mask:var(--pantoken-alert-glyph) center / 1.125rem no-repeat;position:absolute;inset-block:0;inset-inline-start:0}&:has(>.instui-close-button){padding-inline-end:calc(var(--instui-component-base-button-medium-height) + var(--instui-spacing-space-xs))}&.-screen-reader-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}&.-color-info{border-color:var(--instui-component-alert-info-border-color)}&.-color-success{border-color:var(--instui-component-alert-success-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-success-icon-background);--pantoken-alert-glyph:var(--instui-icon-circle-check)}&.-color-warning{border-color:var(--instui-component-alert-warning-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-warning-icon-background);--pantoken-alert-glyph:var(--instui-icon-triangle-alert)}&.-color-danger{border-color:var(--instui-component-alert-danger-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-danger-icon-background);--pantoken-alert-glyph:var(--instui-icon-circle-x)}&[class*=-icon-]{--pantoken-alert-glyph:var(--pantoken-glyph)}&[class*=-icon-]:before{background:var(--pantoken-alert-icon-bg);block-size:auto;inline-size:2.5rem;-webkit-mask:none;mask:none}&.-timeout-1{--timeout:1000}&.-timeout-2{--timeout:2000}&.-timeout-3{--timeout:3000}&.-timeout-4{--timeout:4000}&.-timeout-5{--timeout:5000}&:is(.-has-shadow-false,.-without-shadow){box-shadow:none}&:is(.-variant-info,.-color-info){border-color:var(--instui-component-alert-info-border-color)}&:is(.-variant-success,.-color-success){border-color:var(--instui-component-alert-success-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-success-icon-background);--pantoken-alert-glyph:var(--instui-icon-circle-check)}&:is(.-variant-warning,.-color-warning){border-color:var(--instui-component-alert-warning-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-warning-icon-background);--pantoken-alert-glyph:var(--instui-icon-triangle-alert)}&:is(.-variant-error,.-color-danger){border-color:var(--instui-component-alert-danger-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-danger-icon-background);--pantoken-alert-glyph:var(--instui-icon-circle-x)}}
+@property --timeout{syntax:"<integer>";inherits:false;initial-value:5}@scope(.instui-alert){&{--timeout:0;min-inline-size:12rem;padding:var(--instui-component-alert-content-padding-vertical) var(--instui-component-alert-content-padding-horizontal);background:var(--instui-component-alert-background);color:var(--instui-component-alert-color);border:var(--instui-component-alert-border-width) var(--instui-component-alert-border-style) var(--instui-component-alert-info-border-color);border-radius:var(--instui-component-alert-border-radius);box-shadow:var(--instui-elevation-above);font-family:var(--instui-component-alert-content-font-family);font-size:var(--instui-component-alert-content-font-size);font-weight:var(--instui-component-alert-content-font-weight);line-height:var(--instui-component-alert-content-line-height);--pantoken-alert-icon-bg:var(--instui-component-alert-info-icon-background);--pantoken-alert-glyph:var(--instui-icon-info);padding-inline-start:calc(2.5rem + var(--instui-component-alert-content-padding-horizontal));position:relative;&>.instui-close-button:not([class*=-size-]){min-height:var(--instui-component-base-button-small-height)}&>.instui-close-button{position:absolute;inset-block-start:var(--instui-spacing-space-xs);inset-inline-end:var(--instui-spacing-space-xs)}}&:before{content:"";inset-block:calc(-1 * var(--instui-component-alert-border-width));background:var(--pantoken-alert-icon-bg);inline-size:2.5rem;border-start-start-radius:var(--instui-component-alert-border-radius);border-end-start-radius:var(--instui-component-alert-border-radius);position:absolute;inset-inline-start:calc(-1 * var(--instui-component-alert-border-width))}&:after{content:"";background:var(--instui-component-alert-icon-color);inline-size:2.5rem;-webkit-mask:var(--pantoken-alert-glyph) center / 1.125rem no-repeat;mask:var(--pantoken-alert-glyph) center / 1.125rem no-repeat;position:absolute;inset-block:0;inset-inline-start:0}&:has(>.instui-close-button){padding-inline-end:calc(var(--instui-component-base-button-medium-height) + var(--instui-spacing-space-xs))}&.-screen-reader-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}&.-color-info{border-color:var(--instui-component-alert-info-border-color)}&.-color-success{border-color:var(--instui-component-alert-success-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-success-icon-background);--pantoken-alert-glyph:var(--instui-icon-circle-check)}&.-color-warning{border-color:var(--instui-component-alert-warning-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-warning-icon-background);--pantoken-alert-glyph:var(--instui-icon-triangle-alert)}&.-color-danger{border-color:var(--instui-component-alert-danger-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-danger-icon-background);--pantoken-alert-glyph:var(--instui-icon-circle-x)}&[class*=-icon-]{--pantoken-alert-glyph:var(--pantoken-glyph)}&[class*=-icon-]:before{background:var(--pantoken-alert-icon-bg);block-size:auto;inline-size:2.5rem;-webkit-mask:none;mask:none}&.-timeout-1{--timeout:1000}&.-timeout-2{--timeout:2000}&.-timeout-3{--timeout:3000}&.-timeout-4{--timeout:4000}&.-timeout-5{--timeout:5000}&:is(.-has-shadow-false,.-without-shadow){box-shadow:none}&:is(.-variant-info,.-color-info){border-color:var(--instui-component-alert-info-border-color)}&:is(.-variant-success,.-color-success){border-color:var(--instui-component-alert-success-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-success-icon-background);--pantoken-alert-glyph:var(--instui-icon-circle-check)}&:is(.-variant-warning,.-color-warning){border-color:var(--instui-component-alert-warning-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-warning-icon-background);--pantoken-alert-glyph:var(--instui-icon-triangle-alert)}&:is(.-variant-error,.-color-danger){border-color:var(--instui-component-alert-danger-border-color);--pantoken-alert-icon-bg:var(--instui-component-alert-danger-icon-background);--pantoken-alert-glyph:var(--instui-icon-circle-x)}}

package/dist/billboard.css

@@ -1 +1 @@
-.instui-billboard{text-align:center;background:var(--instui-component-billboard-background-color);padding:var(--instui-component-billboard-padding-medium);margin:var(--instui-component-billboard-medium-margin);font-family:var(--instui-component-billboard-font-family);color:var(--instui-color-text-base);display:block}.instui-billboard.-size-sm{padding:var(--instui-component-billboard-padding-small)}.instui-billboard.-size-md,.instui-billboard.-size-medium{padding:var(--instui-component-billboard-padding-medium)}.instui-billboard.-size-lg,.instui-billboard.-size-large{padding:var(--instui-component-billboard-padding-large);margin:var(--instui-component-billboard-large-margin)}.instui-billboard.-size-sm .message{font-size:var(--instui-font-size-text-sm)}.instui-billboard.-size-md .message,.instui-billboard.-size-medium .message{font-size:var(--instui-font-size-text-base)}.instui-billboard.-size-lg .message,.instui-billboard.-size-large .message{font-size:1.375rem}.instui-billboard.-clickable{cursor:pointer;border:var(--instui-component-billboard-button-border-width) var(--instui-component-billboard-button-border-style) transparent;border-radius:var(--instui-component-billboard-button-border-radius)}.instui-billboard.-clickable:hover{border-style:dashed;border-color:var(--instui-color-text-base)}.instui-billboard.-clickable:focus{border-style:solid;border-color:var(--instui-color-text-base);outline:var(--instui-focus-outline-width) var(--instui-focus-outline-style) var(--instui-focus-outline-color);outline-offset:var(--instui-focus-outline-offset)}.instui-billboard.-clickable:focus-visible{outline:var(--instui-focus-outline-width) var(--instui-focus-outline-style) var(--instui-focus-outline-color);outline-offset:var(--instui-focus-outline-offset)}.instui-billboard.-clickable:active{background:var(--instui-component-billboard-clickable-active-bg);border-style:solid;border-color:var(--instui-color-text-base)}.instui-billboard>.hero{font-size:var(--instui-component-icon-illu-md)}.instui-billboard>.hero[class*=-icon-]{line-height:1}.instui-billboard.-size-sm>.hero,.instui-billboard.-size-small>.hero{font-size:var(--instui-component-icon-illu-sm)}.instui-billboard.-size-md>.hero,.instui-billboard.-size-medium>.hero{font-size:var(--instui-component-icon-illu-md)}.instui-billboard.-size-lg>.hero,.instui-billboard.-size-large>.hero{font-size:var(--instui-component-icon-illu-lg)}@scope(.instui-billboard){:scope{&>.hero{color:var(--instui-color-text-base);font-size:var(--instui-component-icon-illu-md);justify-content:center;margin-block-end:var(--instui-spacing-space-sm);display:inline-flex}&>.hero[class*=-icon-]{line-height:1}&.-size-sm>.hero{font-size:var(--instui-component-icon-illu-sm)}&.-size-md>.hero,&.-size-medium>.hero{font-size:var(--instui-component-icon-illu-md)}&.-size-lg>.hero,&.-size-large>.hero{font-size:var(--instui-component-icon-illu-lg)}&.-size-sm>.hero[class*=-icon-],&.-size-small>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-sm)}&.-size-md>.hero[class*=-icon-],&.-size-medium>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-md)}&.-size-lg>.hero[class*=-icon-],&.-size-large>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-lg)}&>.heading{margin:0 0 var(--instui-spacing-space-xs);color:var(--instui-color-text-base);font-weight:700;font-size:var(--instui-component-text-font-size-x-x-large)}&>.message{color:var(--instui-color-text-base);font-size:var(--instui-font-size-text-base)}&.-clickable:hover>.hero{color:var(--instui-component-link-text-color)}&.-clickable:active>.hero{color:var(--instui-component-link-on-color-text-color)}}}.instui-billboard.-size-small{padding:var(--instui-component-billboard-padding-small)}.instui-billboard.-size-medium,.instui-billboard.-size-medium{padding:var(--instui-component-billboard-padding-medium)}.instui-billboard.-size-large{padding:var(--instui-component-billboard-padding-large);margin:var(--instui-component-billboard-large-margin)}.instui-billboard.-size-small .message{font-size:var(--instui-font-size-text-sm)}.instui-billboard.-size-medium .message,.instui-billboard.-size-medium .message{font-size:var(--instui-font-size-text-base)}.instui-billboard.-size-large .message{font-size:1.375rem}.instui-billboard.-size-small>.hero,.instui-billboard.-size-small>.hero{font-size:var(--instui-component-icon-illu-sm)}.instui-billboard.-size-medium>.hero,.instui-billboard.-size-medium>.hero{font-size:var(--instui-component-icon-illu-md)}.instui-billboard.-size-large>.hero,.instui-billboard.-size-large>.hero{font-size:var(--instui-component-icon-illu-lg)}&.-size-small>.hero{font-size:var(--instui-component-icon-illu-sm)}&.-size-medium>.hero,&.-size-medium>.hero{font-size:var(--instui-component-icon-illu-md)}&.-size-large>.hero{font-size:var(--instui-component-icon-illu-lg)}&.-size-small>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-sm)}&.-size-medium>.hero[class*=-icon-],&.-size-medium>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-md)}&.-size-large>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-lg)}
+.instui-billboard{text-align:center;background:var(--instui-component-billboard-background-color);padding:var(--instui-component-billboard-padding-medium);margin:var(--instui-component-billboard-medium-margin);font-family:var(--instui-component-billboard-font-family);color:var(--instui-color-text-base);display:block}.instui-billboard.-size-sm{padding:var(--instui-component-billboard-padding-small)}.instui-billboard.-size-md,.instui-billboard.-size-medium{padding:var(--instui-component-billboard-padding-medium)}.instui-billboard.-size-lg,.instui-billboard.-size-large{padding:var(--instui-component-billboard-padding-large);margin:var(--instui-component-billboard-large-margin)}.instui-billboard.-size-sm .message{font-size:var(--instui-font-size-text-sm)}.instui-billboard.-size-md .message,.instui-billboard.-size-medium .message{font-size:var(--instui-font-size-text-base)}.instui-billboard.-size-lg .message,.instui-billboard.-size-large .message{font-size:1.375rem}.instui-billboard.-clickable{cursor:pointer;border:var(--instui-component-billboard-button-border-width) var(--instui-component-billboard-button-border-style) transparent;border-radius:var(--instui-component-billboard-button-border-radius)}.instui-billboard.-clickable:hover{border-style:dashed;border-color:var(--instui-color-text-base)}.instui-billboard.-clickable:focus{border-style:solid;border-color:var(--instui-color-text-base);outline:var(--instui-focus-outline-width) var(--instui-focus-outline-style) var(--instui-focus-outline-color);outline-offset:var(--instui-focus-outline-offset)}.instui-billboard.-clickable:focus-visible{outline:var(--instui-focus-outline-width) var(--instui-focus-outline-style) var(--instui-focus-outline-color);outline-offset:var(--instui-focus-outline-offset)}.instui-billboard.-clickable:active{background:var(--instui-component-billboard-clickable-active-bg);border-style:solid;border-color:var(--instui-color-text-base)}.instui-billboard>.hero{font-size:var(--instui-component-icon-illu-md)}.instui-billboard>.hero[class*=-icon-]{line-height:1}.instui-billboard.-size-sm>.hero,.instui-billboard.-size-small>.hero{font-size:var(--instui-component-icon-illu-sm)}.instui-billboard.-size-md>.hero,.instui-billboard.-size-medium>.hero{font-size:var(--instui-component-icon-illu-md)}.instui-billboard.-size-lg>.hero,.instui-billboard.-size-large>.hero{font-size:var(--instui-component-icon-illu-lg)}@scope(.instui-billboard){:scope{&>.hero{color:var(--instui-color-text-base);font-size:var(--instui-component-icon-illu-md);justify-content:center;margin-block-end:var(--instui-spacing-space-sm);display:inline-flex}&>.hero[class*=-icon-]{line-height:1}&.-size-sm>.hero{font-size:var(--instui-component-icon-illu-sm)}&.-size-md>.hero,&.-size-medium>.hero{font-size:var(--instui-component-icon-illu-md)}&.-size-lg>.hero,&.-size-large>.hero{font-size:var(--instui-component-icon-illu-lg)}&.-size-sm>.hero[class*=-icon-],&.-size-small>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-sm)}&.-size-md>.hero[class*=-icon-],&.-size-medium>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-md)}&.-size-lg>.hero[class*=-icon-],&.-size-large>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-lg)}&>.heading{margin:0 0 var(--instui-spacing-space-xs);color:var(--instui-color-text-base);font-weight:700;font-size:var(--instui-component-text-font-size-x-x-large)}&>.message{color:var(--instui-color-text-base);font-size:var(--instui-font-size-text-base)}&.-clickable:hover>.hero{color:var(--instui-component-link-text-color)}&.-clickable:active>.hero{color:var(--instui-component-link-on-color-text-color)}}.instui-billboard.-size-small{padding:var(--instui-component-billboard-padding-small)}.instui-billboard.-size-medium,.instui-billboard.-size-medium{padding:var(--instui-component-billboard-padding-medium)}.instui-billboard.-size-large{padding:var(--instui-component-billboard-padding-large);margin:var(--instui-component-billboard-large-margin)}.instui-billboard.-size-small .message{font-size:var(--instui-font-size-text-sm)}.instui-billboard.-size-medium .message,.instui-billboard.-size-medium .message{font-size:var(--instui-font-size-text-base)}.instui-billboard.-size-large .message{font-size:1.375rem}.instui-billboard.-size-small>.hero,.instui-billboard.-size-small>.hero{font-size:var(--instui-component-icon-illu-sm)}.instui-billboard.-size-medium>.hero,.instui-billboard.-size-medium>.hero{font-size:var(--instui-component-icon-illu-md)}.instui-billboard.-size-large>.hero,.instui-billboard.-size-large>.hero{font-size:var(--instui-component-icon-illu-lg)}&.-size-small>.hero{font-size:var(--instui-component-icon-illu-sm)}&.-size-medium>.hero,&.-size-medium>.hero{font-size:var(--instui-component-icon-illu-md)}&.-size-large>.hero{font-size:var(--instui-component-icon-illu-lg)}&.-size-small>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-sm)}&.-size-medium>.hero[class*=-icon-],&.-size-medium>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-md)}&.-size-large>.hero[class*=-icon-]{font-size:var(--instui-component-icon-illu-lg)}}

package/dist/breadcrumb.css

@@ -1 +1 @@
-@scope(.instui-breadcrumb){&{display:block}&:not(:has(>ol>li>a)){display:none}&>ol{align-items:center;gap:var(--instui-component-breadcrumb-gap-md);font-family:var(--instui-component-link-font-family);font-size:var(--instui-component-link-font-size-md);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}&.-size-sm>ol{gap:var(--instui-component-breadcrumb-gap-sm);font-size:var(--instui-component-link-font-size-sm)}&.-size-md>ol{gap:var(--instui-component-breadcrumb-gap-md);font-size:var(--instui-component-link-font-size-md)}&.-size-lg>ol{gap:var(--instui-component-breadcrumb-gap-lg);font-size:var(--instui-component-link-font-size-lg)}}&.-size-small>ol{gap:var(--instui-component-breadcrumb-gap-sm);font-size:var(--instui-component-link-font-size-sm)}&.-size-medium>ol{gap:var(--instui-component-breadcrumb-gap-md);font-size:var(--instui-component-link-font-size-md)}&.-size-large>ol{gap:var(--instui-component-breadcrumb-gap-lg);font-size:var(--instui-component-link-font-size-lg)}
+@scope(.instui-breadcrumb){&{display:block}&:not(:has(>ol>li>a)){display:none}&>ol{align-items:center;gap:var(--instui-component-breadcrumb-gap-md);font-family:var(--instui-component-link-font-family);font-size:var(--instui-component-link-font-size-md);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}&.-size-sm>ol{gap:var(--instui-component-breadcrumb-gap-sm);font-size:var(--instui-component-link-font-size-sm)}&.-size-md>ol{gap:var(--instui-component-breadcrumb-gap-md);font-size:var(--instui-component-link-font-size-md)}&.-size-lg>ol{gap:var(--instui-component-breadcrumb-gap-lg);font-size:var(--instui-component-link-font-size-lg)}&.-size-small>ol{gap:var(--instui-component-breadcrumb-gap-sm);font-size:var(--instui-component-link-font-size-sm)}&.-size-medium>ol{gap:var(--instui-component-breadcrumb-gap-md);font-size:var(--instui-component-link-font-size-md)}&.-size-large>ol{gap:var(--instui-component-breadcrumb-gap-lg);font-size:var(--instui-component-link-font-size-lg)}}

package/dist/breadcrumb.link.css

@@ -1 +1 @@
-@scope(.instui-breadcrumb){:scope{&.-size-sm li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-sm)}&.-size-md li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-md)}&.-size-lg li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-lg)}&>ol>li{margin:0}& a{color:var(--instui-component-link-text-color);text-decoration:none}& a[class*=-icon-]:before{margin-inline-end:var(--instui-spacing-space2xs)}& a:hover{color:var(--instui-component-link-text-hover-color);text-decoration:underline}& li:not(:last-child){color:var(--instui-color-text-muted)}& li:not(:last-child):after{content:"";vertical-align:-.125em;block-size:1em;inline-size:1em;-webkit-mask:var(--instui-icon-chevron-right) center / contain no-repeat;mask:var(--instui-icon-chevron-right) center / contain no-repeat;background:currentColor;margin-inline-start:var(--instui-component-breadcrumb-gap-md);display:inline-block}[dir=rtl] & li:not(:last-child):after{-webkit-mask:var(--instui-icon-chevron-left) center / contain no-repeat;mask:var(--instui-icon-chevron-left) center / contain no-repeat}@media (width<=47.9375em){&>ol:has(>li:nth-last-child(2))>li:not(:nth-last-child(2)),& li:not(:last-child):after{display:none}& li:nth-last-child(2):before{content:"";vertical-align:-.125em;block-size:1em;inline-size:1em;-webkit-mask:var(--instui-icon-chevron-left) center / contain no-repeat;mask:var(--instui-icon-chevron-left) center / contain no-repeat;background:currentColor;margin-inline-end:var(--instui-component-breadcrumb-gap-md);display:inline-block}[dir=rtl] &>li:nth-last-child(2)>a:before{-webkit-mask:var(--instui-icon-chevron-right) center / contain no-repeat;mask:var(--instui-icon-chevron-right) center / contain no-repeat}}}}&.-size-small li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-sm)}&.-size-medium li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-md)}&.-size-large li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-lg)}
+@scope(.instui-breadcrumb){:scope{&.-size-sm li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-sm)}&.-size-md li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-md)}&.-size-lg li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-lg)}&>ol>li{margin:0}& a{color:var(--instui-component-link-text-color);text-decoration:none}& a[class*=-icon-]:before{margin-inline-end:var(--instui-spacing-space2xs)}& a:hover{color:var(--instui-component-link-text-hover-color);text-decoration:underline}& li:not(:last-child){color:var(--instui-color-text-muted)}& li:not(:last-child):after{content:"";vertical-align:-.125em;block-size:1em;inline-size:1em;-webkit-mask:var(--instui-icon-chevron-right) center / contain no-repeat;mask:var(--instui-icon-chevron-right) center / contain no-repeat;background:currentColor;margin-inline-start:var(--instui-component-breadcrumb-gap-md);display:inline-block}[dir=rtl] & li:not(:last-child):after{-webkit-mask:var(--instui-icon-chevron-left) center / contain no-repeat;mask:var(--instui-icon-chevron-left) center / contain no-repeat}@media (width<=47.9375em){&>ol:has(>li:nth-last-child(2))>li:not(:nth-last-child(2)),& li:not(:last-child):after{display:none}& li:nth-last-child(2):before{content:"";vertical-align:-.125em;block-size:1em;inline-size:1em;-webkit-mask:var(--instui-icon-chevron-left) center / contain no-repeat;mask:var(--instui-icon-chevron-left) center / contain no-repeat;background:currentColor;margin-inline-end:var(--instui-component-breadcrumb-gap-md);display:inline-block}[dir=rtl] &>li:nth-last-child(2)>a:before{-webkit-mask:var(--instui-icon-chevron-right) center / contain no-repeat;mask:var(--instui-icon-chevron-right) center / contain no-repeat}}}&.-size-small li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-sm)}&.-size-medium li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-md)}&.-size-large li:not(:last-child):after{margin-inline-start:var(--instui-component-breadcrumb-gap-lg)}}

package/dist/button.css

@@ -1 +1 @@
-.instui-button{justify-content:center;align-items:center;gap:var(--instui-spacing-space-xs);min-height:var(--instui-component-base-button-medium-height);padding:var(--instui-spacing-space-xs) var(--instui-component-base-button-medium-padding-horizontal);font-family:var(--instui-font-family-base);font-size:var(--instui-component-base-button-medium-font-size);font-weight:var(--instui-font-weight-interactive);line-height:var(--instui-line-height-standalone-text-base);border:var(--instui-border-width-md) solid transparent;border-radius:var(--instui-component-base-button-border-radius);cursor:pointer;background:var(--instui-color-background-interactive-action-primary-base);color:var(--instui-color-text-interactive-action-primary-base);display:inline-flex}.instui-button:hover{background:var(--instui-color-background-interactive-action-primary-hover)}.instui-button:active{background:var(--instui-color-background-interactive-action-primary-active)}.instui-button:disabled,.instui-button[aria-disabled=true]{background:var(--instui-color-background-interactive-action-primary-disabled);color:var(--instui-color-text-interactive-action-primary-disabled);cursor:not-allowed}.instui-button.-color-secondary{background:var(--instui-color-background-interactive-action-secondary-base);color:var(--instui-color-text-interactive-action-secondary-base);border-color:var(--instui-color-stroke-interactive-action-secondary-base)}.instui-button.-color-secondary:hover{background:var(--instui-color-background-interactive-action-secondary-hover);border-color:var(--instui-color-stroke-interactive-action-secondary-hover)}.instui-button.-color-secondary:active{background:var(--instui-color-background-interactive-action-secondary-active);border-color:var(--instui-color-stroke-interactive-action-secondary-active)}.instui-button.-color-danger{background:var(--instui-color-background-interactive-action-destructive-base);color:var(--instui-color-text-interactive-action-status-base)}.instui-button.-color-danger:hover{background:var(--instui-color-background-interactive-action-destructive-hover)}.instui-button.-color-danger:active{background:var(--instui-color-background-interactive-action-destructive-active)}.instui-button.-color-success{background:var(--instui-color-background-interactive-action-success-base);color:var(--instui-color-text-interactive-action-status-base)}.instui-button.-color-success:hover{background:var(--instui-color-background-interactive-action-success-hover)}.instui-button.-color-tertiary{color:var(--instui-color-text-interactive-action-tertiary-base);border-color:var(--instui-color-stroke-interactive-action-tertiary-base);background:0 0}.instui-button.-color-tertiary:hover{background:var(--instui-color-background-interactive-action-tertiary-hover)}.instui-button.-color-tertiary:active{background:var(--instui-color-background-interactive-action-tertiary-active)}.instui-button.-color-primary-inverse{background:var(--instui-component-base-button-primary-inverse-background);color:var(--instui-component-base-button-primary-inverse-color);border-color:var(--instui-component-base-button-primary-inverse-border-color)}.instui-button.-color-primary-inverse:hover{background:var(--instui-component-base-button-primary-inverse-hover-background);border-color:var(--instui-component-base-button-primary-on-color-hover-border-color)}.instui-button.-color-primary-inverse:active{background:var(--instui-component-base-button-primary-inverse-active-background);border-color:var(--instui-component-base-button-primary-on-color-active-border-color)}.instui-button.-color-ai{color:var(--instui-color-text-interactive-action-ai-base);background:linear-gradient(to bottom, var(--instui-color-background-interactive-action-ai-top-gradient-base) 0%, var(--instui-color-background-interactive-action-ai-bottom-gradient-base) 100%) padding-box, linear-gradient(to bottom, var(--instui-color-stroke-interactive-action-ai-top-gradient-base) 0%, var(--instui-color-stroke-interactive-action-ai-bottom-gradient-base) 100%) border-box;border-color:#0000}.instui-button.-color-ai:hover{color:var(--instui-color-text-interactive-action-ai-hover);background:linear-gradient(to bottom, var(--instui-color-background-interactive-action-ai-top-gradient-hover) 0%, var(--instui-color-background-interactive-action-ai-bottom-gradient-hover) 100%) padding-box, linear-gradient(to bottom, var(--instui-color-stroke-interactive-action-ai-top-gradient-hover) 0%, var(--instui-color-stroke-interactive-action-ai-bottom-gradient-hover) 100%) border-box}.instui-button.-color-ai:active{color:var(--instui-color-text-interactive-action-ai-active);background:linear-gradient(to bottom, var(--instui-color-background-interactive-action-ai-top-gradient-active) 0%, var(--instui-color-background-interactive-action-ai-bottom-gradient-active) 100%) padding-box, linear-gradient(to bottom, var(--instui-color-stroke-interactive-action-ai-top-gradient-active) 0%, var(--instui-color-stroke-interactive-action-ai-bottom-gradient-active) 100%) border-box}.instui-button.-color-ai-secondary{background:linear-gradient(to bottom, var(--instui-color-text-interactive-action-ai-secondary-top-gradient-base) 0%, var(--instui-color-text-interactive-action-ai-secondary-bottom-gradient-base) 100%);-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text;border-color:#0000;position:relative}.instui-button.-color-ai-secondary:after{content:"";inset:calc(-1 * var(--instui-border-width-md));border-radius:inherit;padding:var(--instui-border-width-sm);background:linear-gradient(to bottom, var(--instui-color-stroke-interactive-action-ai-top-gradient-base) 0%, var(--instui-color-stroke-interactive-action-ai-bottom-gradient-base) 100%);-webkit-mask-composite:xor;pointer-events:none;position:absolute;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;mask-composite:exclude;mask-mode:match-source,match-source}.instui-button.-color-ai-secondary:hover,.instui-button.-color-ai-secondary:active{color:var(--instui-color-text-interactive-action-ai-secondary-top-gradient-base);-webkit-text-fill-color:currentColor;-webkit-background-clip:border-box;background-clip:border-box}.instui-button.-color-ai-secondary:hover{background:linear-gradient(to bottom, var(--instui-color-background-interactive-action-ai-secondary-hover-top-gradient) 0%, var(--instui-color-background-interactive-action-ai-secondary-hover-bottom-gradient) 100%)}.instui-button.-color-ai-secondary:active{background:linear-gradient(to bottom, var(--instui-color-background-interactive-action-ai-secondary-active-top-gradient) 0%, var(--instui-color-background-interactive-action-ai-secondary-active-bottom-gradient) 100%)}.instui-button.-color-ai:before,.instui-button.-color-ai-secondary:before{content:"";flex:none;block-size:1em;inline-size:1em;-webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 1920 1920' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M960 0L1219.29 700.713L1920 960L1219.29 1219.29L960 1920L700.713 1219.29L0 960L700.713 700.713L960 0Z'/%3E%3Cpath d='M1600 0L1686.43 233.571L1920 320L1686.43 406.429L1600 640L1513.57 406.429L1280 320L1513.57 233.571L1600 0Z'/%3E%3C/svg%3E") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 1920 1920' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M960 0L1219.29 700.713L1920 960L1219.29 1219.29L960 1920L700.713 1219.29L0 960L700.713 700.713L960 0Z'/%3E%3Cpath d='M1600 0L1686.43 233.571L1920 320L1686.43 406.429L1600 640L1513.57 406.429L1280 320L1513.57 233.571L1600 0Z'/%3E%3C/svg%3E") 50%/contain no-repeat}.instui-button.-color-ai:before{background:var(--instui-color-text-interactive-action-ai-base)}.instui-button.-color-ai-secondary:before{background:linear-gradient(to bottom, var(--instui-color-stroke-interactive-action-ai-top-gradient-base) 0%, var(--instui-color-stroke-interactive-action-ai-bottom-gradient-base) 100%)}.instui-button.-without-background{background:var(--instui-component-base-button-primary-ghost-background);color:var(--instui-component-base-button-primary-ghost-color);border-color:var(--instui-component-base-button-primary-ghost-border-color)}.instui-button.-color-secondary.-ghost{background:var(--instui-component-base-button-secondary-ghost-background);color:var(--instui-component-base-button-secondary-ghost-color);border-color:var(--instui-component-base-button-secondary-ghost-border-color)}.instui-button.-without-background:hover{background:color-mix(in srgb, hsl(from var(--instui-component-base-button-primary-ghost-color) h s calc(l - 10)) 10%, transparent)}.instui-button.-without-background:active{background:color-mix(in srgb, hsl(from var(--instui-component-base-button-primary-ghost-color) h s calc(l - 10)) 20%, transparent)}.instui-button.-color-secondary.-ghost:hover{background:color-mix(in srgb, hsl(from var(--instui-component-base-button-secondary-ghost-color) h s calc(l - 10)) 10%, transparent)}.instui-button.-color-secondary.-ghost:active{background:color-mix(in srgb, hsl(from var(--instui-component-base-button-secondary-ghost-color) h s calc(l - 10)) 20%, transparent)}.instui-button.-display-block{width:100%;display:flex}.instui-button.-size-sm{font-size:var(--instui-component-base-button-small-font-size);min-height:var(--instui-component-base-button-small-height);padding-inline:var(--instui-component-base-button-small-padding-horizontal)}.instui-button.-size-lg{font-size:var(--instui-component-base-button-large-font-size);min-height:var(--instui-component-base-button-large-height);padding-inline:var(--instui-component-base-button-large-padding-horizontal)}.instui-button.-shape-square{padding:var(--instui-spacing-space-xs);aspect-ratio:1}.instui-button.-shape-circle{padding:var(--instui-spacing-space-xs);aspect-ratio:1;border-radius:50%}.instui-button.-shape-square[class*=-icon-]:before,.instui-button.-shape-circle[class*=-icon-]:before{block-size:1.25em;inline-size:1.25em}.instui-button.-condensed{min-height:0;color:var(--instui-color-text-interactive-action-secondary-base);padding-inline:var(--instui-spacing-space-xs);background:0 0;border-color:#0000}.instui-button.-condensed:hover{background:var(--instui-color-background-muted)}.instui-button.-toggle[aria-pressed=true]{background:var(--instui-color-background-interactive-action-secondary-active);border-color:var(--instui-color-stroke-interactive-action-secondary-active);color:var(--instui-color-text-interactive-action-secondary-base)}.instui-button.-without-border{border-style:none}.instui-button.-size-small{font-size:var(--instui-component-base-button-small-font-size);min-height:var(--instui-component-base-button-small-height);padding-inline:var(--instui-component-base-button-small-padding-horizontal)}.instui-button.-size-large{font-size:var(--instui-component-base-button-large-font-size);min-height:var(--instui-component-base-button-large-height);padding-inline:var(--instui-component-base-button-large-padding-horizontal)}
+@scope(.instui-button){&{justify-content:center;align-items:center;gap:var(--instui-spacing-space-xs);min-height:var(--instui-component-base-button-medium-height);padding:var(--instui-spacing-space-xs) var(--instui-component-base-button-medium-padding-horizontal);font-family:var(--instui-font-family-base);font-size:var(--instui-component-base-button-medium-font-size);font-weight:var(--instui-font-weight-interactive);line-height:var(--instui-line-height-standalone-text-base);border:var(--instui-border-width-sm) solid transparent;border-radius:var(--instui-component-base-button-border-radius);cursor:pointer;background:var(--instui-color-background-interactive-action-primary-base);color:var(--instui-color-text-interactive-action-primary-base);display:inline-flex}&:hover{background:var(--instui-color-background-interactive-action-primary-hover)}&:active{background:var(--instui-color-background-interactive-action-primary-active)}&:disabled,&[aria-disabled=true]{background:var(--instui-component-base-button-primary-disabled-background-color);border-color:var(--instui-component-base-button-primary-disabled-border-color);color:var(--instui-component-base-button-primary-color);cursor:not-allowed}&.-color-primary{background:var(--instui-color-background-interactive-action-primary-base);color:var(--instui-color-text-interactive-action-primary-base);border-color:var(--instui-color-stroke-interactive-action-primary-base)}&.-color-primary:hover{background:var(--instui-color-background-interactive-action-primary-hover);border-color:var(--instui-color-stroke-interactive-action-primary-hover)}&.-color-primary:active{background:var(--instui-color-background-interactive-action-primary-active);border-color:var(--instui-color-stroke-interactive-action-primary-active)}&.-color-primary:disabled,&.-color-primary[aria-disabled=true]{background:var(--instui-component-base-button-primary-disabled-background-color);border-color:var(--instui-component-base-button-primary-disabled-border-color);color:var(--instui-component-base-button-primary-color)}&.-color-secondary{background:var(--instui-component-base-button-secondary-background);color:var(--instui-component-base-button-secondary-color);border-color:var(--instui-component-base-button-secondary-border-color)}&.-color-secondary:hover{background:var(--instui-component-base-button-secondary-hover-background);border-color:var(--instui-component-base-button-secondary-hover-border-color);color:var(--instui-component-base-button-secondary-hover-text-color)}&.-color-secondary:active{background:var(--instui-component-base-button-secondary-active-background);border-color:var(--instui-component-base-button-secondary-active-border-color);color:var(--instui-component-base-button-secondary-active-text-color)}&.-color-secondary:disabled,&.-color-secondary[aria-disabled=true]{background:var(--instui-component-base-button-secondary-disabled-background-color);border-color:var(--instui-component-base-button-secondary-disabled-border-color);color:var(--instui-component-base-button-secondary-disabled-text-color)}&.-color-danger{background:var(--instui-color-background-interactive-action-destructive-base);color:var(--instui-color-text-interactive-action-status-base)}&.-color-danger:hover{background:var(--instui-color-background-interactive-action-destructive-hover)}&.-color-danger:active{background:var(--instui-color-background-interactive-action-destructive-active)}&.-color-success{background:var(--instui-color-background-interactive-action-success-base);color:var(--instui-color-text-interactive-action-status-base)}&.-color-success:hover{background:var(--instui-color-background-interactive-action-success-hover)}&.-color-tertiary,&.-ghost{color:var(--instui-component-base-button-primary-ghost-color);border-color:var(--instui-component-base-button-primary-ghost-border-color);background:0 0}&.-color-tertiary:hover,&.-ghost:hover{background:var(--instui-component-base-button-primary-ghost-hover-background);border-color:var(--instui-component-base-button-tertiary-hover-border-color);color:var(--instui-component-base-button-tertiary-hover-text-color)}&.-color-tertiary:active,&.-ghost:active{background:var(--instui-component-base-button-primary-ghost-active-background);border-color:var(--instui-component-base-button-tertiary-active-border-color);color:var(--instui-component-base-button-tertiary-active-text-color)}&.-color-tertiary:disabled,&.-color-tertiary[aria-disabled=true],&.-ghost:disabled,&.-ghost[aria-disabled=true]{border-color:var(--instui-component-base-button-tertiary-disabled-border-color);color:var(--instui-component-base-button-tertiary-disabled-text-color);background:0 0}&.-color-primary-inverse{background:var(--instui-component-base-button-primary-inverse-background);color:var(--instui-component-base-button-primary-inverse-color);border-color:var(--instui-component-base-button-primary-inverse-border-color)}&.-color-primary-inverse:hover{background:var(--instui-component-base-button-primary-inverse-hover-background);border-color:var(--instui-component-base-button-primary-on-color-hover-border-color)}&.-color-primary-inverse:active{background:var(--instui-component-base-button-primary-inverse-active-background);border-color:var(--instui-component-base-button-primary-on-color-active-border-color)}&.-on-color:not([class*=-color-]),&.-color-primary.-on-color{background:var(--instui-component-base-button-primary-inverse-background);border-color:var(--instui-component-base-button-primary-inverse-border-color);color:var(--instui-component-base-button-primary-inverse-color)}&.-on-color:not([class*=-color-]):hover,&.-color-primary.-on-color:hover{background:var(--instui-component-base-button-primary-inverse-hover-background);border-color:var(--instui-component-base-button-primary-on-color-hover-border-color);color:var(--instui-component-base-button-primary-on-color-hover-text-color)}&.-on-color:not([class*=-color-]):active,&.-color-primary.-on-color:active{background:var(--instui-component-base-button-primary-inverse-active-background);border-color:var(--instui-component-base-button-primary-on-color-active-border-color);color:var(--instui-component-base-button-primary-on-color-active-text-color)}&.-on-color:not([class*=-color-]):disabled,&.-on-color:not([class*=-color-])[aria-disabled=true],&.-color-primary.-on-color:disabled,&.-color-primary.-on-color[aria-disabled=true]{background:var(--instui-component-base-button-primary-on-color-disabled-background-color);border-color:var(--instui-component-base-button-primary-on-color-disabled-border-color);color:var(--instui-component-base-button-primary-on-color-disabled-text-color)}&.-color-secondary.-on-color{border-color:var(--instui-component-base-button-primary-inverse-ghost-border-color);color:var(--instui-component-base-button-primary-inverse-ghost-color);background:0 0}&.-color-secondary.-on-color:hover{background:var(--instui-component-base-button-primary-inverse-ghost-hover-background);border-color:var(--instui-component-base-button-primary-on-color-hover-border-color);color:var(--instui-component-base-button-secondary-on-color-hover-text-color)}&.-color-secondary.-on-color:active{background:var(--instui-component-base-button-primary-inverse-ghost-active-background);border-color:var(--instui-component-base-button-secondary-on-color-active-border-color);color:var(--instui-component-base-button-secondary-on-color-active-text-color)}&.-color-secondary.-on-color:disabled,&.-color-secondary.-on-color[aria-disabled=true]{border-color:var(--instui-component-base-button-secondary-on-color-disabled-border-color);color:var(--instui-component-base-button-secondary-on-color-disabled-text-color);background:0 0}&.-color-ai{color:var(--instui-color-text-interactive-action-ai-base);background:linear-gradient(to bottom, var(--instui-color-background-interactive-action-ai-top-gradient-base) 0%, var(--instui-color-background-interactive-action-ai-bottom-gradient-base) 100%) padding-box, linear-gradient(to bottom, var(--instui-color-stroke-interactive-action-ai-top-gradient-base) 0%, var(--instui-color-stroke-interactive-action-ai-bottom-gradient-base) 100%) border-box;border-color:#0000}&.-color-ai:hover{color:var(--instui-color-text-interactive-action-ai-hover);background:linear-gradient(to bottom, var(--instui-color-background-interactive-action-ai-top-gradient-hover) 0%, var(--instui-color-background-interactive-action-ai-bottom-gradient-hover) 100%) padding-box, linear-gradient(to bottom, var(--instui-color-stroke-interactive-action-ai-top-gradient-hover) 0%, var(--instui-color-stroke-interactive-action-ai-bottom-gradient-hover) 100%) border-box}&.-color-ai:active{color:var(--instui-color-text-interactive-action-ai-active);background:linear-gradient(to bottom, var(--instui-color-background-interactive-action-ai-top-gradient-active) 0%, var(--instui-color-background-interactive-action-ai-bottom-gradient-active) 100%) padding-box, linear-gradient(to bottom, var(--instui-color-stroke-interactive-action-ai-top-gradient-active) 0%, var(--instui-color-stroke-interactive-action-ai-bottom-gradient-active) 100%) border-box}&.-color-ai:disabled,&.-color-ai[aria-disabled=true]{color:var(--instui-component-base-button-ai-disabled-text-color);border-color:var(--instui-component-base-button-ai-disabled-border-color);background:var(--instui-component-base-button-ai-disabled-background-color)}&.-color-ai-secondary{background:linear-gradient(to bottom, var(--instui-color-text-interactive-action-ai-secondary-top-gradient-base) 0%, var(--instui-color-text-interactive-action-ai-secondary-bottom-gradient-base) 100%);-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text;border-color:#0000;position:relative}&.-color-ai-secondary:after{content:"";inset:calc(-1 * var(--instui-border-width-md));border-radius:inherit;padding:var(--instui-border-width-sm);background:linear-gradient(to bottom, var(--instui-color-stroke-interactive-action-ai-top-gradient-base) 0%, var(--instui-color-stroke-interactive-action-ai-bottom-gradient-base) 100%);-webkit-mask-composite:xor;pointer-events:none;position:absolute;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;mask-composite:exclude;mask-mode:match-source,match-source}&.-color-ai-secondary:hover,&.-color-ai-secondary:active{color:var(--instui-color-text-interactive-action-ai-secondary-top-gradient-base);-webkit-text-fill-color:currentColor;-webkit-background-clip:border-box;background-clip:border-box}&.-color-ai-secondary:hover{background:linear-gradient(to bottom, var(--instui-color-background-interactive-action-ai-secondary-hover-top-gradient) 0%, var(--instui-color-background-interactive-action-ai-secondary-hover-bottom-gradient) 100%)}&.-color-ai-secondary:active{background:linear-gradient(to bottom, var(--instui-color-background-interactive-action-ai-secondary-active-top-gradient) 0%, var(--instui-color-background-interactive-action-ai-secondary-active-bottom-gradient) 100%)}&.-color-ai-secondary:disabled,&.-color-ai-secondary[aria-disabled=true]{border-color:var(--instui-component-base-button-ai-disabled-border-color);color:var(--instui-component-base-button-ai-disabled-text-color);-webkit-text-fill-color:currentColor;background:0 0}&.-color-ai:before{background:var(--instui-color-text-interactive-action-ai-base)}&.-color-ai-secondary:before{background:linear-gradient(to bottom, var(--instui-color-stroke-interactive-action-ai-top-gradient-base) 0%, var(--instui-color-stroke-interactive-action-ai-bottom-gradient-base) 100%)}&.-color-ai:disabled:before,&.-color-ai[aria-disabled=true]:before,&.-color-ai-secondary:disabled:before,&.-color-ai-secondary[aria-disabled=true]:before{background:var(--instui-component-icon-action-ai-disabled-color)}&.-without-background{background:var(--instui-component-base-button-primary-ghost-background);color:var(--instui-component-base-button-primary-ghost-color);border-color:var(--instui-component-base-button-primary-ghost-border-color)}&.-display-block{width:100%;display:flex}&.-size-sm{font-size:var(--instui-component-base-button-small-font-size);min-height:var(--instui-component-base-button-small-height);padding-inline:var(--instui-component-base-button-small-padding-horizontal)}&.-size-md{font-size:var(--instui-component-base-button-medium-font-size);min-height:var(--instui-component-base-button-medium-height);padding-inline:var(--instui-component-base-button-medium-padding-horizontal)}&.-size-lg{font-size:var(--instui-component-base-button-large-font-size);min-height:var(--instui-component-base-button-large-height);padding-inline:var(--instui-component-base-button-large-padding-horizontal)}&.-shape-square{padding:var(--instui-spacing-space-xs);aspect-ratio:1}&.-shape-circle{padding:var(--instui-spacing-space-xs);aspect-ratio:1;border-radius:50%}&.-shape-square[class*=-icon-]:before,&.-shape-circle[class*=-icon-]:before{block-size:1.25em;inline-size:1.25em}&.-condensed{min-height:0;color:var(--instui-color-text-interactive-action-secondary-base);padding-inline:var(--instui-spacing-space-xs);background:0 0;border-color:#0000}&.-condensed:hover{background:var(--instui-color-background-muted)}&.-toggle[aria-pressed=true]{background:var(--instui-color-background-interactive-action-secondary-active);border-color:var(--instui-color-stroke-interactive-action-secondary-active);color:var(--instui-color-text-interactive-action-secondary-base)}&.-without-border{border-style:none}}.instui-button-group{align-items:center;gap:var(--instui-component-shared-tokens-spacing-gap-buttons);flex-wrap:wrap;display:flex}.instui-button.-color-ai:before,.instui-button.-color-ai-secondary:before{content:"";flex:none;block-size:1em;inline-size:1em;-webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 1920 1920' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M960 0L1219.29 700.713L1920 960L1219.29 1219.29L960 1920L700.713 1219.29L0 960L700.713 700.713L960 0Z'/%3E%3Cpath d='M1600 0L1686.43 233.571L1920 320L1686.43 406.429L1600 640L1513.57 406.429L1280 320L1513.57 233.571L1600 0Z'/%3E%3C/svg%3E") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 1920 1920' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M960 0L1219.29 700.713L1920 960L1219.29 1219.29L960 1920L700.713 1219.29L0 960L700.713 700.713L960 0Z'/%3E%3Cpath d='M1600 0L1686.43 233.571L1920 320L1686.43 406.429L1600 640L1513.57 406.429L1280 320L1513.57 233.571L1600 0Z'/%3E%3C/svg%3E") 50%/contain no-repeat}.instui-button.-without-background:hover{background:color-mix(in srgb, hsl(from var(--instui-component-base-button-primary-ghost-color) h s calc(l - 10)) 10%, transparent)}.instui-button.-without-background:active{background:color-mix(in srgb, hsl(from var(--instui-component-base-button-primary-ghost-color) h s calc(l - 10)) 20%, transparent)}&.-size-small{font-size:var(--instui-component-base-button-small-font-size);min-height:var(--instui-component-base-button-small-height);padding-inline:var(--instui-component-base-button-small-padding-horizontal)}&.-size-medium{font-size:var(--instui-component-base-button-medium-font-size);min-height:var(--instui-component-base-button-medium-height);padding-inline:var(--instui-component-base-button-medium-padding-horizontal)}&.-size-large{font-size:var(--instui-component-base-button-large-font-size);min-height:var(--instui-component-base-button-large-height);padding-inline:var(--instui-component-base-button-large-padding-horizontal)}

package/dist/close-button.css

@@ -1 +1 @@
-@scope(.instui-close-button){&{aspect-ratio:1;min-height:var(--instui-component-base-button-medium-height);padding:var(--instui-spacing-space-xs);border-radius:var(--instui-component-base-button-border-radius);color:var(--instui-color-text-interactive-action-secondary-base);cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;display:inline-flex}&:before{content:"";block-size:1em;inline-size:1em;-webkit-mask:var(--instui-icon-x) center / contain no-repeat;mask:var(--instui-icon-x) center / contain no-repeat;background:currentColor}&:hover{background:var(--instui-color-background-interactive-action-tertiary-hover)}&:active{background:var(--instui-color-background-interactive-action-tertiary-active)}&.-size-sm{min-height:var(--instui-component-base-button-small-height)}&.-size-lg{min-height:var(--instui-component-base-button-large-height)}&.-color-inverse{color:var(--instui-component-base-button-primary-inverse-ghost-color)}}&.-size-small{min-height:var(--instui-component-base-button-small-height)}&.-size-large{min-height:var(--instui-component-base-button-large-height)}
+@scope(.instui-close-button){&{aspect-ratio:1;min-height:var(--instui-component-base-button-medium-height);padding:var(--instui-spacing-space-xs);border-radius:var(--instui-component-base-button-border-radius);color:var(--instui-component-icon-base-color);cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;display:inline-flex}&:before{content:"";block-size:1em;inline-size:1em;-webkit-mask:var(--instui-icon-x) center / contain no-repeat;mask:var(--instui-icon-x) center / contain no-repeat;background:currentColor}&:hover{background:var(--instui-component-base-button-primary-ghost-hover-background)}&:active{background:var(--instui-component-base-button-primary-ghost-active-background)}&:disabled,&[aria-disabled=true]{color:var(--instui-component-icon-disabled-base-color);cursor:not-allowed}&.-size-sm{min-height:var(--instui-component-base-button-small-height)}&.-size-md{min-height:var(--instui-component-base-button-medium-height)}&.-size-lg{min-height:var(--instui-component-base-button-large-height)}&.-on-color,&.-color-inverse{color:var(--instui-component-icon-on-color)}&.-on-color:hover,&.-color-inverse:hover{background:var(--instui-component-base-button-primary-inverse-ghost-hover-background)}&.-on-color:active,&.-color-inverse:active{background:var(--instui-component-base-button-primary-inverse-ghost-active-background)}&.-on-color:disabled,&.-on-color[aria-disabled=true],&.-color-inverse:disabled,&.-color-inverse[aria-disabled=true]{color:var(--instui-component-icon-disabled-on-color)}&.-size-small{min-height:var(--instui-component-base-button-small-height)}&.-size-medium{min-height:var(--instui-component-base-button-medium-height)}&.-size-large{min-height:var(--instui-component-base-button-large-height)}}