@salt-ds/lab 1.0.0-alpha.102 → 1.0.0-alpha.103
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/CHANGELOG.md +21 -0
- package/css/salt-lab.css +343 -162
- package/dist-cjs/app-header/AppHeader.css.js +1 -1
- package/dist-cjs/button-bar/ButtonBar.css.js +1 -1
- package/dist-cjs/cascading-menu/CascadingMenuItem.css.js +1 -1
- package/dist-cjs/color-chooser/ColorChooser.css.js +1 -1
- package/dist-cjs/color-chooser/ColorPicker.css.js +1 -1
- package/dist-cjs/color-chooser/HexInput.css.js +1 -1
- package/dist-cjs/color-chooser/RGBAInput.css.js +1 -1
- package/dist-cjs/color-chooser/Swatch.css.js +1 -1
- package/dist-cjs/color-chooser/Swatches.css.js +1 -1
- package/dist-cjs/contact-details/ContactDetails.css.js +1 -1
- package/dist-cjs/content-status/ContentStatus.css.js +1 -1
- package/dist-cjs/dropdown/DropdownButton.css.js +1 -1
- package/dist-cjs/form-field-legacy/FormFieldLegacy.css.js +1 -1
- package/dist-cjs/form-field-legacy/FormHelperText.css.js +1 -1
- package/dist-cjs/index.js +4 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/input-legacy/InputLegacy.css.js +1 -1
- package/dist-cjs/input-legacy/StaticInputAdornment.css.js +1 -1
- package/dist-cjs/layer-layout/LayerLayout.css.js +1 -1
- package/dist-cjs/link-button/LinkButton.css.js +6 -0
- package/dist-cjs/link-button/LinkButton.css.js.map +1 -0
- package/dist-cjs/link-button/LinkButton.js +78 -0
- package/dist-cjs/link-button/LinkButton.js.map +1 -0
- package/dist-cjs/list/List.css.js +1 -1
- package/dist-cjs/list/ListItem.css.js +1 -1
- package/dist-cjs/list-deprecated/ListItem.css.js +1 -1
- package/dist-cjs/list-next/ListItemNext.css.js +1 -1
- package/dist-cjs/logo/LogoSeparator.css.js +1 -1
- package/dist-cjs/menu-button/MenuButtonTrigger.css.js +1 -1
- package/dist-cjs/metric/MetricContent.css.js +1 -1
- package/dist-cjs/metric/MetricHeader.css.js +1 -1
- package/dist-cjs/on-solid-button/OnSolidButton.css.js +6 -0
- package/dist-cjs/on-solid-button/OnSolidButton.css.js.map +1 -0
- package/dist-cjs/on-solid-button/OnSolidButton.js +62 -0
- package/dist-cjs/on-solid-button/OnSolidButton.js.map +1 -0
- package/dist-cjs/query-input/QueryInput.css.js +1 -1
- package/dist-cjs/tabs/Tab.css.js +1 -1
- package/dist-cjs/tabs/Tabstrip.css.js +1 -1
- package/dist-cjs/tabs/ThemeTabstrip.css.js +1 -1
- package/dist-cjs/tokenized-input/TokenizedInput.css.js +1 -1
- package/dist-cjs/tokenized-input-next/TokenizedInputNext.css.js +1 -1
- package/dist-cjs/tokenized-input-next/internal/InputPill.css.js +1 -1
- package/dist-cjs/toolbar/Toolbar.css.js +1 -1
- package/dist-cjs/toolbar/Tooltray.css.js +1 -1
- package/dist-cjs/toolbar/overflow-panel/OverflowPanel.css.js +1 -1
- package/dist-cjs/toolbar/overflow-panel/OverflowSeparator.css.js +1 -1
- package/dist-es/app-header/AppHeader.css.js +1 -1
- package/dist-es/button-bar/ButtonBar.css.js +1 -1
- package/dist-es/cascading-menu/CascadingMenuItem.css.js +1 -1
- package/dist-es/color-chooser/ColorChooser.css.js +1 -1
- package/dist-es/color-chooser/ColorPicker.css.js +1 -1
- package/dist-es/color-chooser/HexInput.css.js +1 -1
- package/dist-es/color-chooser/RGBAInput.css.js +1 -1
- package/dist-es/color-chooser/Swatch.css.js +1 -1
- package/dist-es/color-chooser/Swatches.css.js +1 -1
- package/dist-es/contact-details/ContactDetails.css.js +1 -1
- package/dist-es/content-status/ContentStatus.css.js +1 -1
- package/dist-es/dropdown/DropdownButton.css.js +1 -1
- package/dist-es/form-field-legacy/FormFieldLegacy.css.js +1 -1
- package/dist-es/form-field-legacy/FormHelperText.css.js +1 -1
- package/dist-es/index.js +2 -0
- package/dist-es/index.js.map +1 -1
- package/dist-es/input-legacy/InputLegacy.css.js +1 -1
- package/dist-es/input-legacy/StaticInputAdornment.css.js +1 -1
- package/dist-es/layer-layout/LayerLayout.css.js +1 -1
- package/dist-es/link-button/LinkButton.css.js +4 -0
- package/dist-es/link-button/LinkButton.css.js.map +1 -0
- package/dist-es/link-button/LinkButton.js +76 -0
- package/dist-es/link-button/LinkButton.js.map +1 -0
- package/dist-es/list/List.css.js +1 -1
- package/dist-es/list/ListItem.css.js +1 -1
- package/dist-es/list-deprecated/ListItem.css.js +1 -1
- package/dist-es/list-next/ListItemNext.css.js +1 -1
- package/dist-es/logo/LogoSeparator.css.js +1 -1
- package/dist-es/menu-button/MenuButtonTrigger.css.js +1 -1
- package/dist-es/metric/MetricContent.css.js +1 -1
- package/dist-es/metric/MetricHeader.css.js +1 -1
- package/dist-es/on-solid-button/OnSolidButton.css.js +4 -0
- package/dist-es/on-solid-button/OnSolidButton.css.js.map +1 -0
- package/dist-es/on-solid-button/OnSolidButton.js +60 -0
- package/dist-es/on-solid-button/OnSolidButton.js.map +1 -0
- package/dist-es/query-input/QueryInput.css.js +1 -1
- package/dist-es/tabs/Tab.css.js +1 -1
- package/dist-es/tabs/Tabstrip.css.js +1 -1
- package/dist-es/tabs/ThemeTabstrip.css.js +1 -1
- package/dist-es/tokenized-input/TokenizedInput.css.js +1 -1
- package/dist-es/tokenized-input-next/TokenizedInputNext.css.js +1 -1
- package/dist-es/tokenized-input-next/internal/InputPill.css.js +1 -1
- package/dist-es/toolbar/Toolbar.css.js +1 -1
- package/dist-es/toolbar/Tooltray.css.js +1 -1
- package/dist-es/toolbar/overflow-panel/OverflowPanel.css.js +1 -1
- package/dist-es/toolbar/overflow-panel/OverflowSeparator.css.js +1 -1
- package/dist-types/index.d.ts +2 -0
- package/dist-types/link-button/LinkButton.d.ts +26 -0
- package/dist-types/link-button/index.d.ts +1 -0
- package/dist-types/on-solid-button/OnSolidButton.d.ts +12 -0
- package/dist-types/on-solid-button/index.d.ts +1 -0
- package/package.json +2 -2
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = "/* Component class applied to the root element */\n.saltTabstrip {\n --tabs-tabstrip-height: var(--saltTabs-tabstrip-height, var(--salt-size-
|
|
1
|
+
var css_248z = "/* Component class applied to the root element */\n.saltTabstrip {\n --tabs-tabstrip-height: var(--saltTabs-tabstrip-height, calc(var(--salt-size-base) + var(--salt-spacing-100)));\n --tabs-tabstrip-dragging-display: none;\n --tabs-tabstrip-display: inline-flex;\n --tabs-tabstrip-background: transparent;\n\n align-items: flex-start;\n align-self: var(--saltTabs-tabstrip-alignSelf, stretch);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n position: relative;\n overflow: hidden;\n display: flex;\n min-width: 28px;\n width: 100%;\n}\n\n/* Tabstrip orientation is horizontal */\n.saltTabstrip-horizontal {\n --saltTabs-activationIndicator-height: 1px;\n --saltTabs-activationIndicator-thumb-inset: -1px 0 0 0;\n\n --tabs-activationIndicator-borderStyle: none none solid none;\n --tabs-activationIndicator-inset: auto 0px 0px 0px;\n --tabs-activationIndicator-transitionProperty: left;\n --tabs-activationIndicator-thumb-height: 2px;\n}\n\n/* Tabstrip orientation is vertical */\n.saltTabstrip-vertical {\n --saltTabs-activationIndicator-thumb-inset: 0 0 0 -1px;\n\n --tabs-activationIndicator-transition: top 0.3s ease;\n --tabs-activationIndicator-borderStyle: none solid none none;\n --tabs-activationIndicator-inset: 0px 0px 0px auto;\n --tabs-activationIndicator-transitionProperty: top;\n --tabs-activationIndicator-width: 1px;\n --tabs-activationIndicator-thumb-width: 2px;\n\n align-self: flex-start;\n display: inline-flex;\n}\n\n.saltTabstrip-draggingTab {\n --saltTabs-activationIndicator-transition: none;\n}\n\n.saltTabstrip-draggingTab .saltTab {\n pointer-events: none;\n}\n\n/* Tabstrip orientation is horizontal */\n.saltTabstrip-horizontal {\n height: var(--tabs-tabstrip-height);\n}\n\n.saltTabstrip-addButton,\n.saltDropdownBase.saltTabstrip-overflowMenu {\n margin-left: var(--salt-spacing-100);\n}\n\n.saltTabstrip-overflowMenu.saltDropdownBase {\n --saltIcon-margin: 2px 0 0 0px;\n}\n\n.saltTabstrip-overflowMenu-open {\n --saltButton-background: var(--salt-actionable-subtle-background-active);\n --saltButton-text-color: var(--salt-actionable-subtle-foreground-active);\n}\n\n.saltTabstrip-overflowMenu-open .saltButton {\n --saltIcon-color: var(--salt-actionable-subtle-foreground-active);\n}\n\n.saltTabstrip-inner {\n width: 100%;\n align-items: center;\n display: flex;\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 1;\n flex-wrap: wrap;\n justify-content: flex-start;\n line-height: var(--tabs-tabstrip-height);\n}\n\n.saltTabstrip-vertical .saltTabstrip-inner {\n flex-direction: column;\n height: auto;\n}\n\n.saltTabstrip-centered .saltTabstrip-inner {\n justify-content: center;\n}\n\n/* Styling applied to Draggable wrapper when used to drag a Tab */\n.saltDraggable[class*=\"tabstrip\"] {\n --tabs-tabstrip-display: flex;\n --tabs-tabstrip-height: var(--saltTabs-tabstrip-height, calc(var(--salt-size-base) + var(--salt-spacing-100)));\n --tabs-tabstrip-dragging-display: block;\n\n --tabs-tab-background: var(--salt-overlayable-background-hover);\n --tabs-tab-before-content: \"\";\n --tabs-tab-before-background: var(--salt-navigable-indicator-hover);\n --tabs-tab-before-height: var(--tabs-activationIndicator-thumb-height);\n --tabs-tab-before-inset: var(--tabs-activationIndicator-inset);\n --tabs-tab-before-width: var(--tabs-activationIndicator-thumb-width);\n --tabs-tab-cursor: var(--salt-cursor-grab-active);\n --tabs-tab-position: static;\n\n font-size: 12px;\n}\n\n.saltDraggable-tabstrip-horizontal {\n --tabs-tabstrip-height: var(--saltTabs-tabstrip-height, calc(var(--salt-size-base) + var(--salt-spacing-100)));\n --tabs-activationIndicator-thumb-height: 2px;\n --tabs-activationIndicator-inset: auto 0px 0px 0px;\n\n line-height: var(--tabs-tabstrip-height);\n}\n.saltDraggable-tabstrip-vertical {\n --tabs-activationIndicator-inset: 0px 0px 0px auto;\n --tabs-activationIndicator-thumb-width: 2px;\n}\n\n.saltDraggable[class*=\"tabstrip\"] .saltTab[aria-selected=\"true\"]:before {\n --tabs-tab-before-background: var(--salt-navigable-accent-indicator-active);\n}\n\n.saltDraggable[class*=\"tabstrip\"] .saltTab {\n box-shadow: var(--salt-overlayable-shadow-drag);\n}\n\n[data-overflowed] {\n order: 99;\n visibility: hidden;\n}\n\n.saltTabstrip-overflowMenu-dropTarget:after {\n background: var(--salt-selectable-background-selected);\n content: \"\";\n position: absolute;\n height: 2px;\n left: 0;\n right: 0;\n bottom: 0;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=Tabstrip.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".salt-density-touch {\n /* Component specific, what semantic concept would cover these */\n --toolbar-depth: calc(
|
|
1
|
+
var css_248z = ".salt-density-touch {\n /* Component specific, what semantic concept would cover these */\n --toolbar-depth: calc(4px * 13);\n}\n\n.salt-density-low {\n /* Component specific, what semantic concept would cover these */\n --toolbar-depth: calc(4px * 11);\n}\n\n.salt-density-medium {\n /* Component specific, what semantic concept would cover these */\n --toolbar-depth: calc(4px * 9);\n}\n\n.salt-density-high {\n /* Component specific, what semantic concept would cover these */\n --toolbar-depth: calc(4px * 7);\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=ThemeTabstrip.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = "/* Styles applied to root component (TokenizedInput) */\n.salt-density-medium {\n --tokenizedInput-gutter-size:
|
|
1
|
+
var css_248z = "/* Styles applied to root component (TokenizedInput) */\n.salt-density-medium {\n --tokenizedInput-gutter-size: 4px;\n --tokenizedInput-pill-group-y-padding: calc(var(--salt-spacing-100) / 2);\n --tokenizedInput-last-pill-margin: var(--salt-spacing-100);\n}\n.salt-density-touch {\n --tokenizedInput-gutter-size: 4px;\n --tokenizedInput-pill-group-y-padding: calc(var(--salt-spacing-100) / 2 + 2px);\n --tokenizedInput-last-pill-margin: calc(var(--salt-spacing-100) / 2);\n}\n\n.salt-density-low {\n --tokenizedInput-gutter-size: 4px;\n --tokenizedInput-pill-group-y-padding: calc(var(--salt-spacing-100) / 2 + 1px);\n --tokenizedInput-last-pill-margin: calc(var(--salt-spacing-100) / 2);\n}\n\n.salt-density-high {\n --tokenizedInput-gutter-size: calc(4px - 1px);\n --tokenizedInput-pill-group-y-padding: calc(var(--salt-spacing-100) / 2 + 1px);\n --tokenizedInput-last-pill-margin: var(--salt-spacing-100);\n}\n\n.saltTokenizedInput {\n --tokenizedInput-spacing: var(--salt-spacing-100);\n --tokenizedInput-height: var(--salt-size-base);\n}\n\n.saltTokenizedInput {\n display: inline-flex;\n justify-content: space-between;\n min-width: 8em; /* same min-width as Input component */\n width: 100%;\n}\n\n/* Styles applied to root component on hover state */\n.saltTokenizedInput:hover {\n cursor: var(--salt-cursor-text);\n}\n\n/* Styles applied to root component on hover state if `disabled={true}` */\n.saltTokenizedInput.saltTokenizedInput-disabled:hover {\n cursor: var(--salt-cursor-disabled);\n}\n\n/* Styles applied to container of pills */\n.saltTokenizedInput-pillGroup {\n align-content: flex-start;\n display: flex;\n flex: 1;\n flex-wrap: wrap;\n min-height: var(--tokenizedInput-height);\n padding: var(--tokenizedInput-pill-group-y-padding) var(--tokenizedInput-spacing);\n box-sizing: border-box;\n}\n\n/* Styles applied to root component if `disabled={true}` */\n.saltTokenizedInput-disabled {\n cursor: var(--salt-cursor-disabled);\n opacity: var(--saltTokenizedInput-disabled-opacity, 0.4);\n}\n\n/* Styles applied to root component if `focused={true}` */\n.saltTokenizedInput-focused {\n outline: var(--saltTokenizedInput-focused-outline, var(--salt-focused-outline));\n}\n\n/* Styles applied to root component if `expanded={true}` */\n.saltTokenizedInput-expanded {\n height: auto;\n\n /* Pill CSS API */\n --saltPill-maxWidth: calc(100px - var(--salt-spacing-100));\n}\n\n/* Styles applied to Input and Clear Button if `expanded={false}` */\n.saltTokenizedInput-hidden,\n.saltTokenizedInput-input.saltTokenizedInput-hidden,\n.saltButton.saltTokenizedInput-hidden {\n display: none;\n}\n\n/**\n Styles applied to inner Input component\n Used to be .inputRoot\n**/\n.saltInputLegacy.saltTokenizedInput-input {\n align-items: flex-start;\n cursor: var(--salt-cursor-text);\n flex-grow: 1;\n padding: 0;\n outline: none;\n width: auto;\n height: auto;\n min-width: 0;\n min-height: 0;\n}\n\n/* Styles applied to Clear Button */\n.saltTokenizedInput-clearButton {\n flex: none;\n align-self: flex-end;\n}\n\n/* Styles applied to Expand Button */\n.saltTokenizedInput-expandButton.saltButton {\n padding: 0 calc(var(--tokenizedInput-spacing) / 4);\n --saltButton-height: calc(var(--tokenizedInput-height) - var(--tokenizedInput-spacing) * 1.5);\n --saltButton-margin: calc(var(--tokenizedInput-gutter-size) / 2) 0;\n}\n\n/* Styles applied to root component and pill container if `expanded={true}` */\n.saltTokenizedInput-expanded,\n.saltTokenizedInput-expanded .saltTokenizedInput-pillGroup {\n height: auto;\n}\n\n/* TODO: Adjust specificity of .InputPill depending on styling solution.\n This is an example of internal sub-component naming convension. */\n.saltTokenizedInput .saltInputPill,\n.saltInputLegacy.saltTokenizedInput-input,\n.saltTokenizedInput-inputField.saltTokenizedInput-inputMultiline .saltTokenizedInput-input {\n margin: calc(var(--tokenizedInput-gutter-size) / 2) 0;\n height: calc(var(--tokenizedInput-height) - var(--tokenizedInput-spacing) * 1.5);\n}\n\n/* Styles applied to inner Pills */\n.saltTokenizedInput .saltInputPill {\n min-width: 0;\n margin-right: var(--tokenizedInput-gutter-size);\n --saltPill-maxWidth: 100px;\n}\n\n.saltTokenizedInput .saltInputPill > * {\n min-width: 0;\n}\n\n/* Styles applied to a Pill if `expanded={false} && index >= firstHiddenIndex` */\n.saltTokenizedInput .saltInputPill.saltInputPill-hidden {\n display: none;\n}\n\n/* Styles applied to the last visible Pill when all visible */\n.saltTokenizedInput .saltInputPill-pillLastVisible {\n margin-right: var(--saltTokenizedInput-pill-last-visible-marginRight, var(--tokenizedInput-last-pill-margin));\n}\n\n/* Styles applied to a Pill when active */\n.saltTokenizedInput .saltInputPill-pillActive {\n background: var(--saltTokenizedInput-pill-background-active, var(--salt-selectable-background-hover));\n}\n\n/* Styles applied to a Pills delete icon */\n.saltTokenizedInput .saltInputPill-pillActive .saltPill-deleteIcon {\n color: var(--saltTokenizedInput-pill-delete-icon-color, var(--salt-actionable-accented-bold-foreground-hover));\n}\n\n/* Styles applied to a Pills delete button */\n.saltTokenizedInput .saltInputPill-pillActive .saltPill-deleteButton {\n color: var(--saltTokenizedInput-pill-delete-button-color-active, var(--salt-actionable-accented-bold-foreground-hover));\n background: var(--saltTokenizedInput-pill-delete-button-background-active, var(--salt-actionable-accented-bold-background-hover));\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=TokenizedInput.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = "/* Style applied to the root element */\n.saltTokenizedInputNext-container {\n width: 100%;\n}\n.saltTokenizedInputNext {\n --tokenizedInput-borderColor: var(--salt-editable-borderColor);\n --tokenizedInput-borderStyle: var(--salt-borderStyle-solid);\n --tokenizedInput-outlineColor: var(--salt-focused-outlineColor);\n --tokenizedInput-border: none;\n --tokenizedInput-activationIndicator-borderWidth: var(--salt-size-fixed-100);\n\n align-items: center;\n background: var(--tokenizedInput-background);\n border: var(--tokenizedInput-border);\n color: var(--salt-content-primary-foreground);\n display: inline-flex;\n flex-wrap: wrap;\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n height: 100%;\n line-height: var(--salt-text-lineHeight);\n min-height: var(--salt-size-base);\n padding: 0 var(--salt-spacing-100);\n position: relative;\n width: 100%;\n overflow: hidden;\n box-sizing: border-box;\n}\n\n/* Style applied on hover */\n.saltTokenizedInputNext:hover {\n --tokenizedInput-borderStyle: var(--salt-borderStyle-solid);\n --tokenizedInput-borderColor: var(--salt-editable-borderColor-hover);\n\n background: var(--tokenizedInput-background-hover);\n cursor: var(--salt-cursor-hover);\n}\n\n/* Style applied when active */\n.saltTokenizedInputNext:active {\n --tokenizedInput-borderColor: var(--salt-editable-borderColor-active);\n --tokenizedInput-borderStyle: var(--salt-borderStyle-solid);\n --tokenizedInput-activationIndicator-borderWidth: var(--salt-size-fixed-200);\n\n background: var(--tokenizedInput-background-active);\n cursor: var(--salt-cursor-active);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltTokenizedInputNext-primary {\n --tokenizedInput-background: var(--salt-editable-primary-background);\n --tokenizedInput-background-active: var(--salt-editable-primary-background
|
|
1
|
+
var css_248z = "/* Style applied to the root element */\n.saltTokenizedInputNext-container {\n width: 100%;\n}\n.saltTokenizedInputNext {\n --tokenizedInput-borderColor: var(--salt-editable-borderColor);\n --tokenizedInput-borderStyle: var(--salt-borderStyle-solid);\n --tokenizedInput-outlineColor: var(--salt-focused-outlineColor);\n --tokenizedInput-border: none;\n --tokenizedInput-activationIndicator-borderWidth: var(--salt-size-fixed-100);\n\n align-items: center;\n background: var(--tokenizedInput-background);\n border: var(--tokenizedInput-border);\n color: var(--salt-content-primary-foreground);\n display: inline-flex;\n flex-wrap: wrap;\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n height: 100%;\n line-height: var(--salt-text-lineHeight);\n min-height: var(--salt-size-base);\n padding: 0 var(--salt-spacing-100);\n position: relative;\n width: 100%;\n overflow: hidden;\n box-sizing: border-box;\n}\n\n/* Style applied on hover */\n.saltTokenizedInputNext:hover {\n --tokenizedInput-borderStyle: var(--salt-borderStyle-solid);\n --tokenizedInput-borderColor: var(--salt-editable-borderColor-hover);\n\n background: var(--tokenizedInput-background-hover);\n cursor: var(--salt-cursor-hover);\n}\n\n/* Style applied when active */\n.saltTokenizedInputNext:active {\n --tokenizedInput-borderColor: var(--salt-editable-borderColor-active);\n --tokenizedInput-borderStyle: var(--salt-borderStyle-solid);\n --tokenizedInput-activationIndicator-borderWidth: var(--salt-size-fixed-200);\n\n background: var(--tokenizedInput-background-active);\n cursor: var(--salt-cursor-active);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltTokenizedInputNext-primary {\n --tokenizedInput-background: var(--salt-editable-primary-background);\n --tokenizedInput-background-active: var(--salt-editable-primary-background);\n --tokenizedInput-background-hover: var(--salt-editable-primary-background);\n --tokenizedInput-background-disabled: var(--salt-editable-primary-background-disabled);\n --tokenizedInput-background-readonly: var(--salt-editable-background-readonly);\n}\n\n/* Class applied if `variant=\"secondary\"` */\n.saltTokenizedInputNext-secondary {\n --tokenizedInput-background: var(--salt-editable-secondary-background);\n --tokenizedInput-background-active: var(--salt-editable-secondary-background);\n --tokenizedInput-background-hover: var(--salt-editable-secondary-background);\n --tokenizedInput-background-disabled: var(--salt-editable-secondary-background-disabled);\n --tokenizedInput-background-readonly: var(--salt-editable-background-readonly);\n}\n\n/* Style applied to input if `validationState=\"error\"` */\n.saltTokenizedInputNext-error,\n.saltTokenizedInputNext-error:hover {\n --tokenizedInput-background: var(--salt-status-error-background);\n --tokenizedInput-background-active: var(--salt-status-error-background);\n --tokenizedInput-background-hover: var(--salt-status-error-background);\n --tokenizedInput-borderColor: var(--salt-status-error-borderColor);\n --tokenizedInput-outlineColor: var(--salt-status-error-borderColor);\n}\n\n/* Style applied to input if `validationState=\"warning\"` */\n.saltTokenizedInputNext-warning,\n.saltTokenizedInputNext-warning:hover {\n --tokenizedInput-background: var(--salt-status-warning-background);\n --tokenizedInput-background-active: var(--salt-status-warning-background);\n --tokenizedInput-background-hover: var(--salt-status-warning-background);\n --tokenizedInput-borderColor: var(--salt-status-warning-borderColor);\n --tokenizedInput-outlineColor: var(--salt-status-warning-borderColor);\n}\n\n/* Style applied to input if `validationState=\"success\"` */\n.saltTokenizedInputNext-success,\n.saltTokenizedInputNext-success:hover {\n --tokenizedInput-background: var(--salt-status-success-background);\n --tokenizedInput-background-active: var(--salt-status-success-background);\n --tokenizedInput-background-hover: var(--salt-status-success-background);\n --tokenizedInput-borderColor: var(--salt-status-success-borderColor);\n --tokenizedInput-outlineColor: var(--salt-status-success-borderColor);\n}\n\n/* Style applied to inner textarea element */\n.saltTokenizedInputNext-textarea {\n background: none;\n border: none;\n box-sizing: content-box;\n color: inherit;\n cursor: inherit;\n display: inline-flex;\n flex-basis: 0;\n height: var(--salt-text-lineHeight);\n font: inherit;\n letter-spacing: 0;\n overflow: hidden;\n resize: none;\n padding: 0;\n min-width: 1px; /* requires a min width to be visible */\n}\n.saltTokenizedInputNext-expanded .saltTokenizedInputNext-textarea {\n flex-grow: 1;\n min-width: 4em; /* on expanded, use the same min-width as input*/\n}\n\n/* Style applied to placeholder */\n.saltTokenizedInputNext-textarea::placeholder {\n font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Reset in the class */\n.saltTokenizedInputNext-textarea:focus {\n outline: none;\n}\n\n/* Styling when focused */\n.saltTokenizedInputNext-focused {\n --tokenizedInput-borderColor: var(--tokenizedInput-outlineColor);\n --tokenizedInput-activationIndicator-borderWidth: var(--salt-size-fixed-200);\n\n outline: var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--tokenizedInput-outlineColor);\n}\n\n/* Style applied if `readOnly={true}` */\n.saltTokenizedInputNext-readOnly,\n.saltTokenizedInputNext-readOnly:active,\n.saltTokenizedInputNext-readOnly:hover {\n --tokenizedInput-borderColor: var(--salt-editable-borderColor-readonly);\n --tokenizedInput-borderStyle: var(--salt-borderStyle-solid);\n --tokenizedInput-activationIndicator-borderWidth: var(--salt-size-fixed-100);\n\n background: var(--tokenizedInput-background-readonly);\n cursor: var(--salt-cursor-readonly);\n}\n\n/* Style applied to selected text if `disabled={true}` */\n.saltTokenizedInputNext-disabled .saltTokenizedInputNext-textarea::selection {\n background: none;\n}\n\n/* Style applied when `disabled={true}` */\n.saltTokenizedInputNext-disabled,\n.saltTokenizedInputNext-disabled:hover,\n.saltTokenizedInputNext-disabled:active {\n --tokenizedInput-borderColor: var(--salt-editable-borderColor-disabled);\n --tokenizedInput-borderStyle: var(--salt-borderStyle-solid);\n --tokenizedInput-activationIndicator-borderWidth: var(--salt-size-fixed-100);\n\n background: var(--tokenizedInput-background-disabled);\n cursor: var(--salt-cursor-disabled);\n color: var(--salt-content-primary-foreground-disabled);\n}\n\n/* Style for activation indicator */\n.saltTokenizedInputNext-activationIndicator {\n left: 0;\n bottom: 0;\n width: 100%;\n position: absolute;\n border-bottom: var(--tokenizedInput-activationIndicator-borderWidth) var(--tokenizedInput-borderStyle) var(--tokenizedInput-borderColor);\n}\n\n/* Style applied if `bordered={true}` */\n.saltTokenizedInputNext.saltTokenizedInputNext-bordered {\n --tokenizedInput-border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--tokenizedInput-borderColor);\n --tokenizedInput-activationIndicator-borderWidth: 0;\n}\n\n/* Style applied if active or focused when `bordered={true}` */\n.saltTokenizedInputNext-bordered:active,\n.saltTokenizedInputNext-bordered.saltTokenizedInputNext-focused {\n --tokenizedInput-activationIndicator-borderWidth: var(--salt-size-fixed-200);\n}\n\n/* Styling when focused if `disabled={true}` or `readOnly={true}` when `bordered={true}` */\n.saltTokenizedInputNext-bordered.saltTokenizedInputNext-readOnly:hover,\n.saltTokenizedInputNext-bordered.saltTokenizedInputNext-disabled:hover {\n --tokenizedInput-activationIndicator-borderWidth: 0;\n}\n\n.saltTokenizedInputNext-statusAdornment {\n margin-left: auto;\n margin-right: var(--salt-spacing-100);\n}\n\n.saltTokenizedInputNext-endAdornmentContainer {\n margin-left: auto;\n align-self: self-end;\n display: inline-flex;\n min-height: var(--salt-size-base);\n}\n\n.saltTokenizedInputNext-statusAdornment ~ .saltTokenizedInputNext-endAdornmentContainer {\n margin-left: 0;\n}\n\n.saltTokenizedInputNext .saltButton {\n --saltButton-padding: 0;\n --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n --saltButton-width: calc(var(--salt-size-base) - var(--salt-spacing-100));\n}\n\n.saltTokenizedInputNext .saltButton.saltTokenizedInputNext-endAdornment {\n --saltButton-margin: auto calc(var(--salt-spacing-50) * -1) auto auto;\n}\n.saltTokenizedInputNext-hidden {\n display: none;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=TokenizedInputNext.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltInputPill {\n max-width: 100%;\n margin: var(--salt-spacing-25) var(--salt-spacing-50);\n margin-left: 0;\n}\n.saltInputPill-expanded {\n max-width: calc(100% - (var(--salt-size-base) - var(--salt-spacing-100)));\n}\n.saltInputPill-label {\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.saltInputPill.saltInputPill-hidden {\n display: none;\n}\n\n.saltInputPill.saltInputPill:hover {\n background: var(--salt-selectable-background-hover);\n}\n\n.saltInputPill.saltInputPill-pillHighlighted {\n --saltPill-background: var(--salt-selectable-background-hover);\n}\n\n.saltInputPill.saltInputPill:active {\n background: var(--salt-actionable-
|
|
1
|
+
var css_248z = ".saltInputPill {\n max-width: 100%;\n margin: var(--salt-spacing-25) var(--salt-spacing-50);\n margin-left: 0;\n}\n.saltInputPill-expanded {\n max-width: calc(100% - (var(--salt-size-base) - var(--salt-spacing-100)));\n}\n.saltInputPill-label {\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.saltInputPill.saltInputPill-hidden {\n display: none;\n}\n\n.saltInputPill.saltInputPill:hover {\n background: var(--salt-selectable-background-hover);\n}\n\n.saltInputPill.saltInputPill-pillHighlighted {\n --saltPill-background: var(--salt-selectable-background-hover);\n}\n\n.saltInputPill.saltInputPill:active {\n background: var(--salt-actionable-bold-background-active);\n --saltPill-color: var(--salt-actionable-bold-foreground-active);\n --saltIcon-color: var(--salt-actionable-bold-foreground-active);\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=InputPill.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltToolbar {\n --toolbar-background: var(--salt-container-secondary-background);\n --toolbar-fontSize: var(--salt-text-fontSize);\n /* --saltFormFieldLegacy-activationIndicator-size: 0; */\n}\n\n.saltToolbar {\n --toolbar-size: calc(var(--salt-size-base) + var(--salt-
|
|
1
|
+
var css_248z = ".saltToolbar {\n --toolbar-background: var(--salt-container-secondary-background);\n --toolbar-fontSize: var(--salt-text-fontSize);\n /* --saltFormFieldLegacy-activationIndicator-size: 0; */\n}\n\n.saltToolbar {\n --toolbar-size: calc(var(--salt-size-base) + var(--salt-spacing-100) * 2);\n\n background: var(--saltToolbar-background, var(--toolbar-background));\n font-size: var(--toolbar-fontSize);\n justify-content: flex-start;\n overflow: hidden;\n position: relative;\n\n font-family: var(--salt-text-fontFamily);\n font-weight: var(--salt-text-fontWeight);\n line-height: var(--salt-text-lineHeight);\n}\n\n/* .saltToolbarField:not([data-overflow-indicator]) > .saltButton {\n --saltButton-fontSize: 0;\n --saltButton-letterSpacing: 0;\n} */\n\n.saltToolbar > .Responsive-inner {\n align-items: center;\n flex: 1;\n flex-wrap: wrap;\n justify-content: inherit;\n margin: 0 !important;\n overflow: hidden;\n padding: 0 !important;\n}\n\n.saltToolbar[aria-orientation=\"horizontal\"] {\n display: flex;\n height: var(--saltToolbar-height, var(--toolbar-size));\n line-height: normal;\n min-width: 0;\n white-space: nowrap;\n width: var(--saltToolbar-width, 100%);\n}\n\n.saltToolbar[aria-orientation=\"horizontal\"] > .Responsive-inner {\n display: flex;\n flex-direction: row;\n width: 100%;\n}\n\n.saltToolbar[aria-orientation=\"horizontal\"] > .Responsive-inner > :not(.saltTooltray) {\n margin-right: var(--salt-spacing-100);\n align-self: center;\n}\n\n.saltToolbar[aria-orientation=\"horizontal\"] > .Responsive-inner > .saltTooltray > .Responsive-inner > * {\n margin-top: var(--salt-spacing-100);\n /* margin-right: var(--salt-spacing-100); */\n}\n\n.saltToolbar[aria-orientation=\"horizontal\"] > .Responsive-inner > .saltTooltray {\n margin-top: 0;\n}\n\n.saltToolbar[aria-orientation=\"horizontal\"] > .Responsive-inner > [data-pad-end=\"true\"] {\n margin-right: auto;\n}\n\n.saltToolbar[aria-orientation=\"vertical\"] > .Responsive-inner > [data-pad-end=\"true\"] {\n margin-bottom: auto;\n}\n\n.saltToolbar[aria-orientation=\"horizontal\"] > .Responsive-inner > *:first-child {\n margin-left: var(--salt-spacing-100);\n}\n\n.saltToolbar[aria-orientation=\"vertical\"] {\n display: inline-flex;\n flex-direction: column;\n height: 100%;\n min-height: 0;\n}\n\n.saltToolbar[aria-orientation=\"vertical\"] > .Responsive-inner {\n display: inline-flex;\n flex-direction: column;\n max-height: 100%;\n}\n\n.saltToolbar > .Responsive-inner[data-collapsing=\"true\"] {\n flex-wrap: nowrap;\n}\n\n.saltToolbar > .Responsive-inner[data-collapsing=\"true\"] > *[data-overflowed=\"true\"] {\n min-width: 0;\n flex-shrink: 1;\n flex-basis: 0;\n padding: 0;\n margin: 0;\n visibility: visible;\n}\n\n.saltToolbar > .Responsive-inner > *[data-pad-start=\"true\"] {\n margin-left: auto;\n}\n\n.saltToolbarField-start {\n margin-left: 0 !important;\n order: -1;\n}\n\n.saltToolbar > .Responsive-inner > .saltToolbarField {\n flex-shrink: 0;\n flex-grow: 0;\n}\n\n.saltToolbarField.saltFormFieldLegacy-labelLeft > .saltFormLabel {\n padding-left: var(--salt-spacing-100);\n}\n\n.saltToolbar .saltFormFieldLegacy-primary.saltFormFieldLegacy > .saltToolbarButton {\n background: var(--toolbar-background);\n}\n.saltToolbar .saltFormFieldLegacy-primary.saltFormFieldLegacy > .saltToolbarButton:hover {\n background: var(--salt-actionable-subtle-background-hover);\n}\n.saltToolbar .saltFormFieldLegacy-primary.saltFormFieldLegacy > .saltButton-active,\n.saltToolbar .saltFormFieldLegacy-primary.saltFormFieldLegacy > .saltToolbarButton:active {\n background: var(--salt-actionable-subtle-background-active) !important;\n}\n\n/* copied over from Tabstrip.css */\n[data-overflowed] {\n order: 99;\n visibility: hidden;\n}\n\n/* .Responsive-inner > [data-collapsed='true'] {\n background: brown;\n}\n.Responsive-inner > [data-collapsing='true'] {\n background: pink;\n} */\n\n/* .saltToolbar > .Responsive-inner > .saltOverflowPanel {\n background: pink;;\n}\n\n.saltTooltray > .Responsive-inner > .saltOverflowPanel {\n background: yellow;\n} */\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=Toolbar.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltTooltray {\n --toolbar-tooltray-height: var(--toolbar-size);\n}\n\n.saltTooltray {\n background: inherit;\n flex-shrink: 0;\n flex-grow: 0;\n position: relative;\n overflow: hidden;\n align-items: flex-start;\n justify-content: flex-start;\n}\n\n.saltTooltray-horizontal {\n height: var(--toolbar-tooltray-height);\n}\n\n.saltTooltray > .Responsive-inner > .saltToolbarField {\n flex-shrink: 0;\n flex-grow: 0;\n}\n.saltTooltray > .Responsive-inner {\n align-items: center;\n display: flex;\n flex: 1;\n flex-wrap: nowrap;\n gap: 0 !important;\n justify-content: inherit;\n}\n\n/* .saltTooltray-horizontal > .Responsive-inner > :not(:last-child) { */\n.saltTooltray-horizontal > .Responsive-inner > * {\n margin-top: var(--salt-
|
|
1
|
+
var css_248z = ".saltTooltray {\n --toolbar-tooltray-height: var(--toolbar-size);\n}\n\n.saltTooltray {\n background: inherit;\n flex-shrink: 0;\n flex-grow: 0;\n position: relative;\n overflow: hidden;\n align-items: flex-start;\n justify-content: flex-start;\n}\n\n.saltTooltray-horizontal {\n height: var(--toolbar-tooltray-height);\n}\n\n.saltTooltray > .Responsive-inner > .saltToolbarField {\n flex-shrink: 0;\n flex-grow: 0;\n}\n.saltTooltray > .Responsive-inner {\n align-items: center;\n display: flex;\n flex: 1;\n flex-wrap: nowrap;\n gap: 0 !important;\n justify-content: inherit;\n}\n\n/* .saltTooltray-horizontal > .Responsive-inner > :not(:last-child) { */\n.saltTooltray-horizontal > .Responsive-inner > * {\n margin-top: var(--salt-spacing-100);\n margin-right: var(--salt-spacing-100);\n}\n\n/* .saltTooltray-horizontal:first-child {\n padding-left: var(--salt-spacing-100);\n} */\n/* .saltTooltray-horizontal:last-child {\n padding-right: var(--salt-spacing-100);\n} */\n\n.saltTooltray-horizontal:not(:first-child) {\n margin-left: var(--salt-spacing-100);\n padding-left: calc(var(--salt-spacing-100) * 2);\n}\n.saltTooltray-horizontal:not(:first-child):before {\n content: \"\";\n position: absolute;\n background: var(--salt-separable-primary-borderColor);\n top: 8px;\n left: 0;\n width: 1px;\n height: 28px;\n}\n\n.saltTooltray > .Responsive-inner > .saltToolbarField {\n flex: 0 0 auto;\n}\n\n.saltTooltray > .Responsive-inner > *[data-pad-start=\"true\"] {\n margin-left: auto;\n}\n\n.saltTooltray[data-collapsible=\"dynamic\"] {\n flex-shrink: 0;\n}\n.saltTooltray[data-collapsible=\"dynamic\"] > .Responsive-inner {\n flex-wrap: wrap;\n}\n.saltTooltray[data-collapsing=\"true\"] {\n flex-shrink: 1;\n}\n\n.saltTooltray[data-collapsed=\"true\"] {\n flex-shrink: 1;\n}\n\n.saltTooltray[data-collapsible=\"dynamic\"][data-collapsed=\"true\"] {\n flex-basis: 0;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=Tooltray.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltOverflowPanel.saltDropdownBase-popup {\n background: var(--salt-container-primary-background);\n border: solid 1px var(--salt-selectable-borderColor-hover);\n box-shadow: var(--salt-overlayable-shadow-popout);\n}\n\n.saltOverflowPanel-content {\n --saltButton-justifyContent: flex-start;\n align-items: stretch;\n color: var(--salt-content-primary-foreground);\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-container-bold-borderColor);\n display: flex;\n flex-direction: column;\n padding: calc(var(--salt-
|
|
1
|
+
var css_248z = ".saltOverflowPanel.saltDropdownBase-popup {\n background: var(--salt-container-primary-background);\n border: solid 1px var(--salt-selectable-borderColor-hover);\n box-shadow: var(--salt-overlayable-shadow-popout);\n}\n\n.saltOverflowPanel-content {\n --saltButton-justifyContent: flex-start;\n align-items: stretch;\n color: var(--salt-content-primary-foreground);\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-container-bold-borderColor);\n display: flex;\n flex-direction: column;\n padding: calc(var(--salt-spacing-100) * 1.5) 0;\n outline: none;\n}\n\n.saltOverflowPanel [aria-expanded=\"true\"] {\n --saltButton-background: var(--salt-actionable-subtle-background-active);\n --saltButton-background-hover: var(--salt-actionable-subtle-background-active);\n --saltIcon-color: var(--salt-actionable-subtle-foreground-active);\n}\n\n.saltOverflowPanel.saltDropdownBase {\n --saltIcon-margin: 2px 0 0 0px;\n}\n\n.saltOverflowPanel.saltDropdownBase-popup .saltFormFieldLegacy:not(.saltFormFieldLegacy-toolbarButton) {\n --saltFormFieldLegacy-margin: 0 12px 8px 12px;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=OverflowPanel.css.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltOverflowSeparator {\n background: var(--salt-separable-tertiary-borderColor);\n height: var(--salt-size-fixed-100);\n margin: calc(var(--salt-
|
|
1
|
+
var css_248z = ".saltOverflowSeparator {\n background: var(--salt-separable-tertiary-borderColor);\n height: var(--salt-size-fixed-100);\n margin: calc(var(--salt-spacing-100) / 2) 0;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=OverflowSeparator.css.js.map
|
package/dist-types/index.d.ts
CHANGED
|
@@ -17,6 +17,7 @@ export * from "./form-group";
|
|
|
17
17
|
export * from "./formatted-input";
|
|
18
18
|
export { InputLegacy as Input, type InputLegacyProps as InputProps, StaticInputAdornment, } from "./input-legacy";
|
|
19
19
|
export * from "./layer-layout";
|
|
20
|
+
export * from "./link-button";
|
|
20
21
|
export * from "./list";
|
|
21
22
|
export type { ListChangeHandler as ListChangeHandlerDeprecated, ListSelectHandler as ListSelectHandlerDeprecated, } from "./list-deprecated";
|
|
22
23
|
export { ListItemBase as ListItemBaseDeprecated, useListItem as useListItemDeprecated, } from "./list-deprecated";
|
|
@@ -24,6 +25,7 @@ export * from "./list-next";
|
|
|
24
25
|
export * from "./logo";
|
|
25
26
|
export * from "./menu-button";
|
|
26
27
|
export * from "./metric";
|
|
28
|
+
export * from "./on-solid-button";
|
|
27
29
|
export * from "./portal";
|
|
28
30
|
export * from "./query-input";
|
|
29
31
|
export * from "./responsive";
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { type RenderPropsType } from "@salt-ds/core";
|
|
2
|
+
import type { IconProps } from "@salt-ds/icons";
|
|
3
|
+
import { type ComponentPropsWithoutRef, type ComponentType } from "react";
|
|
4
|
+
export interface LinkButtonProps extends ComponentPropsWithoutRef<"a"> {
|
|
5
|
+
/**
|
|
6
|
+
* Icon component displayed when `target="_blank"`. Defaults to `ExternalIcon` from `SemanticIconProvider`.
|
|
7
|
+
*/
|
|
8
|
+
IconComponent?: ComponentType<IconProps> | null;
|
|
9
|
+
/**
|
|
10
|
+
* The sentiment of the button. Options are 'accented' and 'neutral'.
|
|
11
|
+
* 'neutral' is the default value.
|
|
12
|
+
*/
|
|
13
|
+
sentiment?: "accented" | "neutral";
|
|
14
|
+
/**
|
|
15
|
+
* Render prop to enable customisation of anchor element.
|
|
16
|
+
*/
|
|
17
|
+
render?: RenderPropsType["render"];
|
|
18
|
+
/**
|
|
19
|
+
* Either "default" or "never".
|
|
20
|
+
* Determines when underline should be applied to the link button.
|
|
21
|
+
*
|
|
22
|
+
* @default "default".
|
|
23
|
+
*/
|
|
24
|
+
underline?: "default" | "never";
|
|
25
|
+
}
|
|
26
|
+
export declare const LinkButton: import("react").ForwardRefExoticComponent<LinkButtonProps & import("react").RefAttributes<HTMLAnchorElement>>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./LinkButton";
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { type ComponentPropsWithoutRef } from "react";
|
|
2
|
+
export interface OnSolidButtonProps extends ComponentPropsWithoutRef<"button"> {
|
|
3
|
+
/**
|
|
4
|
+
* If `true`, the button will be disabled.
|
|
5
|
+
*/
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
/**
|
|
8
|
+
* If `true`, the button will be focusable when disabled.
|
|
9
|
+
*/
|
|
10
|
+
focusableWhenDisabled?: boolean;
|
|
11
|
+
}
|
|
12
|
+
export declare const OnSolidButton: import("react").ForwardRefExoticComponent<OnSolidButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./OnSolidButton";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@salt-ds/lab",
|
|
3
|
-
"version": "1.0.0-alpha.
|
|
3
|
+
"version": "1.0.0-alpha.103",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
],
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"@floating-ui/react": "^0.27.19",
|
|
24
|
-
"@salt-ds/core": "^1.
|
|
24
|
+
"@salt-ds/core": "^1.70.0",
|
|
25
25
|
"@salt-ds/icons": "^1.18.2",
|
|
26
26
|
"@salt-ds/styles": "0.4.0",
|
|
27
27
|
"@salt-ds/window": "0.1.1",
|