@cfx-dev/ui-components 2.1.10 → 2.1.11
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/assets/Button.css +1 -1
- package/dist/assets/InfoPanel.css +1 -1
- package/dist/assets/ToggleGroup.css +1 -1
- package/dist/assets/global.css +1 -1
- package/dist/components/Button/Button.js +50 -50
- package/dist/components/InfoPanel/InfoPanel.js +28 -28
- package/dist/components/ToggleGroup/ToggleGroup.js +40 -40
- package/dist/styles-scss/global.scss +5 -1
- package/package.json +1 -1
package/dist/assets/Button.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_1n01a_1{flex-shrink:0;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--offset-small);--height: var(--control-height-large);height:var(--height);min-width:var(--control-height-large);padding:var(--offset-xxsmall) calc(var(--quant) * 5);outline:none;font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-xxsmall);line-height:1.1;letter-spacing:1px;text-transform:uppercase;text-decoration:none;cursor:pointer;border:solid 1.5px;border-radius:var(--border-radius-small);--color: var(--color-button-text);--border-color: var(--color-button-border);--background-color: var(--color-button-background);color:var(--color);border-color:var(--border-color);background-color:var(--background-color)}._root_1n01a_1{transition:background-color .25s ease,color .25s ease,outline-offset 0s,outline 0s}._root_1n01a_1._fullWidth_1n01a_33{width:100%;flex-shrink:1}._root_1n01a_1:disabled{cursor:not-allowed;opacity:.5}._root_1n01a_1:not(:disabled):hover{--border-color: var(--color-button-hover-border);--background-color: var(--color-button-hover-background)}._root_1n01a_1:not(:disabled):active{--border-color: var(--color-button-active-border);--background-color: var(--color-button-active-background);transform:translateY(1px)}._root_1n01a_1:not(:disabled):focus-visible:not(:active):not(:hover){box-shadow:0 0 0 2px var(--color-button-focus-outline)}._root_1n01a_1._primary_1n01a_53{-webkit-backdrop-filter:none;backdrop-filter:none;--color: var(--color-button-primary-text);--border-color: var(--color-button-primary-border);--background-color: var(--color-button-primary-background)}._root_1n01a_1._primary_1n01a_53:disabled{--color: var(--color-button-primary-disabled-text);--border-color: var(--color-button-primary-disabled-border);--background-color: var(--color-button-primary-disabled-background)}._root_1n01a_1._primary_1n01a_53:not(:disabled):hover{--color: var(--color-button-primary-hover-text);--border-color: var(--color-button-primary-hover-border);--background-color: var(--color-button-primary-hover-background)}._root_1n01a_1._primary_1n01a_53:not(:disabled):active{--color: var(--color-button-primary-active-text);--border-color: var(--color-button-primary-active-border);--background-color: var(--color-button-primary-active-background)}._root_1n01a_1._secondary_1n01a_74{-webkit-backdrop-filter:none;backdrop-filter:none;--color: var(--color-button-secondary-text);--border-color: var(--color-button-secondary-border);--background-color: var(--color-button-secondary-background)}._root_1n01a_1._secondary_1n01a_74:disabled{--color: var(--color-button-secondary-disabled-text);--border-color: var(--color-button-secondary-disabled-border);--background-color: var(--color-button-secondary-disabled-background)}._root_1n01a_1._secondary_1n01a_74:not(:disabled):hover{--color: var(--color-button-secondary-hover-text);--border-color: var(--color-button-secondary-hover-border);--background-color: var(--color-button-secondary-hover-background)}._root_1n01a_1._secondary_1n01a_74:not(:disabled):active{--color: var(--color-button-secondary-active-text);--border-color: var(--color-button-secondary-active-border);--background-color: var(--color-button-secondary-active-background)}._root_1n01a_1._on-light_1n01a_95{-webkit-backdrop-filter:none;backdrop-filter:none;--color: var(--color-button-onlight-text);--border-color: var(--color-button-onlight-border);--background-color: var(--color-button-onlight-background)}._root_1n01a_1._on-light_1n01a_95:disabled{--color: var(--color-button-onlight-disabled-text);--border-color: var(--color-button-onlight-disabled-border);--background-color: var(--color-button-onlight-disabled-background)}._root_1n01a_1._on-light_1n01a_95:not(:disabled):hover{--color: var(--color-button-onlight-hover-text);--border-color: var(--color-button-onlight-hover-border);--background-color: var(--color-button-onlight-hover-background)}._root_1n01a_1._on-light_1n01a_95:not(:disabled):active{--color: var(--color-button-onlight-active-text);--border-color: var(--color-button-onlight-active-border);--background-color: var(--color-button-onlight-active-background)}._root_1n01a_1._linked_1n01a_116{--height: calc(var(--quant) * 4);-webkit-backdrop-filter:none;backdrop-filter:none;text-transform:none;min-width:0;padding:0 var(--offset-small);--color: var(--color-button-linked-text);--border-color: var(--color-button-linked-border);--background-color: var(--color-button-linked-background)}._root_1n01a_1._linked_1n01a_116:disabled{--color: var(--color-button-linked-disabled-text);--border-color: var(--color-button-linked-disabled-border);--background-color: var(--color-button-linked-disabled-background)}._root_1n01a_1._linked_1n01a_116:not(:disabled):hover{--color: var(--color-button-linked-hover-text);--border-color: var(--color-button-linked-hover-border);--background-color: var(--color-button-linked-hover-background)}._root_1n01a_1._linked_1n01a_116:not(:disabled):active{--color: var(--color-button-linked-active-text);--border-color: var(--color-button-linked-active-border);--background-color: var(--color-button-linked-active-background)}._root_1n01a_1._quicklink_1n01a_141{-webkit-backdrop-filter:none;backdrop-filter:none;justify-content:space-between;--color: var(--color-button-quicklink-text);--border-color: var(--color-button-quicklink-border);--background-color: var(--color-button-quicklink-background)}._root_1n01a_1._quicklink_1n01a_141 ._icon_1n01a_148{position:relative;right:0}._root_1n01a_1._quicklink_1n01a_141 ._icon_1n01a_148{transition:right .25s ease,outline-offset 0s,outline 0s}._root_1n01a_1._quicklink_1n01a_141:disabled{--color: var(--color-button-quicklink-disabled-text);--border-color: var(--color-button-quicklink-disabled-border);--background-color: var(--color-button-quicklink-disabled-background)}._root_1n01a_1._quicklink_1n01a_141:not(:disabled):hover{--color: var(--color-button-quicklink-hover-text);--border-color: var(--color-button-quicklink-hover-border);--background-color: var(--color-button-quicklink-hover-background)}._root_1n01a_1._quicklink_1n01a_141:not(:disabled):hover ._icon_1n01a_148{right:calc(-1 * calc(var(--quant) * .5))}._root_1n01a_1._quicklink_1n01a_141:not(:disabled):active{--color: var(--color-button-quicklink-active-text);--border-color: var(--color-button-quicklink-active-border);--background-color: var(--color-button-quicklink-active-background)}._root_1n01a_1._icononly_1n01a_173{padding:0;width:var(--height);line-height:0}._root_1n01a_1 ._decorator_1n01a_178{position:absolute;top:2px;left:2px;display:flex;align-items:center;justify-content:center;width:0;height:0}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._rootUnset_5rtl4_1{all:unset}._root_5rtl4_1{width:100%;box-sizing:border-box;display:flex;align-items:center;gap:calc(var(--quant) * 1.5);padding:var(--offset-normal) calc(var(--offset-large) - var(--quant) * .75) var(--offset-normal) var(--offset-large);background-color:var(--bg-color);border-left:solid calc(var(--quant) * .75) var(--border-color);border-radius:var(--border-radius-small)}._root_5rtl4_1{transition:all .25s ease,outline-offset 0s,outline 0s}._root_5rtl4_1._interactive_5rtl4_19{cursor:pointer}._root_5rtl4_1._interactive_5rtl4_19:hover ._interactiveIcon_5rtl4_22{opacity:1;transform:translate(0)}._root_5rtl4_1._interactive_5rtl4_19:focus-visible,._root_5rtl4_1._interactive_5rtl4_19:focus-visible:hover{outline-offset:var(--info-panel-focus-border-size, initial);outline:var(--info-panel-focus-border-size, initial) solid var(--border-color)}._root_5rtl4_1._interactive_5rtl4_19:focus-visible ._interactiveIcon_5rtl4_22,._root_5rtl4_1._interactive_5rtl4_19:focus-visible:hover ._interactiveIcon_5rtl4_22{opacity:1;transform:translate(0)}._root_5rtl4_1._type-neutral_5rtl4_34{--bg-color: var(--color-info-panel-background);--border-color: var(--color-info-panel-border)}._root_5rtl4_1._type-neutral_5rtl4_34._interactive_5rtl4_19:hover{--bg-color: var(--color-info-panel-background-hover)}._root_5rtl4_1._type-error_5rtl4_41{--bg-color: var(--color-info-panel-error-background);--border-color: var(--color-info-panel-error-border)}._root_5rtl4_1._type-error_5rtl4_41._interactive_5rtl4_19:hover{--bg-color: var(--color-info-panel-error-background-hover)}._root_5rtl4_1._type-success_5rtl4_48{--bg-color: var(--color-info-panel-success-background);--border-color: var(--color-info-panel-success-border)}._root_5rtl4_1._type-success_5rtl4_48._interactive_5rtl4_19:hover{--bg-color: var(--color-info-panel-success-background-hover)}._root_5rtl4_1._type-warning_5rtl4_55{--bg-color: var(--color-info-panel-warning-background);--border-color: var(--color-info-panel-warning-border)}._root_5rtl4_1._type-warning_5rtl4_55._interactive_5rtl4_19:hover{--bg-color: var(--color-info-panel-warning-background-hover)}._root_5rtl4_1._size-small_5rtl4_62{min-height:var(--control-height-small);padding:var(--offset-small) var(--offset-small)}._root_5rtl4_1._size-large_5rtl4_66{gap:var(--offset-normal);min-height:var(--control-height-large)}._root_5rtl4_1 ._icon_5rtl4_70{flex-shrink:0;color:var(--border-color)}._root_5rtl4_1 ._content_5rtl4_74{flex-grow:1}._root_5rtl4_1 ._interactiveIcon_5rtl4_22{opacity:0;transform:translate(calc(-1 * var(--quant)))}._root_5rtl4_1 ._interactiveIcon_5rtl4_22{transition:all .25s ease,outline-offset 0s,outline 0s}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_1500i_1{display:inline-flex;position:relative;height:var(--control-height-normal)}._root_1500i_1._disabled_1500i_6{opacity:.5;pointer-events:none}._root_1500i_1._descripted_1500i_10{margin-bottom:var(--offset-normal)}._root_1500i_1._multiline_1500i_13{display:flex;height:auto}._root_1500i_1._multiline_1500i_13 ._options_1500i_17{flex-wrap:wrap}._root_1500i_1._multiline_1500i_13 ._options_1500i_17 ._option_1500i_17{flex-grow:1;height:var(--control-height-normal)}._root_1500i_1 ._description_1500i_24{position:absolute;bottom:0;padding-top:var(--offset-small);transform:translateY(100%);color:var(--color-toggle-description-text);font-size:var(--font-size-small);white-space:nowrap}._root_1500i_1 ._options_1500i_17{display:flex;gap:1px;height:100%;overflow:hidden;background-color:var(--color-toggle-background);box-shadow:0 0 0 2px var(--color-toggle-border) inset;border-radius:var(--border-radius-small)}._root_1500i_1 ._option_1500i_17{position:relative;display:flex;align-items:center;justify-content:center;gap:var(--offset-small);height:100%;padding:0 var(--offset-normal);font-weight:var(--font-weight-normal);cursor:pointer}._root_1500i_1 ._option_1500i_17{transition:all .25s ease,outline-offset 0s,outline 0s}._root_1500i_1 ._option_1500i_17:after{content:"";display:block;position:absolute;right:-1px;top:2px;bottom:2px;background-color:var(--color-toggle-border);width:1px}._root_1500i_1 ._option_1500i_17:hover{background-color:var(--color-toggle-hover-background)}._root_1500i_1 ._option_1500i_17._active_1500i_69{color:var(--color-toggle-active-text);background-color:var(--color-toggle-active-background)}
|