@proyecto-viviana/solidaria-components 0.7.0-rc.1 → 0.7.0-rc.2
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/ActionBar.d.ts.map +1 -1
- package/dist/ActionBar.js +6 -2
- package/dist/ActionBar.js.map +1 -1
- package/dist/ActionBar.jsx +6 -2
- package/dist/ActionBar.jsx.map +1 -1
- package/dist/ActionGroup.d.ts.map +1 -1
- package/dist/ActionGroup.js +6 -2
- package/dist/ActionGroup.js.map +1 -1
- package/dist/ActionGroup.jsx +6 -2
- package/dist/ActionGroup.jsx.map +1 -1
- package/dist/Breadcrumbs.d.ts.map +1 -1
- package/dist/Breadcrumbs.js +12 -4
- package/dist/Breadcrumbs.js.map +1 -1
- package/dist/Breadcrumbs.jsx +12 -4
- package/dist/Breadcrumbs.jsx.map +1 -1
- package/dist/Calendar.d.ts.map +1 -1
- package/dist/Calendar.js +30 -10
- package/dist/Calendar.js.map +1 -1
- package/dist/Calendar.jsx +30 -10
- package/dist/Calendar.jsx.map +1 -1
- package/dist/Checkbox.d.ts.map +1 -1
- package/dist/Checkbox.js +24 -8
- package/dist/Checkbox.js.map +1 -1
- package/dist/Checkbox.jsx +24 -8
- package/dist/Checkbox.jsx.map +1 -1
- package/dist/Collection.d.ts.map +1 -1
- package/dist/Collection.js +18 -6
- package/dist/Collection.js.map +1 -1
- package/dist/Collection.jsx +18 -6
- package/dist/Collection.jsx.map +1 -1
- package/dist/ColorArea.d.ts.map +1 -1
- package/dist/ColorArea.js +18 -6
- package/dist/ColorArea.js.map +1 -1
- package/dist/ColorArea.jsx +18 -6
- package/dist/ColorArea.jsx.map +1 -1
- package/dist/ColorField.d.ts.map +1 -1
- package/dist/ColorField.js +12 -4
- package/dist/ColorField.js.map +1 -1
- package/dist/ColorField.jsx +12 -4
- package/dist/ColorField.jsx.map +1 -1
- package/dist/ColorPicker.d.ts.map +1 -1
- package/dist/ColorPicker.js +6 -2
- package/dist/ColorPicker.js.map +1 -1
- package/dist/ColorPicker.jsx +6 -2
- package/dist/ColorPicker.jsx.map +1 -1
- package/dist/ColorSlider.d.ts.map +1 -1
- package/dist/ColorSlider.js +18 -6
- package/dist/ColorSlider.js.map +1 -1
- package/dist/ColorSlider.jsx +18 -6
- package/dist/ColorSlider.jsx.map +1 -1
- package/dist/ColorSwatch.d.ts.map +1 -1
- package/dist/ColorSwatch.js +6 -2
- package/dist/ColorSwatch.js.map +1 -1
- package/dist/ColorSwatch.jsx +6 -2
- package/dist/ColorSwatch.jsx.map +1 -1
- package/dist/ColorSwatchPicker.d.ts.map +1 -1
- package/dist/ColorSwatchPicker.js +12 -4
- package/dist/ColorSwatchPicker.js.map +1 -1
- package/dist/ColorSwatchPicker.jsx +12 -4
- package/dist/ColorSwatchPicker.jsx.map +1 -1
- package/dist/ColorWheel.d.ts.map +1 -1
- package/dist/ColorWheel.js +18 -6
- package/dist/ColorWheel.js.map +1 -1
- package/dist/ColorWheel.jsx +18 -6
- package/dist/ColorWheel.jsx.map +1 -1
- package/dist/ComboBox.d.ts.map +1 -1
- package/dist/ComboBox.js +38 -16
- package/dist/ComboBox.js.map +1 -1
- package/dist/ComboBox.jsx +38 -14
- package/dist/ComboBox.jsx.map +1 -1
- package/dist/DateField.d.ts.map +1 -1
- package/dist/DateField2.js +18 -6
- package/dist/DateField2.js.map +1 -1
- package/dist/DateField2.jsx +18 -6
- package/dist/DateField2.jsx.map +1 -1
- package/dist/DatePicker.d.ts.map +1 -1
- package/dist/DatePicker2.js +24 -8
- package/dist/DatePicker2.js.map +1 -1
- package/dist/DatePicker2.jsx +24 -8
- package/dist/DatePicker2.jsx.map +1 -1
- package/dist/Dialog.d.ts.map +1 -1
- package/dist/Dialog.js +24 -16
- package/dist/Dialog.js.map +1 -1
- package/dist/Dialog.jsx +24 -12
- package/dist/Dialog.jsx.map +1 -1
- package/dist/Disclosure.d.ts.map +1 -1
- package/dist/Disclosure.js +18 -6
- package/dist/Disclosure.js.map +1 -1
- package/dist/Disclosure.jsx +18 -6
- package/dist/Disclosure.jsx.map +1 -1
- package/dist/DragAndDrop.d.ts.map +1 -1
- package/dist/DragAndDrop.js +6 -2
- package/dist/DragAndDrop.js.map +1 -1
- package/dist/DragAndDrop.jsx +6 -2
- package/dist/DragAndDrop.jsx.map +1 -1
- package/dist/DropZone.d.ts.map +1 -1
- package/dist/DropZone.js +6 -2
- package/dist/DropZone.js.map +1 -1
- package/dist/DropZone.jsx +6 -2
- package/dist/DropZone.jsx.map +1 -1
- package/dist/FieldError.d.ts.map +1 -1
- package/dist/FieldError.js +6 -2
- package/dist/FieldError.js.map +1 -1
- package/dist/FieldError.jsx +6 -2
- package/dist/FieldError.jsx.map +1 -1
- package/dist/GridList.d.ts.map +1 -1
- package/dist/GridList.js +24 -8
- package/dist/GridList.js.map +1 -1
- package/dist/GridList.jsx +24 -8
- package/dist/GridList.jsx.map +1 -1
- package/dist/Icon.d.ts.map +1 -1
- package/dist/Icon.js +6 -2
- package/dist/Icon.js.map +1 -1
- package/dist/Icon.jsx +6 -2
- package/dist/Icon.jsx.map +1 -1
- package/dist/ListBox.d.ts.map +1 -1
- package/dist/ListBox.js +20 -10
- package/dist/ListBox.js.map +1 -1
- package/dist/ListBox.jsx +20 -8
- package/dist/ListBox.jsx.map +1 -1
- package/dist/Menu.d.ts.map +1 -1
- package/dist/Menu.js +18 -6
- package/dist/Menu.js.map +1 -1
- package/dist/Menu.jsx +18 -6
- package/dist/Menu.jsx.map +1 -1
- package/dist/Meter.d.ts.map +1 -1
- package/dist/Meter.js +6 -2
- package/dist/Meter.js.map +1 -1
- package/dist/Meter.jsx +6 -2
- package/dist/Meter.jsx.map +1 -1
- package/dist/Modal.d.ts.map +1 -1
- package/dist/Modal.js +12 -4
- package/dist/Modal.js.map +1 -1
- package/dist/Modal.jsx +12 -4
- package/dist/Modal.jsx.map +1 -1
- package/dist/NumberField.d.ts.map +1 -1
- package/dist/NumberField.js +24 -8
- package/dist/NumberField.js.map +1 -1
- package/dist/NumberField.jsx +24 -8
- package/dist/NumberField.jsx.map +1 -1
- package/dist/Popover.d.ts.map +1 -1
- package/dist/Popover.js +6 -2
- package/dist/Popover.js.map +1 -1
- package/dist/Popover.jsx +6 -2
- package/dist/Popover.jsx.map +1 -1
- package/dist/ProgressBar.d.ts.map +1 -1
- package/dist/ProgressBar.js +6 -2
- package/dist/ProgressBar.js.map +1 -1
- package/dist/ProgressBar.jsx +6 -2
- package/dist/ProgressBar.jsx.map +1 -1
- package/dist/RadioGroup.d.ts.map +1 -1
- package/dist/RadioGroup.js +29 -19
- package/dist/RadioGroup.js.map +1 -1
- package/dist/RadioGroup.jsx +29 -13
- package/dist/RadioGroup.jsx.map +1 -1
- package/dist/RangeCalendar.d.ts.map +1 -1
- package/dist/RangeCalendar.js +24 -8
- package/dist/RangeCalendar.js.map +1 -1
- package/dist/RangeCalendar.jsx +24 -8
- package/dist/RangeCalendar.jsx.map +1 -1
- package/dist/SearchField.d.ts.map +1 -1
- package/dist/SearchField.js +20 -8
- package/dist/SearchField.js.map +1 -1
- package/dist/SearchField.jsx +20 -8
- package/dist/SearchField.jsx.map +1 -1
- package/dist/Select.d.ts.map +1 -1
- package/dist/Select.js +32 -14
- package/dist/Select.js.map +1 -1
- package/dist/Select.jsx +32 -12
- package/dist/Select.jsx.map +1 -1
- package/dist/SelectionIndicator.d.ts.map +1 -1
- package/dist/SelectionIndicator.js +6 -2
- package/dist/SelectionIndicator.js.map +1 -1
- package/dist/SelectionIndicator.jsx +6 -2
- package/dist/SelectionIndicator.jsx.map +1 -1
- package/dist/SharedElementTransition.d.ts.map +1 -1
- package/dist/SharedElementTransition.js +6 -2
- package/dist/SharedElementTransition.js.map +1 -1
- package/dist/SharedElementTransition.jsx +6 -2
- package/dist/SharedElementTransition.jsx.map +1 -1
- package/dist/StepList.d.ts.map +1 -1
- package/dist/StepList.js +6 -2
- package/dist/StepList.js.map +1 -1
- package/dist/StepList.jsx +6 -2
- package/dist/StepList.jsx.map +1 -1
- package/dist/Switch.d.ts.map +1 -1
- package/dist/Switch.js +18 -6
- package/dist/Switch.js.map +1 -1
- package/dist/Switch.jsx +18 -6
- package/dist/Switch.jsx.map +1 -1
- package/dist/Table.d.ts.map +1 -1
- package/dist/Table.js +54 -18
- package/dist/Table.js.map +1 -1
- package/dist/Table.jsx +54 -18
- package/dist/Table.jsx.map +1 -1
- package/dist/Tabs.d.ts.map +1 -1
- package/dist/Tabs.js +26 -12
- package/dist/Tabs.js.map +1 -1
- package/dist/Tabs.jsx +26 -10
- package/dist/Tabs.jsx.map +1 -1
- package/dist/TagGroup.d.ts.map +1 -1
- package/dist/TagGroup.js +14 -8
- package/dist/TagGroup.js.map +1 -1
- package/dist/TagGroup.jsx +14 -6
- package/dist/TagGroup.jsx.map +1 -1
- package/dist/TextField.d.ts.map +1 -1
- package/dist/TextField.js +7 -3
- package/dist/TextField.js.map +1 -1
- package/dist/TextField.jsx +7 -3
- package/dist/TextField.jsx.map +1 -1
- package/dist/TimeField.d.ts.map +1 -1
- package/dist/TimeField.js +6 -2
- package/dist/TimeField.js.map +1 -1
- package/dist/TimeField.jsx +6 -2
- package/dist/TimeField.jsx.map +1 -1
- package/dist/Toast.d.ts.map +1 -1
- package/dist/Toast.js +12 -4
- package/dist/Toast.js.map +1 -1
- package/dist/Toast.jsx +12 -4
- package/dist/Toast.jsx.map +1 -1
- package/dist/ToggleButton.d.ts.map +1 -1
- package/dist/ToggleButton.js +10 -8
- package/dist/ToggleButton.js.map +1 -1
- package/dist/ToggleButton.jsx +10 -6
- package/dist/ToggleButton.jsx.map +1 -1
- package/dist/ToggleButtonGroup.d.ts.map +1 -1
- package/dist/ToggleButtonGroup.js +6 -2
- package/dist/ToggleButtonGroup.js.map +1 -1
- package/dist/ToggleButtonGroup.jsx +6 -2
- package/dist/ToggleButtonGroup.jsx.map +1 -1
- package/dist/TokenField.d.ts.map +1 -1
- package/dist/TokenField.js +18 -6
- package/dist/TokenField.js.map +1 -1
- package/dist/TokenField.jsx +18 -6
- package/dist/TokenField.jsx.map +1 -1
- package/dist/Tooltip.d.ts.map +1 -1
- package/dist/Tooltip.js +6 -2
- package/dist/Tooltip.js.map +1 -1
- package/dist/Tooltip.jsx +6 -2
- package/dist/Tooltip.jsx.map +1 -1
- package/dist/Tree.d.ts.map +1 -1
- package/dist/Tree.js +24 -8
- package/dist/Tree.js.map +1 -1
- package/dist/Tree.jsx +24 -8
- package/dist/Tree.jsx.map +1 -1
- package/dist/VisuallyHidden.d.ts.map +1 -1
- package/dist/VisuallyHidden.js +3 -1
- package/dist/VisuallyHidden.js.map +1 -1
- package/dist/VisuallyHidden.jsx +3 -1
- package/dist/VisuallyHidden.jsx.map +1 -1
- package/dist/utils.d.ts.map +1 -1
- package/dist/utils.js +4 -3
- package/dist/utils.js.map +1 -1
- package/dist/utils.jsx +4 -3
- package/dist/utils.jsx.map +1 -1
- package/package.json +3 -3
- package/src/ActionBar.tsx +6 -2
- package/src/ActionGroup.tsx +6 -2
- package/src/Breadcrumbs.tsx +12 -4
- package/src/Calendar.tsx +30 -10
- package/src/Checkbox.tsx +24 -8
- package/src/Collection.tsx +18 -6
- package/src/ColorArea.tsx +18 -6
- package/src/ColorField.tsx +12 -4
- package/src/ColorPicker.tsx +6 -2
- package/src/ColorSlider.tsx +18 -6
- package/src/ColorSwatch.tsx +6 -2
- package/src/ColorSwatchPicker.tsx +12 -4
- package/src/ColorWheel.tsx +18 -6
- package/src/ComboBox.tsx +39 -15
- package/src/DateField.tsx +18 -6
- package/src/DatePicker.tsx +24 -8
- package/src/Dialog.tsx +26 -12
- package/src/Disclosure.tsx +18 -6
- package/src/DragAndDrop.tsx +6 -2
- package/src/DropZone.tsx +6 -2
- package/src/FieldError.tsx +6 -2
- package/src/GridList.tsx +24 -8
- package/src/Icon.tsx +6 -2
- package/src/ListBox.tsx +21 -9
- package/src/Menu.tsx +18 -6
- package/src/Meter.tsx +6 -2
- package/src/Modal.tsx +12 -4
- package/src/NumberField.tsx +24 -8
- package/src/Popover.tsx +6 -2
- package/src/ProgressBar.tsx +6 -2
- package/src/RadioGroup.tsx +31 -15
- package/src/RangeCalendar.tsx +24 -8
- package/src/SearchField.tsx +24 -8
- package/src/Select.tsx +33 -13
- package/src/SelectionIndicator.tsx +6 -2
- package/src/SharedElementTransition.tsx +6 -2
- package/src/StepList.tsx +6 -2
- package/src/Switch.tsx +18 -6
- package/src/Table.tsx +54 -18
- package/src/Tabs.tsx +27 -11
- package/src/TagGroup.tsx +15 -7
- package/src/TextField.tsx +8 -3
- package/src/TimeField.tsx +6 -2
- package/src/Toast.tsx +12 -4
- package/src/ToggleButton.tsx +12 -7
- package/src/ToggleButtonGroup.tsx +6 -2
- package/src/TokenField.tsx +18 -6
- package/src/Tooltip.tsx +6 -2
- package/src/Tree.tsx +24 -8
- package/src/VisuallyHidden.tsx +3 -1
- package/src/utils.tsx +14 -3
package/dist/ActionBar.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionBar.d.ts","sourceRoot":"","sources":["../src/ActionBar.tsx"],"names":[],"mappings":"AAyCA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,iCAAiC,CAAC;AAE3D,OAAO,EACL,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,SAAS,EAIf,MAAM,SAAS,CAAC;AAEjB,KAAK,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,CAAC,KAAK,IAAI,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,CAAC,GAAG,IAAI,CAAA;CAAE,GAAG,SAAS,CAAC;AAWzE,MAAM,WAAW,oBAAoB;IACnC,yCAAyC;IACzC,MAAM,EAAE,OAAO,CAAC;IAChB,oCAAoC;IACpC,iBAAiB,EAAE,MAAM,GAAG,KAAK,CAAC;CACnC;AAED,MAAM,WAAW,cACf,SACE,IAAI,CAAC,GAAG,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,UAAU,GAAG,KAAK,GAAG,MAAM,CAAC,EACzF,SAAS;IACX,2EAA2E;IAC3E,iBAAiB,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IACnC,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B,qCAAqC;IACrC,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,mCAAmC;IACnC,KAAK,CAAC,EAAE,mBAAmB,CAAC,oBAAoB,CAAC,CAAC;IAClD,sCAAsC;IACtC,KAAK,CAAC,EAAE,eAAe,CAAC,oBAAoB,CAAC,CAAC;IAC9C,8DAA8D;IAC9D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,uEAAuE;IACvE,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,0DAA0D;IAC1D,SAAS,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,cAAc,EAAE,aAAa,CAAC,CAAC;IACjE,wEAAwE;IACxE,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,iDAAiD;IACjD,GAAG,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CAC/B;AAED,MAAM,WAAW,qBAAqB;IACpC,iBAAiB,EAAE,MAAM,MAAM,GAAG,KAAK,CAAC;IACxC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;CAC/B;AAED,eAAO,MAAM,gBAAgB,0DAAoD,CAAC;AAElF,wBAAgB,mBAAmB,IAAI,qBAAqB,GAAG,IAAI,CAElE;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,GAAG,GAAG,CAAC,OAAO,
|
|
1
|
+
{"version":3,"file":"ActionBar.d.ts","sourceRoot":"","sources":["../src/ActionBar.tsx"],"names":[],"mappings":"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"}
|
package/dist/ActionBar.js
CHANGED
|
@@ -90,8 +90,12 @@ function ActionBar(props) {
|
|
|
90
90
|
};
|
|
91
91
|
const renderProps = useRenderProps({
|
|
92
92
|
children: void 0,
|
|
93
|
-
class
|
|
94
|
-
|
|
93
|
+
get class() {
|
|
94
|
+
return local.class;
|
|
95
|
+
},
|
|
96
|
+
get style() {
|
|
97
|
+
return local.style;
|
|
98
|
+
},
|
|
95
99
|
defaultClassName: "solidaria-ActionBar"
|
|
96
100
|
}, () => ({
|
|
97
101
|
isOpen: isOpen(),
|
package/dist/ActionBar.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionBar.js","names":["<Show when={isOpen()}>\n <ActionBarContext value={contextValue()}>\n <div\n {...filteredDOMProps()}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-open={dataAttr(isOpen())}\n onKeyDown={handleKeyDown}\n ref={(el) => assignRef(local.ref, el)}\n >\n {local.children}\n </div>\n </ActionBarContext>\n </Show>","<ActionBarContext value={contextValue()}>\n <div\n {...filteredDOMProps()}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-open={dataAttr(isOpen())}\n onKeyDown={handleKeyDown}\n ref={(el) => assignRef(local.ref, el)}\n >\n {local.children}\n </div>\n </ActionBarContext>","ref={(el) => assignRef(local.ref, el)}","onKeyDown={handleKeyDown}","{local.children}","<div\n {...filteredDOMProps()}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-open={dataAttr(isOpen())}\n onKeyDown={handleKeyDown}\n ref={(el) => assignRef(local.ref, el)}\n >\n {local.children}\n </div>","{props.children}","style={{ position: \"relative\", ...props.style }}","<div\n class={props.class ?? \"solidaria-ActionBarContainer\"}\n style={{ position: \"relative\", ...props.style }}\n >\n {props.children}\n </div>","{text()}","<span class={props.class}>{text()}</span>","class={props.class}","<button\n type=\"button\"\n aria-label={props[\"aria-label\"] ?? \"Clear selection\"}\n class={props.class}\n onClick={() => ctx?.onClearSelection?.()}\n >\n {props.children ?? \"\\u2715\"}\n </button>"],"sources":["../src/ActionBar.tsx"],"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/*\n * Copyright 2024 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// Ported to SolidJS for Proyecto Viviana; based on packages/@adobe/react-spectrum/src/actionbar/ActionBarContainer.tsx\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ActionBar.tsx\n\n/**\n * ActionBar component for solidaria-components\n *\n * Headless action bar that appears when items are selected in a collection.\n * Shows a selection count, clear button, and action buttons.\n *\n * Based on packages/@react-spectrum/s2/src/ActionBar.tsx and\n * https://github.com/adobe/react-spectrum/blob/5ecb3333001313e83898cd07644227897e3bae1f/packages/@adobe/react-spectrum/src/actionbar/ActionBarContainer.tsx.\n * The Solid port keeps the S2 action-bar structure and the Spectrum\n * ActionBarContainer ownership model. It exposes the selection count and clear\n * action as separate headless primitives.\n */\n\nimport { Show, createContext, createMemo, createEffect, useContext } from \"solid-js\";\nimport type { ParentProps } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { announce } from \"@proyecto-viviana/solidaria\";\nimport type { Key } from \"@proyecto-viviana/solid-stately\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n type ClassNameOrFunction,\n type StyleOrFunction,\n type SlotProps,\n useRenderProps,\n filterDOMProps,\n dataAttr,\n} from \"./utils\";\n\ntype RefLike<T> = ((el: T) => void) | { current?: T | null } | undefined;\n\nfunction assignRef<T>(ref: RefLike<T>, el: T): void {\n if (!ref) return;\n if (typeof ref === \"function\") {\n ref(el);\n } else {\n ref.current = el;\n }\n}\n\nexport interface ActionBarRenderProps {\n /** Whether the action bar is visible. */\n isOpen: boolean;\n /** The number of selected items. */\n selectedItemCount: number | \"all\";\n}\n\nexport interface ActionBarProps\n extends\n Omit<JSX.HTMLAttributes<HTMLDivElement>, \"class\" | \"style\" | \"children\" | \"ref\" | \"slot\">,\n SlotProps {\n /** The number of selected items. ActionBar is hidden when 0. @default 0 */\n selectedItemCount?: number | \"all\";\n /** Callback when the clear button is pressed. */\n onClearSelection?: () => void;\n /** Callback when an action is triggered. */\n onAction?: (key: Key) => void;\n /** The action buttons to display. */\n children?: JSX.Element;\n /** CSS class for the container. */\n class?: ClassNameOrFunction<ActionBarRenderProps>;\n /** Inline style for the container. */\n style?: StyleOrFunction<ActionBarRenderProps>;\n /** Accessible label for the action bar. @default 'Actions' */\n \"aria-label\"?: string;\n /** Identifies the element (or elements) that labels the action bar. */\n \"aria-labelledby\"?: string;\n /** Optional keydown handler on the action bar element. */\n onKeyDown?: JSX.EventHandlerUnion<HTMLDivElement, KeyboardEvent>;\n /** Screen reader announcement when the action bar becomes available. */\n actionsAvailableMessage?: string;\n /** Ref for the underlying action bar element. */\n ref?: RefLike<HTMLDivElement>;\n}\n\nexport interface ActionBarContextValue {\n selectedItemCount: () => number | \"all\";\n onClearSelection?: () => void;\n onAction?: (key: Key) => void;\n}\n\nexport const ActionBarContext = createContext<ActionBarContextValue | null>(null);\n\nexport function useActionBarContext(): ActionBarContextValue | null {\n return useContext(ActionBarContext);\n}\n\nexport function ActionBar(props: ActionBarProps): JSX.Element {\n const [local, domProps] = splitProps(props, [\n \"selectedItemCount\",\n \"onClearSelection\",\n \"onAction\",\n \"children\",\n \"class\",\n \"style\",\n \"slot\",\n \"aria-label\",\n \"aria-labelledby\",\n \"onKeyDown\",\n \"actionsAvailableMessage\",\n \"ref\",\n ]);\n\n // Hoist the JSX getter: `selectedItemCount={count()}` compiles as a memo\n // created on first read, and createTrackedEffect forbids primitives.\n const selectedItemCount = createMemo(() => local.selectedItemCount ?? 0);\n const isOpen = () => selectedItemCount() !== 0;\n\n // Faithful to S2 `ActionBar` (ActionBar.tsx:192): the ROOT is a PLAIN\n // container with NO `role` — S2 spreads only `keyboardProps` (an Escape\n // handler that clears the selection) onto it. The single `toolbar` is the\n // inner `ActionButtonGroup` (styled layer), NOT this root. Applying\n // `createToolbar` here would (a) give the root a spurious `role=\"toolbar\"`\n // S2 never renders and (b) nest the real action toolbar inside it, forcing\n // its role to downgrade to `group`. So the root deliberately carries no\n // toolbar props — `aria-label`/`aria-labelledby` are consumed by the inner\n // ActionButtonGroup at the styled layer.\n let wasOpen = false;\n createEffect(\n () => ({ open: isOpen(), message: local.actionsAvailableMessage }),\n ({ open, message }) => {\n if (open && !wasOpen && message) {\n announce(message);\n }\n wasOpen = open;\n },\n );\n\n const handleKeyDown: JSX.EventHandlerUnion<HTMLDivElement, KeyboardEvent> = (e) => {\n const onKeyDown = local.onKeyDown as\n | JSX.EventHandler<HTMLDivElement, KeyboardEvent>\n | undefined;\n onKeyDown?.(e);\n if (e.defaultPrevented) {\n return;\n }\n\n if (e.key === \"Escape\" && isOpen()) {\n e.preventDefault();\n e.stopPropagation();\n local.onClearSelection?.();\n }\n };\n\n const renderProps = useRenderProps(\n {\n children: undefined,\n class: local.class,\n style: local.style,\n defaultClassName: \"solidaria-ActionBar\",\n },\n () => ({\n isOpen: isOpen(),\n selectedItemCount: selectedItemCount(),\n }),\n );\n\n const filteredDOMProps = createMemo(() =>\n filterDOMProps(domProps as Record<string, unknown>, { global: true }),\n );\n\n const contextValue = createMemo<ActionBarContextValue>(() => ({\n selectedItemCount,\n onClearSelection: local.onClearSelection,\n onAction: local.onAction,\n }));\n\n return (\n <Show when={isOpen()}>\n <ActionBarContext value={contextValue()}>\n <div\n {...filteredDOMProps()}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-open={dataAttr(isOpen())}\n onKeyDown={handleKeyDown}\n ref={(el) => assignRef(local.ref, el)}\n >\n {local.children}\n </div>\n </ActionBarContext>\n </Show>\n );\n}\n\nexport interface ActionBarContainerProps extends ParentProps {\n class?: string;\n style?: JSX.CSSProperties;\n}\n\n/**\n * Container that positions a collection and its ActionBar.\n */\nexport function ActionBarContainer(props: ActionBarContainerProps): JSX.Element {\n return (\n <div\n class={props.class ?? \"solidaria-ActionBarContainer\"}\n style={{ position: \"relative\", ...props.style }}\n >\n {props.children}\n </div>\n );\n}\n\nexport interface ActionBarSelectionCountProps {\n class?: string;\n}\n\n/**\n * Displays the count of selected items.\n */\nexport function ActionBarSelectionCount(props: ActionBarSelectionCountProps): JSX.Element {\n const ctx = useActionBarContext();\n\n const text = () => {\n if (!ctx) return \"\";\n const count = ctx.selectedItemCount();\n if (count === \"all\") return \"All selected\";\n if (count === 0) return \"None selected\";\n return `${count} selected`;\n };\n\n return <span class={props.class}>{text()}</span>;\n}\n\nexport interface ActionBarClearButtonProps {\n class?: string;\n children?: JSX.Element;\n \"aria-label\"?: string;\n}\n\n/**\n * Button to clear the current selection.\n */\nexport function ActionBarClearButton(props: ActionBarClearButtonProps): JSX.Element {\n const ctx = useActionBarContext();\n\n return (\n <button\n type=\"button\"\n aria-label={props[\"aria-label\"] ?? \"Clear selection\"}\n class={props.class}\n onClick={() => ctx?.onClearSelection?.()}\n >\n {props.children ?? \"\\u2715\"}\n </button>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ActionBar.js","names":["<Show when={isOpen()}>\n <ActionBarContext value={contextValue()}>\n <div\n {...filteredDOMProps()}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-open={dataAttr(isOpen())}\n onKeyDown={handleKeyDown}\n ref={(el) => assignRef(local.ref, el)}\n >\n {local.children}\n </div>\n </ActionBarContext>\n </Show>","<ActionBarContext value={contextValue()}>\n <div\n {...filteredDOMProps()}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-open={dataAttr(isOpen())}\n onKeyDown={handleKeyDown}\n ref={(el) => assignRef(local.ref, el)}\n >\n {local.children}\n </div>\n </ActionBarContext>","ref={(el) => assignRef(local.ref, el)}","onKeyDown={handleKeyDown}","{local.children}","<div\n {...filteredDOMProps()}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-open={dataAttr(isOpen())}\n onKeyDown={handleKeyDown}\n ref={(el) => assignRef(local.ref, el)}\n >\n {local.children}\n </div>","{props.children}","style={{ position: \"relative\", ...props.style }}","<div\n class={props.class ?? \"solidaria-ActionBarContainer\"}\n style={{ position: \"relative\", ...props.style }}\n >\n {props.children}\n </div>","{text()}","<span class={props.class}>{text()}</span>","class={props.class}","<button\n type=\"button\"\n aria-label={props[\"aria-label\"] ?? \"Clear selection\"}\n class={props.class}\n onClick={() => ctx?.onClearSelection?.()}\n >\n {props.children ?? \"\\u2715\"}\n </button>"],"sources":["../src/ActionBar.tsx"],"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/*\n * Copyright 2024 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// Ported to SolidJS for Proyecto Viviana; based on packages/@adobe/react-spectrum/src/actionbar/ActionBarContainer.tsx\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ActionBar.tsx\n\n/**\n * ActionBar component for solidaria-components\n *\n * Headless action bar that appears when items are selected in a collection.\n * Shows a selection count, clear button, and action buttons.\n *\n * Based on packages/@react-spectrum/s2/src/ActionBar.tsx and\n * https://github.com/adobe/react-spectrum/blob/5ecb3333001313e83898cd07644227897e3bae1f/packages/@adobe/react-spectrum/src/actionbar/ActionBarContainer.tsx.\n * The Solid port keeps the S2 action-bar structure and the Spectrum\n * ActionBarContainer ownership model. It exposes the selection count and clear\n * action as separate headless primitives.\n */\n\nimport { Show, createContext, createMemo, createEffect, useContext } from \"solid-js\";\nimport type { ParentProps } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { announce } from \"@proyecto-viviana/solidaria\";\nimport type { Key } from \"@proyecto-viviana/solid-stately\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n type ClassNameOrFunction,\n type StyleOrFunction,\n type SlotProps,\n useRenderProps,\n filterDOMProps,\n dataAttr,\n} from \"./utils\";\n\ntype RefLike<T> = ((el: T) => void) | { current?: T | null } | undefined;\n\nfunction assignRef<T>(ref: RefLike<T>, el: T): void {\n if (!ref) return;\n if (typeof ref === \"function\") {\n ref(el);\n } else {\n ref.current = el;\n }\n}\n\nexport interface ActionBarRenderProps {\n /** Whether the action bar is visible. */\n isOpen: boolean;\n /** The number of selected items. */\n selectedItemCount: number | \"all\";\n}\n\nexport interface ActionBarProps\n extends\n Omit<JSX.HTMLAttributes<HTMLDivElement>, \"class\" | \"style\" | \"children\" | \"ref\" | \"slot\">,\n SlotProps {\n /** The number of selected items. ActionBar is hidden when 0. @default 0 */\n selectedItemCount?: number | \"all\";\n /** Callback when the clear button is pressed. */\n onClearSelection?: () => void;\n /** Callback when an action is triggered. */\n onAction?: (key: Key) => void;\n /** The action buttons to display. */\n children?: JSX.Element;\n /** CSS class for the container. */\n class?: ClassNameOrFunction<ActionBarRenderProps>;\n /** Inline style for the container. */\n style?: StyleOrFunction<ActionBarRenderProps>;\n /** Accessible label for the action bar. @default 'Actions' */\n \"aria-label\"?: string;\n /** Identifies the element (or elements) that labels the action bar. */\n \"aria-labelledby\"?: string;\n /** Optional keydown handler on the action bar element. */\n onKeyDown?: JSX.EventHandlerUnion<HTMLDivElement, KeyboardEvent>;\n /** Screen reader announcement when the action bar becomes available. */\n actionsAvailableMessage?: string;\n /** Ref for the underlying action bar element. */\n ref?: RefLike<HTMLDivElement>;\n}\n\nexport interface ActionBarContextValue {\n selectedItemCount: () => number | \"all\";\n onClearSelection?: () => void;\n onAction?: (key: Key) => void;\n}\n\nexport const ActionBarContext = createContext<ActionBarContextValue | null>(null);\n\nexport function useActionBarContext(): ActionBarContextValue | null {\n return useContext(ActionBarContext);\n}\n\nexport function ActionBar(props: ActionBarProps): JSX.Element {\n const [local, domProps] = splitProps(props, [\n \"selectedItemCount\",\n \"onClearSelection\",\n \"onAction\",\n \"children\",\n \"class\",\n \"style\",\n \"slot\",\n \"aria-label\",\n \"aria-labelledby\",\n \"onKeyDown\",\n \"actionsAvailableMessage\",\n \"ref\",\n ]);\n\n // Hoist the JSX getter: `selectedItemCount={count()}` compiles as a memo\n // created on first read, and createTrackedEffect forbids primitives.\n const selectedItemCount = createMemo(() => local.selectedItemCount ?? 0);\n const isOpen = () => selectedItemCount() !== 0;\n\n // Faithful to S2 `ActionBar` (ActionBar.tsx:192): the ROOT is a PLAIN\n // container with NO `role` — S2 spreads only `keyboardProps` (an Escape\n // handler that clears the selection) onto it. The single `toolbar` is the\n // inner `ActionButtonGroup` (styled layer), NOT this root. Applying\n // `createToolbar` here would (a) give the root a spurious `role=\"toolbar\"`\n // S2 never renders and (b) nest the real action toolbar inside it, forcing\n // its role to downgrade to `group`. So the root deliberately carries no\n // toolbar props — `aria-label`/`aria-labelledby` are consumed by the inner\n // ActionButtonGroup at the styled layer.\n let wasOpen = false;\n createEffect(\n () => ({ open: isOpen(), message: local.actionsAvailableMessage }),\n ({ open, message }) => {\n if (open && !wasOpen && message) {\n announce(message);\n }\n wasOpen = open;\n },\n );\n\n const handleKeyDown: JSX.EventHandlerUnion<HTMLDivElement, KeyboardEvent> = (e) => {\n const onKeyDown = local.onKeyDown as\n | JSX.EventHandler<HTMLDivElement, KeyboardEvent>\n | undefined;\n onKeyDown?.(e);\n if (e.defaultPrevented) {\n return;\n }\n\n if (e.key === \"Escape\" && isOpen()) {\n e.preventDefault();\n e.stopPropagation();\n local.onClearSelection?.();\n }\n };\n\n const renderProps = useRenderProps(\n {\n children: undefined,\n get class() {\n return local.class;\n },\n get style() {\n return local.style;\n },\n defaultClassName: \"solidaria-ActionBar\",\n },\n () => ({\n isOpen: isOpen(),\n selectedItemCount: selectedItemCount(),\n }),\n );\n\n const filteredDOMProps = createMemo(() =>\n filterDOMProps(domProps as Record<string, unknown>, { global: true }),\n );\n\n const contextValue = createMemo<ActionBarContextValue>(() => ({\n selectedItemCount,\n onClearSelection: local.onClearSelection,\n onAction: local.onAction,\n }));\n\n return (\n <Show when={isOpen()}>\n <ActionBarContext value={contextValue()}>\n <div\n {...filteredDOMProps()}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-open={dataAttr(isOpen())}\n onKeyDown={handleKeyDown}\n ref={(el) => assignRef(local.ref, el)}\n >\n {local.children}\n </div>\n </ActionBarContext>\n </Show>\n );\n}\n\nexport interface ActionBarContainerProps extends ParentProps {\n class?: string;\n style?: JSX.CSSProperties;\n}\n\n/**\n * Container that positions a collection and its ActionBar.\n */\nexport function ActionBarContainer(props: ActionBarContainerProps): JSX.Element {\n return (\n <div\n class={props.class ?? \"solidaria-ActionBarContainer\"}\n style={{ position: \"relative\", ...props.style }}\n >\n {props.children}\n </div>\n );\n}\n\nexport interface ActionBarSelectionCountProps {\n class?: string;\n}\n\n/**\n * Displays the count of selected items.\n */\nexport function ActionBarSelectionCount(props: ActionBarSelectionCountProps): JSX.Element {\n const ctx = useActionBarContext();\n\n const text = () => {\n if (!ctx) return \"\";\n const count = ctx.selectedItemCount();\n if (count === \"all\") return \"All selected\";\n if (count === 0) return \"None selected\";\n return `${count} selected`;\n };\n\n return <span class={props.class}>{text()}</span>;\n}\n\nexport interface ActionBarClearButtonProps {\n class?: string;\n children?: JSX.Element;\n \"aria-label\"?: string;\n}\n\n/**\n * Button to clear the current selection.\n */\nexport function ActionBarClearButton(props: ActionBarClearButtonProps): JSX.Element {\n const ctx = useActionBarContext();\n\n return (\n <button\n type=\"button\"\n aria-label={props[\"aria-label\"] ?? \"Clear selection\"}\n class={props.class}\n onClick={() => ctx?.onClearSelection?.()}\n >\n {props.children ?? \"\\u2715\"}\n </button>\n );\n}\n"],"mappings":"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"}
|
package/dist/ActionBar.jsx
CHANGED
|
@@ -85,8 +85,12 @@ function ActionBar(props) {
|
|
|
85
85
|
};
|
|
86
86
|
const renderProps = useRenderProps({
|
|
87
87
|
children: void 0,
|
|
88
|
-
class
|
|
89
|
-
|
|
88
|
+
get class() {
|
|
89
|
+
return local.class;
|
|
90
|
+
},
|
|
91
|
+
get style() {
|
|
92
|
+
return local.style;
|
|
93
|
+
},
|
|
90
94
|
defaultClassName: "solidaria-ActionBar"
|
|
91
95
|
}, () => ({
|
|
92
96
|
isOpen: isOpen(),
|
package/dist/ActionBar.jsx.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionBar.jsx","names":["assignRef"],"sources":["../src/ActionBar.tsx"],"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/*\n * Copyright 2024 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// Ported to SolidJS for Proyecto Viviana; based on packages/@adobe/react-spectrum/src/actionbar/ActionBarContainer.tsx\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ActionBar.tsx\n\n/**\n * ActionBar component for solidaria-components\n *\n * Headless action bar that appears when items are selected in a collection.\n * Shows a selection count, clear button, and action buttons.\n *\n * Based on packages/@react-spectrum/s2/src/ActionBar.tsx and\n * https://github.com/adobe/react-spectrum/blob/5ecb3333001313e83898cd07644227897e3bae1f/packages/@adobe/react-spectrum/src/actionbar/ActionBarContainer.tsx.\n * The Solid port keeps the S2 action-bar structure and the Spectrum\n * ActionBarContainer ownership model. It exposes the selection count and clear\n * action as separate headless primitives.\n */\n\nimport { Show, createContext, createMemo, createEffect, useContext } from \"solid-js\";\nimport type { ParentProps } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { announce } from \"@proyecto-viviana/solidaria\";\nimport type { Key } from \"@proyecto-viviana/solid-stately\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n type ClassNameOrFunction,\n type StyleOrFunction,\n type SlotProps,\n useRenderProps,\n filterDOMProps,\n dataAttr,\n} from \"./utils\";\n\ntype RefLike<T> = ((el: T) => void) | { current?: T | null } | undefined;\n\nfunction assignRef<T>(ref: RefLike<T>, el: T): void {\n if (!ref) return;\n if (typeof ref === \"function\") {\n ref(el);\n } else {\n ref.current = el;\n }\n}\n\nexport interface ActionBarRenderProps {\n /** Whether the action bar is visible. */\n isOpen: boolean;\n /** The number of selected items. */\n selectedItemCount: number | \"all\";\n}\n\nexport interface ActionBarProps\n extends\n Omit<JSX.HTMLAttributes<HTMLDivElement>, \"class\" | \"style\" | \"children\" | \"ref\" | \"slot\">,\n SlotProps {\n /** The number of selected items. ActionBar is hidden when 0. @default 0 */\n selectedItemCount?: number | \"all\";\n /** Callback when the clear button is pressed. */\n onClearSelection?: () => void;\n /** Callback when an action is triggered. */\n onAction?: (key: Key) => void;\n /** The action buttons to display. */\n children?: JSX.Element;\n /** CSS class for the container. */\n class?: ClassNameOrFunction<ActionBarRenderProps>;\n /** Inline style for the container. */\n style?: StyleOrFunction<ActionBarRenderProps>;\n /** Accessible label for the action bar. @default 'Actions' */\n \"aria-label\"?: string;\n /** Identifies the element (or elements) that labels the action bar. */\n \"aria-labelledby\"?: string;\n /** Optional keydown handler on the action bar element. */\n onKeyDown?: JSX.EventHandlerUnion<HTMLDivElement, KeyboardEvent>;\n /** Screen reader announcement when the action bar becomes available. */\n actionsAvailableMessage?: string;\n /** Ref for the underlying action bar element. */\n ref?: RefLike<HTMLDivElement>;\n}\n\nexport interface ActionBarContextValue {\n selectedItemCount: () => number | \"all\";\n onClearSelection?: () => void;\n onAction?: (key: Key) => void;\n}\n\nexport const ActionBarContext = createContext<ActionBarContextValue | null>(null);\n\nexport function useActionBarContext(): ActionBarContextValue | null {\n return useContext(ActionBarContext);\n}\n\nexport function ActionBar(props: ActionBarProps): JSX.Element {\n const [local, domProps] = splitProps(props, [\n \"selectedItemCount\",\n \"onClearSelection\",\n \"onAction\",\n \"children\",\n \"class\",\n \"style\",\n \"slot\",\n \"aria-label\",\n \"aria-labelledby\",\n \"onKeyDown\",\n \"actionsAvailableMessage\",\n \"ref\",\n ]);\n\n // Hoist the JSX getter: `selectedItemCount={count()}` compiles as a memo\n // created on first read, and createTrackedEffect forbids primitives.\n const selectedItemCount = createMemo(() => local.selectedItemCount ?? 0);\n const isOpen = () => selectedItemCount() !== 0;\n\n // Faithful to S2 `ActionBar` (ActionBar.tsx:192): the ROOT is a PLAIN\n // container with NO `role` — S2 spreads only `keyboardProps` (an Escape\n // handler that clears the selection) onto it. The single `toolbar` is the\n // inner `ActionButtonGroup` (styled layer), NOT this root. Applying\n // `createToolbar` here would (a) give the root a spurious `role=\"toolbar\"`\n // S2 never renders and (b) nest the real action toolbar inside it, forcing\n // its role to downgrade to `group`. So the root deliberately carries no\n // toolbar props — `aria-label`/`aria-labelledby` are consumed by the inner\n // ActionButtonGroup at the styled layer.\n let wasOpen = false;\n createEffect(\n () => ({ open: isOpen(), message: local.actionsAvailableMessage }),\n ({ open, message }) => {\n if (open && !wasOpen && message) {\n announce(message);\n }\n wasOpen = open;\n },\n );\n\n const handleKeyDown: JSX.EventHandlerUnion<HTMLDivElement, KeyboardEvent> = (e) => {\n const onKeyDown = local.onKeyDown as\n | JSX.EventHandler<HTMLDivElement, KeyboardEvent>\n | undefined;\n onKeyDown?.(e);\n if (e.defaultPrevented) {\n return;\n }\n\n if (e.key === \"Escape\" && isOpen()) {\n e.preventDefault();\n e.stopPropagation();\n local.onClearSelection?.();\n }\n };\n\n const renderProps = useRenderProps(\n {\n children: undefined,\n class: local.class,\n style: local.style,\n defaultClassName: \"solidaria-ActionBar\",\n },\n () => ({\n isOpen: isOpen(),\n selectedItemCount: selectedItemCount(),\n }),\n );\n\n const filteredDOMProps = createMemo(() =>\n filterDOMProps(domProps as Record<string, unknown>, { global: true }),\n );\n\n const contextValue = createMemo<ActionBarContextValue>(() => ({\n selectedItemCount,\n onClearSelection: local.onClearSelection,\n onAction: local.onAction,\n }));\n\n return (\n <Show when={isOpen()}>\n <ActionBarContext value={contextValue()}>\n <div\n {...filteredDOMProps()}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-open={dataAttr(isOpen())}\n onKeyDown={handleKeyDown}\n ref={(el) => assignRef(local.ref, el)}\n >\n {local.children}\n </div>\n </ActionBarContext>\n </Show>\n );\n}\n\nexport interface ActionBarContainerProps extends ParentProps {\n class?: string;\n style?: JSX.CSSProperties;\n}\n\n/**\n * Container that positions a collection and its ActionBar.\n */\nexport function ActionBarContainer(props: ActionBarContainerProps): JSX.Element {\n return (\n <div\n class={props.class ?? \"solidaria-ActionBarContainer\"}\n style={{ position: \"relative\", ...props.style }}\n >\n {props.children}\n </div>\n );\n}\n\nexport interface ActionBarSelectionCountProps {\n class?: string;\n}\n\n/**\n * Displays the count of selected items.\n */\nexport function ActionBarSelectionCount(props: ActionBarSelectionCountProps): JSX.Element {\n const ctx = useActionBarContext();\n\n const text = () => {\n if (!ctx) return \"\";\n const count = ctx.selectedItemCount();\n if (count === \"all\") return \"All selected\";\n if (count === 0) return \"None selected\";\n return `${count} selected`;\n };\n\n return <span class={props.class}>{text()}</span>;\n}\n\nexport interface ActionBarClearButtonProps {\n class?: string;\n children?: JSX.Element;\n \"aria-label\"?: string;\n}\n\n/**\n * Button to clear the current selection.\n */\nexport function ActionBarClearButton(props: ActionBarClearButtonProps): JSX.Element {\n const ctx = useActionBarContext();\n\n return (\n <button\n type=\"button\"\n aria-label={props[\"aria-label\"] ?? \"Clear selection\"}\n class={props.class}\n onClick={() => ctx?.onClearSelection?.()}\n >\n {props.children ?? \"\\u2715\"}\n </button>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDA,SAASA,YAAa,KAAiB,IAAa;CAClD,IAAI,CAAC,KAAK;CACV,IAAI,OAAO,QAAQ,YACjB,IAAI,EAAE;MAEN,IAAI,UAAU;AAElB;AA2CA,MAAa,mBAAmB,cAA4C,IAAI;AAEhF,SAAgB,sBAAoD;CAClE,OAAO,WAAW,gBAAgB;AACpC;AAEA,SAAgB,UAAU,OAAoC;CAC5D,MAAM,CAAC,OAAO,YAAY,WAAW,OAAO;EAC1C;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAID,MAAM,oBAAoB,iBAAiB,MAAM,qBAAqB,CAAC;CACvE,MAAM,eAAe,kBAAkB,MAAM;CAW7C,IAAI,UAAU;CACd,oBACS;EAAE,MAAM,OAAO;EAAG,SAAS,MAAM;CAAwB,KAC/D,EAAE,MAAM,cAAc;EACrB,IAAI,QAAQ,CAAC,WAAW,SACtB,SAAS,OAAO;EAElB,UAAU;CACZ,CACF;CAEA,MAAM,iBAAuE,MAAM;EACjF,MAAM,YAAY,MAAM;EAGxB,YAAY,CAAC;EACb,IAAI,EAAE,kBACJ;EAGF,IAAI,EAAE,QAAQ,YAAY,OAAO,GAAG;GAClC,EAAE,eAAe;GACjB,EAAE,gBAAgB;GAClB,MAAM,mBAAmB;EAC3B;CACF;CAEA,MAAM,cAAc,eAClB;EACE,UAAU,KAAA;EACV,OAAO,MAAM;EACb,OAAO,MAAM;EACb,kBAAkB;CACpB,UACO;EACL,QAAQ,OAAO;EACf,mBAAmB,kBAAkB;CACvC,EACF;CAEA,MAAM,mBAAmB,iBACvB,eAAe,UAAqC,EAAE,QAAQ,KAAK,CAAC,CACtE;CAEA,MAAM,eAAe,kBAAyC;EAC5D;EACA,kBAAkB,MAAM;EACxB,UAAU,MAAM;CAClB,EAAE;CAEF,OACE,CAAC,KAAK,MAAM,OAAO,GAAG;MACpB,CAAC,iBAAiB,OAAO,aAAa,GAAG;QACvC,CAAC,QACK,iBAAiB,GACrB,OAAO,YAAY,MAAM,GACzB,OAAO,YAAY,MAAM,GACzB,MAAM,MAAM,MACZ,WAAW,SAAS,OAAO,CAAC,GAC5B,WAAW,eACX,MAAM,OAAOA,YAAU,MAAM,KAAK,EAAE,GACrC;WACE,MAAM,SAAS;QAClB,EAAE,IAAI;MACR,EAAE,iBAAiB;IACrB,EAAE;AAEN;;;;AAUA,SAAgB,mBAAmB,OAA6C;CAC9E,OACE,CAAC,IACC,OAAO,MAAM,SAAS,gCACtB,OAAO;EAAE,UAAU;EAAY,GAAG,MAAM;CAAM,GAC/C;OACE,MAAM,SAAS;IAClB,EAAE;AAEN;;;;AASA,SAAgB,wBAAwB,OAAkD;CACxF,MAAM,MAAM,oBAAoB;CAEhC,MAAM,aAAa;EACjB,IAAI,CAAC,KAAK,OAAO;EACjB,MAAM,QAAQ,IAAI,kBAAkB;EACpC,IAAI,UAAU,OAAO,OAAO;EAC5B,IAAI,UAAU,GAAG,OAAO;EACxB,OAAO,GAAG,MAAM;CAClB;CAEA,OAAO,CAAC,KAAK,OAAO,MAAM,QAAQ,KAAK,EAAE,EAAE;AAC7C;;;;AAWA,SAAgB,qBAAqB,OAA+C;CAClF,MAAM,MAAM,oBAAoB;CAEhC,OACE,CAAC,OACC,cACA,YAAY,MAAM,iBAAiB,mBACnC,OAAO,MAAM,OACb,eAAe,KAAK,mBAAmB,GACxC;OACE,MAAM,YAAY,IAAS;IAC9B,EAAE;AAEN"}
|
|
1
|
+
{"version":3,"file":"ActionBar.jsx","names":["assignRef"],"sources":["../src/ActionBar.tsx"],"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/*\n * Copyright 2024 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// Ported to SolidJS for Proyecto Viviana; based on packages/@adobe/react-spectrum/src/actionbar/ActionBarContainer.tsx\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ActionBar.tsx\n\n/**\n * ActionBar component for solidaria-components\n *\n * Headless action bar that appears when items are selected in a collection.\n * Shows a selection count, clear button, and action buttons.\n *\n * Based on packages/@react-spectrum/s2/src/ActionBar.tsx and\n * https://github.com/adobe/react-spectrum/blob/5ecb3333001313e83898cd07644227897e3bae1f/packages/@adobe/react-spectrum/src/actionbar/ActionBarContainer.tsx.\n * The Solid port keeps the S2 action-bar structure and the Spectrum\n * ActionBarContainer ownership model. It exposes the selection count and clear\n * action as separate headless primitives.\n */\n\nimport { Show, createContext, createMemo, createEffect, useContext } from \"solid-js\";\nimport type { ParentProps } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { announce } from \"@proyecto-viviana/solidaria\";\nimport type { Key } from \"@proyecto-viviana/solid-stately\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n type ClassNameOrFunction,\n type StyleOrFunction,\n type SlotProps,\n useRenderProps,\n filterDOMProps,\n dataAttr,\n} from \"./utils\";\n\ntype RefLike<T> = ((el: T) => void) | { current?: T | null } | undefined;\n\nfunction assignRef<T>(ref: RefLike<T>, el: T): void {\n if (!ref) return;\n if (typeof ref === \"function\") {\n ref(el);\n } else {\n ref.current = el;\n }\n}\n\nexport interface ActionBarRenderProps {\n /** Whether the action bar is visible. */\n isOpen: boolean;\n /** The number of selected items. */\n selectedItemCount: number | \"all\";\n}\n\nexport interface ActionBarProps\n extends\n Omit<JSX.HTMLAttributes<HTMLDivElement>, \"class\" | \"style\" | \"children\" | \"ref\" | \"slot\">,\n SlotProps {\n /** The number of selected items. ActionBar is hidden when 0. @default 0 */\n selectedItemCount?: number | \"all\";\n /** Callback when the clear button is pressed. */\n onClearSelection?: () => void;\n /** Callback when an action is triggered. */\n onAction?: (key: Key) => void;\n /** The action buttons to display. */\n children?: JSX.Element;\n /** CSS class for the container. */\n class?: ClassNameOrFunction<ActionBarRenderProps>;\n /** Inline style for the container. */\n style?: StyleOrFunction<ActionBarRenderProps>;\n /** Accessible label for the action bar. @default 'Actions' */\n \"aria-label\"?: string;\n /** Identifies the element (or elements) that labels the action bar. */\n \"aria-labelledby\"?: string;\n /** Optional keydown handler on the action bar element. */\n onKeyDown?: JSX.EventHandlerUnion<HTMLDivElement, KeyboardEvent>;\n /** Screen reader announcement when the action bar becomes available. */\n actionsAvailableMessage?: string;\n /** Ref for the underlying action bar element. */\n ref?: RefLike<HTMLDivElement>;\n}\n\nexport interface ActionBarContextValue {\n selectedItemCount: () => number | \"all\";\n onClearSelection?: () => void;\n onAction?: (key: Key) => void;\n}\n\nexport const ActionBarContext = createContext<ActionBarContextValue | null>(null);\n\nexport function useActionBarContext(): ActionBarContextValue | null {\n return useContext(ActionBarContext);\n}\n\nexport function ActionBar(props: ActionBarProps): JSX.Element {\n const [local, domProps] = splitProps(props, [\n \"selectedItemCount\",\n \"onClearSelection\",\n \"onAction\",\n \"children\",\n \"class\",\n \"style\",\n \"slot\",\n \"aria-label\",\n \"aria-labelledby\",\n \"onKeyDown\",\n \"actionsAvailableMessage\",\n \"ref\",\n ]);\n\n // Hoist the JSX getter: `selectedItemCount={count()}` compiles as a memo\n // created on first read, and createTrackedEffect forbids primitives.\n const selectedItemCount = createMemo(() => local.selectedItemCount ?? 0);\n const isOpen = () => selectedItemCount() !== 0;\n\n // Faithful to S2 `ActionBar` (ActionBar.tsx:192): the ROOT is a PLAIN\n // container with NO `role` — S2 spreads only `keyboardProps` (an Escape\n // handler that clears the selection) onto it. The single `toolbar` is the\n // inner `ActionButtonGroup` (styled layer), NOT this root. Applying\n // `createToolbar` here would (a) give the root a spurious `role=\"toolbar\"`\n // S2 never renders and (b) nest the real action toolbar inside it, forcing\n // its role to downgrade to `group`. So the root deliberately carries no\n // toolbar props — `aria-label`/`aria-labelledby` are consumed by the inner\n // ActionButtonGroup at the styled layer.\n let wasOpen = false;\n createEffect(\n () => ({ open: isOpen(), message: local.actionsAvailableMessage }),\n ({ open, message }) => {\n if (open && !wasOpen && message) {\n announce(message);\n }\n wasOpen = open;\n },\n );\n\n const handleKeyDown: JSX.EventHandlerUnion<HTMLDivElement, KeyboardEvent> = (e) => {\n const onKeyDown = local.onKeyDown as\n | JSX.EventHandler<HTMLDivElement, KeyboardEvent>\n | undefined;\n onKeyDown?.(e);\n if (e.defaultPrevented) {\n return;\n }\n\n if (e.key === \"Escape\" && isOpen()) {\n e.preventDefault();\n e.stopPropagation();\n local.onClearSelection?.();\n }\n };\n\n const renderProps = useRenderProps(\n {\n children: undefined,\n get class() {\n return local.class;\n },\n get style() {\n return local.style;\n },\n defaultClassName: \"solidaria-ActionBar\",\n },\n () => ({\n isOpen: isOpen(),\n selectedItemCount: selectedItemCount(),\n }),\n );\n\n const filteredDOMProps = createMemo(() =>\n filterDOMProps(domProps as Record<string, unknown>, { global: true }),\n );\n\n const contextValue = createMemo<ActionBarContextValue>(() => ({\n selectedItemCount,\n onClearSelection: local.onClearSelection,\n onAction: local.onAction,\n }));\n\n return (\n <Show when={isOpen()}>\n <ActionBarContext value={contextValue()}>\n <div\n {...filteredDOMProps()}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-open={dataAttr(isOpen())}\n onKeyDown={handleKeyDown}\n ref={(el) => assignRef(local.ref, el)}\n >\n {local.children}\n </div>\n </ActionBarContext>\n </Show>\n );\n}\n\nexport interface ActionBarContainerProps extends ParentProps {\n class?: string;\n style?: JSX.CSSProperties;\n}\n\n/**\n * Container that positions a collection and its ActionBar.\n */\nexport function ActionBarContainer(props: ActionBarContainerProps): JSX.Element {\n return (\n <div\n class={props.class ?? \"solidaria-ActionBarContainer\"}\n style={{ position: \"relative\", ...props.style }}\n >\n {props.children}\n </div>\n );\n}\n\nexport interface ActionBarSelectionCountProps {\n class?: string;\n}\n\n/**\n * Displays the count of selected items.\n */\nexport function ActionBarSelectionCount(props: ActionBarSelectionCountProps): JSX.Element {\n const ctx = useActionBarContext();\n\n const text = () => {\n if (!ctx) return \"\";\n const count = ctx.selectedItemCount();\n if (count === \"all\") return \"All selected\";\n if (count === 0) return \"None selected\";\n return `${count} selected`;\n };\n\n return <span class={props.class}>{text()}</span>;\n}\n\nexport interface ActionBarClearButtonProps {\n class?: string;\n children?: JSX.Element;\n \"aria-label\"?: string;\n}\n\n/**\n * Button to clear the current selection.\n */\nexport function ActionBarClearButton(props: ActionBarClearButtonProps): JSX.Element {\n const ctx = useActionBarContext();\n\n return (\n <button\n type=\"button\"\n aria-label={props[\"aria-label\"] ?? \"Clear selection\"}\n class={props.class}\n onClick={() => ctx?.onClearSelection?.()}\n >\n {props.children ?? \"\\u2715\"}\n </button>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDA,SAASA,YAAa,KAAiB,IAAa;CAClD,IAAI,CAAC,KAAK;CACV,IAAI,OAAO,QAAQ,YACjB,IAAI,EAAE;MAEN,IAAI,UAAU;AAElB;AA2CA,MAAa,mBAAmB,cAA4C,IAAI;AAEhF,SAAgB,sBAAoD;CAClE,OAAO,WAAW,gBAAgB;AACpC;AAEA,SAAgB,UAAU,OAAoC;CAC5D,MAAM,CAAC,OAAO,YAAY,WAAW,OAAO;EAC1C;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAID,MAAM,oBAAoB,iBAAiB,MAAM,qBAAqB,CAAC;CACvE,MAAM,eAAe,kBAAkB,MAAM;CAW7C,IAAI,UAAU;CACd,oBACS;EAAE,MAAM,OAAO;EAAG,SAAS,MAAM;CAAwB,KAC/D,EAAE,MAAM,cAAc;EACrB,IAAI,QAAQ,CAAC,WAAW,SACtB,SAAS,OAAO;EAElB,UAAU;CACZ,CACF;CAEA,MAAM,iBAAuE,MAAM;EACjF,MAAM,YAAY,MAAM;EAGxB,YAAY,CAAC;EACb,IAAI,EAAE,kBACJ;EAGF,IAAI,EAAE,QAAQ,YAAY,OAAO,GAAG;GAClC,EAAE,eAAe;GACjB,EAAE,gBAAgB;GAClB,MAAM,mBAAmB;EAC3B;CACF;CAEA,MAAM,cAAc,eAClB;EACE,UAAU,KAAA;EACV,IAAI,QAAQ;GACV,OAAO,MAAM;EACf;EACA,IAAI,QAAQ;GACV,OAAO,MAAM;EACf;EACA,kBAAkB;CACpB,UACO;EACL,QAAQ,OAAO;EACf,mBAAmB,kBAAkB;CACvC,EACF;CAEA,MAAM,mBAAmB,iBACvB,eAAe,UAAqC,EAAE,QAAQ,KAAK,CAAC,CACtE;CAEA,MAAM,eAAe,kBAAyC;EAC5D;EACA,kBAAkB,MAAM;EACxB,UAAU,MAAM;CAClB,EAAE;CAEF,OACE,CAAC,KAAK,MAAM,OAAO,GAAG;MACpB,CAAC,iBAAiB,OAAO,aAAa,GAAG;QACvC,CAAC,QACK,iBAAiB,GACrB,OAAO,YAAY,MAAM,GACzB,OAAO,YAAY,MAAM,GACzB,MAAM,MAAM,MACZ,WAAW,SAAS,OAAO,CAAC,GAC5B,WAAW,eACX,MAAM,OAAOA,YAAU,MAAM,KAAK,EAAE,GACrC;WACE,MAAM,SAAS;QAClB,EAAE,IAAI;MACR,EAAE,iBAAiB;IACrB,EAAE;AAEN;;;;AAUA,SAAgB,mBAAmB,OAA6C;CAC9E,OACE,CAAC,IACC,OAAO,MAAM,SAAS,gCACtB,OAAO;EAAE,UAAU;EAAY,GAAG,MAAM;CAAM,GAC/C;OACE,MAAM,SAAS;IAClB,EAAE;AAEN;;;;AASA,SAAgB,wBAAwB,OAAkD;CACxF,MAAM,MAAM,oBAAoB;CAEhC,MAAM,aAAa;EACjB,IAAI,CAAC,KAAK,OAAO;EACjB,MAAM,QAAQ,IAAI,kBAAkB;EACpC,IAAI,UAAU,OAAO,OAAO;EAC5B,IAAI,UAAU,GAAG,OAAO;EACxB,OAAO,GAAG,MAAM;CAClB;CAEA,OAAO,CAAC,KAAK,OAAO,MAAM,QAAQ,KAAK,EAAE,EAAE;AAC7C;;;;AAWA,SAAgB,qBAAqB,OAA+C;CAClF,MAAM,MAAM,oBAAoB;CAEhC,OACE,CAAC,OACC,cACA,YAAY,MAAM,iBAAiB,mBACnC,OAAO,MAAM,OACb,eAAe,KAAK,mBAAmB,GACxC;OACE,MAAM,YAAY,IAAS;IAC9B,EAAE;AAEN"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionGroup.d.ts","sourceRoot":"","sources":["../src/ActionGroup.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAMxC,OAAO,EAEL,KAAK,SAAS,EACd,KAAK,GAAG,EACR,KAAK,aAAa,EACnB,MAAM,iCAAiC,CAAC;AAEzC,OAAO,EACL,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,SAAS,EAIf,MAAM,SAAS,CAAC;AAEjB,MAAM,WAAW,sBAAsB;IACrC,2CAA2C;IAC3C,WAAW,EAAE,YAAY,GAAG,UAAU,CAAC;IACvC,4CAA4C;IAC5C,UAAU,EAAE,OAAO,CAAC;IACpB,0BAA0B;IAC1B,aAAa,EAAE,aAAa,CAAC;CAC9B;AAED,MAAM,WAAW,0BAA0B;IACzC,oCAAoC;IACpC,UAAU,EAAE,OAAO,CAAC;IACpB,oCAAoC;IACpC,UAAU,EAAE,OAAO,CAAC;IACpB,mCAAmC;IACnC,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,eAAe,GAAG,eAAe,CAAE,SAAQ,SAAS;IAC9F,qCAAqC;IACrC,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,0CAA0C;IAC1C,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,sDAAsD;IACtD,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,4CAA4C;IAC5C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wBAAwB;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,sBAAsB;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,4CAA4C;IAC5C,YAAY,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC;IAC7B,4CAA4C;IAC5C,mBAAmB,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC;IACpC,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,GAAG,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC;IACrD,uDAAuD;IACvD,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B,8BAA8B;IAC9B,YAAY,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC;IAC7B,qCAAqC;IACrC,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,WAAW,EAAE,0BAA0B,KAAK,GAAG,CAAC,OAAO,CAAC;IAC5E,mCAAmC;IACnC,KAAK,CAAC,EAAE,mBAAmB,CAAC,sBAAsB,CAAC,CAAC;IACpD,sCAAsC;IACtC,KAAK,CAAC,EAAE,eAAe,CAAC,sBAAsB,CAAC,CAAC;CACjD;AAED,MAAM,WAAW,uBAAuB,CAAC,CAAC,SAAS,eAAe,GAAG,eAAe;IAClF,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;CACrB;AAED,eAAO,MAAM,kBAAkB,6EAAsD,CAAC;AACtF,eAAO,MAAM,uBAAuB,+DAAyD,CAAC;AAE9F,wBAAgB,WAAW,CAAC,CAAC,SAAS,eAAe,GAAG,eAAe,EACrE,KAAK,EAAE,gBAAgB,CAAC,CAAC,CAAC,GACzB,GAAG,CAAC,OAAO,
|
|
1
|
+
{"version":3,"file":"ActionGroup.d.ts","sourceRoot":"","sources":["../src/ActionGroup.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAMxC,OAAO,EAEL,KAAK,SAAS,EACd,KAAK,GAAG,EACR,KAAK,aAAa,EACnB,MAAM,iCAAiC,CAAC;AAEzC,OAAO,EACL,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,SAAS,EAIf,MAAM,SAAS,CAAC;AAEjB,MAAM,WAAW,sBAAsB;IACrC,2CAA2C;IAC3C,WAAW,EAAE,YAAY,GAAG,UAAU,CAAC;IACvC,4CAA4C;IAC5C,UAAU,EAAE,OAAO,CAAC;IACpB,0BAA0B;IAC1B,aAAa,EAAE,aAAa,CAAC;CAC9B;AAED,MAAM,WAAW,0BAA0B;IACzC,oCAAoC;IACpC,UAAU,EAAE,OAAO,CAAC;IACpB,oCAAoC;IACpC,UAAU,EAAE,OAAO,CAAC;IACpB,mCAAmC;IACnC,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,eAAe,GAAG,eAAe,CAAE,SAAQ,SAAS;IAC9F,qCAAqC;IACrC,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,0CAA0C;IAC1C,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,sDAAsD;IACtD,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,4CAA4C;IAC5C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wBAAwB;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,sBAAsB;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,4CAA4C;IAC5C,YAAY,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC;IAC7B,4CAA4C;IAC5C,mBAAmB,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC;IACpC,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,GAAG,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC;IACrD,uDAAuD;IACvD,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B,8BAA8B;IAC9B,YAAY,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC;IAC7B,qCAAqC;IACrC,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,WAAW,EAAE,0BAA0B,KAAK,GAAG,CAAC,OAAO,CAAC;IAC5E,mCAAmC;IACnC,KAAK,CAAC,EAAE,mBAAmB,CAAC,sBAAsB,CAAC,CAAC;IACpD,sCAAsC;IACtC,KAAK,CAAC,EAAE,eAAe,CAAC,sBAAsB,CAAC,CAAC;CACjD;AAED,MAAM,WAAW,uBAAuB,CAAC,CAAC,SAAS,eAAe,GAAG,eAAe;IAClF,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;CACrB;AAED,eAAO,MAAM,kBAAkB,6EAAsD,CAAC;AACtF,eAAO,MAAM,uBAAuB,+DAAyD,CAAC;AAE9F,wBAAgB,WAAW,CAAC,CAAC,SAAS,eAAe,GAAG,eAAe,EACrE,KAAK,EAAE,gBAAgB,CAAC,CAAC,CAAC,GACzB,GAAG,CAAC,OAAO,CA8Hb;AAiDD,wBAAgB,qBAAqB,IAAI,uBAAuB,GAAG,IAAI,CAEtE"}
|
package/dist/ActionGroup.js
CHANGED
|
@@ -96,8 +96,12 @@ function ActionGroup(props) {
|
|
|
96
96
|
const orientation = () => local.orientation ?? "horizontal";
|
|
97
97
|
const renderProps = useRenderProps({
|
|
98
98
|
children: void 0,
|
|
99
|
-
class
|
|
100
|
-
|
|
99
|
+
get class() {
|
|
100
|
+
return local.class;
|
|
101
|
+
},
|
|
102
|
+
get style() {
|
|
103
|
+
return local.style;
|
|
104
|
+
},
|
|
101
105
|
defaultClassName: "solidaria-ActionGroup"
|
|
102
106
|
}, () => ({
|
|
103
107
|
orientation: orientation(),
|
package/dist/ActionGroup.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionGroup.js","names":["<ActionGroupContext value={{ state: state as ListState<ActionGroupItem> }}>\n <ActionGroupStateContext value={state as ListState<ActionGroupItem>}>\n <div\n {...filteredDOMProps()}\n {...actionGroupProps}\n ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-orientation={orientation()}\n data-disabled={dataAttr(local.isDisabled)}\n >\n <For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>\n </div>\n </ActionGroupStateContext>\n </ActionGroupContext>","value={{ state: state as ListState<ActionGroupItem> }}","<ActionGroupStateContext value={state as ListState<ActionGroupItem>}>\n <div\n {...filteredDOMProps()}\n {...actionGroupProps}\n ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-orientation={orientation()}\n data-disabled={dataAttr(local.isDisabled)}\n >\n <For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>\n </div>\n </ActionGroupStateContext>","value={state as ListState<ActionGroupItem>}","ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}","<For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>","<ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />","state={state as ListState<ActionGroupItem>}","<div\n {...filteredDOMProps()}\n {...actionGroupProps}\n ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-orientation={orientation()}\n data-disabled={dataAttr(local.isDisabled)}\n >\n <For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>\n </div>","{props.renderChild(props.item, renderProps())}","<button\n {...restButtonProps}\n data-selected={dataAttr(isSelected())}\n data-disabled={dataAttr(isDisabled())}\n data-focused={dataAttr(isFocused())}\n >\n {props.renderChild(props.item, renderProps())}\n </button>"],"sources":["../src/ActionGroup.tsx"],"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// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroup.ts\n// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroupItem.ts\n\n/**\n * ActionGroup component for solidaria-components\n *\n * Pre-wired headless action group component that combines\n * createListState + createActionGroup/createActionGroupItem.\n * Provides proper dynamic roles (toolbar/radiogroup), keyboard\n * navigation, and ARIA attributes.\n *\n * Based on packages/react-aria/src/actiongroup/useActionGroup.ts and\n * packages/react-aria/src/actiongroup/useActionGroupItem.ts. React Aria\n * Components has no ActionGroup component, so this file wires the two hooks.\n */\n\nimport { createContext, createMemo, useContext, For } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport {\n createActionGroup,\n createActionGroupItem,\n type AriaActionGroupProps,\n} from \"@proyecto-viviana/solidaria\";\nimport {\n createListState,\n type ListState,\n type Key,\n type SelectionMode,\n} from \"@proyecto-viviana/solid-stately\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n type ClassNameOrFunction,\n type StyleOrFunction,\n type SlotProps,\n useRenderProps,\n filterDOMProps,\n dataAttr,\n} from \"./utils\";\n\nexport interface ActionGroupRenderProps {\n /** The orientation of the action group. */\n orientation: \"horizontal\" | \"vertical\";\n /** Whether the entire group is disabled. */\n isDisabled: boolean;\n /** The selection mode. */\n selectionMode: SelectionMode;\n}\n\nexport interface ActionGroupItemRenderProps {\n /** Whether the item is selected. */\n isSelected: boolean;\n /** Whether the item is disabled. */\n isDisabled: boolean;\n /** Whether the item is focused. */\n isFocused: boolean;\n}\n\nexport interface ActionGroupItem {\n id: string;\n label: string;\n isDisabled?: boolean;\n [key: string]: unknown;\n}\n\nexport interface ActionGroupProps<T extends ActionGroupItem = ActionGroupItem> extends SlotProps {\n /** The items in the action group. */\n items: T[];\n /** The selection mode. @default 'none' */\n selectionMode?: SelectionMode;\n /** Orientation of the group. @default 'horizontal' */\n orientation?: \"horizontal\" | \"vertical\";\n /** Whether the entire group is disabled. */\n isDisabled?: boolean;\n /** Accessible label. */\n \"aria-label\"?: string;\n /** Labelled-by id. */\n \"aria-labelledby\"?: string;\n /** Currently selected keys (controlled). */\n selectedKeys?: Iterable<Key>;\n /** Default selected keys (uncontrolled). */\n defaultSelectedKeys?: Iterable<Key>;\n /** Handler called when selection changes. */\n onSelectionChange?: (keys: \"all\" | Set<Key>) => void;\n /** Handler called when an item action is triggered. */\n onAction?: (key: Key) => void;\n /** Keys of disabled items. */\n disabledKeys?: Iterable<Key>;\n /** Render function for each item. */\n children: (item: T, renderProps: ActionGroupItemRenderProps) => JSX.Element;\n /** CSS class for the container. */\n class?: ClassNameOrFunction<ActionGroupRenderProps>;\n /** Inline style for the container. */\n style?: StyleOrFunction<ActionGroupRenderProps>;\n}\n\nexport interface ActionGroupContextValue<T extends ActionGroupItem = ActionGroupItem> {\n state: ListState<T>;\n}\n\nexport const ActionGroupContext = createContext<ActionGroupContextValue | null>(null);\nexport const ActionGroupStateContext = createContext<ListState<ActionGroupItem> | null>(null);\n\nexport function ActionGroup<T extends ActionGroupItem = ActionGroupItem>(\n props: ActionGroupProps<T>,\n): JSX.Element {\n const [local, ariaGroupProps, domProps] = splitProps(\n props,\n [\n \"items\",\n \"selectionMode\",\n \"orientation\",\n \"isDisabled\",\n \"selectedKeys\",\n \"defaultSelectedKeys\",\n \"onSelectionChange\",\n \"onAction\",\n \"disabledKeys\",\n \"children\",\n \"class\",\n \"style\",\n \"slot\",\n ],\n [\"aria-label\", \"aria-labelledby\"],\n );\n\n const state = createListState<T>({\n get items() {\n return local.items;\n },\n get selectionMode() {\n return local.selectionMode ?? \"none\";\n },\n get selectedKeys() {\n return local.selectedKeys;\n },\n get defaultSelectedKeys() {\n return local.defaultSelectedKeys;\n },\n get onSelectionChange() {\n return local.onSelectionChange;\n },\n get disabledKeys() {\n return local.disabledKeys;\n },\n getKey: (item) => item.id,\n getTextValue: (item) => item.label,\n getDisabled: (item) => !!item.isDisabled,\n });\n\n const groupAriaProps: AriaActionGroupProps<T> = {\n get items() {\n return local.items;\n },\n get isDisabled() {\n return local.isDisabled;\n },\n get orientation() {\n return local.orientation;\n },\n get \"aria-label\"() {\n return ariaGroupProps[\"aria-label\"];\n },\n get \"aria-labelledby\"() {\n return ariaGroupProps[\"aria-labelledby\"];\n },\n get onAction() {\n return local.onAction;\n },\n };\n\n const { actionGroupProps } = createActionGroup(groupAriaProps, state as ListState<T>);\n\n const orientation = () => local.orientation ?? \"horizontal\";\n\n const renderProps = useRenderProps(\n {\n children: undefined,\n class: local.class,\n style: local.style,\n defaultClassName: \"solidaria-ActionGroup\",\n },\n () => ({\n orientation: orientation(),\n isDisabled: !!local.isDisabled,\n selectionMode: (local.selectionMode ?? \"none\") as SelectionMode,\n }),\n );\n\n const filteredDOMProps = createMemo(() =>\n filterDOMProps(domProps as Record<string, unknown>, { global: true }),\n );\n\n return (\n <ActionGroupContext value={{ state: state as ListState<ActionGroupItem> }}>\n <ActionGroupStateContext value={state as ListState<ActionGroupItem>}>\n <div\n {...filteredDOMProps()}\n {...actionGroupProps}\n ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-orientation={orientation()}\n data-disabled={dataAttr(local.isDisabled)}\n >\n <For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>\n </div>\n </ActionGroupStateContext>\n </ActionGroupContext>\n );\n}\n\ninterface ActionGroupItemWrapperProps {\n item: ActionGroupItem;\n state: ListState<ActionGroupItem>;\n renderChild: (item: ActionGroupItem, renderProps: ActionGroupItemRenderProps) => JSX.Element;\n}\n\nfunction ActionGroupItemWrapper(props: ActionGroupItemWrapperProps): JSX.Element {\n const { buttonProps } = createActionGroupItem(\n {\n get key() {\n return props.item.id;\n },\n },\n props.state,\n );\n\n const isFocused = () => props.state.focusedKey() === props.item.id;\n const isSelected = () => {\n const keys = props.state.selectedKeys();\n return keys === \"all\" || (keys instanceof Set && keys.has(props.item.id));\n };\n const isDisabled = () => props.state.isDisabled(props.item.id);\n\n const renderProps = createMemo<ActionGroupItemRenderProps>(() => ({\n isSelected: isSelected(),\n isDisabled: isDisabled(),\n isFocused: isFocused(),\n }));\n\n // splitProps (not object destructuring) so the reactive getters on buttonProps\n // — tabIndex (roving stop), onFocus (sets the focused key), role, aria-checked\n // — stay live. A rest-spread `{ ref, ...rest }` would FREEZE them at their\n // first-render values, pinning the roving tabIndex and killing focus tracking.\n const [, restButtonProps] = splitProps(buttonProps, [\"ref\"]);\n\n return (\n <button\n {...restButtonProps}\n data-selected={dataAttr(isSelected())}\n data-disabled={dataAttr(isDisabled())}\n data-focused={dataAttr(isFocused())}\n >\n {props.renderChild(props.item, renderProps())}\n </button>\n );\n}\n\nexport function useActionGroupContext(): ActionGroupContextValue | null {\n return useContext(ActionGroupContext);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+GA,MAAa,qBAAqB,cAA8C,IAAI;AACpF,MAAa,0BAA0B,cAAiD,IAAI;AAE5F,SAAgB,YACd,OACa;CACb,MAAM,CAAC,OAAO,gBAAgB,YAAY,WACxC,OACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,GACA,CAAC,cAAc,iBAAiB,CAClC;CAEA,MAAM,QAAQ,gBAAmB;EAC/B,IAAI,QAAQ;GACV,OAAO,MAAM;EACf;EACA,IAAI,gBAAgB;GAClB,OAAO,MAAM,iBAAiB;EAChC;EACA,IAAI,eAAe;GACjB,OAAO,MAAM;EACf;EACA,IAAI,sBAAsB;GACxB,OAAO,MAAM;EACf;EACA,IAAI,oBAAoB;GACtB,OAAO,MAAM;EACf;EACA,IAAI,eAAe;GACjB,OAAO,MAAM;EACf;EACA,SAAS,SAAS,KAAK;EACvB,eAAe,SAAS,KAAK;EAC7B,cAAc,SAAS,CAAC,CAAC,KAAK;CAChC,CAAC;CAuBD,MAAM,EAAE,qBAAqB,kBAAkB;EApB7C,IAAI,QAAQ;GACV,OAAO,MAAM;EACf;EACA,IAAI,aAAa;GACf,OAAO,MAAM;EACf;EACA,IAAI,cAAc;GAChB,OAAO,MAAM;EACf;EACA,IAAI,eAAe;GACjB,OAAO,eAAe;EACxB;EACA,IAAI,oBAAoB;GACtB,OAAO,eAAe;EACxB;EACA,IAAI,WAAW;GACb,OAAO,MAAM;EACf;CAG6C,GAAgB,KAAqB;CAEpF,MAAM,oBAAoB,MAAM,eAAe;CAE/C,MAAM,cAAc,eAClB;EACE,UAAU,KAAA;EACV,OAAO,MAAM;EACb,OAAO,MAAM;EACb,kBAAkB;CACpB,UACO;EACL,aAAa,YAAY;EACzB,YAAY,CAAC,CAAC,MAAM;EACpB,eAAgB,MAAM,iBAAiB;CACzC,EACF;CAEA,MAAM,mBAAmB,iBACvB,eAAe,UAAqC,EAAE,QAAQ,KAAK,CAAC,CACtE;CAEA,OACEA,gBAAAA,oBAAAA;EAAoBC,OAAO,EAAS,MAAoC;EAAxE,IAAA,WAAA;GACEC,OAAAA,gBAAAA,yBAAAA;IAAyBC,OAAO;IAAhC,IAAA,WAAA;KACE,IAAA,OAAA,eAAA,MA2BK;KAxBH,UAAA;MAAM,QAAA,OAAuB;OAC3B,MAAM,QAAS,iBAAyD;OACxE,QAAQ,EAAE;MACZ;KAAC,GAHDC,IAGC;;MALG;MACA;;OAKJ,IAAA,UAAA;QAAO,OAAA,YAAY,MAAM;OAAC;OAC1B,IAAA,QAAA;QAAO,OAAA,YAAY,MAAM;OAAC;OAC1B,IAAA,OAAA;QAAM,OAAA,MAAM;OAAI;OAChB,IAAA,qBAAA;QAAkB,OAAA,YAAY;OAAC;OAC/B,IAAA,kBAAA;QAAe,OAAA,SAAS,MAAM,UAAU;OAAC;;;KAX3C,OAAA,MAaEC,gBAAAA,KAAAA;MAAK,IAAA,OAAA;OAAM,OAAA,MAAM;MAAK;MAAtBA,WACI,SACAC,gBAAAA,wBAAAA;OACQ;OACC;OACP,IAAA,cAAA;QACE,OAAA,MAAM;OAIR;MACD,CAAA;KAEA,CAAA,CACF;KA3BL,mBA2BK;KA5BP,OACEE;IA4BuB;;EACP;;AAExB;AAQA,SAAS,uBAAuB,OAAiD;CAC/E,MAAM,EAAE,gBAAgB,sBACtB,EACE,IAAI,MAAM;EACR,OAAO,MAAM,KAAK;CACpB,EACF,GACA,MAAM,KACR;CAEA,MAAM,kBAAkB,MAAM,MAAM,WAAW,MAAM,MAAM,KAAK;CAChE,MAAM,mBAAmB;EACvB,MAAM,OAAO,MAAM,MAAM,aAAa;EACtC,OAAO,SAAS,SAAU,gBAAgB,OAAO,KAAK,IAAI,MAAM,KAAK,EAAE;CACzE;CACA,MAAM,mBAAmB,MAAM,MAAM,WAAW,MAAM,KAAK,EAAE;CAE7D,MAAM,cAAc,kBAA8C;EAChE,YAAY,WAAW;EACvB,YAAY,WAAW;EACvB,WAAW,UAAU;CACvB,EAAE;CAMF,MAAM,GAAG,mBAAmB,WAAW,aAAa,CAAC,KAAK,CAAC;CAGzD,IAAA,QAAA,eAAA,OAOQ;CANF,OAAA,OAAA,CAAA,iBAAA;EACJ,IAAA,kBAAA;GAAe,OAAA,SAAS,WAAW,CAAC;EAAC;EACrC,IAAA,kBAAA;GAAe,OAAA,SAAS,WAAW,CAAC;EAAC;EACrC,IAAA,iBAAA;GAAc,OAAA,SAAS,UAAU,CAAC;EAAC;;CAJrC,OAAA,OAMEC,YAAAA;EAAC,OAAA,MAAM,YAAY,MAAM,MAAM,YAAY,CAAC;CAAC,CAAA,CACvC;CAPR,mBAOQ;CARV,OACEC;AASJ;AAEA,SAAgB,wBAAwD;CACtE,OAAO,WAAW,kBAAkB;AACtC"}
|
|
1
|
+
{"version":3,"file":"ActionGroup.js","names":["<ActionGroupContext value={{ state: state as ListState<ActionGroupItem> }}>\n <ActionGroupStateContext value={state as ListState<ActionGroupItem>}>\n <div\n {...filteredDOMProps()}\n {...actionGroupProps}\n ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-orientation={orientation()}\n data-disabled={dataAttr(local.isDisabled)}\n >\n <For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>\n </div>\n </ActionGroupStateContext>\n </ActionGroupContext>","value={{ state: state as ListState<ActionGroupItem> }}","<ActionGroupStateContext value={state as ListState<ActionGroupItem>}>\n <div\n {...filteredDOMProps()}\n {...actionGroupProps}\n ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-orientation={orientation()}\n data-disabled={dataAttr(local.isDisabled)}\n >\n <For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>\n </div>\n </ActionGroupStateContext>","value={state as ListState<ActionGroupItem>}","ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}","<For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>","<ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />","state={state as ListState<ActionGroupItem>}","<div\n {...filteredDOMProps()}\n {...actionGroupProps}\n ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-orientation={orientation()}\n data-disabled={dataAttr(local.isDisabled)}\n >\n <For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>\n </div>","{props.renderChild(props.item, renderProps())}","<button\n {...restButtonProps}\n data-selected={dataAttr(isSelected())}\n data-disabled={dataAttr(isDisabled())}\n data-focused={dataAttr(isFocused())}\n >\n {props.renderChild(props.item, renderProps())}\n </button>"],"sources":["../src/ActionGroup.tsx"],"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// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroup.ts\n// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroupItem.ts\n\n/**\n * ActionGroup component for solidaria-components\n *\n * Pre-wired headless action group component that combines\n * createListState + createActionGroup/createActionGroupItem.\n * Provides proper dynamic roles (toolbar/radiogroup), keyboard\n * navigation, and ARIA attributes.\n *\n * Based on packages/react-aria/src/actiongroup/useActionGroup.ts and\n * packages/react-aria/src/actiongroup/useActionGroupItem.ts. React Aria\n * Components has no ActionGroup component, so this file wires the two hooks.\n */\n\nimport { createContext, createMemo, useContext, For } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport {\n createActionGroup,\n createActionGroupItem,\n type AriaActionGroupProps,\n} from \"@proyecto-viviana/solidaria\";\nimport {\n createListState,\n type ListState,\n type Key,\n type SelectionMode,\n} from \"@proyecto-viviana/solid-stately\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n type ClassNameOrFunction,\n type StyleOrFunction,\n type SlotProps,\n useRenderProps,\n filterDOMProps,\n dataAttr,\n} from \"./utils\";\n\nexport interface ActionGroupRenderProps {\n /** The orientation of the action group. */\n orientation: \"horizontal\" | \"vertical\";\n /** Whether the entire group is disabled. */\n isDisabled: boolean;\n /** The selection mode. */\n selectionMode: SelectionMode;\n}\n\nexport interface ActionGroupItemRenderProps {\n /** Whether the item is selected. */\n isSelected: boolean;\n /** Whether the item is disabled. */\n isDisabled: boolean;\n /** Whether the item is focused. */\n isFocused: boolean;\n}\n\nexport interface ActionGroupItem {\n id: string;\n label: string;\n isDisabled?: boolean;\n [key: string]: unknown;\n}\n\nexport interface ActionGroupProps<T extends ActionGroupItem = ActionGroupItem> extends SlotProps {\n /** The items in the action group. */\n items: T[];\n /** The selection mode. @default 'none' */\n selectionMode?: SelectionMode;\n /** Orientation of the group. @default 'horizontal' */\n orientation?: \"horizontal\" | \"vertical\";\n /** Whether the entire group is disabled. */\n isDisabled?: boolean;\n /** Accessible label. */\n \"aria-label\"?: string;\n /** Labelled-by id. */\n \"aria-labelledby\"?: string;\n /** Currently selected keys (controlled). */\n selectedKeys?: Iterable<Key>;\n /** Default selected keys (uncontrolled). */\n defaultSelectedKeys?: Iterable<Key>;\n /** Handler called when selection changes. */\n onSelectionChange?: (keys: \"all\" | Set<Key>) => void;\n /** Handler called when an item action is triggered. */\n onAction?: (key: Key) => void;\n /** Keys of disabled items. */\n disabledKeys?: Iterable<Key>;\n /** Render function for each item. */\n children: (item: T, renderProps: ActionGroupItemRenderProps) => JSX.Element;\n /** CSS class for the container. */\n class?: ClassNameOrFunction<ActionGroupRenderProps>;\n /** Inline style for the container. */\n style?: StyleOrFunction<ActionGroupRenderProps>;\n}\n\nexport interface ActionGroupContextValue<T extends ActionGroupItem = ActionGroupItem> {\n state: ListState<T>;\n}\n\nexport const ActionGroupContext = createContext<ActionGroupContextValue | null>(null);\nexport const ActionGroupStateContext = createContext<ListState<ActionGroupItem> | null>(null);\n\nexport function ActionGroup<T extends ActionGroupItem = ActionGroupItem>(\n props: ActionGroupProps<T>,\n): JSX.Element {\n const [local, ariaGroupProps, domProps] = splitProps(\n props,\n [\n \"items\",\n \"selectionMode\",\n \"orientation\",\n \"isDisabled\",\n \"selectedKeys\",\n \"defaultSelectedKeys\",\n \"onSelectionChange\",\n \"onAction\",\n \"disabledKeys\",\n \"children\",\n \"class\",\n \"style\",\n \"slot\",\n ],\n [\"aria-label\", \"aria-labelledby\"],\n );\n\n const state = createListState<T>({\n get items() {\n return local.items;\n },\n get selectionMode() {\n return local.selectionMode ?? \"none\";\n },\n get selectedKeys() {\n return local.selectedKeys;\n },\n get defaultSelectedKeys() {\n return local.defaultSelectedKeys;\n },\n get onSelectionChange() {\n return local.onSelectionChange;\n },\n get disabledKeys() {\n return local.disabledKeys;\n },\n getKey: (item) => item.id,\n getTextValue: (item) => item.label,\n getDisabled: (item) => !!item.isDisabled,\n });\n\n const groupAriaProps: AriaActionGroupProps<T> = {\n get items() {\n return local.items;\n },\n get isDisabled() {\n return local.isDisabled;\n },\n get orientation() {\n return local.orientation;\n },\n get \"aria-label\"() {\n return ariaGroupProps[\"aria-label\"];\n },\n get \"aria-labelledby\"() {\n return ariaGroupProps[\"aria-labelledby\"];\n },\n get onAction() {\n return local.onAction;\n },\n };\n\n const { actionGroupProps } = createActionGroup(groupAriaProps, state as ListState<T>);\n\n const orientation = () => local.orientation ?? \"horizontal\";\n\n const renderProps = useRenderProps(\n {\n children: undefined,\n get class() {\n return local.class;\n },\n get style() {\n return local.style;\n },\n defaultClassName: \"solidaria-ActionGroup\",\n },\n () => ({\n orientation: orientation(),\n isDisabled: !!local.isDisabled,\n selectionMode: (local.selectionMode ?? \"none\") as SelectionMode,\n }),\n );\n\n const filteredDOMProps = createMemo(() =>\n filterDOMProps(domProps as Record<string, unknown>, { global: true }),\n );\n\n return (\n <ActionGroupContext value={{ state: state as ListState<ActionGroupItem> }}>\n <ActionGroupStateContext value={state as ListState<ActionGroupItem>}>\n <div\n {...filteredDOMProps()}\n {...actionGroupProps}\n ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-orientation={orientation()}\n data-disabled={dataAttr(local.isDisabled)}\n >\n <For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>\n </div>\n </ActionGroupStateContext>\n </ActionGroupContext>\n );\n}\n\ninterface ActionGroupItemWrapperProps {\n item: ActionGroupItem;\n state: ListState<ActionGroupItem>;\n renderChild: (item: ActionGroupItem, renderProps: ActionGroupItemRenderProps) => JSX.Element;\n}\n\nfunction ActionGroupItemWrapper(props: ActionGroupItemWrapperProps): JSX.Element {\n const { buttonProps } = createActionGroupItem(\n {\n get key() {\n return props.item.id;\n },\n },\n props.state,\n );\n\n const isFocused = () => props.state.focusedKey() === props.item.id;\n const isSelected = () => {\n const keys = props.state.selectedKeys();\n return keys === \"all\" || (keys instanceof Set && keys.has(props.item.id));\n };\n const isDisabled = () => props.state.isDisabled(props.item.id);\n\n const renderProps = createMemo<ActionGroupItemRenderProps>(() => ({\n isSelected: isSelected(),\n isDisabled: isDisabled(),\n isFocused: isFocused(),\n }));\n\n // splitProps (not object destructuring) so the reactive getters on buttonProps\n // — tabIndex (roving stop), onFocus (sets the focused key), role, aria-checked\n // — stay live. A rest-spread `{ ref, ...rest }` would FREEZE them at their\n // first-render values, pinning the roving tabIndex and killing focus tracking.\n const [, restButtonProps] = splitProps(buttonProps, [\"ref\"]);\n\n return (\n <button\n {...restButtonProps}\n data-selected={dataAttr(isSelected())}\n data-disabled={dataAttr(isDisabled())}\n data-focused={dataAttr(isFocused())}\n >\n {props.renderChild(props.item, renderProps())}\n </button>\n );\n}\n\nexport function useActionGroupContext(): ActionGroupContextValue | null {\n return useContext(ActionGroupContext);\n}\n"],"mappings":"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"}
|
package/dist/ActionGroup.jsx
CHANGED
|
@@ -93,8 +93,12 @@ function ActionGroup(props) {
|
|
|
93
93
|
const orientation = () => local.orientation ?? "horizontal";
|
|
94
94
|
const renderProps = useRenderProps({
|
|
95
95
|
children: void 0,
|
|
96
|
-
class
|
|
97
|
-
|
|
96
|
+
get class() {
|
|
97
|
+
return local.class;
|
|
98
|
+
},
|
|
99
|
+
get style() {
|
|
100
|
+
return local.style;
|
|
101
|
+
},
|
|
98
102
|
defaultClassName: "solidaria-ActionGroup"
|
|
99
103
|
}, () => ({
|
|
100
104
|
orientation: orientation(),
|
package/dist/ActionGroup.jsx.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionGroup.jsx","names":[],"sources":["../src/ActionGroup.tsx"],"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// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroup.ts\n// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroupItem.ts\n\n/**\n * ActionGroup component for solidaria-components\n *\n * Pre-wired headless action group component that combines\n * createListState + createActionGroup/createActionGroupItem.\n * Provides proper dynamic roles (toolbar/radiogroup), keyboard\n * navigation, and ARIA attributes.\n *\n * Based on packages/react-aria/src/actiongroup/useActionGroup.ts and\n * packages/react-aria/src/actiongroup/useActionGroupItem.ts. React Aria\n * Components has no ActionGroup component, so this file wires the two hooks.\n */\n\nimport { createContext, createMemo, useContext, For } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport {\n createActionGroup,\n createActionGroupItem,\n type AriaActionGroupProps,\n} from \"@proyecto-viviana/solidaria\";\nimport {\n createListState,\n type ListState,\n type Key,\n type SelectionMode,\n} from \"@proyecto-viviana/solid-stately\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n type ClassNameOrFunction,\n type StyleOrFunction,\n type SlotProps,\n useRenderProps,\n filterDOMProps,\n dataAttr,\n} from \"./utils\";\n\nexport interface ActionGroupRenderProps {\n /** The orientation of the action group. */\n orientation: \"horizontal\" | \"vertical\";\n /** Whether the entire group is disabled. */\n isDisabled: boolean;\n /** The selection mode. */\n selectionMode: SelectionMode;\n}\n\nexport interface ActionGroupItemRenderProps {\n /** Whether the item is selected. */\n isSelected: boolean;\n /** Whether the item is disabled. */\n isDisabled: boolean;\n /** Whether the item is focused. */\n isFocused: boolean;\n}\n\nexport interface ActionGroupItem {\n id: string;\n label: string;\n isDisabled?: boolean;\n [key: string]: unknown;\n}\n\nexport interface ActionGroupProps<T extends ActionGroupItem = ActionGroupItem> extends SlotProps {\n /** The items in the action group. */\n items: T[];\n /** The selection mode. @default 'none' */\n selectionMode?: SelectionMode;\n /** Orientation of the group. @default 'horizontal' */\n orientation?: \"horizontal\" | \"vertical\";\n /** Whether the entire group is disabled. */\n isDisabled?: boolean;\n /** Accessible label. */\n \"aria-label\"?: string;\n /** Labelled-by id. */\n \"aria-labelledby\"?: string;\n /** Currently selected keys (controlled). */\n selectedKeys?: Iterable<Key>;\n /** Default selected keys (uncontrolled). */\n defaultSelectedKeys?: Iterable<Key>;\n /** Handler called when selection changes. */\n onSelectionChange?: (keys: \"all\" | Set<Key>) => void;\n /** Handler called when an item action is triggered. */\n onAction?: (key: Key) => void;\n /** Keys of disabled items. */\n disabledKeys?: Iterable<Key>;\n /** Render function for each item. */\n children: (item: T, renderProps: ActionGroupItemRenderProps) => JSX.Element;\n /** CSS class for the container. */\n class?: ClassNameOrFunction<ActionGroupRenderProps>;\n /** Inline style for the container. */\n style?: StyleOrFunction<ActionGroupRenderProps>;\n}\n\nexport interface ActionGroupContextValue<T extends ActionGroupItem = ActionGroupItem> {\n state: ListState<T>;\n}\n\nexport const ActionGroupContext = createContext<ActionGroupContextValue | null>(null);\nexport const ActionGroupStateContext = createContext<ListState<ActionGroupItem> | null>(null);\n\nexport function ActionGroup<T extends ActionGroupItem = ActionGroupItem>(\n props: ActionGroupProps<T>,\n): JSX.Element {\n const [local, ariaGroupProps, domProps] = splitProps(\n props,\n [\n \"items\",\n \"selectionMode\",\n \"orientation\",\n \"isDisabled\",\n \"selectedKeys\",\n \"defaultSelectedKeys\",\n \"onSelectionChange\",\n \"onAction\",\n \"disabledKeys\",\n \"children\",\n \"class\",\n \"style\",\n \"slot\",\n ],\n [\"aria-label\", \"aria-labelledby\"],\n );\n\n const state = createListState<T>({\n get items() {\n return local.items;\n },\n get selectionMode() {\n return local.selectionMode ?? \"none\";\n },\n get selectedKeys() {\n return local.selectedKeys;\n },\n get defaultSelectedKeys() {\n return local.defaultSelectedKeys;\n },\n get onSelectionChange() {\n return local.onSelectionChange;\n },\n get disabledKeys() {\n return local.disabledKeys;\n },\n getKey: (item) => item.id,\n getTextValue: (item) => item.label,\n getDisabled: (item) => !!item.isDisabled,\n });\n\n const groupAriaProps: AriaActionGroupProps<T> = {\n get items() {\n return local.items;\n },\n get isDisabled() {\n return local.isDisabled;\n },\n get orientation() {\n return local.orientation;\n },\n get \"aria-label\"() {\n return ariaGroupProps[\"aria-label\"];\n },\n get \"aria-labelledby\"() {\n return ariaGroupProps[\"aria-labelledby\"];\n },\n get onAction() {\n return local.onAction;\n },\n };\n\n const { actionGroupProps } = createActionGroup(groupAriaProps, state as ListState<T>);\n\n const orientation = () => local.orientation ?? \"horizontal\";\n\n const renderProps = useRenderProps(\n {\n children: undefined,\n class: local.class,\n style: local.style,\n defaultClassName: \"solidaria-ActionGroup\",\n },\n () => ({\n orientation: orientation(),\n isDisabled: !!local.isDisabled,\n selectionMode: (local.selectionMode ?? \"none\") as SelectionMode,\n }),\n );\n\n const filteredDOMProps = createMemo(() =>\n filterDOMProps(domProps as Record<string, unknown>, { global: true }),\n );\n\n return (\n <ActionGroupContext value={{ state: state as ListState<ActionGroupItem> }}>\n <ActionGroupStateContext value={state as ListState<ActionGroupItem>}>\n <div\n {...filteredDOMProps()}\n {...actionGroupProps}\n ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-orientation={orientation()}\n data-disabled={dataAttr(local.isDisabled)}\n >\n <For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>\n </div>\n </ActionGroupStateContext>\n </ActionGroupContext>\n );\n}\n\ninterface ActionGroupItemWrapperProps {\n item: ActionGroupItem;\n state: ListState<ActionGroupItem>;\n renderChild: (item: ActionGroupItem, renderProps: ActionGroupItemRenderProps) => JSX.Element;\n}\n\nfunction ActionGroupItemWrapper(props: ActionGroupItemWrapperProps): JSX.Element {\n const { buttonProps } = createActionGroupItem(\n {\n get key() {\n return props.item.id;\n },\n },\n props.state,\n );\n\n const isFocused = () => props.state.focusedKey() === props.item.id;\n const isSelected = () => {\n const keys = props.state.selectedKeys();\n return keys === \"all\" || (keys instanceof Set && keys.has(props.item.id));\n };\n const isDisabled = () => props.state.isDisabled(props.item.id);\n\n const renderProps = createMemo<ActionGroupItemRenderProps>(() => ({\n isSelected: isSelected(),\n isDisabled: isDisabled(),\n isFocused: isFocused(),\n }));\n\n // splitProps (not object destructuring) so the reactive getters on buttonProps\n // — tabIndex (roving stop), onFocus (sets the focused key), role, aria-checked\n // — stay live. A rest-spread `{ ref, ...rest }` would FREEZE them at their\n // first-render values, pinning the roving tabIndex and killing focus tracking.\n const [, restButtonProps] = splitProps(buttonProps, [\"ref\"]);\n\n return (\n <button\n {...restButtonProps}\n data-selected={dataAttr(isSelected())}\n data-disabled={dataAttr(isDisabled())}\n data-focused={dataAttr(isFocused())}\n >\n {props.renderChild(props.item, renderProps())}\n </button>\n );\n}\n\nexport function useActionGroupContext(): ActionGroupContextValue | null {\n return useContext(ActionGroupContext);\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ActionGroup.jsx","names":[],"sources":["../src/ActionGroup.tsx"],"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// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroup.ts\n// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroupItem.ts\n\n/**\n * ActionGroup component for solidaria-components\n *\n * Pre-wired headless action group component that combines\n * createListState + createActionGroup/createActionGroupItem.\n * Provides proper dynamic roles (toolbar/radiogroup), keyboard\n * navigation, and ARIA attributes.\n *\n * Based on packages/react-aria/src/actiongroup/useActionGroup.ts and\n * packages/react-aria/src/actiongroup/useActionGroupItem.ts. React Aria\n * Components has no ActionGroup component, so this file wires the two hooks.\n */\n\nimport { createContext, createMemo, useContext, For } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport {\n createActionGroup,\n createActionGroupItem,\n type AriaActionGroupProps,\n} from \"@proyecto-viviana/solidaria\";\nimport {\n createListState,\n type ListState,\n type Key,\n type SelectionMode,\n} from \"@proyecto-viviana/solid-stately\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n type ClassNameOrFunction,\n type StyleOrFunction,\n type SlotProps,\n useRenderProps,\n filterDOMProps,\n dataAttr,\n} from \"./utils\";\n\nexport interface ActionGroupRenderProps {\n /** The orientation of the action group. */\n orientation: \"horizontal\" | \"vertical\";\n /** Whether the entire group is disabled. */\n isDisabled: boolean;\n /** The selection mode. */\n selectionMode: SelectionMode;\n}\n\nexport interface ActionGroupItemRenderProps {\n /** Whether the item is selected. */\n isSelected: boolean;\n /** Whether the item is disabled. */\n isDisabled: boolean;\n /** Whether the item is focused. */\n isFocused: boolean;\n}\n\nexport interface ActionGroupItem {\n id: string;\n label: string;\n isDisabled?: boolean;\n [key: string]: unknown;\n}\n\nexport interface ActionGroupProps<T extends ActionGroupItem = ActionGroupItem> extends SlotProps {\n /** The items in the action group. */\n items: T[];\n /** The selection mode. @default 'none' */\n selectionMode?: SelectionMode;\n /** Orientation of the group. @default 'horizontal' */\n orientation?: \"horizontal\" | \"vertical\";\n /** Whether the entire group is disabled. */\n isDisabled?: boolean;\n /** Accessible label. */\n \"aria-label\"?: string;\n /** Labelled-by id. */\n \"aria-labelledby\"?: string;\n /** Currently selected keys (controlled). */\n selectedKeys?: Iterable<Key>;\n /** Default selected keys (uncontrolled). */\n defaultSelectedKeys?: Iterable<Key>;\n /** Handler called when selection changes. */\n onSelectionChange?: (keys: \"all\" | Set<Key>) => void;\n /** Handler called when an item action is triggered. */\n onAction?: (key: Key) => void;\n /** Keys of disabled items. */\n disabledKeys?: Iterable<Key>;\n /** Render function for each item. */\n children: (item: T, renderProps: ActionGroupItemRenderProps) => JSX.Element;\n /** CSS class for the container. */\n class?: ClassNameOrFunction<ActionGroupRenderProps>;\n /** Inline style for the container. */\n style?: StyleOrFunction<ActionGroupRenderProps>;\n}\n\nexport interface ActionGroupContextValue<T extends ActionGroupItem = ActionGroupItem> {\n state: ListState<T>;\n}\n\nexport const ActionGroupContext = createContext<ActionGroupContextValue | null>(null);\nexport const ActionGroupStateContext = createContext<ListState<ActionGroupItem> | null>(null);\n\nexport function ActionGroup<T extends ActionGroupItem = ActionGroupItem>(\n props: ActionGroupProps<T>,\n): JSX.Element {\n const [local, ariaGroupProps, domProps] = splitProps(\n props,\n [\n \"items\",\n \"selectionMode\",\n \"orientation\",\n \"isDisabled\",\n \"selectedKeys\",\n \"defaultSelectedKeys\",\n \"onSelectionChange\",\n \"onAction\",\n \"disabledKeys\",\n \"children\",\n \"class\",\n \"style\",\n \"slot\",\n ],\n [\"aria-label\", \"aria-labelledby\"],\n );\n\n const state = createListState<T>({\n get items() {\n return local.items;\n },\n get selectionMode() {\n return local.selectionMode ?? \"none\";\n },\n get selectedKeys() {\n return local.selectedKeys;\n },\n get defaultSelectedKeys() {\n return local.defaultSelectedKeys;\n },\n get onSelectionChange() {\n return local.onSelectionChange;\n },\n get disabledKeys() {\n return local.disabledKeys;\n },\n getKey: (item) => item.id,\n getTextValue: (item) => item.label,\n getDisabled: (item) => !!item.isDisabled,\n });\n\n const groupAriaProps: AriaActionGroupProps<T> = {\n get items() {\n return local.items;\n },\n get isDisabled() {\n return local.isDisabled;\n },\n get orientation() {\n return local.orientation;\n },\n get \"aria-label\"() {\n return ariaGroupProps[\"aria-label\"];\n },\n get \"aria-labelledby\"() {\n return ariaGroupProps[\"aria-labelledby\"];\n },\n get onAction() {\n return local.onAction;\n },\n };\n\n const { actionGroupProps } = createActionGroup(groupAriaProps, state as ListState<T>);\n\n const orientation = () => local.orientation ?? \"horizontal\";\n\n const renderProps = useRenderProps(\n {\n children: undefined,\n get class() {\n return local.class;\n },\n get style() {\n return local.style;\n },\n defaultClassName: \"solidaria-ActionGroup\",\n },\n () => ({\n orientation: orientation(),\n isDisabled: !!local.isDisabled,\n selectionMode: (local.selectionMode ?? \"none\") as SelectionMode,\n }),\n );\n\n const filteredDOMProps = createMemo(() =>\n filterDOMProps(domProps as Record<string, unknown>, { global: true }),\n );\n\n return (\n <ActionGroupContext value={{ state: state as ListState<ActionGroupItem> }}>\n <ActionGroupStateContext value={state as ListState<ActionGroupItem>}>\n <div\n {...filteredDOMProps()}\n {...actionGroupProps}\n ref={(el: HTMLDivElement) => {\n const refFn = (actionGroupProps as { ref?: (el: HTMLElement) => void }).ref;\n refFn?.(el);\n }}\n class={renderProps.class()}\n style={renderProps.style()}\n slot={local.slot}\n data-orientation={orientation()}\n data-disabled={dataAttr(local.isDisabled)}\n >\n <For each={local.items}>\n {(item) => (\n <ActionGroupItemWrapper\n item={item}\n state={state as ListState<ActionGroupItem>}\n renderChild={\n local.children as (\n item: ActionGroupItem,\n rp: ActionGroupItemRenderProps,\n ) => JSX.Element\n }\n />\n )}\n </For>\n </div>\n </ActionGroupStateContext>\n </ActionGroupContext>\n );\n}\n\ninterface ActionGroupItemWrapperProps {\n item: ActionGroupItem;\n state: ListState<ActionGroupItem>;\n renderChild: (item: ActionGroupItem, renderProps: ActionGroupItemRenderProps) => JSX.Element;\n}\n\nfunction ActionGroupItemWrapper(props: ActionGroupItemWrapperProps): JSX.Element {\n const { buttonProps } = createActionGroupItem(\n {\n get key() {\n return props.item.id;\n },\n },\n props.state,\n );\n\n const isFocused = () => props.state.focusedKey() === props.item.id;\n const isSelected = () => {\n const keys = props.state.selectedKeys();\n return keys === \"all\" || (keys instanceof Set && keys.has(props.item.id));\n };\n const isDisabled = () => props.state.isDisabled(props.item.id);\n\n const renderProps = createMemo<ActionGroupItemRenderProps>(() => ({\n isSelected: isSelected(),\n isDisabled: isDisabled(),\n isFocused: isFocused(),\n }));\n\n // splitProps (not object destructuring) so the reactive getters on buttonProps\n // — tabIndex (roving stop), onFocus (sets the focused key), role, aria-checked\n // — stay live. A rest-spread `{ ref, ...rest }` would FREEZE them at their\n // first-render values, pinning the roving tabIndex and killing focus tracking.\n const [, restButtonProps] = splitProps(buttonProps, [\"ref\"]);\n\n return (\n <button\n {...restButtonProps}\n data-selected={dataAttr(isSelected())}\n data-disabled={dataAttr(isDisabled())}\n data-focused={dataAttr(isFocused())}\n >\n {props.renderChild(props.item, renderProps())}\n </button>\n );\n}\n\nexport function useActionGroupContext(): ActionGroupContextValue | null {\n return useContext(ActionGroupContext);\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Breadcrumbs.d.ts","sourceRoot":"","sources":["../src/Breadcrumbs.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Breadcrumbs.d.ts","sourceRoot":"","sources":["../src/Breadcrumbs.tsx"],"names":[],"mappings":"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"}
|
package/dist/Breadcrumbs.js
CHANGED
|
@@ -130,8 +130,12 @@ function Breadcrumbs(props) {
|
|
|
130
130
|
});
|
|
131
131
|
const renderValues = createMemo(() => ({ isDisabled: isDisabled() }));
|
|
132
132
|
const renderProps = useRenderProps({
|
|
133
|
-
class
|
|
134
|
-
|
|
133
|
+
get class() {
|
|
134
|
+
return local.class;
|
|
135
|
+
},
|
|
136
|
+
get style() {
|
|
137
|
+
return local.style;
|
|
138
|
+
},
|
|
135
139
|
defaultClassName: "solidaria-Breadcrumbs"
|
|
136
140
|
}, renderValues);
|
|
137
141
|
const domProps = createMemo(() => filterDOMProps(rest, { global: true }));
|
|
@@ -364,8 +368,12 @@ function BreadcrumbItem(props) {
|
|
|
364
368
|
get children() {
|
|
365
369
|
return props.children;
|
|
366
370
|
},
|
|
367
|
-
class
|
|
368
|
-
|
|
371
|
+
get class() {
|
|
372
|
+
return local.class;
|
|
373
|
+
},
|
|
374
|
+
get style() {
|
|
375
|
+
return local.style;
|
|
376
|
+
},
|
|
369
377
|
defaultClassName: "solidaria-BreadcrumbItem"
|
|
370
378
|
}, renderValues);
|
|
371
379
|
const mergedStyle = () => {
|
package/dist/Breadcrumbs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Breadcrumbs.js","names":["<BreadcrumbsContext\n value={{\n isDisabled,\n registerStaticItem: () => probeIndex++,\n staticItemCount: () => 0,\n resetStaticItems: () => {\n probeIndex = 0;\n },\n setStaticItemCount: () => {},\n }}\n >\n {local.children as JSX.Element}\n </BreadcrumbsContext>","value={{\n isDisabled,\n registerStaticItem: () => probeIndex++,\n staticItemCount: () => 0,\n resetStaticItems: () => {\n probeIndex = 0;\n },\n setStaticItemCount: () => {},\n }}","<BreadcrumbsContext\n value={{\n isDisabled,\n onAction: local.onAction,\n registerStaticItem,\n staticItemCount,\n resetStaticItems,\n setStaticItemCount,\n }}\n >\n {/*\n Faithful to react-aria-components Breadcrumbs: the accessible name (navProps'\n aria-label) sits directly on the <ol> (role=\"list\"), with NO wrapping <nav>\n landmark (react-spectrum/packages/react-aria-components/src/Breadcrumbs.tsx\n renders `<dom.ol {...mergeProps(DOMProps, navProps)} style={props.style}>`).\n The <ol> carries ONLY the consumer's class/style — no hard-coded inline\n layout reset. An inline reset would beat the styled layer's class (inline\n wins over class), which is exactly what broke S2 parity: the solid-spectrum\n `wrapperStyles` class supplies display:flex / list-style:none / padding:0 /\n marginStart and deliberately leaves align-items at its `normal` default, so\n a hard-coded inline `align-items:center` + `margin:0` clobbered the\n wrapper's margin and diverged from S2 (whose <ol> has neither).\n */}\n <ol\n {...navProps}\n {...domProps()}\n data-rsp-breadcrumbs-id={!hasCollectionItems() ? breadcrumbsId : undefined}\n data-rsp-breadcrumbs-count={serverStaticCount > 0 ? serverStaticCount : undefined}\n ref={(element) => assignRef(local.ref, element)}\n class={renderProps.class()}\n style={renderProps.style()}\n data-disabled={dataAttr(isDisabled())}\n >\n <Show\n when={hasCollectionItems()}\n fallback={<StaticBreadcrumbItems>{local.children as JSX.Element}</StaticBreadcrumbItems>}\n >\n <For each={items()}>\n {(item, index) => {\n const itemKey = getItemKey(item, index());\n const isLast = () => index() === items().length - 1;\n const renderItem = local.children as ((item: T) => JSX.Element) | undefined;\n\n return (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>\n );\n }}\n </For>\n </Show>\n </ol>\n </BreadcrumbsContext>","ref={(element) => assignRef(local.ref, element)}","<Show\n when={hasCollectionItems()}\n fallback={<StaticBreadcrumbItems>{local.children as JSX.Element}</StaticBreadcrumbItems>}\n >\n <For each={items()}>\n {(item, index) => {\n const itemKey = getItemKey(item, index());\n const isLast = () => index() === items().length - 1;\n const renderItem = local.children as ((item: T) => JSX.Element) | undefined;\n\n return (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>\n );\n }}\n </For>\n </Show>","<StaticBreadcrumbItems>{local.children as JSX.Element}</StaticBreadcrumbItems>","<For each={items()}>\n {(item, index) => {\n const itemKey = getItemKey(item, index());\n const isLast = () => index() === items().length - 1;\n const renderItem = local.children as ((item: T) => JSX.Element) | undefined;\n\n return (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>\n );\n }}\n </For>","<BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>","value={{ itemKey, isLast }}","<li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>","<ol\n {...navProps}\n {...domProps()}\n data-rsp-breadcrumbs-id={!hasCollectionItems() ? breadcrumbsId : undefined}\n data-rsp-breadcrumbs-count={serverStaticCount > 0 ? serverStaticCount : undefined}\n ref={(element) => assignRef(local.ref, element)}\n class={renderProps.class()}\n style={renderProps.style()}\n data-disabled={dataAttr(isDisabled())}\n >\n <Show\n when={hasCollectionItems()}\n fallback={<StaticBreadcrumbItems>{local.children as JSX.Element}</StaticBreadcrumbItems>}\n >\n <For each={items()}>\n {(item, index) => {\n const itemKey = getItemKey(item, index());\n const isLast = () => index() === items().length - 1;\n const renderItem = local.children as ((item: T) => JSX.Element) | undefined;\n\n return (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>\n );\n }}\n </For>\n </Show>\n </ol>","<For each={indices()}>\n {(index) => (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n {childArray()[index] as JSX.Element}\n </li>\n )}\n </For>","<ElementTag\n tag={elementType()}\n {...itemDomProps()}\n ref={(element: HTMLElement) => assignRef(local.ref, element)}\n aria-current={isCurrent() ? (ariaProps[\"aria-current\"] ?? \"page\") : undefined}\n aria-disabled={attrTrue(isDisabled() || isCurrent())}\n class={renderProps.class()}\n style={mergedStyle()}\n data-current={dataAttr(isCurrent())}\n data-disabled={dataAttr(isDisabled())}\n data-pressed={dataAttr(isPressed())}\n data-focused={dataAttr(isFocused())}\n data-focus-visible={dataAttr(isFocusVisible())}\n data-hovered={dataAttr(isHovered())}\n >\n {renderProps.renderChildren()}\n </ElementTag>","ref={(element: HTMLElement) => assignRef(local.ref, element)}","isCurrent() ? (ariaProps[\"aria-current\"] ?? \"page\") : undefined"],"sources":["../src/Breadcrumbs.tsx"],"sourcesContent":["/*\n * Copyright 2022 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// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria-components/src/Breadcrumbs.tsx\n\n/**\n * Breadcrumbs component for solidaria-components\n *\n * A pre-wired headless breadcrumbs component that combines aria hooks.\n * Port of react-aria-components Breadcrumbs.\n */\n\nimport {\n createContext,\n createMemo,\n createSignal,\n createUniqueId,\n useContext,\n For,\n Show,\n type Accessor,\n} from \"solid-js\";\nimport { isServer, renderToString, type JSX } from \"@solidjs/web\";\nimport { ElementTag } from \"./ElementTag\";\nimport { handleLinkClick, useRouter } from \"./RouterProvider\";\nimport {\n createBreadcrumbs,\n createBreadcrumbItem,\n createFocusRing,\n createHover,\n mergeProps,\n type AriaBreadcrumbsProps,\n type AriaBreadcrumbItemProps,\n type PressEvent,\n} from \"@proyecto-viviana/solidaria\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n type RenderChildren,\n type ClassNameOrFunction,\n type StyleOrFunction,\n type SlotProps,\n useRenderProps,\n filterDOMProps,\n dataAttr,\n attrTrue,\n} from \"./utils\";\n\ntype RefLike<T> = ((el: T) => void) | { current?: T | null } | undefined;\n\nfunction assignRef<T>(ref: RefLike<T>, el: T): void {\n if (!ref) {\n return;\n }\n\n if (typeof ref === \"function\") {\n ref(el);\n } else {\n ref.current = el;\n }\n}\n\nfunction omitOnClick(raw: Record<string, unknown>): Record<string, unknown> {\n const rest: Record<string, unknown> = {};\n for (const key of Object.keys(raw)) {\n if (key === \"onClick\") continue;\n const desc = Object.getOwnPropertyDescriptor(raw, key);\n if (desc) {\n Object.defineProperty(rest, key, desc);\n }\n }\n return rest;\n}\n\nexport interface BreadcrumbsRenderProps {\n /** Whether the breadcrumbs are disabled. */\n isDisabled: boolean;\n}\n\nexport interface BreadcrumbsProps<T> extends Omit<AriaBreadcrumbsProps, \"isDisabled\">, SlotProps {\n /** The items to render in the breadcrumbs. */\n items?: T[];\n /** Function to get the key from an item. */\n getKey?: (item: T) => string | number;\n /** Whether the breadcrumbs are disabled. */\n isDisabled?: boolean;\n /** Handler called when a breadcrumb item is activated. */\n onAction?: (key: string | number) => void;\n /** The children of the component, or a render function for collection items. */\n children?: JSX.Element | ((item: T) => JSX.Element);\n /** The CSS className for the element. */\n class?: ClassNameOrFunction<BreadcrumbsRenderProps>;\n /** The inline style for the element. */\n style?: StyleOrFunction<BreadcrumbsRenderProps>;\n /** Ref for the navigation element. */\n ref?: RefLike<HTMLElement>;\n}\n\nexport interface BreadcrumbItemRenderProps {\n /** Whether this is the current/last item. */\n isCurrent: boolean;\n /** Whether the item is disabled. */\n isDisabled: boolean;\n /** Whether the item is pressed. */\n isPressed: boolean;\n /** Whether the item is focused. */\n isFocused: boolean;\n /** Whether the item has visible focus ring. */\n isFocusVisible: boolean;\n /** Whether the item is hovered. */\n isHovered: boolean;\n}\n\nexport interface BreadcrumbItemProps\n extends Omit<AriaBreadcrumbItemProps, \"isDisabled\">, SlotProps {\n /** The children of the breadcrumb item. */\n children?: RenderChildren<BreadcrumbItemRenderProps>;\n /** The CSS className for the element. */\n class?: ClassNameOrFunction<BreadcrumbItemRenderProps>;\n /** The inline style for the element. */\n style?: StyleOrFunction<BreadcrumbItemRenderProps>;\n /** Whether this item is disabled. */\n isDisabled?: boolean;\n /** Ref for the breadcrumb item element. */\n ref?: RefLike<HTMLElement>;\n}\n\ninterface BreadcrumbsContextValue {\n isDisabled: Accessor<boolean>;\n onAction?: (key: string | number) => void;\n registerStaticItem?: () => number;\n staticItemCount?: Accessor<number>;\n resetStaticItems?: () => void;\n setStaticItemCount?: (count: number) => void;\n}\n\nexport const BreadcrumbsContext = createContext<BreadcrumbsContextValue | null>(null);\n\ninterface BreadcrumbItemContextValue {\n itemKey: string | number | null;\n isLast: Accessor<boolean>;\n}\n\nexport const BreadcrumbItemContext = createContext<BreadcrumbItemContextValue | null>(null);\n\nfunction defaultItemKey(item: unknown, index: number): string | number {\n const maybeItem = item as { key?: string | number; id?: string | number };\n return maybeItem.key ?? maybeItem.id ?? index;\n}\n\n/**\n * Breadcrumbs show hierarchy and navigational context for a user's location within an application.\n */\nexport function Breadcrumbs<T>(props: BreadcrumbsProps<T>): JSX.Element {\n const [local, ariaProps, rest] = splitProps(\n props,\n [\"children\", \"class\", \"style\", \"slot\", \"items\", \"getKey\", \"isDisabled\", \"onAction\", \"ref\"],\n [\"aria-label\", \"aria-labelledby\", \"aria-describedby\", \"aria-details\"],\n );\n\n const isDisabled = () => local.isDisabled ?? false;\n const items = () => local.items ?? [];\n const hasCollectionItems = () => local.items !== undefined;\n const getItemKey = (item: T, index: number): string | number =>\n local.getKey?.(item) ?? defaultItemKey(item, index);\n const breadcrumbsId = createUniqueId();\n let serverStaticCount = 0;\n if (isServer && !hasCollectionItems()) {\n let probeIndex = 0;\n renderToString(() => (\n <BreadcrumbsContext\n value={{\n isDisabled,\n registerStaticItem: () => probeIndex++,\n staticItemCount: () => 0,\n resetStaticItems: () => {\n probeIndex = 0;\n },\n setStaticItemCount: () => {},\n }}\n >\n {local.children as JSX.Element}\n </BreadcrumbsContext>\n ));\n serverStaticCount = probeIndex;\n }\n let clientInitialCount = 0;\n if (!isServer && !hasCollectionItems() && typeof document !== \"undefined\") {\n const el = document.querySelector(`[data-rsp-breadcrumbs-id=\"${breadcrumbsId}\"]`);\n if (el) {\n const countAttr = el.getAttribute(\"data-rsp-breadcrumbs-count\");\n if (countAttr) {\n clientInitialCount = parseInt(countAttr, 10) || 0;\n }\n }\n }\n const [clientStaticCount, setClientStaticCount] = createSignal(clientInitialCount, {\n ownedWrite: true,\n });\n const staticItemCount = () => (isServer ? serverStaticCount : clientStaticCount());\n let nextStaticIndex = 0;\n const resetStaticItems = () => {\n nextStaticIndex = 0;\n if (!isServer) {\n setClientStaticCount(0);\n }\n };\n const setStaticItemCount = (count: number) => {\n if (isServer) {\n serverStaticCount = count;\n } else {\n setClientStaticCount(count);\n }\n };\n const registerStaticItem = () => {\n const index = nextStaticIndex;\n nextStaticIndex += 1;\n return index;\n };\n\n const { navProps } = createBreadcrumbs({\n get \"aria-label\"() {\n return ariaProps[\"aria-label\"];\n },\n get \"aria-labelledby\"() {\n return ariaProps[\"aria-labelledby\"];\n },\n get \"aria-describedby\"() {\n return ariaProps[\"aria-describedby\"];\n },\n get isDisabled() {\n return isDisabled();\n },\n });\n\n const renderValues = createMemo<BreadcrumbsRenderProps>(() => ({\n isDisabled: isDisabled(),\n }));\n\n const renderProps = useRenderProps(\n {\n class: local.class,\n style: local.style,\n defaultClassName: \"solidaria-Breadcrumbs\",\n },\n renderValues,\n );\n\n const domProps = createMemo(() =>\n filterDOMProps(rest as Record<string, unknown>, { global: true }),\n );\n return (\n <BreadcrumbsContext\n value={{\n isDisabled,\n onAction: local.onAction,\n registerStaticItem,\n staticItemCount,\n resetStaticItems,\n setStaticItemCount,\n }}\n >\n {/*\n Faithful to react-aria-components Breadcrumbs: the accessible name (navProps'\n aria-label) sits directly on the <ol> (role=\"list\"), with NO wrapping <nav>\n landmark (react-spectrum/packages/react-aria-components/src/Breadcrumbs.tsx\n renders `<dom.ol {...mergeProps(DOMProps, navProps)} style={props.style}>`).\n The <ol> carries ONLY the consumer's class/style — no hard-coded inline\n layout reset. An inline reset would beat the styled layer's class (inline\n wins over class), which is exactly what broke S2 parity: the solid-spectrum\n `wrapperStyles` class supplies display:flex / list-style:none / padding:0 /\n marginStart and deliberately leaves align-items at its `normal` default, so\n a hard-coded inline `align-items:center` + `margin:0` clobbered the\n wrapper's margin and diverged from S2 (whose <ol> has neither).\n */}\n <ol\n {...navProps}\n {...domProps()}\n data-rsp-breadcrumbs-id={!hasCollectionItems() ? breadcrumbsId : undefined}\n data-rsp-breadcrumbs-count={serverStaticCount > 0 ? serverStaticCount : undefined}\n ref={(element) => assignRef(local.ref, element)}\n class={renderProps.class()}\n style={renderProps.style()}\n data-disabled={dataAttr(isDisabled())}\n >\n <Show\n when={hasCollectionItems()}\n fallback={<StaticBreadcrumbItems>{local.children as JSX.Element}</StaticBreadcrumbItems>}\n >\n <For each={items()}>\n {(item, index) => {\n const itemKey = getItemKey(item, index());\n const isLast = () => index() === items().length - 1;\n const renderItem = local.children as ((item: T) => JSX.Element) | undefined;\n\n return (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>\n );\n }}\n </For>\n </Show>\n </ol>\n </BreadcrumbsContext>\n );\n}\n\nfunction walkStaticChildren(children: unknown): unknown[] {\n const result: unknown[] = [];\n function walk(node: unknown): void {\n if (node == null || typeof node === \"boolean\") {\n return;\n }\n if (Array.isArray(node)) {\n for (const item of node) {\n walk(item);\n }\n return;\n }\n if (typeof node === \"function\" && (node as Function).length === 0) {\n walk((node as () => unknown)());\n return;\n }\n result.push(node);\n }\n walk(children);\n return result;\n}\n\nfunction StaticBreadcrumbItems(props: { children?: JSX.Element }): JSX.Element {\n const context = useContext(BreadcrumbsContext);\n const childArray = createMemo(() => {\n context?.resetStaticItems?.();\n const array = walkStaticChildren(props.children);\n if (!isServer) {\n context?.setStaticItemCount?.(array.length);\n }\n return array;\n });\n\n const indices = createMemo(() => Array.from({ length: childArray().length }, (_, i) => i));\n\n return (\n <For each={indices()}>\n {(index) => (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n {childArray()[index] as JSX.Element}\n </li>\n )}\n </For>\n );\n}\n\n/**\n * A BreadcrumbItem represents an individual breadcrumb in the navigation trail.\n */\nexport function BreadcrumbItem(props: BreadcrumbItemProps): JSX.Element {\n const [local, ariaProps] = splitProps(props, [\"class\", \"style\", \"slot\", \"isDisabled\", \"ref\"]);\n\n const context = useContext(BreadcrumbsContext);\n const itemContext = useContext(BreadcrumbItemContext);\n const router = useRouter();\n const staticIndex = itemContext ? null : context?.registerStaticItem?.();\n const isDisabled = () => local.isDisabled ?? context?.isDisabled() ?? false;\n const isCurrent = () =>\n ariaProps.isCurrent ??\n itemContext?.isLast() ??\n (staticIndex !== null &&\n staticIndex !== undefined &&\n context?.staticItemCount !== undefined &&\n staticIndex === context.staticItemCount() - 1);\n const itemKey = () => itemContext?.itemKey ?? ariaProps.id ?? null;\n\n // Mirror react-aria-components' Link: render an <a> only when there is an\n // href on an enabled, non-current item; otherwise fall back to a <span\n // role=\"link\"> (via createLink). A styled layer may force the element type\n // (S2 renders the current item as a plain <div>), which takes precedence.\n const elementType = () =>\n ariaProps.elementType ?? (ariaProps.href && !isDisabled() && !isCurrent() ? \"a\" : \"span\");\n // The current breadcrumb is the current page and is non-interactive: S2\n // renders it as a plain element with no link role. createLink only omits\n // role=\"link\" for an <a>, so treat the current item as an \"a\" purely for the\n // role decision while still rendering the resolved element type above.\n const linkElementType = () => (isCurrent() ? \"a\" : elementType());\n\n const handlePress = (e: PressEvent) => {\n ariaProps.onPress?.(e);\n const key = itemKey();\n if (key !== null && !isCurrent() && !isDisabled()) {\n context?.onAction?.(key);\n }\n };\n\n const itemAria = createBreadcrumbItem({\n get id() {\n return ariaProps.id;\n },\n get isCurrent() {\n return isCurrent();\n },\n get isDisabled() {\n return isDisabled();\n },\n get href() {\n return ariaProps.href;\n },\n get target() {\n return ariaProps.target;\n },\n get rel() {\n return ariaProps.rel;\n },\n get elementType() {\n return linkElementType();\n },\n get onPress() {\n return handlePress;\n },\n get onPressStart() {\n return ariaProps.onPressStart;\n },\n get onPressEnd() {\n return ariaProps.onPressEnd;\n },\n get onClick() {\n return ariaProps.onClick;\n },\n get onFocus() {\n return ariaProps.onFocus;\n },\n get onBlur() {\n return ariaProps.onBlur;\n },\n get onFocusChange() {\n return ariaProps.onFocusChange;\n },\n get onKeyDown() {\n return ariaProps.onKeyDown;\n },\n get onKeyUp() {\n return ariaProps.onKeyUp;\n },\n get autoFocus() {\n return ariaProps.autoFocus;\n },\n get \"aria-label\"() {\n return ariaProps[\"aria-label\"];\n },\n get \"aria-labelledby\"() {\n return ariaProps[\"aria-labelledby\"];\n },\n get \"aria-describedby\"() {\n return ariaProps[\"aria-describedby\"];\n },\n get \"aria-details\"() {\n return ariaProps[\"aria-details\"];\n },\n get \"aria-current\"() {\n return ariaProps[\"aria-current\"];\n },\n });\n\n const isPressed = itemAria.isPressed;\n const { isFocused, isFocusVisible, focusProps } = createFocusRing();\n const { isHovered, hoverProps } = createHover({\n get isDisabled() {\n return isDisabled();\n },\n });\n // Read itemAria.itemProps fresh inside the memo (do NOT destructure it above):\n // the reactive getter re-runs createBreadcrumbItem → createLink each time this\n // memo re-evaluates, so role/tabIndex track elementType once isCurrent settles.\n const mergedItemProps = createMemo(() =>\n mergeProps(\n itemAria.itemProps as Record<string, unknown>,\n focusProps as Record<string, unknown>,\n hoverProps as Record<string, unknown>,\n ),\n );\n // createLink does not call handleLinkClick.\n const onItemClick = (event: MouseEvent) => {\n const click = (mergedItemProps() as { onClick?: (event: MouseEvent) => void }).onClick;\n click?.(event);\n handleLinkClick(event, router, ariaProps.href, ariaProps.routerOptions);\n };\n const itemDomProps = createMemo(() =>\n mergeProps(omitOnClick(mergedItemProps() as Record<string, unknown>), {\n onClick: onItemClick,\n }),\n );\n\n const renderValues = createMemo<BreadcrumbItemRenderProps>(() => ({\n isCurrent: isCurrent(),\n isDisabled: isDisabled(),\n isPressed: isPressed(),\n isFocused: isFocused(),\n isFocusVisible: isFocusVisible(),\n isHovered: isHovered(),\n }));\n\n const renderProps = useRenderProps(\n {\n get children() {\n return props.children;\n },\n class: local.class,\n style: local.style,\n defaultClassName: \"solidaria-BreadcrumbItem\",\n },\n renderValues,\n );\n\n const mergedStyle = () => {\n const userStyle = renderProps.style();\n const baseStyle = { display: \"inline-flex\", \"align-items\": \"center\" };\n return userStyle ? { ...baseStyle, ...userStyle } : baseStyle;\n };\n\n return (\n <ElementTag\n tag={elementType()}\n {...itemDomProps()}\n ref={(element: HTMLElement) => assignRef(local.ref, element)}\n aria-current={isCurrent() ? (ariaProps[\"aria-current\"] ?? \"page\") : undefined}\n aria-disabled={attrTrue(isDisabled() || isCurrent())}\n class={renderProps.class()}\n style={mergedStyle()}\n data-current={dataAttr(isCurrent())}\n data-disabled={dataAttr(isDisabled())}\n data-pressed={dataAttr(isPressed())}\n data-focused={dataAttr(isFocused())}\n data-focus-visible={dataAttr(isFocusVisible())}\n data-hovered={dataAttr(isHovered())}\n >\n {renderProps.renderChildren()}\n </ElementTag>\n );\n}\n\nBreadcrumbs.Item = BreadcrumbItem;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Breadcrumbs.js","names":["<BreadcrumbsContext\n value={{\n isDisabled,\n registerStaticItem: () => probeIndex++,\n staticItemCount: () => 0,\n resetStaticItems: () => {\n probeIndex = 0;\n },\n setStaticItemCount: () => {},\n }}\n >\n {local.children as JSX.Element}\n </BreadcrumbsContext>","value={{\n isDisabled,\n registerStaticItem: () => probeIndex++,\n staticItemCount: () => 0,\n resetStaticItems: () => {\n probeIndex = 0;\n },\n setStaticItemCount: () => {},\n }}","<BreadcrumbsContext\n value={{\n isDisabled,\n onAction: local.onAction,\n registerStaticItem,\n staticItemCount,\n resetStaticItems,\n setStaticItemCount,\n }}\n >\n {/*\n Faithful to react-aria-components Breadcrumbs: the accessible name (navProps'\n aria-label) sits directly on the <ol> (role=\"list\"), with NO wrapping <nav>\n landmark (react-spectrum/packages/react-aria-components/src/Breadcrumbs.tsx\n renders `<dom.ol {...mergeProps(DOMProps, navProps)} style={props.style}>`).\n The <ol> carries ONLY the consumer's class/style — no hard-coded inline\n layout reset. An inline reset would beat the styled layer's class (inline\n wins over class), which is exactly what broke S2 parity: the solid-spectrum\n `wrapperStyles` class supplies display:flex / list-style:none / padding:0 /\n marginStart and deliberately leaves align-items at its `normal` default, so\n a hard-coded inline `align-items:center` + `margin:0` clobbered the\n wrapper's margin and diverged from S2 (whose <ol> has neither).\n */}\n <ol\n {...navProps}\n {...domProps()}\n data-rsp-breadcrumbs-id={!hasCollectionItems() ? breadcrumbsId : undefined}\n data-rsp-breadcrumbs-count={serverStaticCount > 0 ? serverStaticCount : undefined}\n ref={(element) => assignRef(local.ref, element)}\n class={renderProps.class()}\n style={renderProps.style()}\n data-disabled={dataAttr(isDisabled())}\n >\n <Show\n when={hasCollectionItems()}\n fallback={<StaticBreadcrumbItems>{local.children as JSX.Element}</StaticBreadcrumbItems>}\n >\n <For each={items()}>\n {(item, index) => {\n const itemKey = getItemKey(item, index());\n const isLast = () => index() === items().length - 1;\n const renderItem = local.children as ((item: T) => JSX.Element) | undefined;\n\n return (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>\n );\n }}\n </For>\n </Show>\n </ol>\n </BreadcrumbsContext>","ref={(element) => assignRef(local.ref, element)}","<Show\n when={hasCollectionItems()}\n fallback={<StaticBreadcrumbItems>{local.children as JSX.Element}</StaticBreadcrumbItems>}\n >\n <For each={items()}>\n {(item, index) => {\n const itemKey = getItemKey(item, index());\n const isLast = () => index() === items().length - 1;\n const renderItem = local.children as ((item: T) => JSX.Element) | undefined;\n\n return (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>\n );\n }}\n </For>\n </Show>","<StaticBreadcrumbItems>{local.children as JSX.Element}</StaticBreadcrumbItems>","<For each={items()}>\n {(item, index) => {\n const itemKey = getItemKey(item, index());\n const isLast = () => index() === items().length - 1;\n const renderItem = local.children as ((item: T) => JSX.Element) | undefined;\n\n return (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>\n );\n }}\n </For>","<BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>","value={{ itemKey, isLast }}","<li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>","<ol\n {...navProps}\n {...domProps()}\n data-rsp-breadcrumbs-id={!hasCollectionItems() ? breadcrumbsId : undefined}\n data-rsp-breadcrumbs-count={serverStaticCount > 0 ? serverStaticCount : undefined}\n ref={(element) => assignRef(local.ref, element)}\n class={renderProps.class()}\n style={renderProps.style()}\n data-disabled={dataAttr(isDisabled())}\n >\n <Show\n when={hasCollectionItems()}\n fallback={<StaticBreadcrumbItems>{local.children as JSX.Element}</StaticBreadcrumbItems>}\n >\n <For each={items()}>\n {(item, index) => {\n const itemKey = getItemKey(item, index());\n const isLast = () => index() === items().length - 1;\n const renderItem = local.children as ((item: T) => JSX.Element) | undefined;\n\n return (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>\n );\n }}\n </For>\n </Show>\n </ol>","<For each={indices()}>\n {(index) => (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n {childArray()[index] as JSX.Element}\n </li>\n )}\n </For>","<ElementTag\n tag={elementType()}\n {...itemDomProps()}\n ref={(element: HTMLElement) => assignRef(local.ref, element)}\n aria-current={isCurrent() ? (ariaProps[\"aria-current\"] ?? \"page\") : undefined}\n aria-disabled={attrTrue(isDisabled() || isCurrent())}\n class={renderProps.class()}\n style={mergedStyle()}\n data-current={dataAttr(isCurrent())}\n data-disabled={dataAttr(isDisabled())}\n data-pressed={dataAttr(isPressed())}\n data-focused={dataAttr(isFocused())}\n data-focus-visible={dataAttr(isFocusVisible())}\n data-hovered={dataAttr(isHovered())}\n >\n {renderProps.renderChildren()}\n </ElementTag>","ref={(element: HTMLElement) => assignRef(local.ref, element)}","isCurrent() ? (ariaProps[\"aria-current\"] ?? \"page\") : undefined"],"sources":["../src/Breadcrumbs.tsx"],"sourcesContent":["/*\n * Copyright 2022 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// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria-components/src/Breadcrumbs.tsx\n\n/**\n * Breadcrumbs component for solidaria-components\n *\n * A pre-wired headless breadcrumbs component that combines aria hooks.\n * Port of react-aria-components Breadcrumbs.\n */\n\nimport {\n createContext,\n createMemo,\n createSignal,\n createUniqueId,\n useContext,\n For,\n Show,\n type Accessor,\n} from \"solid-js\";\nimport { isServer, renderToString, type JSX } from \"@solidjs/web\";\nimport { ElementTag } from \"./ElementTag\";\nimport { handleLinkClick, useRouter } from \"./RouterProvider\";\nimport {\n createBreadcrumbs,\n createBreadcrumbItem,\n createFocusRing,\n createHover,\n mergeProps,\n type AriaBreadcrumbsProps,\n type AriaBreadcrumbItemProps,\n type PressEvent,\n} from \"@proyecto-viviana/solidaria\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n type RenderChildren,\n type ClassNameOrFunction,\n type StyleOrFunction,\n type SlotProps,\n useRenderProps,\n filterDOMProps,\n dataAttr,\n attrTrue,\n} from \"./utils\";\n\ntype RefLike<T> = ((el: T) => void) | { current?: T | null } | undefined;\n\nfunction assignRef<T>(ref: RefLike<T>, el: T): void {\n if (!ref) {\n return;\n }\n\n if (typeof ref === \"function\") {\n ref(el);\n } else {\n ref.current = el;\n }\n}\n\nfunction omitOnClick(raw: Record<string, unknown>): Record<string, unknown> {\n const rest: Record<string, unknown> = {};\n for (const key of Object.keys(raw)) {\n if (key === \"onClick\") continue;\n const desc = Object.getOwnPropertyDescriptor(raw, key);\n if (desc) {\n Object.defineProperty(rest, key, desc);\n }\n }\n return rest;\n}\n\nexport interface BreadcrumbsRenderProps {\n /** Whether the breadcrumbs are disabled. */\n isDisabled: boolean;\n}\n\nexport interface BreadcrumbsProps<T> extends Omit<AriaBreadcrumbsProps, \"isDisabled\">, SlotProps {\n /** The items to render in the breadcrumbs. */\n items?: T[];\n /** Function to get the key from an item. */\n getKey?: (item: T) => string | number;\n /** Whether the breadcrumbs are disabled. */\n isDisabled?: boolean;\n /** Handler called when a breadcrumb item is activated. */\n onAction?: (key: string | number) => void;\n /** The children of the component, or a render function for collection items. */\n children?: JSX.Element | ((item: T) => JSX.Element);\n /** The CSS className for the element. */\n class?: ClassNameOrFunction<BreadcrumbsRenderProps>;\n /** The inline style for the element. */\n style?: StyleOrFunction<BreadcrumbsRenderProps>;\n /** Ref for the navigation element. */\n ref?: RefLike<HTMLElement>;\n}\n\nexport interface BreadcrumbItemRenderProps {\n /** Whether this is the current/last item. */\n isCurrent: boolean;\n /** Whether the item is disabled. */\n isDisabled: boolean;\n /** Whether the item is pressed. */\n isPressed: boolean;\n /** Whether the item is focused. */\n isFocused: boolean;\n /** Whether the item has visible focus ring. */\n isFocusVisible: boolean;\n /** Whether the item is hovered. */\n isHovered: boolean;\n}\n\nexport interface BreadcrumbItemProps\n extends Omit<AriaBreadcrumbItemProps, \"isDisabled\">, SlotProps {\n /** The children of the breadcrumb item. */\n children?: RenderChildren<BreadcrumbItemRenderProps>;\n /** The CSS className for the element. */\n class?: ClassNameOrFunction<BreadcrumbItemRenderProps>;\n /** The inline style for the element. */\n style?: StyleOrFunction<BreadcrumbItemRenderProps>;\n /** Whether this item is disabled. */\n isDisabled?: boolean;\n /** Ref for the breadcrumb item element. */\n ref?: RefLike<HTMLElement>;\n}\n\ninterface BreadcrumbsContextValue {\n isDisabled: Accessor<boolean>;\n onAction?: (key: string | number) => void;\n registerStaticItem?: () => number;\n staticItemCount?: Accessor<number>;\n resetStaticItems?: () => void;\n setStaticItemCount?: (count: number) => void;\n}\n\nexport const BreadcrumbsContext = createContext<BreadcrumbsContextValue | null>(null);\n\ninterface BreadcrumbItemContextValue {\n itemKey: string | number | null;\n isLast: Accessor<boolean>;\n}\n\nexport const BreadcrumbItemContext = createContext<BreadcrumbItemContextValue | null>(null);\n\nfunction defaultItemKey(item: unknown, index: number): string | number {\n const maybeItem = item as { key?: string | number; id?: string | number };\n return maybeItem.key ?? maybeItem.id ?? index;\n}\n\n/**\n * Breadcrumbs show hierarchy and navigational context for a user's location within an application.\n */\nexport function Breadcrumbs<T>(props: BreadcrumbsProps<T>): JSX.Element {\n const [local, ariaProps, rest] = splitProps(\n props,\n [\"children\", \"class\", \"style\", \"slot\", \"items\", \"getKey\", \"isDisabled\", \"onAction\", \"ref\"],\n [\"aria-label\", \"aria-labelledby\", \"aria-describedby\", \"aria-details\"],\n );\n\n const isDisabled = () => local.isDisabled ?? false;\n const items = () => local.items ?? [];\n const hasCollectionItems = () => local.items !== undefined;\n const getItemKey = (item: T, index: number): string | number =>\n local.getKey?.(item) ?? defaultItemKey(item, index);\n const breadcrumbsId = createUniqueId();\n let serverStaticCount = 0;\n if (isServer && !hasCollectionItems()) {\n let probeIndex = 0;\n renderToString(() => (\n <BreadcrumbsContext\n value={{\n isDisabled,\n registerStaticItem: () => probeIndex++,\n staticItemCount: () => 0,\n resetStaticItems: () => {\n probeIndex = 0;\n },\n setStaticItemCount: () => {},\n }}\n >\n {local.children as JSX.Element}\n </BreadcrumbsContext>\n ));\n serverStaticCount = probeIndex;\n }\n let clientInitialCount = 0;\n if (!isServer && !hasCollectionItems() && typeof document !== \"undefined\") {\n const el = document.querySelector(`[data-rsp-breadcrumbs-id=\"${breadcrumbsId}\"]`);\n if (el) {\n const countAttr = el.getAttribute(\"data-rsp-breadcrumbs-count\");\n if (countAttr) {\n clientInitialCount = parseInt(countAttr, 10) || 0;\n }\n }\n }\n const [clientStaticCount, setClientStaticCount] = createSignal(clientInitialCount, {\n ownedWrite: true,\n });\n const staticItemCount = () => (isServer ? serverStaticCount : clientStaticCount());\n let nextStaticIndex = 0;\n const resetStaticItems = () => {\n nextStaticIndex = 0;\n if (!isServer) {\n setClientStaticCount(0);\n }\n };\n const setStaticItemCount = (count: number) => {\n if (isServer) {\n serverStaticCount = count;\n } else {\n setClientStaticCount(count);\n }\n };\n const registerStaticItem = () => {\n const index = nextStaticIndex;\n nextStaticIndex += 1;\n return index;\n };\n\n const { navProps } = createBreadcrumbs({\n get \"aria-label\"() {\n return ariaProps[\"aria-label\"];\n },\n get \"aria-labelledby\"() {\n return ariaProps[\"aria-labelledby\"];\n },\n get \"aria-describedby\"() {\n return ariaProps[\"aria-describedby\"];\n },\n get isDisabled() {\n return isDisabled();\n },\n });\n\n const renderValues = createMemo<BreadcrumbsRenderProps>(() => ({\n isDisabled: isDisabled(),\n }));\n\n const renderProps = useRenderProps(\n {\n get class() {\n return local.class;\n },\n get style() {\n return local.style;\n },\n defaultClassName: \"solidaria-Breadcrumbs\",\n },\n renderValues,\n );\n\n const domProps = createMemo(() =>\n filterDOMProps(rest as Record<string, unknown>, { global: true }),\n );\n return (\n <BreadcrumbsContext\n value={{\n isDisabled,\n onAction: local.onAction,\n registerStaticItem,\n staticItemCount,\n resetStaticItems,\n setStaticItemCount,\n }}\n >\n {/*\n Faithful to react-aria-components Breadcrumbs: the accessible name (navProps'\n aria-label) sits directly on the <ol> (role=\"list\"), with NO wrapping <nav>\n landmark (react-spectrum/packages/react-aria-components/src/Breadcrumbs.tsx\n renders `<dom.ol {...mergeProps(DOMProps, navProps)} style={props.style}>`).\n The <ol> carries ONLY the consumer's class/style — no hard-coded inline\n layout reset. An inline reset would beat the styled layer's class (inline\n wins over class), which is exactly what broke S2 parity: the solid-spectrum\n `wrapperStyles` class supplies display:flex / list-style:none / padding:0 /\n marginStart and deliberately leaves align-items at its `normal` default, so\n a hard-coded inline `align-items:center` + `margin:0` clobbered the\n wrapper's margin and diverged from S2 (whose <ol> has neither).\n */}\n <ol\n {...navProps}\n {...domProps()}\n data-rsp-breadcrumbs-id={!hasCollectionItems() ? breadcrumbsId : undefined}\n data-rsp-breadcrumbs-count={serverStaticCount > 0 ? serverStaticCount : undefined}\n ref={(element) => assignRef(local.ref, element)}\n class={renderProps.class()}\n style={renderProps.style()}\n data-disabled={dataAttr(isDisabled())}\n >\n <Show\n when={hasCollectionItems()}\n fallback={<StaticBreadcrumbItems>{local.children as JSX.Element}</StaticBreadcrumbItems>}\n >\n <For each={items()}>\n {(item, index) => {\n const itemKey = getItemKey(item, index());\n const isLast = () => index() === items().length - 1;\n const renderItem = local.children as ((item: T) => JSX.Element) | undefined;\n\n return (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n <BreadcrumbItemContext value={{ itemKey, isLast }}>\n {renderItem?.(item)}\n </BreadcrumbItemContext>\n </li>\n );\n }}\n </For>\n </Show>\n </ol>\n </BreadcrumbsContext>\n );\n}\n\nfunction walkStaticChildren(children: unknown): unknown[] {\n const result: unknown[] = [];\n function walk(node: unknown): void {\n if (node == null || typeof node === \"boolean\") {\n return;\n }\n if (Array.isArray(node)) {\n for (const item of node) {\n walk(item);\n }\n return;\n }\n if (typeof node === \"function\" && (node as Function).length === 0) {\n walk((node as () => unknown)());\n return;\n }\n result.push(node);\n }\n walk(children);\n return result;\n}\n\nfunction StaticBreadcrumbItems(props: { children?: JSX.Element }): JSX.Element {\n const context = useContext(BreadcrumbsContext);\n const childArray = createMemo(() => {\n context?.resetStaticItems?.();\n const array = walkStaticChildren(props.children);\n if (!isServer) {\n context?.setStaticItemCount?.(array.length);\n }\n return array;\n });\n\n const indices = createMemo(() => Array.from({ length: childArray().length }, (_, i) => i));\n\n return (\n <For each={indices()}>\n {(index) => (\n <li style={{ display: \"flex\", \"align-items\": \"center\" }}>\n {childArray()[index] as JSX.Element}\n </li>\n )}\n </For>\n );\n}\n\n/**\n * A BreadcrumbItem represents an individual breadcrumb in the navigation trail.\n */\nexport function BreadcrumbItem(props: BreadcrumbItemProps): JSX.Element {\n const [local, ariaProps] = splitProps(props, [\"class\", \"style\", \"slot\", \"isDisabled\", \"ref\"]);\n\n const context = useContext(BreadcrumbsContext);\n const itemContext = useContext(BreadcrumbItemContext);\n const router = useRouter();\n const staticIndex = itemContext ? null : context?.registerStaticItem?.();\n const isDisabled = () => local.isDisabled ?? context?.isDisabled() ?? false;\n const isCurrent = () =>\n ariaProps.isCurrent ??\n itemContext?.isLast() ??\n (staticIndex !== null &&\n staticIndex !== undefined &&\n context?.staticItemCount !== undefined &&\n staticIndex === context.staticItemCount() - 1);\n const itemKey = () => itemContext?.itemKey ?? ariaProps.id ?? null;\n\n // Mirror react-aria-components' Link: render an <a> only when there is an\n // href on an enabled, non-current item; otherwise fall back to a <span\n // role=\"link\"> (via createLink). A styled layer may force the element type\n // (S2 renders the current item as a plain <div>), which takes precedence.\n const elementType = () =>\n ariaProps.elementType ?? (ariaProps.href && !isDisabled() && !isCurrent() ? \"a\" : \"span\");\n // The current breadcrumb is the current page and is non-interactive: S2\n // renders it as a plain element with no link role. createLink only omits\n // role=\"link\" for an <a>, so treat the current item as an \"a\" purely for the\n // role decision while still rendering the resolved element type above.\n const linkElementType = () => (isCurrent() ? \"a\" : elementType());\n\n const handlePress = (e: PressEvent) => {\n ariaProps.onPress?.(e);\n const key = itemKey();\n if (key !== null && !isCurrent() && !isDisabled()) {\n context?.onAction?.(key);\n }\n };\n\n const itemAria = createBreadcrumbItem({\n get id() {\n return ariaProps.id;\n },\n get isCurrent() {\n return isCurrent();\n },\n get isDisabled() {\n return isDisabled();\n },\n get href() {\n return ariaProps.href;\n },\n get target() {\n return ariaProps.target;\n },\n get rel() {\n return ariaProps.rel;\n },\n get elementType() {\n return linkElementType();\n },\n get onPress() {\n return handlePress;\n },\n get onPressStart() {\n return ariaProps.onPressStart;\n },\n get onPressEnd() {\n return ariaProps.onPressEnd;\n },\n get onClick() {\n return ariaProps.onClick;\n },\n get onFocus() {\n return ariaProps.onFocus;\n },\n get onBlur() {\n return ariaProps.onBlur;\n },\n get onFocusChange() {\n return ariaProps.onFocusChange;\n },\n get onKeyDown() {\n return ariaProps.onKeyDown;\n },\n get onKeyUp() {\n return ariaProps.onKeyUp;\n },\n get autoFocus() {\n return ariaProps.autoFocus;\n },\n get \"aria-label\"() {\n return ariaProps[\"aria-label\"];\n },\n get \"aria-labelledby\"() {\n return ariaProps[\"aria-labelledby\"];\n },\n get \"aria-describedby\"() {\n return ariaProps[\"aria-describedby\"];\n },\n get \"aria-details\"() {\n return ariaProps[\"aria-details\"];\n },\n get \"aria-current\"() {\n return ariaProps[\"aria-current\"];\n },\n });\n\n const isPressed = itemAria.isPressed;\n const { isFocused, isFocusVisible, focusProps } = createFocusRing();\n const { isHovered, hoverProps } = createHover({\n get isDisabled() {\n return isDisabled();\n },\n });\n // Read itemAria.itemProps fresh inside the memo (do NOT destructure it above):\n // the reactive getter re-runs createBreadcrumbItem → createLink each time this\n // memo re-evaluates, so role/tabIndex track elementType once isCurrent settles.\n const mergedItemProps = createMemo(() =>\n mergeProps(\n itemAria.itemProps as Record<string, unknown>,\n focusProps as Record<string, unknown>,\n hoverProps as Record<string, unknown>,\n ),\n );\n // createLink does not call handleLinkClick.\n const onItemClick = (event: MouseEvent) => {\n const click = (mergedItemProps() as { onClick?: (event: MouseEvent) => void }).onClick;\n click?.(event);\n handleLinkClick(event, router, ariaProps.href, ariaProps.routerOptions);\n };\n const itemDomProps = createMemo(() =>\n mergeProps(omitOnClick(mergedItemProps() as Record<string, unknown>), {\n onClick: onItemClick,\n }),\n );\n\n const renderValues = createMemo<BreadcrumbItemRenderProps>(() => ({\n isCurrent: isCurrent(),\n isDisabled: isDisabled(),\n isPressed: isPressed(),\n isFocused: isFocused(),\n isFocusVisible: isFocusVisible(),\n isHovered: isHovered(),\n }));\n\n const renderProps = useRenderProps(\n {\n get children() {\n return props.children;\n },\n get class() {\n return local.class;\n },\n get style() {\n return local.style;\n },\n defaultClassName: \"solidaria-BreadcrumbItem\",\n },\n renderValues,\n );\n\n const mergedStyle = () => {\n const userStyle = renderProps.style();\n const baseStyle = { display: \"inline-flex\", \"align-items\": \"center\" };\n return userStyle ? { ...baseStyle, ...userStyle } : baseStyle;\n };\n\n return (\n <ElementTag\n tag={elementType()}\n {...itemDomProps()}\n ref={(element: HTMLElement) => assignRef(local.ref, element)}\n aria-current={isCurrent() ? (ariaProps[\"aria-current\"] ?? \"page\") : undefined}\n aria-disabled={attrTrue(isDisabled() || isCurrent())}\n class={renderProps.class()}\n style={mergedStyle()}\n data-current={dataAttr(isCurrent())}\n data-disabled={dataAttr(isDisabled())}\n data-pressed={dataAttr(isPressed())}\n data-focused={dataAttr(isFocused())}\n data-focus-visible={dataAttr(isFocusVisible())}\n data-hovered={dataAttr(isHovered())}\n >\n {renderProps.renderChildren()}\n </ElementTag>\n );\n}\n\nBreadcrumbs.Item = BreadcrumbItem;\n"],"mappings":"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"}
|