@react-spectrum/tabs 3.1.7-nightly.3248 → 3.1.7-nightly.3249
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/main.css +1 -1
- package/dist/main.js +8 -3
- package/dist/main.js.map +1 -1
- package/dist/module.js +8 -3
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +20 -20
- package/src/Tabs.tsx +6 -2
package/dist/main.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.spectrum-TabsPanel_3e140b{width:100%;display:flex}.spectrum-TabsPanel--horizontal_3e140b{flex-direction:column}.spectrum-TabsPanel--vertical_3e140b{flex-direction:row}.spectrum-Tabs_3e140b{z-index:0;vertical-align:top;-webkit-user-select:none;user-select:none;outline:0;margin:0;padding:0;display:flex;position:relative}.spectrum-Tabs-item_3e140b{box-sizing:border-box;height:calc(var(--spectrum-tabs-height,var(--spectrum-global-dimension-size-600)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)));line-height:calc(var(--spectrum-tabs-height,var(--spectrum-global-dimension-size-600)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)));z-index:1;white-space:nowrap;transition:color var(--spectrum-global-animation-duration-100,130ms)ease-out;cursor:default;outline:0;text-decoration:none;position:relative}.spectrum-Tabs-item_3e140b.is-disabled_3e140b,.spectrum-Tabs-item_3e140b.is-disabled_3e140b .spectrum-Tabs-itemLabel_3e140b{cursor:default}.spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b{height:calc(var(--spectrum-tabs-height,var(--spectrum-global-dimension-size-600)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)));transition:fill var(--spectrum-global-animation-duration-100,130ms)ease-out;transform:translate(0,0)}[dir=ltr] .spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b+.spectrum-Tabs-itemLabel_3e140b{margin-left:var(--spectrum-tabs-icon-gap,var(--spectrum-global-dimension-size-100))}[dir=rtl] .spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b+.spectrum-Tabs-itemLabel_3e140b{margin-right:var(--spectrum-tabs-icon-gap,var(--spectrum-global-dimension-size-100))}[dir=ltr] .spectrum-Tabs-item_3e140b:before{left:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}[dir=rtl] .spectrum-Tabs-item_3e140b:before,[dir=ltr] .spectrum-Tabs-item_3e140b:before{right:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}[dir=rtl] .spectrum-Tabs-item_3e140b:before{left:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}.spectrum-Tabs-item_3e140b:before{content:"";box-sizing:border-box;height:var(--spectrum-tabs-focus-ring-height,var(--spectrum-alias-single-line-height));margin-top:calc(var(--spectrum-tabs-focus-ring-height,var(--spectrum-alias-single-line-height))/-2 + var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick))/2);border:var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))solid transparent;border-radius:var(--spectrum-tabs-focus-ring-border-radius);pointer-events:none;position:absolute;top:50%}.spectrum-Tabs-itemLabel_3e140b{cursor:default;vertical-align:top;font-size:var(--spectrum-tabs-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-tabs-text-font-weight,var(--spectrum-alias-body-text-font-weight));display:inline-block}.spectrum-Tabs-itemLabel_3e140b:empty{display:none}[dir=ltr] .spectrum-Tabs-selectionIndicator_3e140b{left:0}[dir=rtl] .spectrum-Tabs-selectionIndicator_3e140b{right:0}.spectrum-Tabs-selectionIndicator_3e140b{z-index:0;transform-origin:0 0;border-radius:var(--spectrum-tabs-rule-border-radius,var(--spectrum-global-dimension-static-size-10));position:absolute}[dir=ltr] .spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-selectionIndicator_3e140b{transform:translateX(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)))}[dir=rtl] .spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-selectionIndicator_3e140b{transform:translateX(calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1))}.spectrum-Tabs--compact_3e140b .spectrum-Tabs-item_3e140b{height:calc(var(--spectrum-tabs-quiet-compact-height,var(--spectrum-global-dimension-size-400)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)));line-height:calc(var(--spectrum-tabs-quiet-compact-height,var(--spectrum-global-dimension-size-400)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)))}.spectrum-Tabs--compact_3e140b .spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b{height:calc(var(--spectrum-tabs-quiet-compact-height,var(--spectrum-global-dimension-size-400)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)))}.spectrum-Tabs--horizontal_3e140b{border-bottom:var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick))solid;align-items:center}.spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-item_3e140b{vertical-align:top}[dir=ltr] .spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-item_3e140b+:not(.spectrum-Tabs-selectionIndicator_3e140b){margin-left:var(--spectrum-tabs-item-gap,var(--spectrum-global-dimension-size-300))}[dir=rtl] .spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-item_3e140b+:not(.spectrum-Tabs-selectionIndicator_3e140b){margin-right:var(--spectrum-tabs-item-gap,var(--spectrum-global-dimension-size-300))}.spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-selectionIndicator_3e140b{height:var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick));bottom:calc(var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick))*-1);transition:transform var(--spectrum-tabs-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100))ease-in-out,width var(--spectrum-tabs-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100))ease-in-out;position:absolute}[dir=ltr] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b{left:0}[dir=rtl] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b{right:0}.spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b{height:calc(var(--spectrum-tabs-height,var(--spectrum-global-dimension-size-600)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)))}[dir=ltr] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b button:before{left:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}[dir=rtl] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b button:before,[dir=ltr] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b button:before{right:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}[dir=rtl] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b button:before{left:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}.spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b button:before{content:"";box-sizing:border-box;height:var(--spectrum-tabs-focus-ring-height,var(--spectrum-alias-single-line-height));margin-top:calc(var(--spectrum-tabs-focus-ring-height,var(--spectrum-alias-single-line-height))/-2 + var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick))/2);border:var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))solid transparent;border-radius:var(--spectrum-tabs-focus-ring-border-radius);pointer-events:none;position:absolute;top:50%}.spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b.spectrum-Tabs--compact_3e140b button{height:calc(var(--spectrum-tabs-quiet-compact-height,var(--spectrum-global-dimension-size-400)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)))}.spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--compact_3e140b{box-sizing:content-box;height:calc(var(--spectrum-tabs-quiet-compact-height,var(--spectrum-global-dimension-size-400)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)));align-items:end}.spectrum-Tabs--quiet_3e140b{display:inline-flex}[dir=ltr] .spectrum-Tabs--vertical_3e140b{border-left:var(--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick))solid}[dir=rtl] .spectrum-Tabs--vertical_3e140b{border-right:var(--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick))solid}.spectrum-Tabs--vertical_3e140b{flex-direction:column;padding:0;display:inline-flex}[dir=ltr] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b{margin-left:calc(var(--spectrum-tabs-vertical-item-margin-left,var(--spectrum-global-dimension-size-150)) - var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)))}[dir=rtl] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b{margin-right:calc(var(--spectrum-tabs-vertical-item-margin-left,var(--spectrum-global-dimension-size-150)) - var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)))}.spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b{height:var(--spectrum-tabs-vertical-item-height,var(--spectrum-global-dimension-size-550));padding:0 var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100));margin-bottom:var(--spectrum-tabs-vertical-item-gap,var(--spectrum-global-dimension-size-50))}[dir=ltr] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b:before{left:calc(var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))*-1)}[dir=rtl] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b:before,[dir=ltr] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b:before{right:calc(var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))*-1)}[dir=rtl] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b:before{left:calc(var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))*-1)}.spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b:before{margin-top:calc(var(--spectrum-tabs-focus-ring-height,var(--spectrum-alias-single-line-height))/-2)}.spectrum-Tabs--vertical_3e140b.spectrum-Tabs--compact_3e140b .spectrum-Tabs-item_3e140b{height:var(--spectrum-tabs-compact-vertical-item-height,var(--spectrum-global-dimension-size-400));line-height:var(--spectrum-tabs-compact-vertical-item-height,var(--spectrum-global-dimension-size-400));margin-bottom:var(--spectrum-tabs-compact-vertical-item-gap,var(--spectrum-global-dimension-size-50))}.spectrum-Tabs--vertical_3e140b.spectrum-Tabs--compact_3e140b .spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b{height:var(--spectrum-tabs-compact-vertical-item-height,var(--spectrum-global-dimension-size-400))}[dir=ltr] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-selectionIndicator_3e140b{left:calc(var(--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick))*-1)}[dir=rtl] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-selectionIndicator_3e140b{right:calc(var(--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick))*-1)}.spectrum-Tabs--vertical_3e140b .spectrum-Tabs-selectionIndicator_3e140b{width:var(--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick));transition:transform var(--spectrum-tabs-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100))ease-in-out,height var(--spectrum-tabs-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100))ease-in-out;position:absolute}.spectrum-TabsPanel-collapseWrapper_3e140b{display:flex;position:relative}.spectrum-TabsPanel-tabs_3e140b{flex:1 0}.spectrum-TabsPanel-tabs_3e140b.spectrum-Tabs--vertical_3e140b{flex-grow:0}.spectrum-TabsPanel-tabpanel_3e140b{border:var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))solid transparent;flex-grow:1}.spectrum-TabsPanel--vertical_3e140b .spectrum-Tabs_3e140b{padding-right:var(--spectrum-global-dimension-size-160)}.spectrum-Tabs_3e140b{border-bottom-color:var(--spectrum-tabs-rule-color,var(--spectrum-global-color-gray-200))}.spectrum-Tabs_3e140b.spectrum-Tabs--isCollapsed_3e140b .focus-ring_3e140b{box-shadow:none}.spectrum-Tabs_3e140b.spectrum-Tabs--isCollapsed_3e140b .focus-ring_3e140b:before{border-color:var(--spectrum-tabs-focus-ring-color,var(--spectrum-alias-border-color-focus))}[dir=ltr] .spectrum-Tabs--vertical_3e140b{border-left-color:var(--spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200))}[dir=rtl] .spectrum-Tabs--vertical_3e140b{border-right-color:var(--spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200))}.spectrum-Tabs-selectionIndicator_3e140b{background-color:var(--spectrum-tabs-selection-indicator-color,var(--spectrum-global-color-gray-900))}.spectrum-Tabs-item_3e140b{color:var(--spectrum-tabs-text-color,var(--spectrum-alias-label-text-color))}.spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-tabs-icon-color,var(--spectrum-alias-icon-color))}.spectrum-Tabs-item_3e140b.is-hovered_3e140b{color:var(--spectrum-tabs-text-color-hover,var(--spectrum-alias-text-color-hover))}.spectrum-Tabs-item_3e140b.is-hovered_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-tabs-icon-color-hover,var(--spectrum-alias-icon-color-hover))}.spectrum-Tabs-item_3e140b.is-selected_3e140b{color:var(--spectrum-tabs-text-color-selected,var(--spectrum-global-color-gray-900))}.spectrum-Tabs-item_3e140b.is-selected_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-tabs-icon-color-selected,var(--spectrum-global-color-gray-900))}.spectrum-Tabs-item_3e140b.focus-ring_3e140b{color:var(--spectrum-tabs-text-color-key-focus,var(--spectrum-alias-text-color-hover))}.spectrum-Tabs-item_3e140b.focus-ring_3e140b:before{border-color:var(--spectrum-tabs-focus-ring-color,var(--spectrum-alias-border-color-focus))}.spectrum-Tabs-item_3e140b.focus-ring_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-tabs-icon-color-key-focus,var(--spectrum-alias-icon-color-focus))}.spectrum-Tabs-item_3e140b.is-disabled_3e140b{color:var(--spectrum-tabs-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-Tabs-item_3e140b.is-disabled_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-tabs-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}.spectrum-Tabs--quiet_3e140b{border-bottom-color:var(--spectrum-tabs-quiet-rule-color,var(--spectrum-alias-border-color-transparent))}.spectrum-Tabs--quiet_3e140b .spectrum-Tabs-selectionIndicator_3e140b{background-color:var(--spectrum-tabs-quiet-selection-indicator-color,var(--spectrum-global-color-gray-900))}[dir=ltr] .spectrum-Tabs--vertical_3e140b.spectrum-Tabs--quiet_3e140b,[dir=ltr] .spectrum-Tabs--vertical_3e140b.spectrum-Tabs--compact_3e140b{border-left-color:var(--spectrum-tabs-quiet-vertical-rule-color,var(--spectrum-alias-border-color-transparent))}[dir=rtl] .spectrum-Tabs--vertical_3e140b.spectrum-Tabs--quiet_3e140b,[dir=rtl] .spectrum-Tabs--vertical_3e140b.spectrum-Tabs--compact_3e140b{border-right-color:var(--spectrum-tabs-quiet-vertical-rule-color,var(--spectrum-alias-border-color-transparent))}.spectrum-Tabs--vertical_3e140b.spectrum-Tabs--quiet_3e140b .spectrum-Tabs-selectionIndicator_3e140b,.spectrum-Tabs--vertical_3e140b.spectrum-Tabs--compact_3e140b .spectrum-Tabs-selectionIndicator_3e140b{background-color:var(--spectrum-tabs-quiet-selection-indicator-color,var(--spectrum-global-color-gray-900))}.spectrum-TabsPanel-tabpanel_3e140b:focus{outline:0}.spectrum-TabsPanel-tabpanel_3e140b.focus-ring_3e140b{border-color:var(--spectrum-tabs-focus-ring-color,var(--spectrum-alias-border-color-focus))}@media (forced-colors:active){.spectrum-Tabs_3e140b{forced-color-adjust:none;--spectrum-tabs-focus-ring-color:ButtonText;--spectrum-tabs-icon-color:ButtonText;--spectrum-tabs-icon-color-disabled:GrayText;--spectrum-tabs-icon-color-hover:ButtonText;--spectrum-tabs-icon-color-key-focus:ButtonText;--spectrum-tabs-icon-color-selected:HighlightText;--spectrum-tabs-quiet-rule-color:transparent;--spectrum-tabs-quiet-selection-indicator-color:transparent;--spectrum-tabs-quiet-vertical-rule-color:transparent;--spectrum-tabs-rule-color:transparent;--spectrum-tabs-selection-indicator-color:transparent;--spectrum-tabs-text-color:ButtonText;--spectrum-tabs-text-color-disabled:GrayText;--spectrum-tabs-text-color-hover:ButtonText;--spectrum-tabs-text-color-key-focus:ButtonText;--spectrum-tabs-text-color-selected:HighlightText;--spectrum-tabs-vertical-rule-color:transparent}.spectrum-Tabs_3e140b .spectrum-Tabs-item_3e140b:before{background-color:ButtonFace}.spectrum-Tabs_3e140b .spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b,.spectrum-Tabs_3e140b .spectrum-Tabs-item_3e140b .spectrum-Tabs-itemLabel_3e140b{z-index:1;position:relative}.spectrum-Tabs_3e140b .is-selected_3e140b{color:HighlightText}.spectrum-Tabs_3e140b .is-selected_3e140b .spectrum-Icon_3e140b{fill:HighlightText}.spectrum-Tabs_3e140b .is-selected_3e140b:before{background-color:Highlight;color:HighlightText}.spectrum-Tabs_3e140b .is-selected_3e140b .spectrum-Tabs-itemLabel_3e140b{color:HighlightText}}
|
|
1
|
+
.spectrum-TabsPanel_3e140b{width:100%;display:flex}.spectrum-TabsPanel--horizontal_3e140b{flex-direction:column}.spectrum-TabsPanel--vertical_3e140b{flex-direction:row}.spectrum-Tabs_3e140b{z-index:0;vertical-align:top;-webkit-user-select:none;user-select:none;outline:0;margin:0;padding:0;display:flex;position:relative}.spectrum-Tabs-item_3e140b{box-sizing:border-box;height:calc(var(--spectrum-tabs-height,var(--spectrum-global-dimension-size-600)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)));line-height:calc(var(--spectrum-tabs-height,var(--spectrum-global-dimension-size-600)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)));z-index:1;white-space:nowrap;transition:color var(--spectrum-global-animation-duration-100,130ms)ease-out;cursor:default;outline:0;text-decoration:none;position:relative}.spectrum-Tabs-item_3e140b.is-disabled_3e140b,.spectrum-Tabs-item_3e140b.is-disabled_3e140b .spectrum-Tabs-itemLabel_3e140b{cursor:default}.spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b{height:calc(var(--spectrum-tabs-height,var(--spectrum-global-dimension-size-600)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)));transition:fill var(--spectrum-global-animation-duration-100,130ms)ease-out;transform:translate(0,0)}[dir=ltr] .spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b+.spectrum-Tabs-itemLabel_3e140b{margin-left:var(--spectrum-tabs-icon-gap,var(--spectrum-global-dimension-size-100))}[dir=rtl] .spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b+.spectrum-Tabs-itemLabel_3e140b{margin-right:var(--spectrum-tabs-icon-gap,var(--spectrum-global-dimension-size-100))}[dir=ltr] .spectrum-Tabs-item_3e140b:before{left:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}[dir=rtl] .spectrum-Tabs-item_3e140b:before,[dir=ltr] .spectrum-Tabs-item_3e140b:before{right:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}[dir=rtl] .spectrum-Tabs-item_3e140b:before{left:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}.spectrum-Tabs-item_3e140b:before{content:"";box-sizing:border-box;height:var(--spectrum-tabs-focus-ring-height,var(--spectrum-alias-single-line-height));margin-top:calc(var(--spectrum-tabs-focus-ring-height,var(--spectrum-alias-single-line-height))/-2 + var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick))/2);border:var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))solid transparent;border-radius:var(--spectrum-tabs-focus-ring-border-radius);pointer-events:none;position:absolute;top:50%}.spectrum-Tabs-itemLabel_3e140b{cursor:default;vertical-align:top;font-size:var(--spectrum-tabs-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-tabs-text-font-weight,var(--spectrum-alias-body-text-font-weight));display:inline-block}.spectrum-Tabs-itemLabel_3e140b:empty{display:none}[dir=ltr] .spectrum-Tabs-selectionIndicator_3e140b{left:0}[dir=rtl] .spectrum-Tabs-selectionIndicator_3e140b{right:0}.spectrum-Tabs-selectionIndicator_3e140b{z-index:0;transform-origin:0 0;border-radius:var(--spectrum-tabs-rule-border-radius,var(--spectrum-global-dimension-static-size-10));position:absolute}[dir=ltr] .spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-selectionIndicator_3e140b{transform:translateX(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)))}[dir=rtl] .spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-selectionIndicator_3e140b{transform:translateX(calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1))}.spectrum-Tabs--compact_3e140b .spectrum-Tabs-item_3e140b{height:calc(var(--spectrum-tabs-quiet-compact-height,var(--spectrum-global-dimension-size-400)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)));line-height:calc(var(--spectrum-tabs-quiet-compact-height,var(--spectrum-global-dimension-size-400)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)))}.spectrum-Tabs--compact_3e140b .spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b{height:calc(var(--spectrum-tabs-quiet-compact-height,var(--spectrum-global-dimension-size-400)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)))}.spectrum-Tabs--horizontal_3e140b{border-bottom:var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick))solid;align-items:center}.spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-item_3e140b{vertical-align:top}[dir=ltr] .spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-item_3e140b+:not(.spectrum-Tabs-selectionIndicator_3e140b){margin-left:var(--spectrum-tabs-item-gap,var(--spectrum-global-dimension-size-300))}[dir=rtl] .spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-item_3e140b+:not(.spectrum-Tabs-selectionIndicator_3e140b){margin-right:var(--spectrum-tabs-item-gap,var(--spectrum-global-dimension-size-300))}.spectrum-Tabs--horizontal_3e140b .spectrum-Tabs-selectionIndicator_3e140b{height:var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick));bottom:calc(var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick))*-1);transition:transform var(--spectrum-tabs-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100))ease-in-out,width var(--spectrum-tabs-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100))ease-in-out;position:absolute}[dir=ltr] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b{left:0}[dir=rtl] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b{right:0}.spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b{height:calc(var(--spectrum-tabs-height,var(--spectrum-global-dimension-size-600)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)))}[dir=ltr] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b button:before{left:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}[dir=rtl] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b button:before,[dir=ltr] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b button:before{right:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}[dir=rtl] .spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b button:before{left:calc(var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100))*-1)}.spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b button:before{content:"";box-sizing:border-box;height:var(--spectrum-tabs-focus-ring-height,var(--spectrum-alias-single-line-height));margin-top:calc(var(--spectrum-tabs-focus-ring-height,var(--spectrum-alias-single-line-height))/-2 + var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick))/2);border:var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))solid transparent;border-radius:var(--spectrum-tabs-focus-ring-border-radius);pointer-events:none;position:absolute;top:50%}.spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--isCollapsed_3e140b.spectrum-Tabs--compact_3e140b button{height:calc(var(--spectrum-tabs-quiet-compact-height,var(--spectrum-global-dimension-size-400)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)))}.spectrum-Tabs--horizontal_3e140b.spectrum-Tabs--compact_3e140b{box-sizing:content-box;height:calc(var(--spectrum-tabs-quiet-compact-height,var(--spectrum-global-dimension-size-400)) - var(--spectrum-tabs-rule-height,var(--spectrum-alias-border-size-thick)));align-items:end}.spectrum-Tabs--quiet_3e140b{display:inline-flex}[dir=ltr] .spectrum-Tabs--vertical_3e140b{border-left:var(--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick))solid}[dir=rtl] .spectrum-Tabs--vertical_3e140b{border-right:var(--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick))solid}.spectrum-Tabs--vertical_3e140b{flex-direction:column;padding:0;display:inline-flex}[dir=ltr] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b{margin-left:calc(var(--spectrum-tabs-vertical-item-margin-left,var(--spectrum-global-dimension-size-150)) - var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)))}[dir=rtl] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b{margin-right:calc(var(--spectrum-tabs-vertical-item-margin-left,var(--spectrum-global-dimension-size-150)) - var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)))}.spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b{height:var(--spectrum-tabs-vertical-item-height,var(--spectrum-global-dimension-size-550));padding:0 var(--spectrum-tabs-focus-ring-padding-x,var(--spectrum-global-dimension-size-100));margin-bottom:var(--spectrum-tabs-vertical-item-gap,var(--spectrum-global-dimension-size-50))}[dir=ltr] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b:before{left:calc(var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))*-1)}[dir=rtl] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b:before,[dir=ltr] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b:before{right:calc(var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))*-1)}[dir=rtl] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b:before{left:calc(var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))*-1)}.spectrum-Tabs--vertical_3e140b .spectrum-Tabs-item_3e140b:before{margin-top:calc(var(--spectrum-tabs-focus-ring-height,var(--spectrum-alias-single-line-height))/-2)}.spectrum-Tabs--vertical_3e140b.spectrum-Tabs--compact_3e140b .spectrum-Tabs-item_3e140b{height:var(--spectrum-tabs-compact-vertical-item-height,var(--spectrum-global-dimension-size-400));line-height:var(--spectrum-tabs-compact-vertical-item-height,var(--spectrum-global-dimension-size-400));margin-bottom:var(--spectrum-tabs-compact-vertical-item-gap,var(--spectrum-global-dimension-size-50))}.spectrum-Tabs--vertical_3e140b.spectrum-Tabs--compact_3e140b .spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b{height:var(--spectrum-tabs-compact-vertical-item-height,var(--spectrum-global-dimension-size-400))}[dir=ltr] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-selectionIndicator_3e140b{left:calc(var(--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick))*-1)}[dir=rtl] .spectrum-Tabs--vertical_3e140b .spectrum-Tabs-selectionIndicator_3e140b{right:calc(var(--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick))*-1)}.spectrum-Tabs--vertical_3e140b .spectrum-Tabs-selectionIndicator_3e140b{width:var(--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick));transition:transform var(--spectrum-tabs-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100))ease-in-out,height var(--spectrum-tabs-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100))ease-in-out;position:absolute}.spectrum-TabsPanel-collapseWrapper_3e140b{display:flex;position:relative}.spectrum-TabsPanel-tabs_3e140b{flex:1 0}.spectrum-TabsPanel-tabs_3e140b.spectrum-Tabs--vertical_3e140b{flex-grow:0}.spectrum-TabsPanel-tabpanel_3e140b{border:var(--spectrum-tabs-focus-ring-size,var(--spectrum-alias-border-size-thick))solid transparent;flex-grow:1}.spectrum-TabsPanel--vertical_3e140b .spectrum-Tabs_3e140b{padding-right:var(--spectrum-global-dimension-size-160)}.spectrum-Tabs_3e140b{border-bottom-color:var(--spectrum-tabs-rule-color,var(--spectrum-global-color-gray-200))}.spectrum-Tabs_3e140b.spectrum-Tabs--isCollapsed_3e140b .focus-ring_3e140b{box-shadow:none}.spectrum-Tabs_3e140b.spectrum-Tabs--isCollapsed_3e140b .focus-ring_3e140b:before{border-color:var(--spectrum-tabs-focus-ring-color,var(--spectrum-alias-border-color-focus))}[dir=ltr] .spectrum-Tabs--vertical_3e140b{border-left-color:var(--spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200))}[dir=rtl] .spectrum-Tabs--vertical_3e140b{border-right-color:var(--spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200))}.spectrum-Tabs--emphasized_3e140b .spectrum-Tabs-selectionIndicator_3e140b{background-color:var(--spectrum-global-color-blue-600)}.spectrum-Tabs-selectionIndicator_3e140b{background-color:var(--spectrum-tabs-selection-indicator-color,var(--spectrum-global-color-gray-900))}.spectrum-Tabs-item_3e140b{color:var(--spectrum-tabs-text-color,var(--spectrum-alias-label-text-color))}.spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-tabs-icon-color,var(--spectrum-alias-icon-color))}.spectrum-Tabs-item_3e140b.is-hovered_3e140b{color:var(--spectrum-tabs-text-color-hover,var(--spectrum-alias-text-color-hover))}.spectrum-Tabs-item_3e140b.is-hovered_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-tabs-icon-color-hover,var(--spectrum-alias-icon-color-hover))}.spectrum-Tabs-item_3e140b.is-selected_3e140b{color:var(--spectrum-tabs-text-color-selected,var(--spectrum-global-color-gray-900))}.spectrum-Tabs-item_3e140b.is-selected_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-tabs-icon-color-selected,var(--spectrum-global-color-gray-900))}.spectrum-Tabs-item_3e140b.focus-ring_3e140b{color:var(--spectrum-tabs-text-color-key-focus,var(--spectrum-alias-text-color-hover))}.spectrum-Tabs-item_3e140b.focus-ring_3e140b:before{border-color:var(--spectrum-tabs-focus-ring-color,var(--spectrum-alias-border-color-focus))}.spectrum-Tabs-item_3e140b.focus-ring_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-tabs-icon-color-key-focus,var(--spectrum-alias-icon-color-focus))}.spectrum-Tabs-item_3e140b.is-disabled_3e140b{color:var(--spectrum-tabs-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-Tabs-item_3e140b.is-disabled_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-tabs-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}.spectrum-Tabs--emphasized_3e140b .spectrum-Tabs-item_3e140b.is-selected_3e140b{color:var(--spectrum-global-color-blue-600)}.spectrum-Tabs--emphasized_3e140b .spectrum-Tabs-item_3e140b.is-selected_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-global-color-blue-600)}.spectrum-Tabs--emphasized_3e140b .spectrum-Tabs-item_3e140b.is-selected_3e140b.focus-ring_3e140b{color:var(--spectrum-global-color-blue-600)}.spectrum-Tabs--emphasized_3e140b .spectrum-Tabs-item_3e140b.is-selected_3e140b.focus-ring_3e140b:before{border-color:var(--spectrum-global-color-blue-600)}.spectrum-Tabs--emphasized_3e140b .spectrum-Tabs-item_3e140b.is-selected_3e140b.focus-ring_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-global-color-blue-600)}.spectrum-Tabs--emphasized_3e140b .spectrum-Tabs-item_3e140b.is-selected_3e140b.is-hovered_3e140b{color:var(--spectrum-global-color-blue-700)}.spectrum-Tabs--emphasized_3e140b .spectrum-Tabs-item_3e140b.is-selected_3e140b.is-hovered_3e140b .spectrum-Icon_3e140b{fill:var(--spectrum-global-color-blue-700)}.spectrum-Tabs--quiet_3e140b{border-bottom-color:var(--spectrum-tabs-quiet-rule-color,var(--spectrum-alias-border-color-transparent))}.spectrum-Tabs--quiet_3e140b .spectrum-Tabs-selectionIndicator_3e140b{background-color:var(--spectrum-tabs-quiet-selection-indicator-color,var(--spectrum-global-color-gray-900))}.spectrum-Tabs--quiet_3e140b.spectrum-Tabs--emphasized_3e140b .spectrum-Tabs-selectionIndicator_3e140b{background-color:var(--spectrum-global-color-blue-600)}[dir=ltr] .spectrum-Tabs--vertical_3e140b.spectrum-Tabs--quiet_3e140b,[dir=ltr] .spectrum-Tabs--vertical_3e140b.spectrum-Tabs--compact_3e140b{border-left-color:var(--spectrum-tabs-quiet-vertical-rule-color,var(--spectrum-alias-border-color-transparent))}[dir=rtl] .spectrum-Tabs--vertical_3e140b.spectrum-Tabs--quiet_3e140b,[dir=rtl] .spectrum-Tabs--vertical_3e140b.spectrum-Tabs--compact_3e140b{border-right-color:var(--spectrum-tabs-quiet-vertical-rule-color,var(--spectrum-alias-border-color-transparent))}.spectrum-Tabs--vertical_3e140b.spectrum-Tabs--quiet_3e140b .spectrum-Tabs-selectionIndicator_3e140b,.spectrum-Tabs--vertical_3e140b.spectrum-Tabs--compact_3e140b .spectrum-Tabs-selectionIndicator_3e140b{background-color:var(--spectrum-tabs-quiet-selection-indicator-color,var(--spectrum-global-color-gray-900))}.spectrum-Tabs--vertical_3e140b.spectrum-Tabs--emphasized_3e140b .spectrum-Tabs-selectionIndicator_3e140b{background-color:var(--spectrum-global-color-blue-600)}.spectrum-TabsPanel-tabpanel_3e140b:focus{outline:0}.spectrum-TabsPanel-tabpanel_3e140b.focus-ring_3e140b{border-color:var(--spectrum-tabs-focus-ring-color,var(--spectrum-alias-border-color-focus))}@media (forced-colors:active){.spectrum-Tabs_3e140b{forced-color-adjust:none;--spectrum-tabs-focus-ring-color:ButtonText;--spectrum-tabs-icon-color:ButtonText;--spectrum-tabs-icon-color-disabled:GrayText;--spectrum-tabs-icon-color-hover:ButtonText;--spectrum-tabs-icon-color-key-focus:ButtonText;--spectrum-tabs-icon-color-selected:HighlightText;--spectrum-tabs-quiet-rule-color:transparent;--spectrum-tabs-quiet-selection-indicator-color:transparent;--spectrum-tabs-quiet-vertical-rule-color:transparent;--spectrum-tabs-rule-color:transparent;--spectrum-tabs-selection-indicator-color:transparent;--spectrum-tabs-text-color:ButtonText;--spectrum-tabs-text-color-disabled:GrayText;--spectrum-tabs-text-color-hover:ButtonText;--spectrum-tabs-text-color-key-focus:ButtonText;--spectrum-tabs-text-color-selected:HighlightText;--spectrum-tabs-vertical-rule-color:transparent}.spectrum-Tabs_3e140b .spectrum-Tabs-item_3e140b:before{background-color:ButtonFace}.spectrum-Tabs_3e140b .spectrum-Tabs-item_3e140b .spectrum-Icon_3e140b,.spectrum-Tabs_3e140b .spectrum-Tabs-item_3e140b .spectrum-Tabs-itemLabel_3e140b{z-index:1;position:relative}.spectrum-Tabs_3e140b .is-selected_3e140b{color:HighlightText}.spectrum-Tabs_3e140b .is-selected_3e140b .spectrum-Icon_3e140b{fill:HighlightText}.spectrum-Tabs_3e140b .is-selected_3e140b:before{background-color:Highlight;color:HighlightText}.spectrum-Tabs_3e140b .is-selected_3e140b .spectrum-Tabs-itemLabel_3e140b{color:HighlightText}}
|
package/dist/main.js
CHANGED
|
@@ -69,6 +69,7 @@ $parcel$export($29add1fad43dc941$exports, "spectrum-TabsPanel-collapseWrapper",
|
|
|
69
69
|
$parcel$export($29add1fad43dc941$exports, "spectrum-TabsPanel-tabs", () => $29add1fad43dc941$export$4a157a691c854e23, (v) => $29add1fad43dc941$export$4a157a691c854e23 = v);
|
|
70
70
|
$parcel$export($29add1fad43dc941$exports, "spectrum-TabsPanel-tabpanel", () => $29add1fad43dc941$export$acb5da0970288266, (v) => $29add1fad43dc941$export$acb5da0970288266 = v);
|
|
71
71
|
$parcel$export($29add1fad43dc941$exports, "focus-ring", () => $29add1fad43dc941$export$f39a09f249340e2a, (v) => $29add1fad43dc941$export$f39a09f249340e2a = v);
|
|
72
|
+
$parcel$export($29add1fad43dc941$exports, "spectrum-Tabs--emphasized", () => $29add1fad43dc941$export$87b15021e28e067a, (v) => $29add1fad43dc941$export$87b15021e28e067a = v);
|
|
72
73
|
$parcel$export($29add1fad43dc941$exports, "is-hovered", () => $29add1fad43dc941$export$b8813cd5d7824ce7, (v) => $29add1fad43dc941$export$b8813cd5d7824ce7 = v);
|
|
73
74
|
$parcel$export($29add1fad43dc941$exports, "is-selected", () => $29add1fad43dc941$export$1e0fb04f31d3c22a, (v) => $29add1fad43dc941$export$1e0fb04f31d3c22a = v);
|
|
74
75
|
var $29add1fad43dc941$export$34f1a65c57bb7bb;
|
|
@@ -89,6 +90,7 @@ var $29add1fad43dc941$export$e09869956b4c96f2;
|
|
|
89
90
|
var $29add1fad43dc941$export$4a157a691c854e23;
|
|
90
91
|
var $29add1fad43dc941$export$acb5da0970288266;
|
|
91
92
|
var $29add1fad43dc941$export$f39a09f249340e2a;
|
|
93
|
+
var $29add1fad43dc941$export$87b15021e28e067a;
|
|
92
94
|
var $29add1fad43dc941$export$b8813cd5d7824ce7;
|
|
93
95
|
var $29add1fad43dc941$export$1e0fb04f31d3c22a;
|
|
94
96
|
$29add1fad43dc941$export$34f1a65c57bb7bb = "spectrum-TabsPanel_3e140b";
|
|
@@ -109,6 +111,7 @@ $29add1fad43dc941$export$e09869956b4c96f2 = "spectrum-TabsPanel-collapseWrapper_
|
|
|
109
111
|
$29add1fad43dc941$export$4a157a691c854e23 = "spectrum-TabsPanel-tabs_3e140b";
|
|
110
112
|
$29add1fad43dc941$export$acb5da0970288266 = "spectrum-TabsPanel-tabpanel_3e140b";
|
|
111
113
|
$29add1fad43dc941$export$f39a09f249340e2a = "focus-ring_3e140b";
|
|
114
|
+
$29add1fad43dc941$export$87b15021e28e067a = "spectrum-Tabs--emphasized_3e140b";
|
|
112
115
|
$29add1fad43dc941$export$b8813cd5d7824ce7 = "is-hovered_3e140b";
|
|
113
116
|
$29add1fad43dc941$export$1e0fb04f31d3c22a = "is-selected_3e140b";
|
|
114
117
|
|
|
@@ -294,7 +297,7 @@ function $e8d58e7e32285ba6$var$TabLine(props) {
|
|
|
294
297
|
function $e8d58e7e32285ba6$export$e51a686c67fdaa2d(props) {
|
|
295
298
|
const tabContext = $8zXxA$react.useContext($e8d58e7e32285ba6$var$TabContext);
|
|
296
299
|
const { refs: refs , tabState: tabState , tabProps: tabProps , tabPanelProps: tabPanelProps } = tabContext;
|
|
297
|
-
const { isQuiet: isQuiet , density: density , isDisabled: isDisabled , orientation: orientation } = tabProps;
|
|
300
|
+
const { isQuiet: isQuiet , density: density , isDisabled: isDisabled , isEmphasized: isEmphasized , orientation: orientation } = tabProps;
|
|
298
301
|
const { selectedTab: selectedTab , collapse: collapse , setTabListState: setTabListState } = tabState;
|
|
299
302
|
const { tablistRef: tablistRef , wrapperRef: wrapperRef } = refs;
|
|
300
303
|
// Pass original Tab props but override children to create the collection.
|
|
@@ -326,6 +329,7 @@ function $e8d58e7e32285ba6$export$e51a686c67fdaa2d(props) {
|
|
|
326
329
|
ref: tablistRef,
|
|
327
330
|
className: $8zXxA$reactspectrumutils.classNames((/*@__PURE__*/$parcel$interopDefault($29add1fad43dc941$exports)), 'spectrum-Tabs', `spectrum-Tabs--${orientation}`, tabListclassName, {
|
|
328
331
|
'spectrum-Tabs--quiet': isQuiet,
|
|
332
|
+
'spectrum-Tabs--emphasized': isEmphasized,
|
|
329
333
|
['spectrum-Tabs--compact']: density === 'compact'
|
|
330
334
|
}, orientation === 'vertical' && styleProps.className)
|
|
331
335
|
}, [
|
|
@@ -389,7 +393,7 @@ function $e8d58e7e32285ba6$var$TabPanel(props) {
|
|
|
389
393
|
}, props.children)));
|
|
390
394
|
}
|
|
391
395
|
function $e8d58e7e32285ba6$var$TabPicker(props) {
|
|
392
|
-
let { isDisabled: isDisabled , isQuiet: isQuiet , state: state , 'aria-labelledby': ariaLabeledBy , 'aria-label': ariaLabel , density: density , className: className , id: id } = props;
|
|
396
|
+
let { isDisabled: isDisabled , isEmphasized: isEmphasized , isQuiet: isQuiet , state: state , 'aria-labelledby': ariaLabeledBy , 'aria-label': ariaLabel , density: density , className: className , id: id } = props;
|
|
393
397
|
let ref = $8zXxA$react.useRef();
|
|
394
398
|
let [pickerNode, setPickerNode] = $8zXxA$react.useState(null);
|
|
395
399
|
$8zXxA$react.useEffect(()=>{
|
|
@@ -414,7 +418,8 @@ function $e8d58e7e32285ba6$var$TabPicker(props) {
|
|
|
414
418
|
return(/*#__PURE__*/ ($parcel$interopDefault($8zXxA$react)).createElement("div", {
|
|
415
419
|
className: $8zXxA$reactspectrumutils.classNames((/*@__PURE__*/$parcel$interopDefault($29add1fad43dc941$exports)), 'spectrum-Tabs', 'spectrum-Tabs--horizontal', 'spectrum-Tabs--isCollapsed', {
|
|
416
420
|
'spectrum-Tabs--quiet': isQuiet,
|
|
417
|
-
['spectrum-Tabs--compact']: density === 'compact'
|
|
421
|
+
['spectrum-Tabs--compact']: density === 'compact',
|
|
422
|
+
'spectrum-Tabs--emphasized': isEmphasized
|
|
418
423
|
}, className)
|
|
419
424
|
}, /*#__PURE__*/ ($parcel$interopDefault($8zXxA$react)).createElement($8zXxA$reactspectrumutils.SlotProvider, {
|
|
420
425
|
slots: {
|
package/dist/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/tabs/src/index.ts","packages/@react-spectrum/tabs/src/Tabs.tsx","packages/@adobe/spectrum-css-temp/components/tabs/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport * from './Tabs';\nexport {Item} from '@react-stately/collections';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {classNames, SlotProvider, unwrapDOMRef, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {DOMProps, DOMRef, Node, Orientation} from '@react-types/shared';\nimport {filterDOMProps, useValueEffect} from '@react-aria/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {Item, Picker} from '@react-spectrum/picker';\nimport {ListCollection, SingleSelectListState} from '@react-stately/list';\nimport {mergeProps, useId, useLayoutEffect} from '@react-aria/utils';\nimport React, {Key, MutableRefObject, ReactElement, useCallback, useContext, useEffect, useRef, useState} from 'react';\nimport {SpectrumPickerProps} from '@react-types/select';\nimport {SpectrumTabListProps, SpectrumTabPanelsProps, SpectrumTabsProps} from '@react-types/tabs';\nimport styles from '@adobe/spectrum-css-temp/components/tabs/vars.css';\nimport {TabListState, useTabListState} from '@react-stately/tabs';\nimport {Text} from '@react-spectrum/text';\nimport {useCollection} from '@react-stately/collections';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale} from '@react-aria/i18n';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\nimport {useResizeObserver} from '@react-aria/utils';\nimport {useTab, useTabList, useTabPanel} from '@react-aria/tabs';\n\ninterface TabsContext<T> {\n tabProps: SpectrumTabsProps<T>,\n tabState: {\n tabListState: TabListState<T>,\n setTabListState: (state: TabListState<T>) => void,\n selectedTab: HTMLElement,\n collapse: boolean\n },\n refs: {\n wrapperRef: MutableRefObject<HTMLDivElement>,\n tablistRef: MutableRefObject<HTMLDivElement>\n },\n tabPanelProps: {\n 'aria-labelledby': string\n }\n}\n\nconst TabContext = React.createContext<TabsContext<any>>(null);\n\nfunction Tabs<T extends object>(props: SpectrumTabsProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let {\n orientation = 'horizontal' as Orientation,\n density = 'regular',\n children,\n ...otherProps\n } = props;\n\n let domRef = useDOMRef(ref);\n let tablistRef = useRef<HTMLDivElement>();\n let wrapperRef = useRef<HTMLDivElement>();\n\n let {direction} = useLocale();\n let {styleProps} = useStyleProps(otherProps);\n let [collapse, setCollapse] = useValueEffect(false);\n let [selectedTab, setSelectedTab] = useState<HTMLElement>();\n const [tabListState, setTabListState] = useState<TabListState<T>>(null);\n\n useEffect(() => {\n if (tablistRef.current) {\n let selectedTab: HTMLElement = tablistRef.current.querySelector(`[data-key=\"${tabListState?.selectedKey}\"]`);\n\n if (selectedTab != null) {\n setSelectedTab(selectedTab);\n }\n }\n // collapse is in the dep array so selectedTab can be updated for TabLine positioning\n }, [children, tabListState?.selectedKey, collapse, tablistRef]);\n\n let checkShouldCollapse = useCallback(() => {\n let computeShouldCollapse = () => {\n if (wrapperRef.current) {\n let tabsComponent = wrapperRef.current;\n let tabs = tablistRef.current.querySelectorAll('[role=\"tab\"]');\n let lastTab = tabs[tabs.length - 1];\n\n let end = direction === 'rtl' ? 'left' : 'right';\n let farEdgeTabList = tabsComponent.getBoundingClientRect()[end];\n let farEdgeLastTab = lastTab?.getBoundingClientRect()[end];\n let shouldCollapse = direction === 'rtl' ? farEdgeLastTab < farEdgeTabList : farEdgeTabList < farEdgeLastTab;\n\n return shouldCollapse;\n }\n };\n\n if (orientation !== 'vertical') {\n setCollapse(function* () {\n // Make Tabs render in non-collapsed state\n yield false;\n\n // Compute if Tabs should collapse and update\n yield computeShouldCollapse();\n });\n }\n }, [tablistRef, wrapperRef, direction, orientation, setCollapse]);\n\n useEffect(() => {\n checkShouldCollapse();\n }, [children, checkShouldCollapse]);\n\n useResizeObserver({ref: wrapperRef, onResize: checkShouldCollapse});\n\n let tabPanelProps = {\n 'aria-labelledby': undefined\n };\n\n // When the tabs are collapsed, the tabPanel should be labelled by the Picker button element.\n let collapsibleTabListId = useId();\n if (collapse && orientation !== 'vertical') {\n tabPanelProps['aria-labelledby'] = collapsibleTabListId;\n }\n return (\n <TabContext.Provider\n value={{\n tabProps: {...props, orientation, density},\n tabState: {tabListState, setTabListState, selectedTab, collapse},\n refs: {tablistRef, wrapperRef},\n tabPanelProps\n }}>\n <div\n {...filterDOMProps(otherProps)}\n {...styleProps}\n ref={domRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel',\n `spectrum-TabsPanel--${orientation}`,\n styleProps.className\n )}>\n {props.children}\n </div>\n </TabContext.Provider>\n );\n}\n\ninterface TabProps<T> extends DOMProps {\n item: Node<T>,\n state: SingleSelectListState<T>,\n isDisabled?: boolean,\n orientation?: Orientation\n}\n\n// @private\nfunction Tab<T>(props: TabProps<T>) {\n let {item, state, isDisabled: propsDisabled} = props;\n let {key, rendered} = item;\n let isDisabled = propsDisabled || state.disabledKeys.has(key);\n\n let ref = useRef<HTMLDivElement>();\n let {tabProps} = useTab({key, isDisabled}, state, ref);\n\n let {hoverProps, isHovered} = useHover({\n ...props\n });\n let isSelected = state.selectedKey === key;\n let domProps = filterDOMProps(item.props);\n delete domProps.id;\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div\n {...mergeProps(tabProps, hoverProps, domProps)}\n ref={ref}\n className={classNames(\n styles,\n 'spectrum-Tabs-item',\n {\n 'is-selected': isSelected,\n 'is-disabled': isDisabled,\n 'is-hovered': isHovered\n }\n )}>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n text: {\n UNSAFE_className: classNames(styles, 'spectrum-Tabs-itemLabel')\n }\n }}>\n {typeof rendered === 'string'\n ? <Text>{rendered}</Text>\n : rendered}\n </SlotProvider>\n </div>\n </FocusRing>\n );\n}\n\ninterface TabLineProps {\n orientation?: Orientation,\n selectedTab?: HTMLElement,\n selectedKey?: Key\n}\n\n// @private\nfunction TabLine(props: TabLineProps) {\n let {\n orientation,\n // Is either the tab node (non-collapsed) or the picker node (collapsed)\n selectedTab,\n // selectedKey is provided so that the TabLine styles are updated when the TabPicker's width updates from a selection change\n selectedKey\n } = props;\n\n let {direction} = useLocale();\n let {scale} = useProvider();\n\n let [style, setStyle] = useState({\n width: undefined,\n height: undefined\n });\n\n useLayoutEffect(() => {\n if (selectedTab) {\n let styleObj = {transform: undefined, width: undefined, height: undefined};\n // In RTL, calculate the transform from the right edge of the tablist so that resizing the window doesn't break the Tabline position due to offsetLeft changes\n let offset = direction === 'rtl' ? -1 * ((selectedTab.offsetParent as HTMLElement)?.offsetWidth - selectedTab.offsetWidth - selectedTab.offsetLeft) : selectedTab.offsetLeft;\n styleObj.transform = orientation === 'vertical'\n ? `translateY(${selectedTab.offsetTop}px)`\n : `translateX(${offset}px)`;\n\n if (orientation === 'horizontal') {\n styleObj.width = `${selectedTab.offsetWidth}px`;\n } else {\n styleObj.height = `${selectedTab.offsetHeight}px`;\n }\n setStyle(styleObj);\n }\n\n }, [direction, setStyle, selectedTab, orientation, scale, selectedKey]);\n\n return <div className={classNames(styles, 'spectrum-Tabs-selectionIndicator')} role=\"presentation\" style={style} />;\n}\n\n/**\n * A TabList is used within Tabs to group tabs that a user can switch between.\n * The keys of the items within the <TabList> must match up with a corresponding item inside the <TabPanels>.\n */\nexport function TabList<T>(props: SpectrumTabListProps<T>) {\n const tabContext = useContext(TabContext);\n const {refs, tabState, tabProps, tabPanelProps} = tabContext;\n const {isQuiet, density, isDisabled, orientation} = tabProps;\n const {selectedTab, collapse, setTabListState} = tabState;\n const {tablistRef, wrapperRef} = refs;\n // Pass original Tab props but override children to create the collection.\n const state = useTabListState({...tabProps, children: props.children});\n\n let {styleProps} = useStyleProps(props);\n const {tabListProps} = useTabList({...tabProps, ...props}, state, tablistRef);\n\n useEffect(() => {\n // Passing back to root as useTabPanel needs the TabListState\n setTabListState(state);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [state.disabledKeys, state.selectedItem, state.selectedKey, props.children]);\n let stylePropsForVertical = orientation === 'vertical' ? styleProps : {};\n\n let tabListclassName = classNames(styles, 'spectrum-TabsPanel-tabs');\n const tabContent = (\n <div\n {...stylePropsForVertical}\n {...tabListProps}\n ref={tablistRef}\n className={classNames(\n styles,\n 'spectrum-Tabs',\n `spectrum-Tabs--${orientation}`,\n tabListclassName,\n {\n 'spectrum-Tabs--quiet': isQuiet,\n ['spectrum-Tabs--compact']: density === 'compact'\n },\n orientation === 'vertical' && styleProps.className\n )\n }>\n {[...state.collection].map((item) => (\n <Tab key={item.key} item={item} state={state} isDisabled={isDisabled} orientation={orientation} />\n ))}\n <TabLine orientation={orientation} selectedTab={selectedTab} />\n </div>\n );\n\n\n if (orientation === 'vertical') {\n return tabContent;\n } else {\n return (\n <div\n {...styleProps}\n ref={wrapperRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel-collapseWrapper',\n styleProps.className\n )}>\n {collapse ? <TabPicker {...props} {...tabProps} id={tabPanelProps['aria-labelledby']} state={state} className={tabListclassName} /> : tabContent}\n </div>\n );\n }\n}\n\n/**\n * TabPanels is used within Tabs as a container for the content of each tab.\n * The keys of the items within the <TabPanels> must match up with a corresponding item inside the <TabList>.\n */\nexport function TabPanels<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabProps} = useContext(TabContext);\n const {tabListState} = tabState;\n\n const factory = nodes => new ListCollection(nodes);\n const collection = useCollection({items: tabProps.items, ...props}, factory, {suppressTextValueWarning: true});\n const selectedItem = tabListState ? collection.getItem(tabListState.selectedKey) : null;\n\n return (\n <TabPanel {...props} key={tabListState?.selectedKey}>\n {selectedItem && selectedItem.props.children}\n </TabPanel>\n );\n}\n\n// @private\nfunction TabPanel<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabPanelProps: ctxTabPanelProps} = useContext(TabContext);\n const {tabListState} = tabState;\n let ref = useRef();\n const {tabPanelProps} = useTabPanel(props, tabListState, ref);\n let {styleProps} = useStyleProps(props);\n\n if (ctxTabPanelProps['aria-labelledby']) {\n tabPanelProps['aria-labelledby'] = ctxTabPanelProps['aria-labelledby'];\n }\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div {...styleProps} {...tabPanelProps} ref={ref} className={classNames(styles, 'spectrum-TabsPanel-tabpanel', styleProps.className)}>\n {props.children}\n </div>\n </FocusRing>\n );\n}\n\ninterface TabPickerProps<T> extends Omit<SpectrumPickerProps<T>, 'children'> {\n density?: 'compact' | 'regular',\n state: SingleSelectListState<T>,\n className?: string\n}\n\nfunction TabPicker<T>(props: TabPickerProps<T>) {\n let {\n isDisabled,\n isQuiet,\n state,\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel,\n density,\n className,\n id\n } = props;\n\n let ref = useRef();\n let [pickerNode, setPickerNode] = useState(null);\n\n useEffect(() => {\n let node = unwrapDOMRef(ref);\n setPickerNode(node.current);\n }, [ref]);\n\n let items = [...state.collection].map((item) => ({\n rendered: item.rendered,\n textValue: item.textValue,\n id: item.key\n }));\n\n let pickerProps = {\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel\n };\n\n // TODO: Figure out if tabListProps should go onto the div here, v2 doesn't do it\n return (\n <div\n className={classNames(\n styles,\n 'spectrum-Tabs',\n 'spectrum-Tabs--horizontal',\n 'spectrum-Tabs--isCollapsed',\n {\n 'spectrum-Tabs--quiet': isQuiet,\n ['spectrum-Tabs--compact']: density === 'compact'\n },\n className\n )}>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n button: {\n focusRingClass: classNames(styles, 'focus-ring')\n }\n }}>\n <Picker\n {...pickerProps}\n id={id}\n items={items}\n ref={ref}\n isQuiet\n isDisabled={isDisabled}\n selectedKey={state.selectedKey}\n disabledKeys={state.disabledKeys}\n onSelectionChange={state.setSelectedKey}>\n {item => <Item textValue={item.textValue}>{item.rendered}</Item>}\n </Picker>\n {pickerNode && <TabLine orientation=\"horizontal\" selectedTab={pickerNode} selectedKey={state.selectedKey} />}\n </SlotProvider>\n </div>\n );\n}\n\n/**\n * Tabs organize content into multiple sections and allow users to navigate between them. The content under the set of tabs should be related and form a coherent unit.\n */\n// forwardRef doesn't support generic parameters, so cast the result to the correct type\n// https://stackoverflow.com/questions/58469229/react-with-typescript-generics-while-using-react-forwardref\nconst _Tabs = React.forwardRef(Tabs) as <T>(props: SpectrumTabsProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_Tabs as Tabs};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/tabs/src/index.ts","packages/@react-spectrum/tabs/src/Tabs.tsx","packages/@adobe/spectrum-css-temp/components/tabs/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport * from './Tabs';\nexport {Item} from '@react-stately/collections';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {classNames, SlotProvider, unwrapDOMRef, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {DOMProps, DOMRef, Node, Orientation} from '@react-types/shared';\nimport {filterDOMProps, useValueEffect} from '@react-aria/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {Item, Picker} from '@react-spectrum/picker';\nimport {ListCollection, SingleSelectListState} from '@react-stately/list';\nimport {mergeProps, useId, useLayoutEffect} from '@react-aria/utils';\nimport React, {Key, MutableRefObject, ReactElement, useCallback, useContext, useEffect, useRef, useState} from 'react';\nimport {SpectrumPickerProps} from '@react-types/select';\nimport {SpectrumTabListProps, SpectrumTabPanelsProps, SpectrumTabsProps} from '@react-types/tabs';\nimport styles from '@adobe/spectrum-css-temp/components/tabs/vars.css';\nimport {TabListState, useTabListState} from '@react-stately/tabs';\nimport {Text} from '@react-spectrum/text';\nimport {useCollection} from '@react-stately/collections';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale} from '@react-aria/i18n';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\nimport {useResizeObserver} from '@react-aria/utils';\nimport {useTab, useTabList, useTabPanel} from '@react-aria/tabs';\n\ninterface TabsContext<T> {\n tabProps: SpectrumTabsProps<T>,\n tabState: {\n tabListState: TabListState<T>,\n setTabListState: (state: TabListState<T>) => void,\n selectedTab: HTMLElement,\n collapse: boolean\n },\n refs: {\n wrapperRef: MutableRefObject<HTMLDivElement>,\n tablistRef: MutableRefObject<HTMLDivElement>\n },\n tabPanelProps: {\n 'aria-labelledby': string\n }\n}\n\nconst TabContext = React.createContext<TabsContext<any>>(null);\n\nfunction Tabs<T extends object>(props: SpectrumTabsProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let {\n orientation = 'horizontal' as Orientation,\n density = 'regular',\n children,\n ...otherProps\n } = props;\n\n let domRef = useDOMRef(ref);\n let tablistRef = useRef<HTMLDivElement>();\n let wrapperRef = useRef<HTMLDivElement>();\n\n let {direction} = useLocale();\n let {styleProps} = useStyleProps(otherProps);\n let [collapse, setCollapse] = useValueEffect(false);\n let [selectedTab, setSelectedTab] = useState<HTMLElement>();\n const [tabListState, setTabListState] = useState<TabListState<T>>(null);\n\n useEffect(() => {\n if (tablistRef.current) {\n let selectedTab: HTMLElement = tablistRef.current.querySelector(`[data-key=\"${tabListState?.selectedKey}\"]`);\n\n if (selectedTab != null) {\n setSelectedTab(selectedTab);\n }\n }\n // collapse is in the dep array so selectedTab can be updated for TabLine positioning\n }, [children, tabListState?.selectedKey, collapse, tablistRef]);\n\n let checkShouldCollapse = useCallback(() => {\n let computeShouldCollapse = () => {\n if (wrapperRef.current) {\n let tabsComponent = wrapperRef.current;\n let tabs = tablistRef.current.querySelectorAll('[role=\"tab\"]');\n let lastTab = tabs[tabs.length - 1];\n\n let end = direction === 'rtl' ? 'left' : 'right';\n let farEdgeTabList = tabsComponent.getBoundingClientRect()[end];\n let farEdgeLastTab = lastTab?.getBoundingClientRect()[end];\n let shouldCollapse = direction === 'rtl' ? farEdgeLastTab < farEdgeTabList : farEdgeTabList < farEdgeLastTab;\n\n return shouldCollapse;\n }\n };\n\n if (orientation !== 'vertical') {\n setCollapse(function* () {\n // Make Tabs render in non-collapsed state\n yield false;\n\n // Compute if Tabs should collapse and update\n yield computeShouldCollapse();\n });\n }\n }, [tablistRef, wrapperRef, direction, orientation, setCollapse]);\n\n useEffect(() => {\n checkShouldCollapse();\n }, [children, checkShouldCollapse]);\n\n useResizeObserver({ref: wrapperRef, onResize: checkShouldCollapse});\n\n let tabPanelProps = {\n 'aria-labelledby': undefined\n };\n\n // When the tabs are collapsed, the tabPanel should be labelled by the Picker button element.\n let collapsibleTabListId = useId();\n if (collapse && orientation !== 'vertical') {\n tabPanelProps['aria-labelledby'] = collapsibleTabListId;\n }\n return (\n <TabContext.Provider\n value={{\n tabProps: {...props, orientation, density},\n tabState: {tabListState, setTabListState, selectedTab, collapse},\n refs: {tablistRef, wrapperRef},\n tabPanelProps\n }}>\n <div\n {...filterDOMProps(otherProps)}\n {...styleProps}\n ref={domRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel',\n `spectrum-TabsPanel--${orientation}`,\n styleProps.className\n )}>\n {props.children}\n </div>\n </TabContext.Provider>\n );\n}\n\ninterface TabProps<T> extends DOMProps {\n item: Node<T>,\n state: SingleSelectListState<T>,\n isDisabled?: boolean,\n orientation?: Orientation\n}\n\n// @private\nfunction Tab<T>(props: TabProps<T>) {\n let {item, state, isDisabled: propsDisabled} = props;\n let {key, rendered} = item;\n let isDisabled = propsDisabled || state.disabledKeys.has(key);\n\n let ref = useRef<HTMLDivElement>();\n let {tabProps} = useTab({key, isDisabled}, state, ref);\n\n let {hoverProps, isHovered} = useHover({\n ...props\n });\n let isSelected = state.selectedKey === key;\n let domProps = filterDOMProps(item.props);\n delete domProps.id;\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div\n {...mergeProps(tabProps, hoverProps, domProps)}\n ref={ref}\n className={classNames(\n styles,\n 'spectrum-Tabs-item',\n {\n 'is-selected': isSelected,\n 'is-disabled': isDisabled,\n 'is-hovered': isHovered\n }\n )}>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n text: {\n UNSAFE_className: classNames(styles, 'spectrum-Tabs-itemLabel')\n }\n }}>\n {typeof rendered === 'string'\n ? <Text>{rendered}</Text>\n : rendered}\n </SlotProvider>\n </div>\n </FocusRing>\n );\n}\n\ninterface TabLineProps {\n orientation?: Orientation,\n selectedTab?: HTMLElement,\n selectedKey?: Key\n}\n\n// @private\nfunction TabLine(props: TabLineProps) {\n let {\n orientation,\n // Is either the tab node (non-collapsed) or the picker node (collapsed)\n selectedTab,\n // selectedKey is provided so that the TabLine styles are updated when the TabPicker's width updates from a selection change\n selectedKey\n } = props;\n\n let {direction} = useLocale();\n let {scale} = useProvider();\n\n let [style, setStyle] = useState({\n width: undefined,\n height: undefined\n });\n\n useLayoutEffect(() => {\n if (selectedTab) {\n let styleObj = {transform: undefined, width: undefined, height: undefined};\n // In RTL, calculate the transform from the right edge of the tablist so that resizing the window doesn't break the Tabline position due to offsetLeft changes\n let offset = direction === 'rtl' ? -1 * ((selectedTab.offsetParent as HTMLElement)?.offsetWidth - selectedTab.offsetWidth - selectedTab.offsetLeft) : selectedTab.offsetLeft;\n styleObj.transform = orientation === 'vertical'\n ? `translateY(${selectedTab.offsetTop}px)`\n : `translateX(${offset}px)`;\n\n if (orientation === 'horizontal') {\n styleObj.width = `${selectedTab.offsetWidth}px`;\n } else {\n styleObj.height = `${selectedTab.offsetHeight}px`;\n }\n setStyle(styleObj);\n }\n\n }, [direction, setStyle, selectedTab, orientation, scale, selectedKey]);\n\n return <div className={classNames(styles, 'spectrum-Tabs-selectionIndicator')} role=\"presentation\" style={style} />;\n}\n\n/**\n * A TabList is used within Tabs to group tabs that a user can switch between.\n * The keys of the items within the <TabList> must match up with a corresponding item inside the <TabPanels>.\n */\nexport function TabList<T>(props: SpectrumTabListProps<T>) {\n const tabContext = useContext(TabContext);\n const {refs, tabState, tabProps, tabPanelProps} = tabContext;\n const {isQuiet, density, isDisabled, isEmphasized, orientation} = tabProps;\n const {selectedTab, collapse, setTabListState} = tabState;\n const {tablistRef, wrapperRef} = refs;\n // Pass original Tab props but override children to create the collection.\n const state = useTabListState({...tabProps, children: props.children});\n\n let {styleProps} = useStyleProps(props);\n const {tabListProps} = useTabList({...tabProps, ...props}, state, tablistRef);\n\n useEffect(() => {\n // Passing back to root as useTabPanel needs the TabListState\n setTabListState(state);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [state.disabledKeys, state.selectedItem, state.selectedKey, props.children]);\n let stylePropsForVertical = orientation === 'vertical' ? styleProps : {};\n\n let tabListclassName = classNames(styles, 'spectrum-TabsPanel-tabs');\n const tabContent = (\n <div\n {...stylePropsForVertical}\n {...tabListProps}\n ref={tablistRef}\n className={classNames(\n styles,\n 'spectrum-Tabs',\n `spectrum-Tabs--${orientation}`,\n tabListclassName,\n {\n 'spectrum-Tabs--quiet': isQuiet,\n 'spectrum-Tabs--emphasized': isEmphasized,\n ['spectrum-Tabs--compact']: density === 'compact'\n },\n orientation === 'vertical' && styleProps.className\n )\n }>\n {[...state.collection].map((item) => (\n <Tab key={item.key} item={item} state={state} isDisabled={isDisabled} orientation={orientation} />\n ))}\n <TabLine orientation={orientation} selectedTab={selectedTab} />\n </div>\n );\n\n\n if (orientation === 'vertical') {\n return tabContent;\n } else {\n return (\n <div\n {...styleProps}\n ref={wrapperRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel-collapseWrapper',\n styleProps.className\n )}>\n {collapse ? <TabPicker {...props} {...tabProps} id={tabPanelProps['aria-labelledby']} state={state} className={tabListclassName} /> : tabContent}\n </div>\n );\n }\n}\n\n/**\n * TabPanels is used within Tabs as a container for the content of each tab.\n * The keys of the items within the <TabPanels> must match up with a corresponding item inside the <TabList>.\n */\nexport function TabPanels<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabProps} = useContext(TabContext);\n const {tabListState} = tabState;\n\n const factory = nodes => new ListCollection(nodes);\n const collection = useCollection({items: tabProps.items, ...props}, factory, {suppressTextValueWarning: true});\n const selectedItem = tabListState ? collection.getItem(tabListState.selectedKey) : null;\n\n return (\n <TabPanel {...props} key={tabListState?.selectedKey}>\n {selectedItem && selectedItem.props.children}\n </TabPanel>\n );\n}\n\n// @private\nfunction TabPanel<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabPanelProps: ctxTabPanelProps} = useContext(TabContext);\n const {tabListState} = tabState;\n let ref = useRef();\n const {tabPanelProps} = useTabPanel(props, tabListState, ref);\n let {styleProps} = useStyleProps(props);\n\n if (ctxTabPanelProps['aria-labelledby']) {\n tabPanelProps['aria-labelledby'] = ctxTabPanelProps['aria-labelledby'];\n }\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div {...styleProps} {...tabPanelProps} ref={ref} className={classNames(styles, 'spectrum-TabsPanel-tabpanel', styleProps.className)}>\n {props.children}\n </div>\n </FocusRing>\n );\n}\n\ninterface TabPickerProps<T> extends Omit<SpectrumPickerProps<T>, 'children'> {\n density?: 'compact' | 'regular',\n isEmphasized?: boolean,\n state: SingleSelectListState<T>,\n className?: string\n}\n\nfunction TabPicker<T>(props: TabPickerProps<T>) {\n let {\n isDisabled,\n isEmphasized,\n isQuiet,\n state,\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel,\n density,\n className,\n id\n } = props;\n\n let ref = useRef();\n let [pickerNode, setPickerNode] = useState(null);\n\n useEffect(() => {\n let node = unwrapDOMRef(ref);\n setPickerNode(node.current);\n }, [ref]);\n\n let items = [...state.collection].map((item) => ({\n rendered: item.rendered,\n textValue: item.textValue,\n id: item.key\n }));\n\n let pickerProps = {\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel\n };\n\n // TODO: Figure out if tabListProps should go onto the div here, v2 doesn't do it\n return (\n <div\n className={classNames(\n styles,\n 'spectrum-Tabs',\n 'spectrum-Tabs--horizontal',\n 'spectrum-Tabs--isCollapsed',\n {\n 'spectrum-Tabs--quiet': isQuiet,\n ['spectrum-Tabs--compact']: density === 'compact',\n 'spectrum-Tabs--emphasized': isEmphasized\n },\n className\n )}>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n button: {\n focusRingClass: classNames(styles, 'focus-ring')\n }\n }}>\n <Picker\n {...pickerProps}\n id={id}\n items={items}\n ref={ref}\n isQuiet\n isDisabled={isDisabled}\n selectedKey={state.selectedKey}\n disabledKeys={state.disabledKeys}\n onSelectionChange={state.setSelectedKey}>\n {item => <Item textValue={item.textValue}>{item.rendered}</Item>}\n </Picker>\n {pickerNode && <TabLine orientation=\"horizontal\" selectedTab={pickerNode} selectedKey={state.selectedKey} />}\n </SlotProvider>\n </div>\n );\n}\n\n/**\n * Tabs organize content into multiple sections and allow users to navigate between them. The content under the set of tabs should be related and form a coherent unit.\n */\n// forwardRef doesn't support generic parameters, so cast the result to the correct type\n// https://stackoverflow.com/questions/58469229/react-with-typescript-generics-while-using-react-forwardref\nconst _Tabs = React.forwardRef(Tabs) as <T>(props: SpectrumTabsProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_Tabs as Tabs};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"main.js.map"}
|
package/dist/module.js
CHANGED
|
@@ -51,6 +51,7 @@ $parcel$export($32d597b82a7aad64$exports, "spectrum-TabsPanel-collapseWrapper",
|
|
|
51
51
|
$parcel$export($32d597b82a7aad64$exports, "spectrum-TabsPanel-tabs", () => $32d597b82a7aad64$export$4a157a691c854e23, (v) => $32d597b82a7aad64$export$4a157a691c854e23 = v);
|
|
52
52
|
$parcel$export($32d597b82a7aad64$exports, "spectrum-TabsPanel-tabpanel", () => $32d597b82a7aad64$export$acb5da0970288266, (v) => $32d597b82a7aad64$export$acb5da0970288266 = v);
|
|
53
53
|
$parcel$export($32d597b82a7aad64$exports, "focus-ring", () => $32d597b82a7aad64$export$f39a09f249340e2a, (v) => $32d597b82a7aad64$export$f39a09f249340e2a = v);
|
|
54
|
+
$parcel$export($32d597b82a7aad64$exports, "spectrum-Tabs--emphasized", () => $32d597b82a7aad64$export$87b15021e28e067a, (v) => $32d597b82a7aad64$export$87b15021e28e067a = v);
|
|
54
55
|
$parcel$export($32d597b82a7aad64$exports, "is-hovered", () => $32d597b82a7aad64$export$b8813cd5d7824ce7, (v) => $32d597b82a7aad64$export$b8813cd5d7824ce7 = v);
|
|
55
56
|
$parcel$export($32d597b82a7aad64$exports, "is-selected", () => $32d597b82a7aad64$export$1e0fb04f31d3c22a, (v) => $32d597b82a7aad64$export$1e0fb04f31d3c22a = v);
|
|
56
57
|
var $32d597b82a7aad64$export$34f1a65c57bb7bb;
|
|
@@ -71,6 +72,7 @@ var $32d597b82a7aad64$export$e09869956b4c96f2;
|
|
|
71
72
|
var $32d597b82a7aad64$export$4a157a691c854e23;
|
|
72
73
|
var $32d597b82a7aad64$export$acb5da0970288266;
|
|
73
74
|
var $32d597b82a7aad64$export$f39a09f249340e2a;
|
|
75
|
+
var $32d597b82a7aad64$export$87b15021e28e067a;
|
|
74
76
|
var $32d597b82a7aad64$export$b8813cd5d7824ce7;
|
|
75
77
|
var $32d597b82a7aad64$export$1e0fb04f31d3c22a;
|
|
76
78
|
$32d597b82a7aad64$export$34f1a65c57bb7bb = "spectrum-TabsPanel_3e140b";
|
|
@@ -91,6 +93,7 @@ $32d597b82a7aad64$export$e09869956b4c96f2 = "spectrum-TabsPanel-collapseWrapper_
|
|
|
91
93
|
$32d597b82a7aad64$export$4a157a691c854e23 = "spectrum-TabsPanel-tabs_3e140b";
|
|
92
94
|
$32d597b82a7aad64$export$acb5da0970288266 = "spectrum-TabsPanel-tabpanel_3e140b";
|
|
93
95
|
$32d597b82a7aad64$export$f39a09f249340e2a = "focus-ring_3e140b";
|
|
96
|
+
$32d597b82a7aad64$export$87b15021e28e067a = "spectrum-Tabs--emphasized_3e140b";
|
|
94
97
|
$32d597b82a7aad64$export$b8813cd5d7824ce7 = "is-hovered_3e140b";
|
|
95
98
|
$32d597b82a7aad64$export$1e0fb04f31d3c22a = "is-selected_3e140b";
|
|
96
99
|
|
|
@@ -276,7 +279,7 @@ function $65ab70ddbed1564b$var$TabLine(props) {
|
|
|
276
279
|
function $65ab70ddbed1564b$export$e51a686c67fdaa2d(props) {
|
|
277
280
|
const tabContext = $cLzzU$useContext($65ab70ddbed1564b$var$TabContext);
|
|
278
281
|
const { refs: refs , tabState: tabState , tabProps: tabProps , tabPanelProps: tabPanelProps } = tabContext;
|
|
279
|
-
const { isQuiet: isQuiet , density: density , isDisabled: isDisabled , orientation: orientation } = tabProps;
|
|
282
|
+
const { isQuiet: isQuiet , density: density , isDisabled: isDisabled , isEmphasized: isEmphasized , orientation: orientation } = tabProps;
|
|
280
283
|
const { selectedTab: selectedTab , collapse: collapse , setTabListState: setTabListState } = tabState;
|
|
281
284
|
const { tablistRef: tablistRef , wrapperRef: wrapperRef } = refs;
|
|
282
285
|
// Pass original Tab props but override children to create the collection.
|
|
@@ -308,6 +311,7 @@ function $65ab70ddbed1564b$export$e51a686c67fdaa2d(props) {
|
|
|
308
311
|
ref: tablistRef,
|
|
309
312
|
className: $cLzzU$classNames((/*@__PURE__*/$parcel$interopDefault($32d597b82a7aad64$exports)), 'spectrum-Tabs', `spectrum-Tabs--${orientation}`, tabListclassName, {
|
|
310
313
|
'spectrum-Tabs--quiet': isQuiet,
|
|
314
|
+
'spectrum-Tabs--emphasized': isEmphasized,
|
|
311
315
|
['spectrum-Tabs--compact']: density === 'compact'
|
|
312
316
|
}, orientation === 'vertical' && styleProps.className)
|
|
313
317
|
}, [
|
|
@@ -371,7 +375,7 @@ function $65ab70ddbed1564b$var$TabPanel(props) {
|
|
|
371
375
|
}, props.children)));
|
|
372
376
|
}
|
|
373
377
|
function $65ab70ddbed1564b$var$TabPicker(props) {
|
|
374
|
-
let { isDisabled: isDisabled , isQuiet: isQuiet , state: state , 'aria-labelledby': ariaLabeledBy , 'aria-label': ariaLabel , density: density , className: className , id: id } = props;
|
|
378
|
+
let { isDisabled: isDisabled , isEmphasized: isEmphasized , isQuiet: isQuiet , state: state , 'aria-labelledby': ariaLabeledBy , 'aria-label': ariaLabel , density: density , className: className , id: id } = props;
|
|
375
379
|
let ref = $cLzzU$useRef();
|
|
376
380
|
let [pickerNode, setPickerNode] = $cLzzU$useState(null);
|
|
377
381
|
$cLzzU$useEffect(()=>{
|
|
@@ -396,7 +400,8 @@ function $65ab70ddbed1564b$var$TabPicker(props) {
|
|
|
396
400
|
return(/*#__PURE__*/ $cLzzU$react.createElement("div", {
|
|
397
401
|
className: $cLzzU$classNames((/*@__PURE__*/$parcel$interopDefault($32d597b82a7aad64$exports)), 'spectrum-Tabs', 'spectrum-Tabs--horizontal', 'spectrum-Tabs--isCollapsed', {
|
|
398
402
|
'spectrum-Tabs--quiet': isQuiet,
|
|
399
|
-
['spectrum-Tabs--compact']: density === 'compact'
|
|
403
|
+
['spectrum-Tabs--compact']: density === 'compact',
|
|
404
|
+
'spectrum-Tabs--emphasized': isEmphasized
|
|
400
405
|
}, className)
|
|
401
406
|
}, /*#__PURE__*/ $cLzzU$react.createElement($cLzzU$SlotProvider, {
|
|
402
407
|
slots: {
|
package/dist/module.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AEAA,GAAoC;AACpC,GAAgD;AAChD,GAA8C;AAC9C,GAA+B;AAC/B,GAAoC;AACpC,GAA6B;AAC7B,GAAyC;AACzC,GAA+B;AAC/B,GAAkD;AAClD,GAA2C;AAC3C,GAAwC;AACxC,GAA4C;AAC5C,GAAsC;AACtC,GAAyC;AACzC,GAAoD;AACpD,GAAyC;AACzC,GAA6C;AAC7C,GAA4B;AAC5B,GAA4B;AAC5B,GAA6B;AAnB7B,wCAAoC,GAAG,CAA2B;AAClE,yCAAgD,GAAG,CAAuC;AAC1F,yCAA8C,GAAG,CAAqC;AACtF,yCAA+B,GAAG,CAAsB;AACxD,yCAAoC,GAAG,CAA2B;AAClE,yCAA6B,GAAG,CAAoB;AACpD,yCAAyC,GAAG,CAAgC;AAC5E,yCAA+B,GAAG,CAAsB;AACxD,yCAAkD,GAAG,CAAyC;AAC9F,yCAA2C,GAAG,CAAkC;AAChF,yCAAwC,GAAG,CAA+B;AAC1E,yCAA4C,GAAG,CAAmC;AAClF,yCAAsC,GAAG,CAA6B;AACtE,yCAAyC,GAAG,CAAgC;AAC5E,yCAAoD,GAAG,CAA2C;AAClG,yCAAyC,GAAG,CAAgC;AAC5E,yCAA6C,GAAG,CAAoC;AACpF,yCAA4B,GAAG,CAAmB;AAClD,yCAA4B,GAAG,CAAmB;AAClD,yCAA6B,GAAG,CAAoB;;;;;;;;;;;AD8BpD,KAAK,CAAC,gCAAU,iBAAG,YAAK,CAAC,aAAa,CAAmB,IAAI;SAEpD,0BAAI,CAAmB,KAA2B,EAAE,GAA2B,EAAE,CAAC;IACzF,KAAK,GAAG,uBAAgB,CAAC,KAAK;IAC9B,GAAG,CAAC,CAAC,cACH,WAAW,GAAG,CAAY,uBAC1B,OAAO,GAAG,CAAS,qBACnB,QAAQ,MACL,UAAU,CACf,CAAC,GAAG,KAAK;IAET,GAAG,CAAC,MAAM,GAAG,gBAAS,CAAC,GAAG;IAC1B,GAAG,CAAC,UAAU,GAAG,aAAM;IACvB,GAAG,CAAC,UAAU,GAAG,aAAM;IAEvB,GAAG,CAAC,CAAC,YAAA,SAAS,EAAA,CAAC,GAAG,gBAAS;IAC3B,GAAG,CAAC,CAAC,aAAA,UAAU,EAAA,CAAC,GAAG,oBAAa,CAAC,UAAU;IAC3C,GAAG,EAAE,QAAQ,EAAE,WAAW,IAAI,qBAAc,CAAC,KAAK;IAClD,GAAG,EAAE,YAAW,EAAE,cAAc,IAAI,eAAQ;IAC5C,KAAK,EAAE,YAAY,EAAE,eAAe,IAAI,eAAQ,CAAkB,IAAI;IAEtE,gBAAS,KAAO,CAAC;QACf,EAAE,EAAE,UAAU,CAAC,OAAO,EAAE,CAAC;YACvB,GAAG,CAAC,WAAW,GAAgB,UAAU,CAAC,OAAO,CAAC,aAAa,EAAE,WAAW,EAAE,YAAY,aAAZ,YAAY,KAAZ,IAAI,CAAJ,CAAyB,GAAzB,IAAI,CAAJ,CAAyB,GAAzB,YAAY,CAAE,WAAW,CAAC,EAAE;YAE1G,EAAE,EAAE,WAAW,IAAI,IAAI,EACrB,cAAc,CAAC,WAAW;QAE9B,CAAC;IACD,EAAqF,AAArF,mFAAqF;IACvF,CAAC,EAAE,CAAC;QAAA,QAAQ;QAAE,YAAY,aAAZ,YAAY,KAAZ,IAAI,CAAJ,CAAyB,GAAzB,IAAI,CAAJ,CAAyB,GAAzB,YAAY,CAAE,WAAW;QAAE,QAAQ;QAAE,UAAU;IAAA,CAAC;IAE9D,GAAG,CAAC,mBAAmB,GAAG,kBAAW,KAAO,CAAC;QAC3C,GAAG,CAAC,qBAAqB,OAAS,CAAC;YACjC,EAAE,EAAE,UAAU,CAAC,OAAO,EAAE,CAAC;gBACvB,GAAG,CAAC,aAAa,GAAG,UAAU,CAAC,OAAO;gBACtC,GAAG,CAAC,IAAI,GAAG,UAAU,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAc;gBAC7D,GAAG,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC;gBAElC,GAAG,CAAC,GAAG,GAAG,SAAS,KAAK,CAAK,OAAG,CAAM,QAAG,CAAO;gBAChD,GAAG,CAAC,cAAc,GAAG,aAAa,CAAC,qBAAqB,GAAG,GAAG;gBAC9D,GAAG,CAAC,cAAc,GAAG,OAAO,aAAP,OAAO,KAAP,IAAI,CAAJ,CAA8B,GAA9B,IAAI,CAAJ,CAA8B,GAA9B,OAAO,CAAE,qBAAqB,GAAG,GAAG;gBACzD,GAAG,CAAC,cAAc,GAAG,SAAS,KAAK,CAAK,OAAG,cAAc,GAAG,cAAc,GAAG,cAAc,GAAG,cAAc;gBAE5G,MAAM,CAAC,cAAc;YACvB,CAAC;QACH,CAAC;QAED,EAAE,EAAE,WAAW,KAAK,CAAU,WAC5B,WAAW,CAAC,QAAQ,IAAK,CAAC;YACxB,EAA0C,AAA1C,wCAA0C;kBACpC,KAAK;YAEX,EAA6C,AAA7C,2CAA6C;kBACvC,qBAAqB;QAC7B,CAAC;IAEL,CAAC,EAAE,CAAC;QAAA,UAAU;QAAE,UAAU;QAAE,SAAS;QAAE,WAAW;QAAE,WAAW;IAAA,CAAC;IAEhE,gBAAS,KAAO,CAAC;QACf,mBAAmB;IACrB,CAAC,EAAE,CAAC;QAAA,QAAQ;QAAE,mBAAmB;IAAA,CAAC;IAElC,wBAAiB,CAAC,CAAC;QAAA,GAAG,EAAE,UAAU;QAAE,QAAQ,EAAE,mBAAmB;IAAA,CAAC;IAElE,GAAG,CAAC,aAAa,GAAG,CAAC;QACnB,CAAiB,kBAAE,SAAS;IAC9B,CAAC;IAED,EAA6F,AAA7F,2FAA6F;IAC7F,GAAG,CAAC,oBAAoB,GAAG,YAAK;IAChC,EAAE,EAAE,QAAQ,IAAI,WAAW,KAAK,CAAU,WACxC,aAAa,CAAC,CAAiB,oBAAI,oBAAoB;IAEzD,MAAM,0CACH,gCAAU,CAAC,QAAQ;QAClB,KAAK,EAAE,CAAC;YACN,QAAQ,EAAE,CAAC;mBAAG,KAAK;6BAAE,WAAW;yBAAE,OAAO;YAAA,CAAC;YAC1C,QAAQ,EAAE,CAAC;8BAAA,YAAY;iCAAE,eAAe;6BAAE,YAAW;0BAAE,QAAQ;YAAA,CAAC;YAChE,IAAI,EAAE,CAAC;4BAAA,UAAU;4BAAE,UAAU;YAAA,CAAC;2BAC9B,aAAa;QACf,CAAC;gDACA,CAAG;WACE,qBAAc,CAAC,UAAU;WACzB,UAAU;QACd,GAAG,EAAE,MAAM;QACX,SAAS,EAAE,iBAAU,CACnB,gEAAM,EACN,CAAoB,sBACnB,oBAAoB,EAAE,WAAW,IAClC,UAAU,CAAC,SAAS;OAErB,KAAK,CAAC,QAAQ;AAIvB,CAAC;AASD,EAAW,AAAX,SAAW;SACF,yBAAG,CAAI,KAAkB,EAAE,CAAC;IACnC,GAAG,CAAC,CAAC,OAAA,IAAI,UAAE,KAAK,GAAE,UAAU,EAAE,aAAa,EAAA,CAAC,GAAG,KAAK;IACpD,GAAG,CAAC,CAAC,MAAA,GAAG,aAAE,QAAQ,EAAA,CAAC,GAAG,IAAI;IAC1B,GAAG,CAAC,UAAU,GAAG,aAAa,IAAI,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG;IAE5D,GAAG,CAAC,GAAG,GAAG,aAAM;IAChB,GAAG,CAAC,CAAC,WAAA,QAAQ,EAAA,CAAC,GAAG,aAAM,CAAC,CAAC;aAAA,GAAG;oBAAE,UAAU;IAAA,CAAC,EAAE,KAAK,EAAE,GAAG;IAErD,GAAG,CAAC,CAAC,aAAA,UAAU,cAAE,SAAS,EAAA,CAAC,GAAG,eAAQ,CAAC,CAAC;WACnC,KAAK;IACV,CAAC;IACD,GAAG,CAAC,UAAU,GAAG,KAAK,CAAC,WAAW,KAAK,GAAG;IAC1C,GAAG,CAAC,QAAQ,GAAG,qBAAc,CAAC,IAAI,CAAC,KAAK;IACxC,MAAM,CAAC,QAAQ,CAAC,EAAE;IAElB,MAAM,0CACH,gBAAS;QAAC,cAAc,EAAE,iBAAU,CAAC,gEAAM,EAAE,CAAY;gDACvD,CAAG;WACE,iBAAU,CAAC,QAAQ,EAAE,UAAU,EAAE,QAAQ;QAC7C,GAAG,EAAE,GAAG;QACR,SAAS,EAAE,iBAAU,CACnB,gEAAM,EACN,CAAoB,qBACpB,CAAC;YACC,CAAa,cAAE,UAAU;YACzB,CAAa,cAAE,UAAU;YACzB,CAAY,aAAE,SAAS;QACzB,CAAC;gDAEF,mBAAY;QACX,KAAK,EAAE,CAAC;YACN,IAAI,EAAE,CAAC;gBACL,IAAI,EAAE,CAAG;gBACT,gBAAgB,EAAE,iBAAU,CAAC,gEAAM,EAAE,CAAe;YACtD,CAAC;YACD,IAAI,EAAE,CAAC;gBACL,gBAAgB,EAAE,iBAAU,CAAC,gEAAM,EAAE,CAAyB;YAChE,CAAC;QACH,CAAC;OACA,MAAM,CAAC,QAAQ,KAAK,CAAQ,mDACxB,WAAI,QAAE,QAAQ,IACf,QAAQ;AAKtB,CAAC;AAQD,EAAW,AAAX,SAAW;SACF,6BAAO,CAAC,KAAmB,EAAE,CAAC;IACrC,GAAG,CAAC,CAAC,cACH,WAAW,gBACX,EAAwE,AAAxE,sEAAwE;IACxE,WAAW,gBACX,EAA4H,AAA5H,0HAA4H;IAC5H,WAAW,EACb,CAAC,GAAG,KAAK;IAET,GAAG,CAAC,CAAC,YAAA,SAAS,EAAA,CAAC,GAAG,gBAAS;IAC3B,GAAG,CAAC,CAAC,QAAA,KAAK,EAAA,CAAC,GAAG,kBAAW;IAEzB,GAAG,EAAE,KAAK,EAAE,QAAQ,IAAI,eAAQ,CAAC,CAAC;QAChC,KAAK,EAAE,SAAS;QAChB,MAAM,EAAE,SAAS;IACnB,CAAC;IAED,sBAAe,KAAO,CAAC;QACrB,EAAE,EAAE,WAAW,EAAE,CAAC;gBAGyB,GAAyC;YAFlF,GAAG,CAAC,QAAQ,GAAG,CAAC;gBAAA,SAAS,EAAE,SAAS;gBAAE,KAAK,EAAE,SAAS;gBAAE,MAAM,EAAE,SAAS;YAAA,CAAC;YAC1E,EAA8J,AAA9J,4JAA8J;YAC9J,GAAG,CAAC,MAAM,GAAG,SAAS,KAAK,CAAK,OAAG,EAAE,MAAI,GAAyC,GAAxC,WAAW,CAAC,YAAY,cAAzB,GAAyC,KAAzC,IAAI,CAAJ,CAAsD,GAAtD,IAAI,CAAJ,CAAsD,GAAtD,GAAyC,CAAE,WAAW,IAAG,WAAW,CAAC,WAAW,GAAG,WAAW,CAAC,UAAU,IAAI,WAAW,CAAC,UAAU;YAC5K,QAAQ,CAAC,SAAS,GAAG,WAAW,KAAK,CAAU,aAC1C,WAAW,EAAE,WAAW,CAAC,SAAS,CAAC,GAAG,KACtC,WAAW,EAAE,MAAM,CAAC,GAAG;YAE5B,EAAE,EAAE,WAAW,KAAK,CAAY,aAC9B,QAAQ,CAAC,KAAK,MAAM,WAAW,CAAC,WAAW,CAAC,EAAE;iBAE9C,QAAQ,CAAC,MAAM,MAAM,WAAW,CAAC,YAAY,CAAC,EAAE;YAElD,QAAQ,CAAC,QAAQ;QACnB,CAAC;IAEH,CAAC,EAAE,CAAC;QAAA,SAAS;QAAE,QAAQ;QAAE,WAAW;QAAE,WAAW;QAAE,KAAK;QAAE,WAAW;IAAA,CAAC;IAEtE,MAAM,0CAAE,CAAG;QAAC,SAAS,EAAE,iBAAU,CAAC,gEAAM,EAAE,CAAkC;QAAG,IAAI,EAAC,CAAc;QAAC,KAAK,EAAE,KAAK;;AACjH,CAAC;SAMe,yCAAO,CAAI,KAA8B,EAAE,CAAC;IAC1D,KAAK,CAAC,UAAU,GAAG,iBAAU,CAAC,gCAAU;IACxC,KAAK,CAAC,CAAC,OAAA,IAAI,aAAE,QAAQ,aAAE,QAAQ,kBAAE,aAAa,EAAA,CAAC,GAAG,UAAU;IAC5D,KAAK,CAAC,CAAC,UAAA,OAAO,YAAE,OAAO,eAAE,UAAU,gBAAE,WAAW,EAAA,CAAC,GAAG,QAAQ;IAC5D,KAAK,CAAC,CAAC,cAAA,WAAW,aAAE,QAAQ,oBAAE,eAAe,EAAA,CAAC,GAAG,QAAQ;IACzD,KAAK,CAAC,CAAC,aAAA,UAAU,eAAE,UAAU,EAAA,CAAC,GAAG,IAAI;IACrC,EAA0E,AAA1E,wEAA0E;IAC1E,KAAK,CAAC,KAAK,GAAG,sBAAe,CAAC,CAAC;WAAG,QAAQ;QAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ;IAAA,CAAC;IAErE,GAAG,CAAC,CAAC,aAAA,UAAU,EAAA,CAAC,GAAG,oBAAa,CAAC,KAAK;IACtC,KAAK,CAAC,CAAC,eAAA,YAAY,EAAA,CAAC,GAAG,iBAAU,CAAC,CAAC;WAAG,QAAQ;WAAK,KAAK;IAAA,CAAC,EAAE,KAAK,EAAE,UAAU;IAE5E,gBAAS,KAAO,CAAC;QACf,EAA6D,AAA7D,2DAA6D;QAC7D,eAAe,CAAC,KAAK;IACrB,EAAuD,AAAvD,qDAAuD;IACzD,CAAC,EAAE,CAAC;QAAA,KAAK,CAAC,YAAY;QAAE,KAAK,CAAC,YAAY;QAAE,KAAK,CAAC,WAAW;QAAE,KAAK,CAAC,QAAQ;IAAA,CAAC;IAC9E,GAAG,CAAC,qBAAqB,GAAG,WAAW,KAAK,CAAU,YAAG,UAAU,GAAG,CAAC;IAAA,CAAC;IAExE,GAAG,CAAC,gBAAgB,GAAG,iBAAU,CAAC,gEAAM,EAAE,CAAyB;IACnE,KAAK,CAAC,UAAU,4CACb,CAAG;WACE,qBAAqB;WACrB,YAAY;QAChB,GAAG,EAAE,UAAU;QACf,SAAS,EAAE,iBAAU,CACnB,gEAAM,EACN,CAAe,iBACd,eAAe,EAAE,WAAW,IAC7B,gBAAgB,EAChB,CAAC;YACC,CAAsB,uBAAE,OAAO;aAC9B,CAAwB,0BAAG,OAAO,KAAK,CAAS;QACnD,CAAC,EACD,WAAW,KAAK,CAAU,aAAI,UAAU,CAAC,SAAS;OAGnD,CAAC;WAAG,KAAK,CAAC,UAAU;IAAA,CAAC,CAAC,GAAG,EAAE,IAAI,4CAC7B,yBAAG;YAAC,GAAG,EAAE,IAAI,CAAC,GAAG;YAAE,IAAI,EAAE,IAAI;YAAE,KAAK,EAAE,KAAK;YAAE,UAAU,EAAE,UAAU;YAAE,WAAW,EAAE,WAAW;;gDAE/F,6BAAO;QAAC,WAAW,EAAE,WAAW;QAAE,WAAW,EAAE,WAAW;;IAK/D,EAAE,EAAE,WAAW,KAAK,CAAU,WAC5B,MAAM,CAAC,UAAU;SAEjB,MAAM,0CACH,CAAG;WACE,UAAU;QACd,GAAG,EAAE,UAAU;QACf,SAAS,EAAE,iBAAU,CACnB,gEAAM,EACN,CAAoC,qCACpC,UAAU,CAAC,SAAS;OAErB,QAAQ,4CAAI,+BAAS;WAAK,KAAK;WAAM,QAAQ;QAAE,EAAE,EAAE,aAAa,CAAC,CAAiB;QAAG,KAAK,EAAE,KAAK;QAAE,SAAS,EAAE,gBAAgB;SAAO,UAAU;AAIxJ,CAAC;SAMe,yCAAS,CAAI,KAAgC,EAAE,CAAC;IAC9D,KAAK,CAAC,CAAC,WAAA,QAAQ,aAAE,QAAQ,EAAA,CAAC,GAAG,iBAAU,CAAC,gCAAU;IAClD,KAAK,CAAC,CAAC,eAAA,YAAY,EAAA,CAAC,GAAG,QAAQ;IAE/B,KAAK,CAAC,OAAO,IAAG,KAAK,GAAI,GAAG,CAAC,qBAAc,CAAC,KAAK;;IACjD,KAAK,CAAC,UAAU,GAAG,oBAAa,CAAC,CAAC;QAAA,KAAK,EAAE,QAAQ,CAAC,KAAK;WAAK,KAAK;IAAA,CAAC,EAAE,OAAO,EAAE,CAAC;QAAA,wBAAwB,EAAE,IAAI;IAAA,CAAC;IAC7G,KAAK,CAAC,YAAY,GAAG,YAAY,GAAG,UAAU,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,IAAI,IAAI;IAEvF,MAAM,0CACH,8BAAQ;WAAK,KAAK;QAAE,GAAG,EAAE,YAAY,aAAZ,YAAY,KAAZ,IAAI,CAAJ,CAAyB,GAAzB,IAAI,CAAJ,CAAyB,GAAzB,YAAY,CAAE,WAAW;OAChD,YAAY,IAAI,YAAY,CAAC,KAAK,CAAC,QAAQ;AAGlD,CAAC;AAED,EAAW,AAAX,SAAW;SACF,8BAAQ,CAAI,KAAgC,EAAE,CAAC;IACtD,KAAK,CAAC,CAAC,WAAA,QAAQ,GAAE,aAAa,EAAE,gBAAgB,EAAA,CAAC,GAAG,iBAAU,CAAC,gCAAU;IACzE,KAAK,CAAC,CAAC,eAAA,YAAY,EAAA,CAAC,GAAG,QAAQ;IAC/B,GAAG,CAAC,GAAG,GAAG,aAAM;IAChB,KAAK,CAAC,CAAC,gBAAA,aAAa,EAAA,CAAC,GAAG,kBAAW,CAAC,KAAK,EAAE,YAAY,EAAE,GAAG;IAC5D,GAAG,CAAC,CAAC,aAAA,UAAU,EAAA,CAAC,GAAG,oBAAa,CAAC,KAAK;IAEtC,EAAE,EAAE,gBAAgB,CAAC,CAAiB,mBACpC,aAAa,CAAC,CAAiB,oBAAI,gBAAgB,CAAC,CAAiB;IAGvE,MAAM,0CACH,gBAAS;QAAC,cAAc,EAAE,iBAAU,CAAC,gEAAM,EAAE,CAAY;gDACvD,CAAG;WAAK,UAAU;WAAM,aAAa;QAAE,GAAG,EAAE,GAAG;QAAE,SAAS,EAAE,iBAAU,CAAC,gEAAM,EAAE,CAA6B,8BAAE,UAAU,CAAC,SAAS;OAChI,KAAK,CAAC,QAAQ;AAIvB,CAAC;SAQQ,+BAAS,CAAI,KAAwB,EAAE,CAAC;IAC/C,GAAG,CAAC,CAAC,aACH,UAAU,YACV,OAAO,UACP,KAAK,GACL,CAAiB,kBAAE,aAAa,GAChC,CAAY,aAAE,SAAS,YACvB,OAAO,cACP,SAAS,OACT,EAAE,EACJ,CAAC,GAAG,KAAK;IAET,GAAG,CAAC,GAAG,GAAG,aAAM;IAChB,GAAG,EAAE,UAAU,EAAE,aAAa,IAAI,eAAQ,CAAC,IAAI;IAE/C,gBAAS,KAAO,CAAC;QACf,GAAG,CAAC,IAAI,GAAG,mBAAY,CAAC,GAAG;QAC3B,aAAa,CAAC,IAAI,CAAC,OAAO;IAC5B,CAAC,EAAE,CAAC;QAAA,GAAG;IAAA,CAAC;IAER,GAAG,CAAC,KAAK,GAAG,CAAC;WAAG,KAAK,CAAC,UAAU;IAAA,CAAC,CAAC,GAAG,EAAE,IAAI,IAAM,CAAC;YAChD,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,EAAE,EAAE,IAAI,CAAC,GAAG;QACd,CAAC;;IAED,GAAG,CAAC,WAAW,GAAG,CAAC;QACjB,CAAiB,kBAAE,aAAa;QAChC,CAAY,aAAE,SAAS;IACzB,CAAC;IAED,EAAiF,AAAjF,+EAAiF;IACjF,MAAM,0CACH,CAAG;QACF,SAAS,EAAE,iBAAU,CACnB,gEAAM,EACN,CAAe,gBACf,CAA2B,4BAC3B,CAA4B,6BAC5B,CAAC;YACC,CAAsB,uBAAE,OAAO;aAC9B,CAAwB,0BAAG,OAAO,KAAK,CAAS;QACnD,CAAC,EACD,SAAS;gDAEV,mBAAY;QACX,KAAK,EAAE,CAAC;YACN,IAAI,EAAE,CAAC;gBACL,IAAI,EAAE,CAAG;gBACT,gBAAgB,EAAE,iBAAU,CAAC,gEAAM,EAAE,CAAe;YACtD,CAAC;YACD,MAAM,EAAE,CAAC;gBACP,cAAc,EAAE,iBAAU,CAAC,gEAAM,EAAE,CAAY;YACjD,CAAC;QACH,CAAC;gDACA,aAAM;WACD,WAAW;QACf,EAAE,EAAE,EAAE;QACN,KAAK,EAAE,KAAK;QACZ,GAAG,EAAE,GAAG;QACR,OAAO,EAAP,IAAO;QACP,UAAU,EAAE,UAAU;QACtB,WAAW,EAAE,KAAK,CAAC,WAAW;QAC9B,YAAY,EAAE,KAAK,CAAC,YAAY;QAChC,iBAAiB,EAAE,KAAK,CAAC,cAAc;QACtC,IAAI,4CAAK,WAAI;YAAC,SAAS,EAAE,IAAI,CAAC,SAAS;WAAG,IAAI,CAAC,QAAQ;OAEzD,UAAU,6CAAK,6BAAO;QAAC,WAAW,EAAC,CAAY;QAAC,WAAW,EAAE,UAAU;QAAE,WAAW,EAAE,KAAK,CAAC,WAAW;;AAIhH,CAAC;AAED,EAEG,AAFH;;CAEG,AAFH,EAEG,CACH,EAAwF,AAAxF,sFAAwF;AACxF,EAA2G,AAA3G,yGAA2G;AAC3G,KAAK,CAAC,yCAAK,iBAAG,YAAK,CAAC,UAAU,CAAC,0BAAI","sources":["packages/@react-spectrum/tabs/src/index.ts","packages/@react-spectrum/tabs/src/Tabs.tsx","packages/@adobe/spectrum-css-temp/components/tabs/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport * from './Tabs';\nexport {Item} from '@react-stately/collections';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {classNames, SlotProvider, unwrapDOMRef, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {DOMProps, DOMRef, Node, Orientation} from '@react-types/shared';\nimport {filterDOMProps, useValueEffect} from '@react-aria/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {Item, Picker} from '@react-spectrum/picker';\nimport {ListCollection, SingleSelectListState} from '@react-stately/list';\nimport {mergeProps, useId, useLayoutEffect} from '@react-aria/utils';\nimport React, {Key, MutableRefObject, ReactElement, useCallback, useContext, useEffect, useRef, useState} from 'react';\nimport {SpectrumPickerProps} from '@react-types/select';\nimport {SpectrumTabListProps, SpectrumTabPanelsProps, SpectrumTabsProps} from '@react-types/tabs';\nimport styles from '@adobe/spectrum-css-temp/components/tabs/vars.css';\nimport {TabListState, useTabListState} from '@react-stately/tabs';\nimport {Text} from '@react-spectrum/text';\nimport {useCollection} from '@react-stately/collections';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale} from '@react-aria/i18n';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\nimport {useResizeObserver} from '@react-aria/utils';\nimport {useTab, useTabList, useTabPanel} from '@react-aria/tabs';\n\ninterface TabsContext<T> {\n tabProps: SpectrumTabsProps<T>,\n tabState: {\n tabListState: TabListState<T>,\n setTabListState: (state: TabListState<T>) => void,\n selectedTab: HTMLElement,\n collapse: boolean\n },\n refs: {\n wrapperRef: MutableRefObject<HTMLDivElement>,\n tablistRef: MutableRefObject<HTMLDivElement>\n },\n tabPanelProps: {\n 'aria-labelledby': string\n }\n}\n\nconst TabContext = React.createContext<TabsContext<any>>(null);\n\nfunction Tabs<T extends object>(props: SpectrumTabsProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let {\n orientation = 'horizontal' as Orientation,\n density = 'regular',\n children,\n ...otherProps\n } = props;\n\n let domRef = useDOMRef(ref);\n let tablistRef = useRef<HTMLDivElement>();\n let wrapperRef = useRef<HTMLDivElement>();\n\n let {direction} = useLocale();\n let {styleProps} = useStyleProps(otherProps);\n let [collapse, setCollapse] = useValueEffect(false);\n let [selectedTab, setSelectedTab] = useState<HTMLElement>();\n const [tabListState, setTabListState] = useState<TabListState<T>>(null);\n\n useEffect(() => {\n if (tablistRef.current) {\n let selectedTab: HTMLElement = tablistRef.current.querySelector(`[data-key=\"${tabListState?.selectedKey}\"]`);\n\n if (selectedTab != null) {\n setSelectedTab(selectedTab);\n }\n }\n // collapse is in the dep array so selectedTab can be updated for TabLine positioning\n }, [children, tabListState?.selectedKey, collapse, tablistRef]);\n\n let checkShouldCollapse = useCallback(() => {\n let computeShouldCollapse = () => {\n if (wrapperRef.current) {\n let tabsComponent = wrapperRef.current;\n let tabs = tablistRef.current.querySelectorAll('[role=\"tab\"]');\n let lastTab = tabs[tabs.length - 1];\n\n let end = direction === 'rtl' ? 'left' : 'right';\n let farEdgeTabList = tabsComponent.getBoundingClientRect()[end];\n let farEdgeLastTab = lastTab?.getBoundingClientRect()[end];\n let shouldCollapse = direction === 'rtl' ? farEdgeLastTab < farEdgeTabList : farEdgeTabList < farEdgeLastTab;\n\n return shouldCollapse;\n }\n };\n\n if (orientation !== 'vertical') {\n setCollapse(function* () {\n // Make Tabs render in non-collapsed state\n yield false;\n\n // Compute if Tabs should collapse and update\n yield computeShouldCollapse();\n });\n }\n }, [tablistRef, wrapperRef, direction, orientation, setCollapse]);\n\n useEffect(() => {\n checkShouldCollapse();\n }, [children, checkShouldCollapse]);\n\n useResizeObserver({ref: wrapperRef, onResize: checkShouldCollapse});\n\n let tabPanelProps = {\n 'aria-labelledby': undefined\n };\n\n // When the tabs are collapsed, the tabPanel should be labelled by the Picker button element.\n let collapsibleTabListId = useId();\n if (collapse && orientation !== 'vertical') {\n tabPanelProps['aria-labelledby'] = collapsibleTabListId;\n }\n return (\n <TabContext.Provider\n value={{\n tabProps: {...props, orientation, density},\n tabState: {tabListState, setTabListState, selectedTab, collapse},\n refs: {tablistRef, wrapperRef},\n tabPanelProps\n }}>\n <div\n {...filterDOMProps(otherProps)}\n {...styleProps}\n ref={domRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel',\n `spectrum-TabsPanel--${orientation}`,\n styleProps.className\n )}>\n {props.children}\n </div>\n </TabContext.Provider>\n );\n}\n\ninterface TabProps<T> extends DOMProps {\n item: Node<T>,\n state: SingleSelectListState<T>,\n isDisabled?: boolean,\n orientation?: Orientation\n}\n\n// @private\nfunction Tab<T>(props: TabProps<T>) {\n let {item, state, isDisabled: propsDisabled} = props;\n let {key, rendered} = item;\n let isDisabled = propsDisabled || state.disabledKeys.has(key);\n\n let ref = useRef<HTMLDivElement>();\n let {tabProps} = useTab({key, isDisabled}, state, ref);\n\n let {hoverProps, isHovered} = useHover({\n ...props\n });\n let isSelected = state.selectedKey === key;\n let domProps = filterDOMProps(item.props);\n delete domProps.id;\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div\n {...mergeProps(tabProps, hoverProps, domProps)}\n ref={ref}\n className={classNames(\n styles,\n 'spectrum-Tabs-item',\n {\n 'is-selected': isSelected,\n 'is-disabled': isDisabled,\n 'is-hovered': isHovered\n }\n )}>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n text: {\n UNSAFE_className: classNames(styles, 'spectrum-Tabs-itemLabel')\n }\n }}>\n {typeof rendered === 'string'\n ? <Text>{rendered}</Text>\n : rendered}\n </SlotProvider>\n </div>\n </FocusRing>\n );\n}\n\ninterface TabLineProps {\n orientation?: Orientation,\n selectedTab?: HTMLElement,\n selectedKey?: Key\n}\n\n// @private\nfunction TabLine(props: TabLineProps) {\n let {\n orientation,\n // Is either the tab node (non-collapsed) or the picker node (collapsed)\n selectedTab,\n // selectedKey is provided so that the TabLine styles are updated when the TabPicker's width updates from a selection change\n selectedKey\n } = props;\n\n let {direction} = useLocale();\n let {scale} = useProvider();\n\n let [style, setStyle] = useState({\n width: undefined,\n height: undefined\n });\n\n useLayoutEffect(() => {\n if (selectedTab) {\n let styleObj = {transform: undefined, width: undefined, height: undefined};\n // In RTL, calculate the transform from the right edge of the tablist so that resizing the window doesn't break the Tabline position due to offsetLeft changes\n let offset = direction === 'rtl' ? -1 * ((selectedTab.offsetParent as HTMLElement)?.offsetWidth - selectedTab.offsetWidth - selectedTab.offsetLeft) : selectedTab.offsetLeft;\n styleObj.transform = orientation === 'vertical'\n ? `translateY(${selectedTab.offsetTop}px)`\n : `translateX(${offset}px)`;\n\n if (orientation === 'horizontal') {\n styleObj.width = `${selectedTab.offsetWidth}px`;\n } else {\n styleObj.height = `${selectedTab.offsetHeight}px`;\n }\n setStyle(styleObj);\n }\n\n }, [direction, setStyle, selectedTab, orientation, scale, selectedKey]);\n\n return <div className={classNames(styles, 'spectrum-Tabs-selectionIndicator')} role=\"presentation\" style={style} />;\n}\n\n/**\n * A TabList is used within Tabs to group tabs that a user can switch between.\n * The keys of the items within the <TabList> must match up with a corresponding item inside the <TabPanels>.\n */\nexport function TabList<T>(props: SpectrumTabListProps<T>) {\n const tabContext = useContext(TabContext);\n const {refs, tabState, tabProps, tabPanelProps} = tabContext;\n const {isQuiet, density, isDisabled, orientation} = tabProps;\n const {selectedTab, collapse, setTabListState} = tabState;\n const {tablistRef, wrapperRef} = refs;\n // Pass original Tab props but override children to create the collection.\n const state = useTabListState({...tabProps, children: props.children});\n\n let {styleProps} = useStyleProps(props);\n const {tabListProps} = useTabList({...tabProps, ...props}, state, tablistRef);\n\n useEffect(() => {\n // Passing back to root as useTabPanel needs the TabListState\n setTabListState(state);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [state.disabledKeys, state.selectedItem, state.selectedKey, props.children]);\n let stylePropsForVertical = orientation === 'vertical' ? styleProps : {};\n\n let tabListclassName = classNames(styles, 'spectrum-TabsPanel-tabs');\n const tabContent = (\n <div\n {...stylePropsForVertical}\n {...tabListProps}\n ref={tablistRef}\n className={classNames(\n styles,\n 'spectrum-Tabs',\n `spectrum-Tabs--${orientation}`,\n tabListclassName,\n {\n 'spectrum-Tabs--quiet': isQuiet,\n ['spectrum-Tabs--compact']: density === 'compact'\n },\n orientation === 'vertical' && styleProps.className\n )\n }>\n {[...state.collection].map((item) => (\n <Tab key={item.key} item={item} state={state} isDisabled={isDisabled} orientation={orientation} />\n ))}\n <TabLine orientation={orientation} selectedTab={selectedTab} />\n </div>\n );\n\n\n if (orientation === 'vertical') {\n return tabContent;\n } else {\n return (\n <div\n {...styleProps}\n ref={wrapperRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel-collapseWrapper',\n styleProps.className\n )}>\n {collapse ? <TabPicker {...props} {...tabProps} id={tabPanelProps['aria-labelledby']} state={state} className={tabListclassName} /> : tabContent}\n </div>\n );\n }\n}\n\n/**\n * TabPanels is used within Tabs as a container for the content of each tab.\n * The keys of the items within the <TabPanels> must match up with a corresponding item inside the <TabList>.\n */\nexport function TabPanels<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabProps} = useContext(TabContext);\n const {tabListState} = tabState;\n\n const factory = nodes => new ListCollection(nodes);\n const collection = useCollection({items: tabProps.items, ...props}, factory, {suppressTextValueWarning: true});\n const selectedItem = tabListState ? collection.getItem(tabListState.selectedKey) : null;\n\n return (\n <TabPanel {...props} key={tabListState?.selectedKey}>\n {selectedItem && selectedItem.props.children}\n </TabPanel>\n );\n}\n\n// @private\nfunction TabPanel<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabPanelProps: ctxTabPanelProps} = useContext(TabContext);\n const {tabListState} = tabState;\n let ref = useRef();\n const {tabPanelProps} = useTabPanel(props, tabListState, ref);\n let {styleProps} = useStyleProps(props);\n\n if (ctxTabPanelProps['aria-labelledby']) {\n tabPanelProps['aria-labelledby'] = ctxTabPanelProps['aria-labelledby'];\n }\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div {...styleProps} {...tabPanelProps} ref={ref} className={classNames(styles, 'spectrum-TabsPanel-tabpanel', styleProps.className)}>\n {props.children}\n </div>\n </FocusRing>\n );\n}\n\ninterface TabPickerProps<T> extends Omit<SpectrumPickerProps<T>, 'children'> {\n density?: 'compact' | 'regular',\n state: SingleSelectListState<T>,\n className?: string\n}\n\nfunction TabPicker<T>(props: TabPickerProps<T>) {\n let {\n isDisabled,\n isQuiet,\n state,\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel,\n density,\n className,\n id\n } = props;\n\n let ref = useRef();\n let [pickerNode, setPickerNode] = useState(null);\n\n useEffect(() => {\n let node = unwrapDOMRef(ref);\n setPickerNode(node.current);\n }, [ref]);\n\n let items = [...state.collection].map((item) => ({\n rendered: item.rendered,\n textValue: item.textValue,\n id: item.key\n }));\n\n let pickerProps = {\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel\n };\n\n // TODO: Figure out if tabListProps should go onto the div here, v2 doesn't do it\n return (\n <div\n className={classNames(\n styles,\n 'spectrum-Tabs',\n 'spectrum-Tabs--horizontal',\n 'spectrum-Tabs--isCollapsed',\n {\n 'spectrum-Tabs--quiet': isQuiet,\n ['spectrum-Tabs--compact']: density === 'compact'\n },\n className\n )}>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n button: {\n focusRingClass: classNames(styles, 'focus-ring')\n }\n }}>\n <Picker\n {...pickerProps}\n id={id}\n items={items}\n ref={ref}\n isQuiet\n isDisabled={isDisabled}\n selectedKey={state.selectedKey}\n disabledKeys={state.disabledKeys}\n onSelectionChange={state.setSelectedKey}>\n {item => <Item textValue={item.textValue}>{item.rendered}</Item>}\n </Picker>\n {pickerNode && <TabLine orientation=\"horizontal\" selectedTab={pickerNode} selectedKey={state.selectedKey} />}\n </SlotProvider>\n </div>\n );\n}\n\n/**\n * Tabs organize content into multiple sections and allow users to navigate between them. The content under the set of tabs should be related and form a coherent unit.\n */\n// forwardRef doesn't support generic parameters, so cast the result to the correct type\n// https://stackoverflow.com/questions/58469229/react-with-typescript-generics-while-using-react-forwardref\nconst _Tabs = React.forwardRef(Tabs) as <T>(props: SpectrumTabsProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_Tabs as Tabs};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"module.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/tabs/src/index.ts","packages/@react-spectrum/tabs/src/Tabs.tsx","packages/@adobe/spectrum-css-temp/components/tabs/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport * from './Tabs';\nexport {Item} from '@react-stately/collections';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {classNames, SlotProvider, unwrapDOMRef, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {DOMProps, DOMRef, Node, Orientation} from '@react-types/shared';\nimport {filterDOMProps, useValueEffect} from '@react-aria/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {Item, Picker} from '@react-spectrum/picker';\nimport {ListCollection, SingleSelectListState} from '@react-stately/list';\nimport {mergeProps, useId, useLayoutEffect} from '@react-aria/utils';\nimport React, {Key, MutableRefObject, ReactElement, useCallback, useContext, useEffect, useRef, useState} from 'react';\nimport {SpectrumPickerProps} from '@react-types/select';\nimport {SpectrumTabListProps, SpectrumTabPanelsProps, SpectrumTabsProps} from '@react-types/tabs';\nimport styles from '@adobe/spectrum-css-temp/components/tabs/vars.css';\nimport {TabListState, useTabListState} from '@react-stately/tabs';\nimport {Text} from '@react-spectrum/text';\nimport {useCollection} from '@react-stately/collections';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale} from '@react-aria/i18n';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\nimport {useResizeObserver} from '@react-aria/utils';\nimport {useTab, useTabList, useTabPanel} from '@react-aria/tabs';\n\ninterface TabsContext<T> {\n tabProps: SpectrumTabsProps<T>,\n tabState: {\n tabListState: TabListState<T>,\n setTabListState: (state: TabListState<T>) => void,\n selectedTab: HTMLElement,\n collapse: boolean\n },\n refs: {\n wrapperRef: MutableRefObject<HTMLDivElement>,\n tablistRef: MutableRefObject<HTMLDivElement>\n },\n tabPanelProps: {\n 'aria-labelledby': string\n }\n}\n\nconst TabContext = React.createContext<TabsContext<any>>(null);\n\nfunction Tabs<T extends object>(props: SpectrumTabsProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let {\n orientation = 'horizontal' as Orientation,\n density = 'regular',\n children,\n ...otherProps\n } = props;\n\n let domRef = useDOMRef(ref);\n let tablistRef = useRef<HTMLDivElement>();\n let wrapperRef = useRef<HTMLDivElement>();\n\n let {direction} = useLocale();\n let {styleProps} = useStyleProps(otherProps);\n let [collapse, setCollapse] = useValueEffect(false);\n let [selectedTab, setSelectedTab] = useState<HTMLElement>();\n const [tabListState, setTabListState] = useState<TabListState<T>>(null);\n\n useEffect(() => {\n if (tablistRef.current) {\n let selectedTab: HTMLElement = tablistRef.current.querySelector(`[data-key=\"${tabListState?.selectedKey}\"]`);\n\n if (selectedTab != null) {\n setSelectedTab(selectedTab);\n }\n }\n // collapse is in the dep array so selectedTab can be updated for TabLine positioning\n }, [children, tabListState?.selectedKey, collapse, tablistRef]);\n\n let checkShouldCollapse = useCallback(() => {\n let computeShouldCollapse = () => {\n if (wrapperRef.current) {\n let tabsComponent = wrapperRef.current;\n let tabs = tablistRef.current.querySelectorAll('[role=\"tab\"]');\n let lastTab = tabs[tabs.length - 1];\n\n let end = direction === 'rtl' ? 'left' : 'right';\n let farEdgeTabList = tabsComponent.getBoundingClientRect()[end];\n let farEdgeLastTab = lastTab?.getBoundingClientRect()[end];\n let shouldCollapse = direction === 'rtl' ? farEdgeLastTab < farEdgeTabList : farEdgeTabList < farEdgeLastTab;\n\n return shouldCollapse;\n }\n };\n\n if (orientation !== 'vertical') {\n setCollapse(function* () {\n // Make Tabs render in non-collapsed state\n yield false;\n\n // Compute if Tabs should collapse and update\n yield computeShouldCollapse();\n });\n }\n }, [tablistRef, wrapperRef, direction, orientation, setCollapse]);\n\n useEffect(() => {\n checkShouldCollapse();\n }, [children, checkShouldCollapse]);\n\n useResizeObserver({ref: wrapperRef, onResize: checkShouldCollapse});\n\n let tabPanelProps = {\n 'aria-labelledby': undefined\n };\n\n // When the tabs are collapsed, the tabPanel should be labelled by the Picker button element.\n let collapsibleTabListId = useId();\n if (collapse && orientation !== 'vertical') {\n tabPanelProps['aria-labelledby'] = collapsibleTabListId;\n }\n return (\n <TabContext.Provider\n value={{\n tabProps: {...props, orientation, density},\n tabState: {tabListState, setTabListState, selectedTab, collapse},\n refs: {tablistRef, wrapperRef},\n tabPanelProps\n }}>\n <div\n {...filterDOMProps(otherProps)}\n {...styleProps}\n ref={domRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel',\n `spectrum-TabsPanel--${orientation}`,\n styleProps.className\n )}>\n {props.children}\n </div>\n </TabContext.Provider>\n );\n}\n\ninterface TabProps<T> extends DOMProps {\n item: Node<T>,\n state: SingleSelectListState<T>,\n isDisabled?: boolean,\n orientation?: Orientation\n}\n\n// @private\nfunction Tab<T>(props: TabProps<T>) {\n let {item, state, isDisabled: propsDisabled} = props;\n let {key, rendered} = item;\n let isDisabled = propsDisabled || state.disabledKeys.has(key);\n\n let ref = useRef<HTMLDivElement>();\n let {tabProps} = useTab({key, isDisabled}, state, ref);\n\n let {hoverProps, isHovered} = useHover({\n ...props\n });\n let isSelected = state.selectedKey === key;\n let domProps = filterDOMProps(item.props);\n delete domProps.id;\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div\n {...mergeProps(tabProps, hoverProps, domProps)}\n ref={ref}\n className={classNames(\n styles,\n 'spectrum-Tabs-item',\n {\n 'is-selected': isSelected,\n 'is-disabled': isDisabled,\n 'is-hovered': isHovered\n }\n )}>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n text: {\n UNSAFE_className: classNames(styles, 'spectrum-Tabs-itemLabel')\n }\n }}>\n {typeof rendered === 'string'\n ? <Text>{rendered}</Text>\n : rendered}\n </SlotProvider>\n </div>\n </FocusRing>\n );\n}\n\ninterface TabLineProps {\n orientation?: Orientation,\n selectedTab?: HTMLElement,\n selectedKey?: Key\n}\n\n// @private\nfunction TabLine(props: TabLineProps) {\n let {\n orientation,\n // Is either the tab node (non-collapsed) or the picker node (collapsed)\n selectedTab,\n // selectedKey is provided so that the TabLine styles are updated when the TabPicker's width updates from a selection change\n selectedKey\n } = props;\n\n let {direction} = useLocale();\n let {scale} = useProvider();\n\n let [style, setStyle] = useState({\n width: undefined,\n height: undefined\n });\n\n useLayoutEffect(() => {\n if (selectedTab) {\n let styleObj = {transform: undefined, width: undefined, height: undefined};\n // In RTL, calculate the transform from the right edge of the tablist so that resizing the window doesn't break the Tabline position due to offsetLeft changes\n let offset = direction === 'rtl' ? -1 * ((selectedTab.offsetParent as HTMLElement)?.offsetWidth - selectedTab.offsetWidth - selectedTab.offsetLeft) : selectedTab.offsetLeft;\n styleObj.transform = orientation === 'vertical'\n ? `translateY(${selectedTab.offsetTop}px)`\n : `translateX(${offset}px)`;\n\n if (orientation === 'horizontal') {\n styleObj.width = `${selectedTab.offsetWidth}px`;\n } else {\n styleObj.height = `${selectedTab.offsetHeight}px`;\n }\n setStyle(styleObj);\n }\n\n }, [direction, setStyle, selectedTab, orientation, scale, selectedKey]);\n\n return <div className={classNames(styles, 'spectrum-Tabs-selectionIndicator')} role=\"presentation\" style={style} />;\n}\n\n/**\n * A TabList is used within Tabs to group tabs that a user can switch between.\n * The keys of the items within the <TabList> must match up with a corresponding item inside the <TabPanels>.\n */\nexport function TabList<T>(props: SpectrumTabListProps<T>) {\n const tabContext = useContext(TabContext);\n const {refs, tabState, tabProps, tabPanelProps} = tabContext;\n const {isQuiet, density, isDisabled, isEmphasized, orientation} = tabProps;\n const {selectedTab, collapse, setTabListState} = tabState;\n const {tablistRef, wrapperRef} = refs;\n // Pass original Tab props but override children to create the collection.\n const state = useTabListState({...tabProps, children: props.children});\n\n let {styleProps} = useStyleProps(props);\n const {tabListProps} = useTabList({...tabProps, ...props}, state, tablistRef);\n\n useEffect(() => {\n // Passing back to root as useTabPanel needs the TabListState\n setTabListState(state);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [state.disabledKeys, state.selectedItem, state.selectedKey, props.children]);\n let stylePropsForVertical = orientation === 'vertical' ? styleProps : {};\n\n let tabListclassName = classNames(styles, 'spectrum-TabsPanel-tabs');\n const tabContent = (\n <div\n {...stylePropsForVertical}\n {...tabListProps}\n ref={tablistRef}\n className={classNames(\n styles,\n 'spectrum-Tabs',\n `spectrum-Tabs--${orientation}`,\n tabListclassName,\n {\n 'spectrum-Tabs--quiet': isQuiet,\n 'spectrum-Tabs--emphasized': isEmphasized,\n ['spectrum-Tabs--compact']: density === 'compact'\n },\n orientation === 'vertical' && styleProps.className\n )\n }>\n {[...state.collection].map((item) => (\n <Tab key={item.key} item={item} state={state} isDisabled={isDisabled} orientation={orientation} />\n ))}\n <TabLine orientation={orientation} selectedTab={selectedTab} />\n </div>\n );\n\n\n if (orientation === 'vertical') {\n return tabContent;\n } else {\n return (\n <div\n {...styleProps}\n ref={wrapperRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel-collapseWrapper',\n styleProps.className\n )}>\n {collapse ? <TabPicker {...props} {...tabProps} id={tabPanelProps['aria-labelledby']} state={state} className={tabListclassName} /> : tabContent}\n </div>\n );\n }\n}\n\n/**\n * TabPanels is used within Tabs as a container for the content of each tab.\n * The keys of the items within the <TabPanels> must match up with a corresponding item inside the <TabList>.\n */\nexport function TabPanels<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabProps} = useContext(TabContext);\n const {tabListState} = tabState;\n\n const factory = nodes => new ListCollection(nodes);\n const collection = useCollection({items: tabProps.items, ...props}, factory, {suppressTextValueWarning: true});\n const selectedItem = tabListState ? collection.getItem(tabListState.selectedKey) : null;\n\n return (\n <TabPanel {...props} key={tabListState?.selectedKey}>\n {selectedItem && selectedItem.props.children}\n </TabPanel>\n );\n}\n\n// @private\nfunction TabPanel<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabPanelProps: ctxTabPanelProps} = useContext(TabContext);\n const {tabListState} = tabState;\n let ref = useRef();\n const {tabPanelProps} = useTabPanel(props, tabListState, ref);\n let {styleProps} = useStyleProps(props);\n\n if (ctxTabPanelProps['aria-labelledby']) {\n tabPanelProps['aria-labelledby'] = ctxTabPanelProps['aria-labelledby'];\n }\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div {...styleProps} {...tabPanelProps} ref={ref} className={classNames(styles, 'spectrum-TabsPanel-tabpanel', styleProps.className)}>\n {props.children}\n </div>\n </FocusRing>\n );\n}\n\ninterface TabPickerProps<T> extends Omit<SpectrumPickerProps<T>, 'children'> {\n density?: 'compact' | 'regular',\n isEmphasized?: boolean,\n state: SingleSelectListState<T>,\n className?: string\n}\n\nfunction TabPicker<T>(props: TabPickerProps<T>) {\n let {\n isDisabled,\n isEmphasized,\n isQuiet,\n state,\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel,\n density,\n className,\n id\n } = props;\n\n let ref = useRef();\n let [pickerNode, setPickerNode] = useState(null);\n\n useEffect(() => {\n let node = unwrapDOMRef(ref);\n setPickerNode(node.current);\n }, [ref]);\n\n let items = [...state.collection].map((item) => ({\n rendered: item.rendered,\n textValue: item.textValue,\n id: item.key\n }));\n\n let pickerProps = {\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel\n };\n\n // TODO: Figure out if tabListProps should go onto the div here, v2 doesn't do it\n return (\n <div\n className={classNames(\n styles,\n 'spectrum-Tabs',\n 'spectrum-Tabs--horizontal',\n 'spectrum-Tabs--isCollapsed',\n {\n 'spectrum-Tabs--quiet': isQuiet,\n ['spectrum-Tabs--compact']: density === 'compact',\n 'spectrum-Tabs--emphasized': isEmphasized\n },\n className\n )}>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n button: {\n focusRingClass: classNames(styles, 'focus-ring')\n }\n }}>\n <Picker\n {...pickerProps}\n id={id}\n items={items}\n ref={ref}\n isQuiet\n isDisabled={isDisabled}\n selectedKey={state.selectedKey}\n disabledKeys={state.disabledKeys}\n onSelectionChange={state.setSelectedKey}>\n {item => <Item textValue={item.textValue}>{item.rendered}</Item>}\n </Picker>\n {pickerNode && <TabLine orientation=\"horizontal\" selectedTab={pickerNode} selectedKey={state.selectedKey} />}\n </SlotProvider>\n </div>\n );\n}\n\n/**\n * Tabs organize content into multiple sections and allow users to navigate between them. The content under the set of tabs should be related and form a coherent unit.\n */\n// forwardRef doesn't support generic parameters, so cast the result to the correct type\n// https://stackoverflow.com/questions/58469229/react-with-typescript-generics-while-using-react-forwardref\nconst _Tabs = React.forwardRef(Tabs) as <T>(props: SpectrumTabsProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_Tabs as Tabs};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"module.js.map"}
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;AAyPA;;;GAGG;AACH,wBAAwB,CAAC,EAAE,KAAK,EAAE,qBAAqB,CAAC,CAAC,
|
|
1
|
+
{"mappings":";;;AAyPA;;;GAGG;AACH,wBAAwB,CAAC,EAAE,KAAK,EAAE,qBAAqB,CAAC,CAAC,eA8DxD;AAED;;;GAGG;AACH,0BAA0B,CAAC,EAAE,KAAK,EAAE,uBAAuB,CAAC,CAAC,eAa5D;AAyGD;;GAEG;AAGH,OAAA,MAAM;UAA2E,OAAO,cAAc,CAAC;MAAM,YAAY,CAAC;AC7a1H,OAAO,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC","sources":["packages/@react-spectrum/tabs/src/packages/@react-spectrum/tabs/src/Tabs.tsx","packages/@react-spectrum/tabs/src/packages/@react-spectrum/tabs/src/index.ts","packages/@react-spectrum/tabs/src/index.ts"],"sourcesContent":[null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport * from './Tabs';\nexport {Item} from '@react-stately/collections';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-spectrum/tabs",
|
|
3
|
-
"version": "3.1.7-nightly.
|
|
3
|
+
"version": "3.1.7-nightly.3249+9186a1089",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -32,26 +32,26 @@
|
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@babel/runtime": "^7.6.2",
|
|
35
|
-
"@react-aria/focus": "3.0.0-nightly.
|
|
36
|
-
"@react-aria/i18n": "3.0.0-nightly.
|
|
37
|
-
"@react-aria/interactions": "3.0.0-nightly.
|
|
38
|
-
"@react-aria/tabs": "3.1.6-nightly.
|
|
39
|
-
"@react-aria/utils": "3.0.0-nightly.
|
|
40
|
-
"@react-spectrum/button": "3.0.0-nightly.
|
|
41
|
-
"@react-spectrum/menu": "3.6.5-nightly.
|
|
42
|
-
"@react-spectrum/picker": "3.5.6-nightly.
|
|
43
|
-
"@react-spectrum/text": "3.1.9-nightly.
|
|
44
|
-
"@react-spectrum/utils": "3.0.0-nightly.
|
|
45
|
-
"@react-stately/collections": "3.0.0-nightly.
|
|
46
|
-
"@react-stately/list": "3.4.6-nightly.
|
|
47
|
-
"@react-stately/tabs": "3.0.0-nightly.
|
|
48
|
-
"@react-types/select": "3.5.6-nightly.
|
|
49
|
-
"@react-types/shared": "3.0.0-nightly.
|
|
50
|
-
"@react-types/tabs": "3.0.6-nightly.
|
|
51
|
-
"@spectrum-icons/workflow": "3.0.0-nightly.
|
|
35
|
+
"@react-aria/focus": "3.0.0-nightly.1550+9186a1089",
|
|
36
|
+
"@react-aria/i18n": "3.0.0-nightly.1550+9186a1089",
|
|
37
|
+
"@react-aria/interactions": "3.0.0-nightly.1550+9186a1089",
|
|
38
|
+
"@react-aria/tabs": "3.1.6-nightly.3249+9186a1089",
|
|
39
|
+
"@react-aria/utils": "3.0.0-nightly.1550+9186a1089",
|
|
40
|
+
"@react-spectrum/button": "3.0.0-nightly.1550+9186a1089",
|
|
41
|
+
"@react-spectrum/menu": "3.6.5-nightly.3249+9186a1089",
|
|
42
|
+
"@react-spectrum/picker": "3.5.6-nightly.3249+9186a1089",
|
|
43
|
+
"@react-spectrum/text": "3.1.9-nightly.3249+9186a1089",
|
|
44
|
+
"@react-spectrum/utils": "3.0.0-nightly.1550+9186a1089",
|
|
45
|
+
"@react-stately/collections": "3.0.0-nightly.1550+9186a1089",
|
|
46
|
+
"@react-stately/list": "3.4.6-nightly.3249+9186a1089",
|
|
47
|
+
"@react-stately/tabs": "3.0.0-nightly.1550+9186a1089",
|
|
48
|
+
"@react-types/select": "3.5.6-nightly.3249+9186a1089",
|
|
49
|
+
"@react-types/shared": "3.0.0-nightly.1550+9186a1089",
|
|
50
|
+
"@react-types/tabs": "3.0.6-nightly.3249+9186a1089",
|
|
51
|
+
"@spectrum-icons/workflow": "3.0.0-nightly.1550+9186a1089"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
|
-
"@adobe/spectrum-css-temp": "3.0.0-nightly.
|
|
54
|
+
"@adobe/spectrum-css-temp": "3.0.0-nightly.1550+9186a1089"
|
|
55
55
|
},
|
|
56
56
|
"peerDependencies": {
|
|
57
57
|
"@react-spectrum/provider": "^3.0.0",
|
|
@@ -61,5 +61,5 @@
|
|
|
61
61
|
"publishConfig": {
|
|
62
62
|
"access": "public"
|
|
63
63
|
},
|
|
64
|
-
"gitHead": "
|
|
64
|
+
"gitHead": "9186a10898028b90a3cd4d48c3b0f96f77982fca"
|
|
65
65
|
}
|
package/src/Tabs.tsx
CHANGED
|
@@ -254,7 +254,7 @@ function TabLine(props: TabLineProps) {
|
|
|
254
254
|
export function TabList<T>(props: SpectrumTabListProps<T>) {
|
|
255
255
|
const tabContext = useContext(TabContext);
|
|
256
256
|
const {refs, tabState, tabProps, tabPanelProps} = tabContext;
|
|
257
|
-
const {isQuiet, density, isDisabled, orientation} = tabProps;
|
|
257
|
+
const {isQuiet, density, isDisabled, isEmphasized, orientation} = tabProps;
|
|
258
258
|
const {selectedTab, collapse, setTabListState} = tabState;
|
|
259
259
|
const {tablistRef, wrapperRef} = refs;
|
|
260
260
|
// Pass original Tab props but override children to create the collection.
|
|
@@ -283,6 +283,7 @@ export function TabList<T>(props: SpectrumTabListProps<T>) {
|
|
|
283
283
|
tabListclassName,
|
|
284
284
|
{
|
|
285
285
|
'spectrum-Tabs--quiet': isQuiet,
|
|
286
|
+
'spectrum-Tabs--emphasized': isEmphasized,
|
|
286
287
|
['spectrum-Tabs--compact']: density === 'compact'
|
|
287
288
|
},
|
|
288
289
|
orientation === 'vertical' && styleProps.className
|
|
@@ -356,6 +357,7 @@ function TabPanel<T>(props: SpectrumTabPanelsProps<T>) {
|
|
|
356
357
|
|
|
357
358
|
interface TabPickerProps<T> extends Omit<SpectrumPickerProps<T>, 'children'> {
|
|
358
359
|
density?: 'compact' | 'regular',
|
|
360
|
+
isEmphasized?: boolean,
|
|
359
361
|
state: SingleSelectListState<T>,
|
|
360
362
|
className?: string
|
|
361
363
|
}
|
|
@@ -363,6 +365,7 @@ interface TabPickerProps<T> extends Omit<SpectrumPickerProps<T>, 'children'> {
|
|
|
363
365
|
function TabPicker<T>(props: TabPickerProps<T>) {
|
|
364
366
|
let {
|
|
365
367
|
isDisabled,
|
|
368
|
+
isEmphasized,
|
|
366
369
|
isQuiet,
|
|
367
370
|
state,
|
|
368
371
|
'aria-labelledby': ariaLabeledBy,
|
|
@@ -401,7 +404,8 @@ function TabPicker<T>(props: TabPickerProps<T>) {
|
|
|
401
404
|
'spectrum-Tabs--isCollapsed',
|
|
402
405
|
{
|
|
403
406
|
'spectrum-Tabs--quiet': isQuiet,
|
|
404
|
-
['spectrum-Tabs--compact']: density === 'compact'
|
|
407
|
+
['spectrum-Tabs--compact']: density === 'compact',
|
|
408
|
+
'spectrum-Tabs--emphasized': isEmphasized
|
|
405
409
|
},
|
|
406
410
|
className
|
|
407
411
|
)}>
|