@pantoken/components 1.0.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/alert.css +1 -1
- package/dist/billboard.css +1 -1
- package/dist/breadcrumb.css +1 -1
- package/dist/breadcrumb.link.css +1 -1
- package/dist/calendar.css +1 -1
- package/dist/checkbox.css +1 -1
- package/dist/close-button.css +1 -1
- package/dist/components.css +1 -1
- package/dist/context-view.css +1 -1
- package/dist/file-drop.css +1 -1
- package/dist/form-field-group.css +1 -1
- package/dist/form-field-messages.css +1 -1
- package/dist/form-field.css +1 -1
- package/dist/img.css +1 -1
- package/dist/in-place-edit.css +1 -1
- package/dist/index.mjs +159 -159
- package/dist/link.css +1 -1
- package/dist/list.css +1 -1
- package/dist/list.item.css +1 -1
- package/dist/mask.css +1 -1
- package/dist/menu.css +1 -1
- package/dist/menu.group.css +1 -1
- package/dist/menu.item.css +1 -1
- package/dist/menu.separator.css +1 -1
- package/dist/modal.body.css +1 -1
- package/dist/modal.css +1 -1
- package/dist/modal.footer.css +1 -1
- package/dist/modal.header.css +1 -1
- package/dist/pagination.css +1 -1
- package/dist/pagination.page.css +1 -1
- package/dist/pill.css +1 -1
- package/dist/popover.css +1 -1
- package/dist/progress-circle.css +1 -1
- package/dist/progress.css +1 -1
- package/dist/radio-input-group.css +1 -1
- package/dist/radio.css +1 -1
- package/dist/range-input.css +1 -1
- package/dist/rating.css +1 -1
- package/dist/select.css +1 -1
- package/dist/side-nav-bar.css +1 -1
- package/dist/side-nav-bar.item.css +1 -1
- package/dist/table.css +1 -1
- package/dist/tabs.css +1 -1
- package/dist/tabs.panel.css +1 -1
- package/dist/tabs.tab.css +1 -1
- package/dist/tag.css +1 -1
- package/dist/text.css +1 -1
- package/dist/toggle-details.css +1 -1
- package/dist/toggle-group.css +1 -1
- package/dist/tray.css +1 -1
- package/dist/tree-browser.css +1 -1
- package/dist/utilities/icon.css +1 -1
- package/dist/utilities/screen-reader-content.css +1 -1
- package/dist/utilities/transition.css +1 -1
- package/dist/utilities.css +1 -1
- package/package.json +2 -2
package/dist/link.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-link{align-items:center;gap:var(--instui-component-link-gap-md);color:var(--instui-component-link-text-color);font-family:var(--instui-component-link-font-family);font-size:var(--instui-component-link-font-size-md);font-weight:var(--instui-component-link-font-weight);line-height:var(--instui-component-link-line-height-md);text-decoration:var(--instui-component-link-text-decoration-outside-text);cursor:pointer;display:inline-flex}
|
|
1
|
+
@scope(.instui-link){&{align-items:center;gap:var(--instui-component-link-gap-md);color:var(--instui-component-link-text-color);font-family:var(--instui-component-link-font-family);font-size:var(--instui-component-link-font-size-md);font-weight:var(--instui-component-link-font-weight);line-height:var(--instui-component-link-line-height-md);text-decoration:var(--instui-component-link-text-decoration-outside-text);cursor:pointer;display:inline-flex}&:hover{color:var(--instui-component-link-text-hover-color)}&[aria-disabled=true]{color:var(--instui-component-link-text-disabled-color);cursor:not-allowed}&.-size-sm{gap:var(--instui-component-link-gap-sm);font-size:var(--instui-component-link-font-size-sm);line-height:var(--instui-component-link-line-height-sm)}&.-size-lg{gap:var(--instui-component-link-gap-lg);font-size:var(--instui-component-link-font-size-lg);line-height:var(--instui-component-link-line-height-lg)}}.instui-link.-color-inverse{color:var(--instui-component-link-on-color-text-color)}.instui-link.-color-inverse:hover{color:var(--instui-component-link-on-color-text-hover-color)}.instui-link.-color-inverse[aria-disabled=true]{color:var(--instui-component-link-on-color-text-disabled-color)}.instui-link.-inline{font-family:var(--instui-component-link-inline-link-medium-font-family);font-size:var(--instui-component-link-inline-link-medium-font-size);font-weight:var(--instui-component-link-inline-link-medium-font-weight);line-height:var(--instui-component-link-inline-link-medium-line-height);text-decoration:var(--instui-component-link-text-decoration-within-text);display:inline}.instui-link.-inline.-sm{font-size:var(--instui-component-link-inline-link-small-font-size);font-weight:var(--instui-component-link-inline-link-small-font-weight);line-height:var(--instui-component-link-inline-link-small-line-height)}.instui-link.-inline.-lg{font-size:var(--instui-component-link-inline-link-large-font-size);font-weight:var(--instui-component-link-inline-link-large-font-weight);line-height:var(--instui-component-link-inline-link-large-line-height)}.instui-link.-unstyled{color:var(--instui-component-link-unstyled-text-color);text-decoration:none}&.-size-small{gap:var(--instui-component-link-gap-sm);font-size:var(--instui-component-link-font-size-sm);line-height:var(--instui-component-link-line-height-sm)}&.-size-large{gap:var(--instui-component-link-gap-lg);font-size:var(--instui-component-link-font-size-lg);line-height:var(--instui-component-link-line-height-lg)}
|
package/dist/list.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-list{color:var(--instui-component-list-item-color);font-family:var(--instui-component-list-item-font-family);font-size:var(--instui-component-list-item-font-size-medium);font-weight:var(--instui-component-list-item-font-weight);line-height:var(--instui-component-list-item-line-height);padding-inline-start:var(--instui-component-list-list-padding)}
|
|
1
|
+
@scope(.instui-list){&{color:var(--instui-component-list-item-color);font-family:var(--instui-component-list-item-font-family);font-size:var(--instui-component-list-item-font-size-medium);font-weight:var(--instui-component-list-item-font-weight);line-height:var(--instui-component-list-item-line-height);padding-inline-start:var(--instui-component-list-list-padding)}&.-size-sm{font-size:var(--instui-component-list-item-font-size-small)}&.-size-md{font-size:var(--instui-component-list-item-font-size-medium)}&.-size-lg{font-size:var(--instui-component-list-item-font-size-large)}&.-unstyled{padding-inline-start:0;list-style:none}&.-inline{align-items:center;gap:var(--instui-component-list-item-spacing-medium);flex-wrap:wrap;padding-inline-start:0;list-style:none;display:flex}&.-inline>li{margin:0}}&.-size-small{font-size:var(--instui-component-list-item-font-size-small)}&.-size-medium{font-size:var(--instui-component-list-item-font-size-medium)}&.-size-large{font-size:var(--instui-component-list-item-font-size-large)}
|
package/dist/list.item.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@scope(.instui-list){:scope
|
|
1
|
+
@scope(.instui-list){:scope{&>li{color:var(--instui-component-list-item-color);font-family:var(--instui-component-list-item-font-family);font-size:var(--instui-component-list-item-font-size-medium);font-weight:var(--instui-component-list-item-font-weight);line-height:var(--instui-component-list-item-line-height)}&.-size-sm>li{font-size:var(--instui-component-list-item-font-size-small)}&.-size-md>li{font-size:var(--instui-component-list-item-font-size-medium)}&.-size-lg>li{font-size:var(--instui-component-list-item-font-size-large)}&.-ordered>li::marker{font-weight:var(--instui-component-list-ordered-number-font-weight)}&.-ordered>li{padding-inline-start:var(--instui-component-list-ordered-number-margin)}&.-delimiter-solid>li+li{border-top:var(--instui-component-list-item-delimiter-solid-border-width) var(--instui-component-list-item-delimiter-solid-border-style) var(--instui-component-list-item-delimiter-solid-border-color);padding-top:var(--instui-component-list-item-spacing-medium)}&.-delimiter-dashed>li+li{border-top:var(--instui-component-list-item-delimiter-dashed-border-width) var(--instui-component-list-item-delimiter-dashed-border-style) var(--instui-component-list-item-delimiter-dashed-border-color);padding-top:var(--instui-component-list-item-spacing-medium)}}}&.-size-small>li{font-size:var(--instui-component-list-item-font-size-small)}&.-size-medium>li{font-size:var(--instui-component-list-item-font-size-medium)}&.-size-large>li{font-size:var(--instui-component-list-item-font-size-large)}
|
package/dist/mask.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-mask{background:var(--instui-component-mask-background-color);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}
|
|
1
|
+
@scope(.instui-mask){&{background:var(--instui-component-mask-background-color);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}&.-fullscreen{z-index:999;position:fixed}&.-blur{backdrop-filter:blur(.5rem)}}
|
package/dist/menu.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-menu{min-width:var(--instui-component-menu-min-width);max-width:var(--instui-component-menu-max-width);background:var(--instui-component-menu-item-background);border:var(--instui-border-width-sm) solid var(--instui-color-stroke-base);border-radius:var(--instui-border-radius-md);padding:var(--instui-spacing-space-xs) 0}
|
|
1
|
+
@scope(.instui-menu){&{min-width:var(--instui-component-menu-min-width);max-width:var(--instui-component-menu-max-width);background:var(--instui-component-menu-item-background);border:var(--instui-border-width-sm) solid var(--instui-color-stroke-base);border-radius:var(--instui-border-radius-md);padding:var(--instui-spacing-space-xs) 0}}
|
package/dist/menu.group.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@scope(.instui-menu){:scope
|
|
1
|
+
@scope(.instui-menu){:scope{&>.group{padding:var(--instui-component-menu-group-padding-vertical) var(--instui-component-menu-group-padding-horizontal);background:var(--instui-component-menu-group-background);color:var(--instui-component-menu-group-color);font-family:var(--instui-component-menu-group-font-family);font-size:var(--instui-component-menu-group-font-size);font-weight:var(--instui-component-menu-group-font-weight)}}}
|
package/dist/menu.item.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@scope(.instui-menu){:scope
|
|
1
|
+
@scope(.instui-menu){:scope{&>.item{padding:var(--instui-component-menu-item-padding-vertical) var(--instui-component-menu-item-padding-horizontal);color:var(--instui-component-menu-item-label-color);font-family:var(--instui-component-menu-item-font-family);font-size:var(--instui-component-menu-item-font-size);font-weight:var(--instui-component-menu-item-font-weight);line-height:var(--instui-component-menu-item-line-height);cursor:pointer;display:block}&>.item.-disabled{opacity:var(--instui-opacity-disabled);pointer-events:none;cursor:not-allowed}&>.item:hover,&>.item.-highlighted{background:var(--instui-component-menu-item-highlighted-background);color:var(--instui-component-menu-item-highlighted-label-color)}&>.item.-active,&>.item[aria-checked=true]{background:var(--instui-component-menu-item-active-background);color:var(--instui-component-menu-item-active-label-color)}&>.item.-active:hover,&>.item[aria-checked=true]:hover{background:var(--instui-component-menu-item-selected-highlighted-background)}& .item-info{color:var(--instui-component-menu-item-label-info-color)}&>.item:hover .item-info,&>.item.-highlighted .item-info{color:var(--instui-component-menu-item-highlighted-label-info-color)}}}
|
package/dist/menu.separator.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@scope(.instui-menu){:scope
|
|
1
|
+
@scope(.instui-menu){:scope{&>.separator{height:var(--instui-component-menu-separator-height);background:var(--instui-component-menu-separator-background);margin:var(--instui-component-menu-separator-margin-vertical) var(--instui-component-menu-separator-margin-horizontal)}}}
|
package/dist/modal.body.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@scope(.instui-modal){:scope
|
|
1
|
+
@scope(.instui-modal){:scope{&.-overflow-fit>.body{overflow-y:auto}&>.body{padding:var(--instui-component-modal-body-padding)}&>.body:has(>img){padding:0}&>.body:has(>img) img{width:100%;display:block}&.-density-compact>.body{padding:var(--instui-component-modal-body-padding-compact)}&.-color-inverse>.body{background:var(--instui-component-modal-body-inverse-background-color)}}}
|
package/dist/modal.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-modal{max-width:var(--instui-component-modal-medium-max-width);background:var(--instui-component-modal-background-color);color:var(--instui-component-modal-text-color);border:var(--instui-component-modal-border-width) solid var(--instui-component-modal-border-color);border-radius:var(--instui-component-modal-border-radius);font-family:var(--instui-component-modal-font-family);box-shadow:var(--instui-elevation-topmost);overflow:hidden}dialog
|
|
1
|
+
@scope(.instui-modal){&{max-width:var(--instui-component-modal-medium-max-width);background:var(--instui-component-modal-background-color);color:var(--instui-component-modal-text-color);border:var(--instui-component-modal-border-width) solid var(--instui-component-modal-border-color);border-radius:var(--instui-component-modal-border-radius);font-family:var(--instui-component-modal-font-family);box-shadow:var(--instui-elevation-topmost);overflow:hidden}&[is=dialog],dialog&{margin:auto;padding:0}&[is=dialog]::backdrop,dialog&::backdrop{background:var(--instui-component-mask-background-color)}&[is=dialog].-blur::backdrop,dialog&.-blur::backdrop{backdrop-filter:blur(.5rem)}&.-size-sm{max-width:var(--instui-component-modal-small-max-width)}&.-size-lg{max-width:var(--instui-component-modal-large-max-width)}&.-size-auto{max-width:none;min-width:var(--instui-component-modal-auto-min-width)}&.-size-fullscreen{border-radius:0;width:auto;max-width:none;height:auto;max-height:none;margin:0;position:fixed;inset:0}&.-overflow-fit{max-block-size:calc(100dvh - var(--instui-spacing-space-xl) * 2);flex-direction:column;display:flex}&.-color-inverse{background:var(--instui-component-modal-inverse-background-color);color:var(--instui-component-modal-inverse-text-color);border-color:var(--instui-component-modal-inverse-border-color)}}&.-size-small{max-width:var(--instui-component-modal-small-max-width)}&.-size-large{max-width:var(--instui-component-modal-large-max-width)}
|
package/dist/modal.footer.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@scope(.instui-modal){:scope
|
|
1
|
+
@scope(.instui-modal){:scope{&>.footer{padding:var(--instui-component-modal-footer-padding);background:var(--instui-component-modal-footer-background-color);border-top:var(--instui-component-modal-footer-border-width) solid var(--instui-component-modal-footer-border-color);border-radius:0 0 var(--instui-component-modal-footer-border-radius) var(--instui-component-modal-footer-border-radius)}&.-density-compact>.footer{padding:var(--instui-component-modal-footer-padding-compact)}&.-color-inverse>.footer{background:var(--instui-component-modal-footer-inverse-background-color);border-top-color:var(--instui-component-modal-footer-inverse-border-color)}}}
|
package/dist/modal.header.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@scope(.instui-modal){:scope
|
|
1
|
+
@scope(.instui-modal){:scope{&>.header{padding:var(--instui-component-modal-header-padding);background:var(--instui-component-modal-header-background-color);border-bottom:var(--instui-component-modal-header-border-width) solid var(--instui-component-modal-header-border-color)}&.-density-compact>.header{padding:var(--instui-component-modal-header-padding-compact)}&.-color-inverse>.header{background:var(--instui-component-modal-header-inverse-background-color);border-bottom-color:var(--instui-component-modal-header-inverse-border-color)}}}
|
package/dist/pagination.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-pagination{align-items:center;gap:var(--instui-component-pagination-page-indicator-gap);font-family:var(--instui-font-family-base);flex-wrap:wrap;display:inline-flex}@scope(.instui-pagination){:scope
|
|
1
|
+
.instui-pagination{align-items:center;gap:var(--instui-component-pagination-page-indicator-gap);font-family:var(--instui-font-family-base);flex-wrap:wrap;display:inline-flex}@scope(.instui-pagination){:scope{&>.arrow{min-block-size:2rem;min-inline-size:2rem;padding:var(--instui-spacing-space2xs) var(--instui-spacing-space-xs);color:var(--instui-color-text-interactive-navigation-primary-base);border:var(--instui-border-width-md) solid transparent;border-radius:var(--instui-component-base-button-border-radius);font:inherit;font-weight:var(--instui-font-weight-interactive);cursor:pointer;background:0 0;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}&>.arrow [class*=-icon-]{line-height:1}&>.arrow:hover{background:var(--instui-color-background-muted);color:var(--instui-color-text-interactive-navigation-primary-hover)}&>.arrow:disabled,&>.arrow[aria-disabled=true]{color:var(--instui-color-text-muted);opacity:var(--instui-opacity-disabled);cursor:not-allowed;background:0 0}&>.ellipsis{min-inline-size:2rem;color:var(--instui-color-text-muted);justify-content:center;align-items:center;display:inline-flex}&>.page-input-label{color:var(--instui-component-pagination-page-input-label-color)}}}.instui-pagination.-variant-input{gap:var(--instui-component-pagination-page-input-input-spacing)}.instui-pagination.-variant-input .instui-text-input,.instui-pagination.-variant-input .instui-number-input{inline-size:var(--instui-component-pagination-page-input-input-width)}
|
package/dist/pagination.page.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@scope(.instui-pagination){:scope
|
|
1
|
+
@scope(.instui-pagination){:scope{&>.page{min-block-size:2rem;min-inline-size:2rem;padding:var(--instui-spacing-space2xs) var(--instui-spacing-space-xs);color:var(--instui-color-text-interactive-navigation-primary-base);border:var(--instui-border-width-md) solid transparent;border-radius:var(--instui-component-base-button-border-radius);font:inherit;font-weight:var(--instui-font-weight-interactive);cursor:pointer;background:0 0;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}&>.page:hover{background:var(--instui-color-background-muted);color:var(--instui-color-text-interactive-navigation-primary-hover)}&>.page[aria-current],&>.page.-current{background:var(--instui-color-background-interactive-action-primary-base);color:var(--instui-color-text-interactive-action-primary-base);border-color:var(--instui-color-background-interactive-action-primary-base)}&>.page[aria-current]:hover,&>.page.-current:hover{background:var(--instui-color-background-interactive-action-primary-hover);border-color:var(--instui-color-background-interactive-action-primary-hover);color:var(--instui-color-text-interactive-action-primary-base)}}}
|
package/dist/pill.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-pill{height:var(--instui-component-pill-height);max-width:var(--instui-component-pill-max-width);padding:0 var(--instui-component-pill-padding-horizontal);background:var(--instui-component-pill-background-color);color:var(--instui-component-pill-base-text-color);border:var(--instui-component-pill-border-width) var(--instui-component-pill-border-style) var(--instui-component-pill-base-border-color);border-radius:var(--instui-component-pill-border-radius);font-family:var(--instui-component-pill-font-family);font-size:var(--instui-component-pill-text-font-size);font-weight:var(--instui-component-pill-text-font-weight);line-height:var(--instui-component-pill-line-height);align-items:center;display:inline-flex}
|
|
1
|
+
@scope(.instui-pill){&{height:var(--instui-component-pill-height);max-width:var(--instui-component-pill-max-width);padding:0 var(--instui-component-pill-padding-horizontal);background:var(--instui-component-pill-background-color);color:var(--instui-component-pill-base-text-color);border:var(--instui-component-pill-border-width) var(--instui-component-pill-border-style) var(--instui-component-pill-base-border-color);border-radius:var(--instui-component-pill-border-radius);font-family:var(--instui-component-pill-font-family);font-size:var(--instui-component-pill-text-font-size);font-weight:var(--instui-component-pill-text-font-weight);line-height:var(--instui-component-pill-line-height);align-items:center;display:inline-flex}&[class*=-icon-]:before{inline-size:var(--instui-font-size-text-xs);block-size:var(--instui-font-size-text-xs);margin-inline-end:.375rem}&.-color-info{color:var(--instui-component-pill-info-text-color);border-color:var(--instui-component-pill-info-border-color)}&.-color-success{color:var(--instui-component-pill-success-text-color);border-color:var(--instui-component-pill-success-border-color)}&.-color-warning{color:var(--instui-component-pill-warning-text-color);border-color:var(--instui-component-pill-warning-border-color)}&.-color-danger{color:var(--instui-component-pill-error-text-color);border-color:var(--instui-component-pill-error-border-color)}&.-color-info,&.-color-success,&.-color-warning,&.-color-danger{font-weight:var(--instui-component-pill-status-label-font-weight)}}
|
package/dist/popover.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-popover{background:var(--instui-color-background-elevated-surface-base);color:var(--instui-color-text-base);border:var(--instui-border-width-sm) solid var(--instui-component-popover-border-color);border-radius:var(--instui-component-popover-border-radius);padding:var(--instui-spacing-space-sm);box-shadow:var(--instui-elevation-above)}[popover]
|
|
1
|
+
@scope(.instui-popover){&{background:var(--instui-color-background-elevated-surface-base);color:var(--instui-color-text-base);border:var(--instui-border-width-sm) solid var(--instui-component-popover-border-color);border-radius:var(--instui-component-popover-border-radius);padding:var(--instui-spacing-space-sm);box-shadow:var(--instui-elevation-above)}&[popover]{margin:0}@supports (position-area:block-end){&[popover]{position-anchor:--pantoken-anchor;position-try-fallbacks:flip-block, flip-inline}&[popover].-placement-top{position-area:block-start}&[popover].-placement-bottom{position-area:block-end}&[popover].-placement-start{position-area:inline-start center}&[popover].-placement-end{position-area:inline-end center}}@supports (transition-behavior:allow-discrete){&[popover]{transition:opacity .15s ease, transform .15s ease, overlay .15s allow-discrete, display .15s allow-discrete;opacity:1;transform:translateY(0)}&[popover]:not(:popover-open){opacity:0;transform:translateY(-.25rem)}@starting-style{&[popover]:popover-open{opacity:0;transform:translateY(-.25rem)}}}}
|
package/dist/progress-circle.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@property --value{syntax:"<number>";inherits:true;initial-value:0}@property --value-now{syntax:"<number>";inherits:true;initial-value:0}@property --min{syntax:"<number>";inherits:true;initial-value:0}@property --max{syntax:"<number>";inherits:true;initial-value:100}@property --value-max{syntax:"<number>";inherits:true;initial-value:100}@property --animation-delay{syntax:"<number>";inherits:true;initial-value:0}.instui-progress-circle{--value:var(--value-now);--min:0;--max:var(--value-max);--animation-delay:0;--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-brand);--pantoken-pc-track:var(--instui-component-progress-circle-track-color);--pantoken-pc-stroke:var(--instui-component-progress-circle-medium-stroke-width);width:var(--instui-component-progress-circle-medium-size);height:var(--instui-component-progress-circle-medium-size);color:var(--instui-component-progress-circle-color);font-family:var(--instui-component-progress-circle-font-family);font-weight:var(--instui-component-progress-circle-font-weight);line-height:var(--instui-component-progress-circle-line-height);justify-content:center;align-items:center;transition:--value 1s;display:inline-flex;position:relative}
|
|
1
|
+
@property --value{syntax:"<number>";inherits:true;initial-value:0}@property --value-now{syntax:"<number>";inherits:true;initial-value:0}@property --min{syntax:"<number>";inherits:true;initial-value:0}@property --max{syntax:"<number>";inherits:true;initial-value:100}@property --value-max{syntax:"<number>";inherits:true;initial-value:100}@property --animation-delay{syntax:"<number>";inherits:true;initial-value:0}@scope(.instui-progress-circle){&{--value:var(--value-now);--min:0;--max:var(--value-max);--animation-delay:0;--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-brand);--pantoken-pc-track:var(--instui-component-progress-circle-track-color);--pantoken-pc-stroke:var(--instui-component-progress-circle-medium-stroke-width);width:var(--instui-component-progress-circle-medium-size);height:var(--instui-component-progress-circle-medium-size);color:var(--instui-component-progress-circle-color);font-family:var(--instui-component-progress-circle-font-family);font-weight:var(--instui-component-progress-circle-font-weight);line-height:var(--instui-component-progress-circle-line-height);justify-content:center;align-items:center;transition:--value 1s;display:inline-flex;position:relative}&:before{content:"";background:conic-gradient(var(--pantoken-pc-fill) clamp(0%, calc((var(--value) - var(--min)) / (var(--max) - var(--min)) * 100%), 100%), var(--pantoken-pc-track) 0);-webkit-mask:radial-gradient(farthest-side, #0000 calc(100% - var(--pantoken-pc-stroke)), #000 0);mask:radial-gradient(farthest-side, #0000 calc(100% - var(--pantoken-pc-stroke)), #000 0);border-radius:50%;transition:opacity .5s .2s,transform .5s;position:absolute;inset:0;transform:translate(0)scale(1)}& .value{z-index:1;justify-content:center;align-items:center;display:flex;position:relative}&.-size-xs{width:var(--instui-component-progress-circle-x-small-size);height:var(--instui-component-progress-circle-x-small-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-x-small-stroke-width)}&.-size-sm{width:var(--instui-component-progress-circle-small-size);height:var(--instui-component-progress-circle-small-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-small-stroke-width)}&.-size-md{width:var(--instui-component-progress-circle-medium-size);height:var(--instui-component-progress-circle-medium-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-medium-stroke-width)}&.-size-lg{width:var(--instui-component-progress-circle-large-size);height:var(--instui-component-progress-circle-large-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-large-stroke-width)}&:is(.-color-brand,.-meter-color-brand){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-brand)}&.-color-primary-inverse:is(.-color-brand,.-meter-color-brand){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-brand-inverse)}&:is(.-color-info,.-meter-color-info){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-info)}&.-color-primary-inverse:is(.-color-info,.-meter-color-info){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-info-inverse)}&:is(.-color-success,.-meter-color-success){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-success)}&.-color-primary-inverse:is(.-color-success,.-meter-color-success){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-success-inverse)}&:is(.-color-warning,.-meter-color-warning,.-meter-color-alert){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-warning)}&.-color-primary-inverse:is(.-color-warning,.-meter-color-warning,.-meter-color-alert){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-warning-inverse)}&:is(.-color-danger,.-meter-color-danger){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-danger)}&.-color-primary-inverse:is(.-color-danger,.-meter-color-danger){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-danger-inverse)}&.-color-primary-inverse{--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-brand-inverse);--pantoken-pc-track:var(--instui-component-progress-circle-track-color-inverse);color:var(--instui-component-progress-circle-color-inverse)}@keyframes pantoken-progress-circle-indeterminate{to{transform:rotate(1turn)}}&:indeterminate{--value:25;--min:0;--max:100}&:indeterminate:before{animation:1s linear infinite pantoken-progress-circle-indeterminate}&:indeterminate .value{visibility:hidden}&>.value{transition:opacity .5s 1s,transform .5s 1s;transform:translate(0)}&:is(.-should-animate,.-should-animate-on-mount,.-shold-animate-on-mount){--value:0!important}&:is(.-should-animate,.-should-animate-on-mount,.-shold-animate-on-mount):before{opacity:0;transform:translate(0)scale(.75)}&:is(.-should-animate,.-should-animate-on-mount,.-shold-animate-on-mount)>.value{opacity:0;transform:translateY(10%)}}&.-size-x-small{width:var(--instui-component-progress-circle-x-small-size);height:var(--instui-component-progress-circle-x-small-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-x-small-stroke-width)}&.-size-small{width:var(--instui-component-progress-circle-small-size);height:var(--instui-component-progress-circle-small-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-small-stroke-width)}&.-size-medium{width:var(--instui-component-progress-circle-medium-size);height:var(--instui-component-progress-circle-medium-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-medium-stroke-width)}&.-size-large{width:var(--instui-component-progress-circle-large-size);height:var(--instui-component-progress-circle-large-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-large-stroke-width)}
|
package/dist/progress.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@property --value{syntax:"<number>";inherits:true;initial-value:0}@property --value-now{syntax:"<number>";inherits:true;initial-value:0}@property --min{syntax:"<number>";inherits:true;initial-value:0}@property --max{syntax:"<number>";inherits:true;initial-value:100}@property --value-max{syntax:"<number>";inherits:true;initial-value:100}@keyframes pantoken-progress-indeterminate{0%{left:-40%}to{left:100%}}.instui-progress{--value:var(--value-now);--min:0;--max:var(--value-max);width:100%;height:var(--instui-component-progress-bar-medium-height);background:var(--instui-component-progress-bar-track-color);border:var(--instui-component-progress-bar-track-bottom-border-width) solid var(--instui-component-progress-bar-border-color);border-radius:var(--instui-component-progress-bar-border-radius);display:block;position:relative;overflow:hidden}
|
|
1
|
+
@property --value{syntax:"<number>";inherits:true;initial-value:0}@property --value-now{syntax:"<number>";inherits:true;initial-value:0}@property --min{syntax:"<number>";inherits:true;initial-value:0}@property --max{syntax:"<number>";inherits:true;initial-value:100}@property --value-max{syntax:"<number>";inherits:true;initial-value:100}@keyframes pantoken-progress-indeterminate{0%{left:-40%}to{left:100%}}@scope(.instui-progress){&{--value:var(--value-now);--min:0;--max:var(--value-max);width:100%;height:var(--instui-component-progress-bar-medium-height);background:var(--instui-component-progress-bar-track-color);border:var(--instui-component-progress-bar-track-bottom-border-width) solid var(--instui-component-progress-bar-border-color);border-radius:var(--instui-component-progress-bar-border-radius);display:block;position:relative;overflow:hidden}&:after{content:"";height:var(--instui-component-progress-bar-track-bottom-border-width);background:var(--instui-component-progress-bar-track-bottom-border-color);pointer-events:none;inset-inline:0;position:absolute;bottom:0}&.-size-xs{height:var(--instui-component-progress-bar-x-small-height)}&.-size-sm{height:var(--instui-component-progress-bar-small-height)}&.-size-md{height:var(--instui-component-progress-bar-medium-height)}&.-size-lg{height:var(--instui-component-progress-bar-large-height)}&>.bar{height:100%;width:clamp(0%, calc((var(--value) - var(--min)) / (var(--max) - var(--min)) * 100%), 100%);background:var(--instui-color-background-brand);border-radius:var(--instui-component-progress-bar-border-radius)}&>.value{padding:0 var(--instui-component-progress-bar-value-padding);color:var(--instui-component-progress-bar-text-color);font-family:var(--instui-component-progress-bar-font-family);font-size:var(--instui-component-progress-bar-medium-value-font-size);font-weight:var(--instui-component-progress-bar-font-weight);line-height:var(--instui-component-progress-bar-line-height)}&.-color-inverse>.value,&>.value.-color-inverse{color:var(--instui-component-progress-bar-text-color-inverse)}&:indeterminate>.bar{width:40%;animation:1.4s ease-in-out infinite pantoken-progress-indeterminate;position:absolute}&:indeterminate>.value{visibility:hidden}&:is(.-color-brand,.-meter-color-brand)>.bar{background:var(--instui-color-background-brand)}&:is(.-color-info,.-meter-color-info)>.bar{background:var(--instui-color-background-info)}&:is(.-color-success,.-meter-color-success)>.bar{background:var(--instui-color-background-success)}&:is(.-color-warning,.-meter-color-warning,.-meter-color-alert)>.bar{background:var(--instui-color-background-warning)}&:is(.-color-danger,.-meter-color-danger)>.bar{background:var(--instui-color-background-error)}&.-color-primary-inverse{background:var(--instui-component-progress-bar-track-color-inverse);border-color:var(--instui-component-progress-bar-border-color-inverse);color:var(--instui-component-progress-bar-text-color-inverse)}&.-color-primary-inverse:after{background:var(--instui-component-progress-bar-track-bottom-border-color-inverse)}&.-color-primary-inverse>.bar{background:var(--instui-component-progress-bar-meter-color-brand-inverse)}&.-render-value-inside>.value{justify-content:flex-start;align-items:center;display:flex;position:absolute;inset:0}&.-should-animate>.bar{transition:all .5s}}&.-size-x-small{height:var(--instui-component-progress-bar-x-small-height)}&.-size-small{height:var(--instui-component-progress-bar-small-height)}&.-size-medium{height:var(--instui-component-progress-bar-medium-height)}&.-size-large{height:var(--instui-component-progress-bar-large-height)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-radio-input-group{gap:var(--instui-component-form-field-layout-gap-inputs);border:0;flex-direction:column;min-inline-size:0;margin:0;padding:0;display:flex}
|
|
1
|
+
@scope(.instui-radio-input-group){&{gap:var(--instui-component-form-field-layout-gap-inputs);border:0;flex-direction:column;min-inline-size:0;margin:0;padding:0;display:flex}&>legend{color:var(--instui-component-form-field-layout-text-color);font-family:var(--instui-component-form-field-layout-font-family);font-weight:var(--instui-component-form-field-layout-font-weight);font-size:var(--instui-component-form-field-layout-font-size);line-height:var(--instui-component-form-field-layout-line-height);margin-block-end:var(--instui-component-form-field-layout-gap-primitives);padding:0}&.-required>legend:after{content:"*";color:var(--instui-component-form-field-layout-asterisk-color);margin-inline-start:.25rem}&.-layout-columns,&.-layout-inline{align-items:center;column-gap:var(--instui-spacing-space-md);flex-flow:wrap}&.-layout-columns>legend,&.-layout-inline>legend{flex-basis:100%}&.-variant-toggle{flex-flow:wrap;align-items:center;gap:0}&.-variant-toggle>legend{flex-basis:100%}&.-variant-toggle>.instui-radio:has(input:focus-visible){z-index:1}}
|
package/dist/radio.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-radio{align-items:center;gap:var(--instui-component-radio-input-gap);color:var(--instui-component-radio-input-label-base-color);font-family:var(--instui-component-radio-input-font-family);font-size:var(--instui-component-radio-input-font-size-md);font-weight:var(--instui-component-radio-input-font-weight);line-height:var(--instui-component-radio-input-line-height-md);display:inline-flex}.instui-radio:not(.-variant-toggle):not(.-toggle) input[type=radio]{-webkit-appearance:none;appearance:none;width:var(--instui-component-radio-input-control-size-md);height:var(--instui-component-radio-input-control-size-md);margin-block:var(--instui-component-radio-input-control-vertical-margin);border:var(--instui-component-radio-input-border-width) solid var(--instui-component-radio-input-border-color);background:var(--instui-component-radio-input-background-color);cursor:pointer;border-radius:50%;flex:none;place-content:center;transition:border-color .15s,background-color .15s;display:inline-grid}.instui-radio:not(.-variant-toggle):not(.-toggle) input[type=radio]:before{content:"";width:calc(var(--instui-component-radio-input-control-size-md) - 2 * var(--instui-component-radio-input-checked-inset-md));height:calc(var(--instui-component-radio-input-control-size-md) - 2 * var(--instui-component-radio-input-checked-inset-md));background:var(--instui-component-radio-input-border-selected-color);border-radius:50%;transition:transform .1s;transform:scale(0)}.instui-radio:not(.-variant-toggle):not(.-toggle) input[type=radio]:hover{border-color:var(--instui-component-radio-input-border-hover-color);background:var(--instui-component-radio-input-background-hover-color)}.instui-radio:not(.-variant-toggle):not(.-toggle) input[type=radio]:checked{border-color:var(--instui-component-radio-input-border-selected-color)}.instui-radio:not(.-variant-toggle):not(.-toggle) input[type=radio]:checked:before{transform:scale(1)}.instui-radio:not(.-variant-toggle):not(.-toggle) input[type=radio]:disabled{border-color:var(--instui-component-radio-input-border-disabled-color);background:var(--instui-component-radio-input-background-disabled-color);cursor:not-allowed}.instui-radio:not(.-variant-toggle):not(.-toggle):has(input:disabled){color:var(--instui-component-radio-input-label-disabled-color)}.instui-radio:not(.-variant-toggle):not(.-toggle):hover{color:var(--instui-component-radio-input-label-hover-color)}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-sm{font-size:var(--instui-component-radio-input-font-size-sm);line-height:var(--instui-component-radio-input-line-height-sm)}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-sm input[type=radio]{width:var(--instui-component-radio-input-control-size-sm);height:var(--instui-component-radio-input-control-size-sm)}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-sm input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm));height:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm))}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-lg{font-size:var(--instui-component-radio-input-font-size-lg);line-height:var(--instui-component-radio-input-line-height-lg)}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-lg input[type=radio]{width:var(--instui-component-radio-input-control-size-lg);height:var(--instui-component-radio-input-control-size-lg)}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-lg input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg));height:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg))}.instui-radio:not(.-variant-toggle):not(.-toggle).-readonly{color:var(--instui-component-radio-input-label-readonly-color)}.instui-radio:not(.-variant-toggle):not(.-toggle).-readonly input[type=radio]{border-color:var(--instui-component-radio-input-border-readonly-color);background:var(--instui-component-radio-input-background-readonly-color)}.instui-radio.-variant-toggle{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-success);height:var(--instui-component-radio-input-toggle-medium-height);border-radius:var(--instui-component-radio-input-toggle-border-radius);color:var(--instui-component-radio-input-label-base-color);font-size:var(--instui-component-radio-input-toggle-medium-font-size);text-transform:uppercase;white-space:nowrap;cursor:pointer;background:0 0;justify-content:center;gap:0;padding-inline:.875rem;line-height:1;transition:background-color .15s,color .15s;position:relative}.instui-radio.-variant-toggle input[type=radio]{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.instui-radio.-variant-toggle.-context-off{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-off)}.instui-radio.-variant-toggle.-context-success{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-success)}.instui-radio.-variant-toggle.-context-danger{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-danger)}.instui-radio.-variant-toggle.-context-warning{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-warning)}.instui-radio.-variant-toggle:has(input:checked){background:var(--pantoken-rt-fill);color:var(--instui-component-radio-input-toggle-handle-text);box-shadow:var(--instui-elevation-depth1)}.instui-radio.-variant-toggle:has(input:focus-visible){text-decoration:underline}.instui-radio.-variant-toggle:has(input:focus-visible):before{content:"";border:var(--instui-focus-outline-width) var(--instui-focus-outline-style) var(--instui-focus-outline-color);border-radius:calc(var(--instui-component-radio-input-toggle-border-radius) + .0625rem);pointer-events:none;position:absolute;inset:-.25rem}.instui-radio.-variant-toggle:has(input:disabled){opacity:.5;cursor:not-allowed}.instui-radio.-variant-toggle.-size-sm{height:var(--instui-component-radio-input-toggle-small-height);font-size:var(--instui-component-radio-input-toggle-small-font-size);padding-inline:.5rem}.instui-radio.-variant-toggle.-size-lg{height:var(--instui-component-radio-input-toggle-large-height);font-size:var(--instui-component-radio-input-toggle-large-font-size);padding-inline:1rem}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-small{font-size:var(--instui-component-radio-input-font-size-sm);line-height:var(--instui-component-radio-input-line-height-sm)}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-small input[type=radio]{width:var(--instui-component-radio-input-control-size-sm);height:var(--instui-component-radio-input-control-size-sm)}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-small input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm));height:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm))}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-large{font-size:var(--instui-component-radio-input-font-size-lg);line-height:var(--instui-component-radio-input-line-height-lg)}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-large input[type=radio]{width:var(--instui-component-radio-input-control-size-lg);height:var(--instui-component-radio-input-control-size-lg)}.instui-radio:not(.-variant-toggle):not(.-toggle).-size-large input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg));height:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg))}.instui-radio.-variant-toggle.-size-small{height:var(--instui-component-radio-input-toggle-small-height);font-size:var(--instui-component-radio-input-toggle-small-font-size);padding-inline:.5rem}.instui-radio.-variant-toggle.-size-large{height:var(--instui-component-radio-input-toggle-large-height);font-size:var(--instui-component-radio-input-toggle-large-font-size);padding-inline:1rem}.instui-radio.-toggle{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-success);height:var(--instui-component-radio-input-toggle-medium-height);border-radius:var(--instui-component-radio-input-toggle-border-radius);color:var(--instui-component-radio-input-label-base-color);font-size:var(--instui-component-radio-input-toggle-medium-font-size);text-transform:uppercase;white-space:nowrap;cursor:pointer;background:0 0;justify-content:center;gap:0;padding-inline:.875rem;line-height:1;transition:background-color .15s,color .15s;position:relative}.instui-radio.-toggle input[type=radio]{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.instui-radio.-toggle.-context-off{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-off)}.instui-radio.-toggle.-context-success{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-success)}.instui-radio.-toggle.-context-danger{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-danger)}.instui-radio.-toggle.-context-warning{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-warning)}.instui-radio.-toggle:has(input:checked){background:var(--pantoken-rt-fill);color:var(--instui-component-radio-input-toggle-handle-text);box-shadow:var(--instui-elevation-depth1)}.instui-radio.-toggle:has(input:focus-visible){text-decoration:underline}.instui-radio.-toggle:has(input:focus-visible):before{content:"";border:var(--instui-focus-outline-width) var(--instui-focus-outline-style) var(--instui-focus-outline-color);border-radius:calc(var(--instui-component-radio-input-toggle-border-radius) + .0625rem);pointer-events:none;position:absolute;inset:-.25rem}.instui-radio.-toggle:has(input:disabled){opacity:.5;cursor:not-allowed}.instui-radio.-toggle.-size-sm{height:var(--instui-component-radio-input-toggle-small-height);font-size:var(--instui-component-radio-input-toggle-small-font-size);padding-inline:.5rem}.instui-radio.-toggle.-size-lg{height:var(--instui-component-radio-input-toggle-large-height);font-size:var(--instui-component-radio-input-toggle-large-font-size);padding-inline:1rem}.instui-radio.-toggle.-size-small{height:var(--instui-component-radio-input-toggle-small-height);font-size:var(--instui-component-radio-input-toggle-small-font-size);padding-inline:.5rem}.instui-radio.-toggle.-size-large{height:var(--instui-component-radio-input-toggle-large-height);font-size:var(--instui-component-radio-input-toggle-large-font-size);padding-inline:1rem}
|
|
1
|
+
@scope(.instui-radio){&{align-items:center;gap:var(--instui-component-radio-input-gap);color:var(--instui-component-radio-input-label-base-color);font-family:var(--instui-component-radio-input-font-family);font-size:var(--instui-component-radio-input-font-size-md);font-weight:var(--instui-component-radio-input-font-weight);line-height:var(--instui-component-radio-input-line-height-md);display:inline-flex}&:not(.-variant-toggle):not(.-toggle) input[type=radio]{-webkit-appearance:none;appearance:none;width:var(--instui-component-radio-input-control-size-md);height:var(--instui-component-radio-input-control-size-md);margin-block:var(--instui-component-radio-input-control-vertical-margin);border:var(--instui-component-radio-input-border-width) solid var(--instui-component-radio-input-border-color);background:var(--instui-component-radio-input-background-color);cursor:pointer;border-radius:50%;flex:none;place-content:center;transition:border-color .15s,background-color .15s;display:inline-grid}&:not(.-variant-toggle):not(.-toggle) input[type=radio]:before{content:"";width:calc(var(--instui-component-radio-input-control-size-md) - 2 * var(--instui-component-radio-input-checked-inset-md));height:calc(var(--instui-component-radio-input-control-size-md) - 2 * var(--instui-component-radio-input-checked-inset-md));background:var(--instui-component-radio-input-border-selected-color);border-radius:50%;transition:transform .1s;transform:scale(0)}&:not(.-variant-toggle):not(.-toggle) input[type=radio]:hover{border-color:var(--instui-component-radio-input-border-hover-color);background:var(--instui-component-radio-input-background-hover-color)}&:not(.-variant-toggle):not(.-toggle) input[type=radio]:checked{border-color:var(--instui-component-radio-input-border-selected-color)}&:not(.-variant-toggle):not(.-toggle) input[type=radio]:checked:before{transform:scale(1)}&:not(.-variant-toggle):not(.-toggle) input[type=radio]:disabled{border-color:var(--instui-component-radio-input-border-disabled-color);background:var(--instui-component-radio-input-background-disabled-color);cursor:not-allowed}&:not(.-variant-toggle):not(.-toggle):has(input:disabled){color:var(--instui-component-radio-input-label-disabled-color)}&:not(.-variant-toggle):not(.-toggle):hover{color:var(--instui-component-radio-input-label-hover-color)}&:not(.-variant-toggle):not(.-toggle).-size-sm{font-size:var(--instui-component-radio-input-font-size-sm);line-height:var(--instui-component-radio-input-line-height-sm)}&:not(.-variant-toggle):not(.-toggle).-size-sm input[type=radio]{width:var(--instui-component-radio-input-control-size-sm);height:var(--instui-component-radio-input-control-size-sm)}&:not(.-variant-toggle):not(.-toggle).-size-sm input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm));height:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm))}&:not(.-variant-toggle):not(.-toggle).-size-lg{font-size:var(--instui-component-radio-input-font-size-lg);line-height:var(--instui-component-radio-input-line-height-lg)}&:not(.-variant-toggle):not(.-toggle).-size-lg input[type=radio]{width:var(--instui-component-radio-input-control-size-lg);height:var(--instui-component-radio-input-control-size-lg)}&:not(.-variant-toggle):not(.-toggle).-size-lg input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg));height:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg))}&:not(.-variant-toggle):not(.-toggle).-readonly{color:var(--instui-component-radio-input-label-readonly-color)}&:not(.-variant-toggle):not(.-toggle).-readonly input[type=radio]{border-color:var(--instui-component-radio-input-border-readonly-color);background:var(--instui-component-radio-input-background-readonly-color)}&.-variant-toggle{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-success);height:var(--instui-component-radio-input-toggle-medium-height);border-radius:var(--instui-component-radio-input-toggle-border-radius);color:var(--instui-component-radio-input-label-base-color);font-size:var(--instui-component-radio-input-toggle-medium-font-size);text-transform:uppercase;white-space:nowrap;cursor:pointer;background:0 0;justify-content:center;gap:0;padding-inline:.875rem;line-height:1;transition:background-color .15s,color .15s;position:relative}&.-variant-toggle input[type=radio]{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}&.-variant-toggle.-context-off{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-off)}&.-variant-toggle.-context-success{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-success)}&.-variant-toggle.-context-danger{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-danger)}&.-variant-toggle.-context-warning{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-warning)}&.-variant-toggle:has(input:checked){background:var(--pantoken-rt-fill);color:var(--instui-component-radio-input-toggle-handle-text);box-shadow:var(--instui-elevation-depth1)}&.-variant-toggle:has(input:focus-visible){text-decoration:underline}&.-variant-toggle:has(input:focus-visible):before{content:"";border:var(--instui-focus-outline-width) var(--instui-focus-outline-style) var(--instui-focus-outline-color);border-radius:calc(var(--instui-component-radio-input-toggle-border-radius) + .0625rem);pointer-events:none;position:absolute;inset:-.25rem}&.-variant-toggle:has(input:disabled){opacity:.5;cursor:not-allowed}&.-variant-toggle.-size-sm{height:var(--instui-component-radio-input-toggle-small-height);font-size:var(--instui-component-radio-input-toggle-small-font-size);padding-inline:.5rem}&.-variant-toggle.-size-lg{height:var(--instui-component-radio-input-toggle-large-height);font-size:var(--instui-component-radio-input-toggle-large-font-size);padding-inline:1rem}}&:not(.-variant-toggle):not(.-toggle).-size-small{font-size:var(--instui-component-radio-input-font-size-sm);line-height:var(--instui-component-radio-input-line-height-sm)}&:not(.-variant-toggle):not(.-toggle).-size-small input[type=radio]{width:var(--instui-component-radio-input-control-size-sm);height:var(--instui-component-radio-input-control-size-sm)}&:not(.-variant-toggle):not(.-toggle).-size-small input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm));height:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm))}&:not(.-variant-toggle):not(.-toggle).-size-large{font-size:var(--instui-component-radio-input-font-size-lg);line-height:var(--instui-component-radio-input-line-height-lg)}&:not(.-variant-toggle):not(.-toggle).-size-large input[type=radio]{width:var(--instui-component-radio-input-control-size-lg);height:var(--instui-component-radio-input-control-size-lg)}&:not(.-variant-toggle):not(.-toggle).-size-large input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg));height:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg))}&.-variant-toggle.-size-small{height:var(--instui-component-radio-input-toggle-small-height);font-size:var(--instui-component-radio-input-toggle-small-font-size);padding-inline:.5rem}&.-variant-toggle.-size-large{height:var(--instui-component-radio-input-toggle-large-height);font-size:var(--instui-component-radio-input-toggle-large-font-size);padding-inline:1rem}
|
package/dist/range-input.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-range-input{-webkit-appearance:none;appearance:none;inline-size:100%;min-inline-size:var(--instui-component-range-input-min-width);block-size:var(--instui-component-range-input-handle-size);background:0 0}
|
|
1
|
+
@scope(.instui-range-input){&{-webkit-appearance:none;appearance:none;inline-size:100%;min-inline-size:var(--instui-component-range-input-min-width);block-size:var(--instui-component-range-input-handle-size);background:0 0}&::-webkit-slider-runnable-track{background:var(--instui-component-range-input-track-background);border:var(--instui-border-width-sm) solid var(--instui-component-range-input-track-border-color);border-radius:999px;block-size:.25rem}&::-moz-range-track{background:var(--instui-component-range-input-track-background);border:var(--instui-border-width-sm) solid var(--instui-component-range-input-track-border-color);border-radius:999px;block-size:.25rem}&::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;inline-size:var(--instui-component-range-input-handle-size);block-size:var(--instui-component-range-input-handle-size);background:var(--instui-component-range-input-handle-background);border:var(--instui-component-range-input-handle-border-size) solid var(--instui-component-range-input-handle-border-color);box-shadow:0 0 0 0 var(--instui-component-range-input-handle-shadow-color);cursor:pointer;border-radius:50%;margin-block-start:calc((.25rem - var(--instui-component-range-input-handle-size)) / 2)}&::-moz-range-thumb{inline-size:var(--instui-component-range-input-handle-size);block-size:var(--instui-component-range-input-handle-size);background:var(--instui-component-range-input-handle-background);border:var(--instui-component-range-input-handle-border-size) solid var(--instui-component-range-input-handle-border-color);box-shadow:0 0 0 0 var(--instui-component-range-input-handle-shadow-color);cursor:pointer;border-radius:50%}&:hover::-webkit-slider-thumb{background:var(--instui-component-range-input-handle-hover-background)}&:hover::-moz-range-thumb{background:var(--instui-component-range-input-handle-hover-background)}&:focus-visible{outline:none}&:focus-visible::-webkit-slider-thumb{background:var(--instui-component-range-input-handle-focus-background);box-shadow:0 0 0 var(--instui-component-range-input-handle-focus-outline-width) var(--instui-component-range-input-handle-focus-outline-color)}&:focus-visible::-moz-range-thumb{background:var(--instui-component-range-input-handle-focus-background);box-shadow:0 0 0 var(--instui-component-range-input-handle-focus-outline-width) var(--instui-component-range-input-handle-focus-outline-color)}}@scope(.instui-range-input-value){&{background:var(--instui-color-background-inverse);color:var(--instui-color-text-inverse);border-radius:var(--instui-border-radius-md);padding:var(--instui-component-range-input-value-medium-padding);font-family:var(--instui-component-range-input-value-font-family);font-size:var(--instui-component-range-input-value-medium-font-size);font-weight:var(--instui-component-range-input-value-font-weight);align-self:center;align-items:center;margin-inline-start:.5rem;line-height:1;display:inline-flex;position:relative}&:before{content:"";border-block:.375rem solid #0000;border-inline-end:.375rem solid var(--instui-color-background-inverse);border-inline-start:0;position:absolute;inset-block-start:50%;inset-inline-start:-.375rem;transform:translateY(-50%)}&.-size-sm{padding:var(--instui-component-range-input-value-small-padding);font-size:var(--instui-component-range-input-value-small-font-size);line-height:var(--instui-component-range-input-value-small-line-height)}&.-size-lg{padding:var(--instui-component-range-input-value-large-padding);font-size:var(--instui-component-range-input-value-large-font-size);line-height:var(--instui-component-range-input-value-large-line-height)}}&.-size-small{padding:var(--instui-component-range-input-value-small-padding);font-size:var(--instui-component-range-input-value-small-font-size);line-height:var(--instui-component-range-input-value-small-line-height)}&.-size-large{padding:var(--instui-component-range-input-value-large-padding);font-size:var(--instui-component-range-input-value-large-font-size);line-height:var(--instui-component-range-input-value-large-line-height)}
|
package/dist/rating.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-rating{align-items:center;gap:var(--instui-component-rating-icon-icon-margin);font-size:var(--instui-component-rating-icon-medium-icon-font-size);color:var(--instui-component-rating-icon-icon-empty-color);display:inline-flex}.instui-rating.-size-sm{font-size:var(--instui-component-rating-icon-small-icon-font-size)}.instui-rating.-size-lg{font-size:var(--instui-component-rating-icon-large-icon-font-size)}@scope(.instui-rating){.-icon-star-solid{color:var(--instui-component-rating-icon-icon-filled-color)}
|
|
1
|
+
.instui-rating{align-items:center;gap:var(--instui-component-rating-icon-icon-margin);font-size:var(--instui-component-rating-icon-medium-icon-font-size);color:var(--instui-component-rating-icon-icon-empty-color);display:inline-flex}.instui-rating.-size-sm{font-size:var(--instui-component-rating-icon-small-icon-font-size)}.instui-rating.-size-lg{font-size:var(--instui-component-rating-icon-large-icon-font-size)}@scope(.instui-rating){:scope{& .-icon-star-solid{color:var(--instui-component-rating-icon-icon-filled-color)}&>.label{color:var(--instui-color-text-base);font-family:var(--instui-font-family-base);font-size:var(--instui-font-size-text-base);margin-inline-start:var(--instui-component-rating-icon-icon-margin)}}}.instui-rating.-size-small{font-size:var(--instui-component-rating-icon-small-icon-font-size)}.instui-rating.-size-large{font-size:var(--instui-component-rating-icon-large-icon-font-size)}
|
package/dist/select.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@
|
|
1
|
+
@scope(.instui-simple-select){@supports (appearance:base-select){&{appearance:base-select}&::picker-icon{display:none}&::picker(select){border:var(--instui-component-select-popover-border-width) solid var(--instui-component-text-input-border-color);border-radius:var(--instui-border-radius-lg);box-shadow:var(--instui-elevation-topmost);background-color:var(--instui-component-options-item-background);appearance:base-select;margin:0;padding:0;overflow:hidden}& option{padding:var(--instui-component-options-item-padding-vertical) var(--instui-component-options-item-padding-horizontal);background-color:var(--instui-component-options-item-background);color:var(--instui-component-options-item-color);font-family:var(--instui-component-options-item-font-family);font-weight:var(--instui-component-options-item-font-weight);font-size:var(--instui-component-options-item-font-size);line-height:var(--instui-component-options-item-line-height);cursor:pointer}& option::checkmark{display:none}& option:hover,& option:focus{background-color:var(--instui-component-options-item-highlighted-background);color:var(--instui-component-options-item-highlighted-label-color);outline:none}& option:checked{background-color:var(--instui-component-options-item-selected-background);color:var(--instui-component-options-item-selected-label-color);font-weight:var(--instui-component-options-item-font-weight-selected);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--instui-component-options-item-padding-horizontal) center;background-size:1rem 1rem;padding-inline-end:calc(var(--instui-component-options-item-padding-horizontal) + 1.5rem)}}}
|
package/dist/side-nav-bar.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-side-nav-bar{gap:var(--instui-component-side-nav-bar-content-gap);padding:var(--instui-component-side-nav-bar-content-margin);box-sizing:border-box;background:var(--instui-component-side-nav-bar-background-color);block-size:100%;min-block-size:100%;inline-size:fit-content;color:var(--instui-component-side-nav-bar-font-color);font-family:var(--instui-component-side-nav-bar-item-font-family);flex-direction:column;display:flex}
|
|
1
|
+
@scope(.instui-side-nav-bar){&{gap:var(--instui-component-side-nav-bar-content-gap);padding:var(--instui-component-side-nav-bar-content-margin);box-sizing:border-box;background:var(--instui-component-side-nav-bar-background-color);block-size:100%;min-block-size:100%;inline-size:fit-content;color:var(--instui-component-side-nav-bar-font-color);font-family:var(--instui-component-side-nav-bar-item-font-family);flex-direction:column;display:flex}&.-minimized{inline-size:var(--instui-component-side-nav-bar-minimized-width)}&.-minimized .item .label{display:none}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@scope(.instui-side-nav-bar){:scope
|
|
1
|
+
@scope(.instui-side-nav-bar){:scope{&>.item{align-items:center;gap:var(--instui-spacing-space2xs);padding:var(--instui-component-side-nav-bar-item-content-padding);min-inline-size:var(--instui-component-side-nav-bar-minimized-width);color:var(--instui-component-side-nav-bar-item-font-color);background:var(--instui-component-side-nav-bar-item-background-color);border-radius:var(--instui-component-side-nav-bar-item-border-radius);font-size:var(--instui-component-side-nav-bar-item-font-size);font-weight:var(--instui-component-side-nav-bar-item-font-weight);line-height:var(--instui-component-side-nav-bar-item-line-height);text-align:center;text-decoration:var(--instui-component-side-nav-bar-item-link-text-decoration);cursor:pointer;flex-direction:column;display:flex}&>.item [class*=-icon-]{line-height:1}&>.item:hover{background:var(--instui-component-side-nav-bar-item-hover-background-color)}&>.item.-selected{background:var(--instui-component-side-nav-bar-item-selected-background-color);color:var(--instui-component-side-nav-bar-item-selected-font-color)}}}
|
package/dist/table.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-table{border-collapse:collapse;background:var(--instui-component-table-background);width:100%;color:var(--instui-component-table-color);font-family:var(--instui-component-table-font-family);font-size:var(--instui-component-table-font-size)}
|
|
1
|
+
@scope(.instui-table){&{border-collapse:collapse;background:var(--instui-component-table-background);width:100%;color:var(--instui-component-table-color);font-family:var(--instui-component-table-font-family);font-size:var(--instui-component-table-font-size)}& caption{text-align:start;padding:var(--instui-component-table-cell-padding-vertical) var(--instui-component-table-cell-padding-horizontal);color:var(--instui-component-table-col-header-color);font-weight:var(--instui-component-table-head-font-weight)}&.-layout-fixed{table-layout:fixed}&.-layout-stacked{width:auto;display:block}}
|
package/dist/tabs.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-tabs{background:var(--instui-component-tabs-default-background);flex-direction:column;display:flex}@scope(.instui-tabs){:scope
|
|
1
|
+
.instui-tabs{background:var(--instui-component-tabs-default-background);flex-direction:column;display:flex}@scope(.instui-tabs){:scope{&>.list{flex-flow:wrap;width:100%;display:flex}&.-overflow-scroll>.list{scrollbar-width:none;flex-wrap:nowrap;overflow-x:auto}&.-overflow-scroll>.list::-webkit-scrollbar{display:none}}}
|
package/dist/tabs.panel.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@scope(.instui-tabs){:scope
|
|
1
|
+
@scope(.instui-tabs){:scope{&>.panel{box-sizing:border-box;border-top:var(--instui-component-tabs-panel-border-width) solid var(--instui-component-tabs-panel-border-color);background:var(--instui-component-tabs-panel-background);color:var(--instui-component-tabs-panel-text-color);font-family:var(--instui-component-tabs-panel-font-family);font-size:var(--instui-component-tabs-panel-font-size);font-weight:var(--instui-component-tabs-panel-font-weight);line-height:var(--instui-component-tabs-panel-line-height);padding:var(--instui-spacing-space-sm) var(--instui-spacing-space-md) var(--instui-spacing-space-md)}&>.panel[hidden]{display:none}}}
|
package/dist/tabs.tab.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@scope(.instui-tabs){.tab{-webkit-appearance:none;appearance:none;color:var(--instui-component-tabs-tab-default-text-color);font-family:var(--instui-component-tabs-tab-font-family);font-size:var(--instui-component-tabs-tab-font-size);font-weight:var(--instui-component-tabs-tab-font-weight);cursor:pointer;user-select:none;white-space:nowrap;z-index:1;margin-bottom:calc(-1 * var(--instui-component-tabs-panel-border-width));background:0 0;border:0;border-bottom:.25rem solid #0000;padding:1rem 1.25rem;line-height:1;position:relative}.tab:hover:not(.-selected):not(.-disabled):not([aria-selected=true]):not([aria-disabled=true]){border-bottom-color:var(--instui-component-tabs-tab-default-hover-border-color)}.tab.-selected,.tab[aria-selected=true]{border-bottom-color:var(--instui-component-tabs-tab-default-selected-border-color)}.tab.-disabled,.tab[aria-disabled=true],.tab:disabled{opacity:.5;cursor:default;font-weight:400}:scope
|
|
1
|
+
@scope(.instui-tabs){.tab{-webkit-appearance:none;appearance:none;color:var(--instui-component-tabs-tab-default-text-color);font-family:var(--instui-component-tabs-tab-font-family);font-size:var(--instui-component-tabs-tab-font-size);font-weight:var(--instui-component-tabs-tab-font-weight);cursor:pointer;user-select:none;white-space:nowrap;z-index:1;margin-bottom:calc(-1 * var(--instui-component-tabs-panel-border-width));background:0 0;border:0;border-bottom:.25rem solid #0000;padding:1rem 1.25rem;line-height:1;position:relative}.tab:hover:not(.-selected):not(.-disabled):not([aria-selected=true]):not([aria-disabled=true]){border-bottom-color:var(--instui-component-tabs-tab-default-hover-border-color)}.tab.-selected,.tab[aria-selected=true]{border-bottom-color:var(--instui-component-tabs-tab-default-selected-border-color)}.tab.-disabled,.tab[aria-disabled=true],.tab:disabled{opacity:.5;cursor:default;font-weight:400}:scope{&.-variant-secondary .tab{line-height:var(--instui-component-tabs-tab-line-height);color:var(--instui-component-tabs-tab-secondary-text-color);margin-inline-end:.2em;margin-bottom:calc(-1 * var(--instui-component-tabs-panel-border-width));border:var(--instui-component-tabs-panel-border-width) solid transparent;border-radius:.1875rem .1875rem 0 0;padding:.75rem 1rem}&.-variant-secondary .tab:first-of-type{margin-inline-start:0}&.-variant-secondary .tab:hover:not(.-selected):not(.-disabled):not([aria-selected=true]):not([aria-disabled=true]){background:var(--instui-component-tabs-tab-secondary-selected-background);border-color:var(--instui-component-tabs-tab-secondary-selected-border-color);color:var(--instui-component-tabs-tab-secondary-selected-text-color)}&.-variant-secondary .tab.-selected,&.-variant-secondary .tab[aria-selected=true]{background:var(--instui-component-tabs-tab-secondary-selected-background);border-color:var(--instui-component-tabs-tab-secondary-selected-border-color);border-bottom-color:var(--instui-component-tabs-tab-secondary-selected-background);color:var(--instui-component-tabs-tab-secondary-selected-text-color)}}}
|
package/dist/tag.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-tag{height:var(--instui-component-tag-height-medium);max-width:var(--instui-component-tag-max-width);padding:0 var(--instui-component-tag-padding-horizontal);background:var(--instui-component-tag-default-background);color:var(--instui-component-tag-default-color);border:var(--instui-component-tag-default-border-width) var(--instui-component-tag-default-border-style) var(--instui-component-tag-default-border-color);border-radius:var(--instui-component-tag-default-border-radius);font-family:var(--instui-component-tag-font-family);font-size:var(--instui-component-tag-font-size-medium);align-items:center;display:inline-flex}
|
|
1
|
+
@scope(.instui-tag){&{height:var(--instui-component-tag-height-medium);max-width:var(--instui-component-tag-max-width);padding:0 var(--instui-component-tag-padding-horizontal);background:var(--instui-component-tag-default-background);color:var(--instui-component-tag-default-color);border:var(--instui-component-tag-default-border-width) var(--instui-component-tag-default-border-style) var(--instui-component-tag-default-border-color);border-radius:var(--instui-component-tag-default-border-radius);font-family:var(--instui-component-tag-font-family);font-size:var(--instui-component-tag-font-size-medium);align-items:center;display:inline-flex}&:hover{background:var(--instui-component-tag-default-background-hover)}&.-size-sm{height:var(--instui-component-tag-height-small);padding:0 var(--instui-component-tag-padding-horizontal-small);font-size:var(--instui-component-tag-font-size-small)}&.-size-lg{height:var(--instui-component-tag-height-large);font-size:var(--instui-component-tag-font-size-large)}&.-inline{gap:var(--instui-spacing-space-xs);background:var(--instui-component-tag-inline-background);color:var(--instui-component-tag-inline-color);border-color:var(--instui-component-tag-inline-border-color);border-radius:var(--instui-component-tag-inline-border-radius);cursor:pointer}&.-inline:hover{background:var(--instui-component-tag-inline-background-hover)}&.-inline:after{content:"";background:var(--instui-component-tag-inline-icon-color);width:1em;height:1em;-webkit-mask:var(--instui-icon-x) center / contain no-repeat;mask:var(--instui-icon-x) center / contain no-repeat;flex:none}&.-inline:hover:after{background:var(--instui-component-tag-inline-icon-hover-color)}&.-readonly{cursor:default;background:var(--instui-component-tag-default-background)}&.-readonly.-inline:after{display:none}}&.-size-small{height:var(--instui-component-tag-height-small);padding:0 var(--instui-component-tag-padding-horizontal-small);font-size:var(--instui-component-tag-font-size-small)}&.-size-large{height:var(--instui-component-tag-height-large);font-size:var(--instui-component-tag-font-size-large)}
|
package/dist/text.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-text{font-family:var(--instui-component-text-content-font-family);color:var(--instui-component-text-base-color);font-size:var(--instui-component-text-font-size-medium);font-weight:var(--instui-component-text-font-weight-normal);line-height:var(--instui-component-text-content-line-height)}
|
|
1
|
+
@scope(.instui-text){&{font-family:var(--instui-component-text-content-font-family);color:var(--instui-component-text-base-color);font-size:var(--instui-component-text-font-size-medium);font-weight:var(--instui-component-text-font-weight-normal);line-height:var(--instui-component-text-content-line-height)}&.-size-xs{font-size:var(--instui-component-text-font-size-x-small)}&.-size-sm{font-size:var(--instui-component-text-font-size-small)}&.-size-lg{font-size:var(--instui-component-text-font-size-large)}&.-size-xl{font-size:var(--instui-component-text-font-size-x-large)}&.-weight-bold{font-weight:var(--instui-component-text-font-weight-bold)}&.-style-italic{font-style:italic}&.-color-primary{color:var(--instui-component-text-primary-color)}&.-color-secondary{color:var(--instui-component-text-muted-color)}&.-color-brand{color:light-dark(var(--instui-color-institutional-brand-primary),var(--instui-color-institutional-brand-font-color-dark))}&.-color-success{color:var(--instui-component-text-success-color)}&.-color-danger{color:var(--instui-component-text-error-color)}&.-color-warning{color:var(--instui-component-text-warning-color)}&:is(.-color-ai-highlight,.-color-ai){color:var(--instui-component-text-ai-color);background:var(--instui-component-text-ai-background-color)}&.-color-primary-inverse,&.-color-secondary-inverse{color:var(--instui-component-text-inverse-color)}&.-color-primary-on{color:var(--instui-component-text-base-on-color)}&.-color-secondary-on{color:var(--instui-component-text-muted-on-color)}&.-variant-description-page{font-size:var(--instui-component-text-description-page-font-size);font-weight:var(--instui-component-text-description-page-font-weight);line-height:var(--instui-component-text-description-page-line-height)}&.-variant-description-section{font-size:var(--instui-component-text-description-section-font-size);font-weight:var(--instui-component-text-description-section-font-weight);line-height:var(--instui-component-text-description-section-line-height)}&.-variant-content{font-size:var(--instui-component-text-content-font-size);line-height:var(--instui-component-text-content-line-height);font-weight:var(--instui-component-text-content-font-weight)}&.-variant-content-small{font-size:var(--instui-component-text-content-small-font-size);font-weight:var(--instui-component-text-content-small-font-weight);line-height:var(--instui-component-text-content-small-line-height)}&.-variant-content-important{font-size:var(--instui-component-text-content-important-font-size);line-height:var(--instui-component-text-content-important-line-height);font-weight:var(--instui-component-text-content-important-font-weight)}&.-variant-content-quote{font-size:var(--instui-component-text-content-quote-font-size);font-weight:var(--instui-component-text-content-quote-font-weight);font-style:var(--instui-component-text-content-quote-font-style);line-height:var(--instui-component-text-content-quote-line-height)}&.-variant-legend{font-size:var(--instui-component-text-legend-font-size);line-height:var(--instui-component-text-legend-line-height);font-weight:var(--instui-component-text-legend-font-weight)}&.-transform-uppercase{text-transform:uppercase}&.-transform-lowercase{text-transform:lowercase}&.-transform-capitalize{text-transform:capitalize}}&.-size-x-small{font-size:var(--instui-component-text-font-size-x-small)}&.-size-small{font-size:var(--instui-component-text-font-size-small)}&.-size-large{font-size:var(--instui-component-text-font-size-large)}&.-size-x-large{font-size:var(--instui-component-text-font-size-x-large)}
|
package/dist/toggle-details.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-toggle-details{color:var(--instui-component-toggle-details-text-color);font-family:var(--instui-component-toggle-details-font-family);font-weight:var(--instui-component-toggle-details-font-weight);line-height:var(--instui-component-toggle-details-line-height)}
|
|
1
|
+
@scope(.instui-toggle-details){&{color:var(--instui-component-toggle-details-text-color);font-family:var(--instui-component-toggle-details-font-family);font-weight:var(--instui-component-toggle-details-font-weight);line-height:var(--instui-component-toggle-details-line-height)}&>summary{align-items:center;gap:var(--instui-component-toggle-details-icon-margin);cursor:pointer;font-size:var(--instui-component-toggle-details-font-size-medium);padding:var(--instui-component-toggle-details-toggle-padding);color:var(--instui-component-toggle-details-text-color);list-style:none;display:flex}&>summary::-webkit-details-marker{display:none}&>summary:before{content:"";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;flex:none;transition:transform .2s}&[open]>summary:before{transform:rotate(90deg)}&.-chevron-end>summary:before{order:1;margin-inline-start:auto}&.-variant-filled>summary{background:var(--instui-color-background-interactive-action-secondary-base);border-radius:var(--instui-component-toggle-details-toggle-border-radius)}&>:not(summary){padding:var(--instui-component-toggle-details-content-padding-medium)}&.-size-sm>summary{font-size:var(--instui-component-toggle-details-font-size-small)}&.-size-sm>:not(summary){padding:var(--instui-component-toggle-details-content-padding-small)}&.-size-lg>summary{font-size:var(--instui-component-toggle-details-font-size-large)}&.-size-lg>:not(summary){padding:var(--instui-component-toggle-details-content-padding-large)}}&.-size-small>summary{font-size:var(--instui-component-toggle-details-font-size-small)}&.-size-small>:not(summary){padding:var(--instui-component-toggle-details-content-padding-small)}&.-size-large>summary{font-size:var(--instui-component-toggle-details-font-size-large)}&.-size-large>:not(summary){padding:var(--instui-component-toggle-details-content-padding-large)}
|
package/dist/toggle-group.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-toggle-group{border:var(--instui-border-width-sm) solid var(--instui-component-toggle-group-border-color);border-radius:var(--instui-border-radius-md);background:var(--instui-color-background-elevated-surface-base);color:var(--instui-component-toggle-details-text-color);font-family:var(--instui-component-toggle-details-font-family);font-weight:var(--instui-component-toggle-details-font-weight);line-height:var(--instui-component-toggle-details-line-height);display:block;overflow:hidden}
|
|
1
|
+
@scope(.instui-toggle-group){&{border:var(--instui-border-width-sm) solid var(--instui-component-toggle-group-border-color);border-radius:var(--instui-border-radius-md);background:var(--instui-color-background-elevated-surface-base);color:var(--instui-component-toggle-details-text-color);font-family:var(--instui-component-toggle-details-font-family);font-weight:var(--instui-component-toggle-details-font-weight);line-height:var(--instui-component-toggle-details-line-height);display:block;overflow:hidden}&>summary{align-items:center;gap:var(--instui-component-toggle-details-icon-margin);cursor:pointer;padding:var(--instui-component-toggle-details-content-padding-medium);font-size:var(--instui-component-toggle-details-font-size-medium);list-style:none;display:flex}&>summary::-webkit-details-marker{display:none}&>summary:before{content:"";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;flex:none;transition:transform .2s}&[open]>summary:before{transform:rotate(90deg)}&>:not(summary){border-block-start:var(--instui-border-width-sm) solid var(--instui-component-toggle-group-border-color);padding:var(--instui-component-toggle-details-content-padding-medium)}&.-size-sm>summary,&.-size-sm>:not(summary){font-size:var(--instui-component-toggle-details-font-size-small);padding:var(--instui-component-toggle-details-content-padding-small)}&.-size-lg>summary,&.-size-lg>:not(summary){font-size:var(--instui-component-toggle-details-font-size-large);padding:var(--instui-component-toggle-details-content-padding-large)}&.-without-border{border:0}&.-without-border>:not(summary){border-block-start:0}}&.-size-small>summary,&.-size-small>:not(summary){font-size:var(--instui-component-toggle-details-font-size-small);padding:var(--instui-component-toggle-details-content-padding-small)}&.-size-large>summary,&.-size-large>:not(summary){font-size:var(--instui-component-toggle-details-font-size-large);padding:var(--instui-component-toggle-details-content-padding-large)}
|
package/dist/tray.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-tray{inline-size:var(--instui-component-tray-width-md);background:var(--instui-component-tray-background-color);border:var(--instui-component-tray-border-width) solid var(--instui-component-tray-border-color);block-size:auto;max-block-size:none;max-inline-size:100%;padding:var(--instui-component-tray-padding);z-index:var(--instui-component-tray-z-index);box-shadow:var(--instui-elevation-topmost);position:fixed;inset-block:0;inset-inline-start:0}
|
|
1
|
+
@scope(.instui-tray){&{inline-size:var(--instui-component-tray-width-md);background:var(--instui-component-tray-background-color);border:var(--instui-component-tray-border-width) solid var(--instui-component-tray-border-color);block-size:auto;max-block-size:none;max-inline-size:100%;padding:var(--instui-component-tray-padding);z-index:var(--instui-component-tray-z-index);box-shadow:var(--instui-elevation-topmost);position:fixed;inset-block:0;inset-inline-start:0}&.-placement-start{inset-inline:0 auto}&.-placement-end{inset-inline:auto 0}&.-placement-top{block-size:auto;inline-size:100%;inset:0 0 auto}&.-placement-bottom{block-size:auto;inline-size:100%;inset:auto 0 0}&.-size-xs{inline-size:var(--instui-component-tray-width-xs)}&.-size-sm{inline-size:var(--instui-component-tray-width-sm)}&.-size-md{inline-size:var(--instui-component-tray-width-md)}&.-size-lg{inline-size:var(--instui-component-tray-width-lg)}&.-size-xl{inline-size:var(--instui-component-tray-width-xl)}&[popover]{margin:0}&[is=dialog],dialog&{padding:var(--instui-component-tray-padding);border:var(--instui-component-tray-border-width) solid var(--instui-component-tray-border-color);margin:0}@supports (transition-behavior:allow-discrete){&[popover]{--tray-slide-x:-100%;--tray-slide-y:0%;transition:transform .2s ease, overlay .2s allow-discrete, display .2s allow-discrete;transform:translate(0)}&[popover]:not(:popover-open){transform:translate(var(--tray-slide-x), var(--tray-slide-y))}@starting-style{&[popover]:popover-open{transform:translate(var(--tray-slide-x), var(--tray-slide-y))}}[dir=rtl] &,&.-placement-end{--tray-slide-x:100%}[dir=rtl] &.-placement-end{--tray-slide-x:-100%}&.-placement-top{--tray-slide-x:0%;--tray-slide-y:-100%}&.-placement-bottom{--tray-slide-x:0%;--tray-slide-y:100%}}}&.-size-x-small{inline-size:var(--instui-component-tray-width-xs)}&.-size-small{inline-size:var(--instui-component-tray-width-sm)}&.-size-medium{inline-size:var(--instui-component-tray-width-md)}&.-size-large{inline-size:var(--instui-component-tray-width-lg)}&.-size-x-large{inline-size:var(--instui-component-tray-width-xl)}
|
package/dist/tree-browser.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-tree-browser{border-radius:var(--instui-component-tree-browser-border-radius);font-family:var(--instui-component-tree-browser-tree-collection-font-family);color:var(--instui-component-tree-browser-tree-button-name-text-color)}
|
|
1
|
+
@scope(.instui-tree-browser){&{border-radius:var(--instui-component-tree-browser-border-radius);font-family:var(--instui-component-tree-browser-tree-collection-font-family);color:var(--instui-component-tree-browser-tree-button-name-text-color)}& details>summary,& .item{align-items:center;gap:var(--instui-component-tree-browser-tree-button-icons-margin-right-medium);padding:var(--instui-component-tree-browser-tree-button-base-spacing-medium);font-size:var(--instui-component-tree-browser-tree-button-name-font-size-medium);line-height:var(--instui-component-tree-browser-tree-button-text-line-height);color:var(--instui-component-tree-browser-tree-button-name-text-color);border-radius:var(--instui-component-tree-browser-tree-button-border-radius);cursor:pointer;list-style:none;display:flex}& details>summary [class*=-icon-],& .item [class*=-icon-]{line-height:1}& details>summary::-webkit-details-marker{display:none}& details>summary:before{content:"";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;flex:none;transition:transform .2s}& details[open]>summary:before{transform:rotate(90deg)}& details>summary:hover,& .item:hover{background:var(--instui-component-tree-browser-tree-button-hover-background-color);color:var(--instui-component-tree-browser-tree-button-hover-text-color)}& details>summary.-selected,& .item.-selected{background:var(--instui-component-tree-browser-tree-button-selected-background-color);color:var(--instui-component-tree-browser-tree-button-selected-text-color)}& ul{margin:0;padding-inline-start:var(--instui-component-tree-browser-tree-collection-base-spacing-medium);list-style:none}&.-size-sm details>summary,&.-size-sm .item{padding:var(--instui-component-tree-browser-tree-button-base-spacing-small);font-size:var(--instui-component-tree-browser-tree-button-name-font-size-small)}&.-size-lg details>summary,&.-size-lg .item{padding:var(--instui-component-tree-browser-tree-button-base-spacing-large);font-size:var(--instui-component-tree-browser-tree-button-name-font-size-large)}}&.-size-small details>summary,&.-size-small .item{padding:var(--instui-component-tree-browser-tree-button-base-spacing-small);font-size:var(--instui-component-tree-browser-tree-button-name-font-size-small)}&.-size-large details>summary,&.-size-large .item{padding:var(--instui-component-tree-browser-tree-button-base-spacing-large);font-size:var(--instui-component-tree-browser-tree-button-name-font-size-large)}
|
package/dist/utilities/icon.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-icon
|
|
1
|
+
@scope(.instui-icon){&{display:inline-flex}}[class*=-icon-]:before{content:"";vertical-align:-.125em;block-size:1em;inline-size:1em;-webkit-mask:var(--pantoken-glyph) center / contain no-repeat;mask:var(--pantoken-glyph) center / contain no-repeat;background:currentColor;flex:none;display:inline-block}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-screen-reader-content
|
|
1
|
+
@scope(.instui-screen-reader-content){&{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}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@property --duration{syntax:"<time>";inherits:true;initial-value:.3s}@property --timing{syntax:"*";inherits:true;initial-value:ease-in-out}.instui-transition
|
|
1
|
+
@property --duration{syntax:"<time>";inherits:true;initial-value:.3s}@property --timing{syntax:"*";inherits:true;initial-value:ease-in-out}@scope(.instui-transition){&{transition:opacity var(--duration) var(--timing), transform var(--duration) var(--timing)}&.-transition-fade-exiting,&.-transition-fade-exited{opacity:.01}&.-transition-fade-entering,&.-transition-fade-entered{opacity:1}&.-transition-scale-exiting,&.-transition-scale-exited{opacity:.01;transform:scale(.01)translate(0)}&.-transition-scale-entering,&.-transition-scale-entered{opacity:1;transform:scale(1)translate(0)}&.-transition-slide-right-exited,&.-transition-slide-left-exited,&.-transition-slide-up-exited,&.-transition-slide-down-exited{opacity:.01}&.-transition-slide-right-exiting,&.-transition-slide-right-exited{transform:translate(100%)}&.-transition-slide-left-exiting,&.-transition-slide-left-exited{transform:translate(-100%)}&.-transition-slide-up-exiting,&.-transition-slide-up-exited{transform:translateY(-100%)}&.-transition-slide-down-exiting,&.-transition-slide-down-exited{transform:translateY(100%)}&.-transition-slide-right-entering,&.-transition-slide-left-entering,&.-transition-slide-up-entering,&.-transition-slide-down-entering,&.-transition-slide-right-entered,&.-transition-slide-left-entered,&.-transition-slide-up-entered,&.-transition-slide-down-entered{opacity:1;transform:translate(0)}}
|