@pantoken/components 1.0.3 → 1.1.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/button.css +1 -1
- package/dist/close-button.css +1 -1
- package/dist/components.css +1 -1
- package/dist/heading.css +1 -1
- package/dist/icons/user-round-star.css +1 -0
- package/dist/icons/venetian-mask-stem.css +1 -0
- package/dist/icons.css +1 -1
- package/dist/index.d.mts +95 -95
- package/dist/index.mjs +126 -774
- package/dist/input-group.css +1 -1
- package/dist/list.css +1 -1
- package/dist/list.item.css +1 -1
- package/dist/modal.css +1 -1
- package/dist/model.json +14903 -0
- package/dist/number-input.css +1 -1
- package/dist/progress-circle.css +1 -1
- package/dist/progress.css +1 -1
- package/dist/radio.css +1 -1
- package/dist/range-input.css +1 -1
- package/dist/rating.css +1 -1
- package/dist/scaffold-preset.d.mts +2 -3
- package/dist/simple-select.css +1 -1
- package/dist/tag.css +1 -1
- package/dist/text-area.css +1 -1
- package/dist/text-input.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/view.css +1 -1
- package/package.json +17 -15
package/dist/number-input.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-number-input{box-sizing:border-box;inline-size:100%;block-size:var(--instui-component-text-input-height-md);padding-inline:var(--instui-component-text-input-padding-horizontal-md);align-items:center;gap:var(--instui-component-text-input-gap-content);background-color:var(--instui-component-text-input-background-color);border:var(--instui-component-text-input-border-width) solid var(--instui-component-text-input-border-color);border-radius:var(--instui-component-text-input-border-radius);color:var(--instui-component-text-input-text-color);font-family:var(--instui-component-text-input-font-family);font-size:var(--instui-component-text-input-font-size-md);display:flex}
|
|
1
|
+
@scope(.instui-number-input){&{box-sizing:border-box;inline-size:100%;block-size:var(--instui-component-text-input-height-md);padding-inline:var(--instui-component-text-input-padding-horizontal-md);align-items:center;gap:var(--instui-component-text-input-gap-content);background-color:var(--instui-component-text-input-background-color);border:var(--instui-component-text-input-border-width) solid var(--instui-component-text-input-border-color);border-radius:var(--instui-component-text-input-border-radius);color:var(--instui-component-text-input-text-color);font-family:var(--instui-component-text-input-font-family);font-size:var(--instui-component-text-input-font-size-md);padding-inline-end:0;display:flex;overflow:hidden}&:hover{background-color:var(--instui-component-text-input-background-hover-color);border-color:var(--instui-component-text-input-border-hover-color)}&>input,& .instui-text-input{block-size:auto;min-inline-size:0;font:inherit;color:inherit;background:0 0;border:0;outline:none;flex:1;padding:0}&>input::placeholder{color:var(--instui-component-text-input-placeholder-color)}&>input::-webkit-outer-spin-button,&>input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}&>input[type=number]{-moz-appearance:textfield;appearance:textfield}&.-disabled,&:has(>input:disabled){background-color:var(--instui-component-text-input-background-disabled-color);border-color:var(--instui-component-text-input-border-disabled-color);color:var(--instui-component-text-input-text-disabled-color);cursor:not-allowed}&.-readonly{background-color:var(--instui-component-text-input-background-readonly-color);border-color:var(--instui-component-text-input-border-readonly-color);color:var(--instui-component-text-input-text-readonly-color)}&.-invalid{border-color:var(--instui-component-text-input-error-border-color)}&.-success{border-color:var(--instui-component-text-input-success-border-color)}&:has(: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);border-radius:var(--instui-focus-outline-radius)}&:is(.-invalid,:has(>input:user-invalid)):has(:focus-visible){outline-color:var(--instui-focus-outline-color-danger)}&.-success:has(:focus-visible){outline-color:var(--instui-focus-outline-color-success)}&.-size-sm{block-size:var(--instui-component-text-input-height-sm);padding-inline:var(--instui-component-text-input-padding-horizontal-sm);font-size:var(--instui-component-text-input-font-size-sm)}&.-size-md{block-size:var(--instui-component-text-input-height-md);padding-inline:var(--instui-component-text-input-padding-horizontal-md);font-size:var(--instui-component-text-input-font-size-md)}&.-size-lg{block-size:var(--instui-component-text-input-height-lg);padding-inline:var(--instui-component-text-input-padding-horizontal-lg);font-size:var(--instui-component-text-input-font-size-lg)}& .arrows{border-inline-start:var(--instui-component-text-input-border-width) solid var(--instui-component-text-input-border-color);flex-direction:column;flex:none;align-self:stretch;inline-size:1.5rem;display:flex}& .arrows button{background:var(--instui-component-text-input-arrows-background-color);color:var(--instui-color-icon-interactive-action-secondary-base);cursor:pointer;border:0;flex:1;justify-content:center;align-items:center;padding:0;display:flex}& .arrows button+button{border-block-start:var(--instui-component-text-input-border-width) solid var(--instui-component-text-input-border-color)}& .arrows button:hover{background:var(--instui-component-text-input-arrows-background-hover-color)}& .arrows button:active{background:var(--instui-component-text-input-arrows-background-active-color)}& .arrows button:disabled{background:var(--instui-component-text-input-arrows-background-disabled-color);cursor:not-allowed}& .arrows button:before{content:"";block-size:.875em;inline-size:.875em;-webkit-mask:var(--instui-icon-chevron-up) center / contain no-repeat;mask:var(--instui-icon-chevron-up) center / contain no-repeat;background:currentColor}& .arrows button.down:before{-webkit-mask:var(--instui-icon-chevron-down) center / contain no-repeat;mask:var(--instui-icon-chevron-down) center / contain no-repeat}&.-size-small{block-size:var(--instui-component-text-input-height-sm);padding-inline:var(--instui-component-text-input-padding-horizontal-sm);font-size:var(--instui-component-text-input-font-size-sm)}&.-size-medium{block-size:var(--instui-component-text-input-height-md);padding-inline:var(--instui-component-text-input-padding-horizontal-md);font-size:var(--instui-component-text-input-font-size-md)}&.-size-large{block-size:var(--instui-component-text-input-height-lg);padding-inline:var(--instui-component-text-input-padding-horizontal-lg);font-size:var(--instui-component-text-input-font-size-lg)}}
|
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}@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%)}
|
|
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%}}@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}
|
|
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)}}
|
package/dist/radio.css
CHANGED
|
@@ -1 +1 @@
|
|
|
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}
|
|
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
|
-
@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{cursor:pointer;inline-size:var(--instui-component-range-input-handle-size);block-size:var(--instui-component-range-input-handle-size);border:var(--instui-component-range-input-handle-border-size) solid var(--instui-component-range-input-handle-border-color);background:var(--instui-component-range-input-handle-background);box-shadow:0 0 0 0 var(--instui-component-range-input-handle-shadow-color);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)}.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)}}
|
|
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{cursor:pointer;inline-size:var(--instui-component-range-input-handle-size);block-size:var(--instui-component-range-input-handle-size);border:var(--instui-component-range-input-handle-border-size) solid var(--instui-component-range-input-handle-border-color);background:var(--instui-component-range-input-handle-background);box-shadow:0 0 0 0 var(--instui-component-range-input-handle-shadow-color);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)}.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){: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)}}
|
|
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/simple-select.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-simple-select{box-sizing:border-box;inline-size:100%;font-family:var(--instui-component-text-input-font-family);font-weight:var(--instui-component-text-input-font-weight);color:var(--instui-component-text-input-text-color);background-color:var(--instui-component-text-input-background-color);border:var(--instui-component-text-input-border-width) solid var(--instui-component-text-input-border-color);border-radius:var(--instui-component-text-input-border-radius);
|
|
1
|
+
@scope(.instui-simple-select){&{box-sizing:border-box;inline-size:100%;font-family:var(--instui-component-text-input-font-family);font-weight:var(--instui-component-text-input-font-weight);color:var(--instui-component-text-input-text-color);background-color:var(--instui-component-text-input-background-color);border:var(--instui-component-text-input-border-width) solid var(--instui-component-text-input-border-color);border-radius:var(--instui-component-text-input-border-radius);block-size:var(--instui-component-text-input-height-md);padding-inline:var(--instui-component-text-input-padding-horizontal-md);font-size:var(--instui-component-text-input-font-size-md);-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236a7883' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--instui-component-text-input-padding-horizontal-md) center;background-size:1em;padding-inline-end:calc(var(--instui-component-text-input-padding-horizontal-md) + 1.5rem);display:block}&::placeholder{color:var(--instui-component-text-input-placeholder-color)}&:hover{background-color:var(--instui-component-text-input-background-hover-color);border-color:var(--instui-component-text-input-border-hover-color)}&:hover::placeholder{color:var(--instui-component-text-input-placeholder-hover-color)}&:disabled,&.-disabled{background-color:var(--instui-component-text-input-background-disabled-color);border-color:var(--instui-component-text-input-border-disabled-color);color:var(--instui-component-text-input-text-disabled-color);cursor:not-allowed}&.-readonly{background-color:var(--instui-component-text-input-background-readonly-color);border-color:var(--instui-component-text-input-border-readonly-color);color:var(--instui-component-text-input-text-readonly-color)}&.-invalid{border-color:var(--instui-component-text-input-error-border-color)}&.-success{border-color:var(--instui-component-text-input-success-border-color)}&:is(.-invalid,:user-invalid):focus-visible{outline-color:var(--instui-focus-outline-color-danger)}&.-success:focus-visible{outline-color:var(--instui-focus-outline-color-success)}&.-size-sm{block-size:var(--instui-component-text-input-height-sm);padding-inline:var(--instui-component-text-input-padding-horizontal-sm);font-size:var(--instui-component-text-input-font-size-sm);padding-inline-end:calc(var(--instui-component-text-input-padding-horizontal-sm) + 1.5rem)}&.-size-md{block-size:var(--instui-component-text-input-height-md);padding-inline:var(--instui-component-text-input-padding-horizontal-md);font-size:var(--instui-component-text-input-font-size-md);padding-inline-end:calc(var(--instui-component-text-input-padding-horizontal-md) + 1.5rem)}&.-size-lg{block-size:var(--instui-component-text-input-height-lg);padding-inline:var(--instui-component-text-input-padding-horizontal-lg);font-size:var(--instui-component-text-input-font-size-lg);padding-inline-end:calc(var(--instui-component-text-input-padding-horizontal-lg) + 1.5rem)}&.-size-small{block-size:var(--instui-component-text-input-height-sm);padding-inline:var(--instui-component-text-input-padding-horizontal-sm);font-size:var(--instui-component-text-input-font-size-sm);padding-inline-end:calc(var(--instui-component-text-input-padding-horizontal-sm) + 1.5rem)}&.-size-medium{block-size:var(--instui-component-text-input-height-md);padding-inline:var(--instui-component-text-input-padding-horizontal-md);font-size:var(--instui-component-text-input-font-size-md);padding-inline-end:calc(var(--instui-component-text-input-padding-horizontal-md) + 1.5rem)}&.-size-large{block-size:var(--instui-component-text-input-height-lg);padding-inline:var(--instui-component-text-input-padding-horizontal-lg);font-size:var(--instui-component-text-input-font-size-lg);padding-inline-end:calc(var(--instui-component-text-input-padding-horizontal-lg) + 1.5rem)}}
|
package/dist/tag.css
CHANGED
|
@@ -1 +1 @@
|
|
|
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}
|
|
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-area.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-text-area{box-sizing:border-box;inline-size:100%;font-family:var(--instui-component-text-area-font-family);font-weight:var(--instui-component-text-area-font-weight);color:var(--instui-component-text-area-text-color);background-color:var(--instui-component-text-area-background-color);border:var(--instui-component-text-area-border-width) solid var(--instui-component-text-area-border-color);border-radius:var(--instui-component-text-area-border-radius);
|
|
1
|
+
@scope(.instui-text-area){&{box-sizing:border-box;inline-size:100%;font-family:var(--instui-component-text-area-font-family);font-weight:var(--instui-component-text-area-font-weight);color:var(--instui-component-text-area-text-color);background-color:var(--instui-component-text-area-background-color);border:var(--instui-component-text-area-border-width) solid var(--instui-component-text-area-border-color);border-radius:var(--instui-component-text-area-border-radius);padding:var(--instui-component-text-area-padding);font-size:var(--instui-component-text-area-font-size-md);resize:vertical;min-block-size:4rem;line-height:1.5;display:block}&::placeholder{color:var(--instui-component-text-area-placeholder-color)}&:hover{background-color:var(--instui-component-text-area-background-hover-color);border-color:var(--instui-component-text-area-border-hover-color)}&:hover::placeholder{color:var(--instui-component-text-area-placeholder-hover-color)}&:disabled,&.-disabled{background-color:var(--instui-component-text-area-background-disabled-color);border-color:var(--instui-component-text-area-border-disabled-color);color:var(--instui-component-text-area-text-disabled-color);cursor:not-allowed}&.-readonly{background-color:var(--instui-component-text-area-background-readonly-color);border-color:var(--instui-component-text-area-border-readonly-color);color:var(--instui-component-text-area-text-readonly-color)}&.-invalid{border-color:var(--instui-component-text-area-error-border-color)}&.-success{border-color:var(--instui-component-text-area-success-border-color)}&:is(.-invalid,:user-invalid):focus-visible{outline-color:var(--instui-focus-outline-color-danger)}&.-success:focus-visible{outline-color:var(--instui-focus-outline-color-success)}&.-size-sm{font-size:var(--instui-component-text-area-font-size-sm)}&.-size-md{font-size:var(--instui-component-text-area-font-size-md)}&.-size-lg{font-size:var(--instui-component-text-area-font-size-lg)}&.-size-small{font-size:var(--instui-component-text-area-font-size-sm)}&.-size-medium{font-size:var(--instui-component-text-area-font-size-md)}&.-size-large{font-size:var(--instui-component-text-area-font-size-lg)}}
|
package/dist/text-input.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-text-input{box-sizing:border-box;inline-size:100%;font-family:var(--instui-component-text-input-font-family);font-weight:var(--instui-component-text-input-font-weight);color:var(--instui-component-text-input-text-color);background-color:var(--instui-component-text-input-background-color);border:var(--instui-component-text-input-border-width) solid var(--instui-component-text-input-border-color);border-radius:var(--instui-component-text-input-border-radius);
|
|
1
|
+
@scope(.instui-text-input){&{box-sizing:border-box;inline-size:100%;font-family:var(--instui-component-text-input-font-family);font-weight:var(--instui-component-text-input-font-weight);color:var(--instui-component-text-input-text-color);background-color:var(--instui-component-text-input-background-color);border:var(--instui-component-text-input-border-width) solid var(--instui-component-text-input-border-color);border-radius:var(--instui-component-text-input-border-radius);block-size:var(--instui-component-text-input-height-md);padding-inline:var(--instui-component-text-input-padding-horizontal-md);font-size:var(--instui-component-text-input-font-size-md);display:block}&::placeholder{color:var(--instui-component-text-input-placeholder-color)}&:hover{background-color:var(--instui-component-text-input-background-hover-color);border-color:var(--instui-component-text-input-border-hover-color)}&:hover::placeholder{color:var(--instui-component-text-input-placeholder-hover-color)}&:disabled,&.-disabled{background-color:var(--instui-component-text-input-background-disabled-color);border-color:var(--instui-component-text-input-border-disabled-color);color:var(--instui-component-text-input-text-disabled-color);cursor:not-allowed}&.-readonly{background-color:var(--instui-component-text-input-background-readonly-color);border-color:var(--instui-component-text-input-border-readonly-color);color:var(--instui-component-text-input-text-readonly-color)}&.-invalid{border-color:var(--instui-component-text-input-error-border-color)}&.-success{border-color:var(--instui-component-text-input-success-border-color)}&:is(.-invalid,:user-invalid):focus-visible{outline-color:var(--instui-focus-outline-color-danger)}&.-success:focus-visible{outline-color:var(--instui-focus-outline-color-success)}&.-size-sm{block-size:var(--instui-component-text-input-height-sm);padding-inline:var(--instui-component-text-input-padding-horizontal-sm);font-size:var(--instui-component-text-input-font-size-sm)}&.-size-md{block-size:var(--instui-component-text-input-height-md);padding-inline:var(--instui-component-text-input-padding-horizontal-md);font-size:var(--instui-component-text-input-font-size-md)}&.-size-lg{block-size:var(--instui-component-text-input-height-lg);padding-inline:var(--instui-component-text-input-padding-horizontal-lg);font-size:var(--instui-component-text-input-font-size-lg)}&.-size-small{block-size:var(--instui-component-text-input-height-sm);padding-inline:var(--instui-component-text-input-padding-horizontal-sm);font-size:var(--instui-component-text-input-font-size-sm)}&.-size-medium{block-size:var(--instui-component-text-input-height-md);padding-inline:var(--instui-component-text-input-padding-horizontal-md);font-size:var(--instui-component-text-input-font-size-md)}&.-size-large{block-size:var(--instui-component-text-input-height-lg);padding-inline:var(--instui-component-text-input-padding-horizontal-lg);font-size:var(--instui-component-text-input-font-size-lg)}}
|
package/dist/text.css
CHANGED
|
@@ -1 +1 @@
|
|
|
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}
|
|
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
|
-
@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)}
|
|
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
|
-
@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}
|
|
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
|
-
@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%}}
|
|
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
|
-
@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)}
|
|
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/view.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.instui-view{box-sizing:border-box;display:block}
|
|
1
|
+
@scope(.instui-view){&{box-sizing:border-box;display:block}&.-background-primary{background:var(--instui-component-view-background-primary)}&.-background-secondary{background:var(--instui-component-view-background-secondary)}&.-background-primary-inverse{background:var(--instui-component-view-background-primary-inverse)}&.-background-brand{background:var(--instui-component-view-background-brand)}&.-background-info{background:var(--instui-component-view-background-info)}&.-background-alert{background:var(--instui-component-view-background-alert)}&.-background-success{background:var(--instui-component-view-background-success)}&.-background-danger{background:var(--instui-component-view-background-danger)}&.-background-warning{background:var(--instui-component-view-background-warning)}&.-background-transparent{background:0 0}&.-border-radius-small{border-radius:var(--instui-border-radius-sm)}&.-border-radius-medium{border-radius:var(--instui-border-radius-md)}&.-border-radius-large{border-radius:var(--instui-border-radius-lg)}&.-border-radius-circle{border-radius:50%}&.-border-radius-pill{border-radius:var(--instui-border-radius-full)}&.-border-width-small{border-style:solid;border-width:var(--instui-border-width-sm);border-color:var(--instui-color-stroke-base)}&.-border-width-medium{border-style:solid;border-width:var(--instui-border-width-md);border-color:var(--instui-color-stroke-base)}&.-border-width-large{border-style:solid;border-width:var(--instui-border-width-lg);border-color:var(--instui-color-stroke-base)}&.-border-color-primary{border-color:var(--instui-color-stroke-base)}&.-border-color-brand{border-color:var(--instui-color-stroke-brand)}&.-border-color-success{border-color:var(--instui-color-stroke-success)}&.-border-color-info{border-color:var(--instui-color-stroke-info)}&.-border-color-warning{border-color:var(--instui-color-stroke-warning)}&.-border-color-danger{border-color:var(--instui-color-stroke-error)}&.-shadow-resting{box-shadow:var(--instui-elevation-resting)}&.-shadow-above{box-shadow:var(--instui-elevation-above)}&.-shadow-topmost{box-shadow:var(--instui-elevation-topmost)}&.-display-block{display:block}&.-display-inline-block{display:inline-block}&.-display-inline{display:inline}&.-display-flex{display:flex}&.-display-inline-flex{display:inline-flex}&.-display-none{display:none}&.-position-static{position:static}&.-position-relative{position:relative}&.-position-absolute{position:absolute}&.-position-fixed{position:fixed}&.-position-sticky{position:sticky}&.-overflow-x-visible{overflow-x:visible}&.-overflow-y-visible{overflow-y:visible}&.-overflow-x-hidden{overflow-x:hidden}&.-overflow-y-hidden{overflow-y:hidden}&.-overflow-x-auto{overflow-x:auto}&.-overflow-y-auto{overflow-y:auto}&.-overflow-x-scroll{overflow-x:scroll}&.-overflow-y-scroll{overflow-y:scroll}&.-overflow-x-clip{overflow-x:clip}&.-overflow-y-clip{overflow-y:clip}&.-cursor-auto{cursor:auto}&.-cursor-default{cursor:default}&.-cursor-pointer{cursor:pointer}&.-cursor-not-allowed{cursor:not-allowed}&.-cursor-text{cursor:text}&.-cursor-move{cursor:move}&.-cursor-grab{cursor:grab}&.-cursor-wait{cursor:wait}}
|
package/package.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pantoken/components",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.1.1",
|
|
4
4
|
"description": "An InstUI-look CSS component library from the pantoken tokens: prose/content styling plus class-based components (button, alert, badge).",
|
|
5
|
-
"homepage": "https://pantoken.
|
|
5
|
+
"homepage": "https://pantoken.app",
|
|
6
6
|
"bugs": "https://github.com/thedannywahl/pantoken/issues",
|
|
7
7
|
"license": "MIT",
|
|
8
8
|
"repository": {
|
|
@@ -43,6 +43,7 @@
|
|
|
43
43
|
"./transition.css": "./dist/utilities/transition.css",
|
|
44
44
|
"./responsive.css": "./dist/utilities/responsive.css",
|
|
45
45
|
"./scaffold-preset": "./dist/scaffold-preset.mjs",
|
|
46
|
+
"./model.json": "./dist/model.json",
|
|
46
47
|
"./package.json": "./package.json"
|
|
47
48
|
},
|
|
48
49
|
"publishConfig": {
|
|
@@ -50,23 +51,24 @@
|
|
|
50
51
|
"provenance": true
|
|
51
52
|
},
|
|
52
53
|
"dependencies": {
|
|
53
|
-
"@pantoken/plugin-colors": "0.1.
|
|
54
|
-
"@pantoken/scaffold-base": "0.2.
|
|
55
|
-
"@pantoken/tokens": "0.3.
|
|
56
|
-
"@pantoken/utils": "1.0.
|
|
54
|
+
"@pantoken/plugin-colors": "0.1.3",
|
|
55
|
+
"@pantoken/scaffold-base": "0.2.1",
|
|
56
|
+
"@pantoken/tokens": "0.3.2",
|
|
57
|
+
"@pantoken/utils": "1.0.2"
|
|
57
58
|
},
|
|
58
59
|
"devDependencies": {
|
|
59
|
-
"@cssdoc/config": "^0.
|
|
60
|
-
"@cssdoc/core": "^0.
|
|
61
|
-
"@pantoken/
|
|
62
|
-
"@pantoken/
|
|
63
|
-
"@pantoken/plugin-
|
|
64
|
-
"@
|
|
60
|
+
"@cssdoc/config": "^0.15.2",
|
|
61
|
+
"@cssdoc/core": "^0.15.2",
|
|
62
|
+
"@pantoken/cssdoc-model": "0.2.0",
|
|
63
|
+
"@pantoken/icons": "0.2.2",
|
|
64
|
+
"@pantoken/plugin-props-minify": "0.1.4",
|
|
65
|
+
"@pantoken/plugin-theme-custom-media": "0.2.4",
|
|
66
|
+
"@types/node": "^26.5.0",
|
|
65
67
|
"bingo-stratum": "^0.5.13",
|
|
66
|
-
"postcss": "^8.5.
|
|
68
|
+
"postcss": "^8.5.28",
|
|
67
69
|
"typescript": "^7.0.2",
|
|
68
|
-
"vite": "npm:@voidzero-dev/vite-plus-core@0.3.
|
|
69
|
-
"vite-plus": "0.3.
|
|
70
|
+
"vite": "npm:@voidzero-dev/vite-plus-core@0.3.1",
|
|
71
|
+
"vite-plus": "0.3.1"
|
|
70
72
|
},
|
|
71
73
|
"engines": {
|
|
72
74
|
"node": ">=22.18.0"
|