@react-spectrum/buttongroup 3.6.29 → 3.7.0

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/import.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import {ButtonGroup as $bd4bfa55854eb3bf$export$69b1032f2ecdf404} from "./ButtonGroup.mjs";
1
+ import {ButtonGroup as $9b289607a838bf49$re_export$ButtonGroup} from "@adobe/react-spectrum/ButtonGroup";
2
2
 
3
3
  /*
4
4
  * Copyright 2020 Adobe. All rights reserved.
@@ -14,5 +14,5 @@ import {ButtonGroup as $bd4bfa55854eb3bf$export$69b1032f2ecdf404} from "./Button
14
14
 
15
15
 
16
16
 
17
- export {$bd4bfa55854eb3bf$export$69b1032f2ecdf404 as ButtonGroup};
17
+ export {$9b289607a838bf49$re_export$ButtonGroup as ButtonGroup};
18
18
  //# sourceMappingURL=module.js.map
package/dist/main.js CHANGED
@@ -1,11 +1,11 @@
1
- var $d384d3249418a107$exports = require("./ButtonGroup.main.js");
1
+ var $ciZCF$adobereactspectrumButtonGroup = require("@adobe/react-spectrum/ButtonGroup");
2
2
 
3
3
 
4
4
  function $parcel$export(e, n, v, s) {
5
5
  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
6
6
  }
7
7
 
8
- $parcel$export(module.exports, "ButtonGroup", () => $d384d3249418a107$exports.ButtonGroup);
8
+ $parcel$export(module.exports, "ButtonGroup", function () { return $ciZCF$adobereactspectrumButtonGroup.ButtonGroup; });
9
9
  /*
10
10
  * Copyright 2020 Adobe. All rights reserved.
11
11
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
package/dist/main.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC,GACD,0CAA0C","sources":["packages/@react-spectrum/buttongroup/src/index.ts"],"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/// <reference types=\"css-module-types\" />\nexport {ButtonGroup} from './ButtonGroup';\nexport type {SpectrumButtonGroupProps} from '@react-types/buttongroup';\n"],"names":[],"version":3,"file":"main.js.map"}
1
+ {"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC,GACD,0CAA0C","sources":["packages/@react-spectrum/buttongroup/src/index.ts"],"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/// <reference types=\"css-module-types\" />\nexport {ButtonGroup} from '@adobe/react-spectrum/ButtonGroup';\n\nexport type {SpectrumButtonGroupProps} from '@adobe/react-spectrum/ButtonGroup';\n"],"names":[],"version":3,"file":"main.js.map"}
package/dist/module.js CHANGED
@@ -1,4 +1,4 @@
1
- import {ButtonGroup as $bd4bfa55854eb3bf$export$69b1032f2ecdf404} from "./ButtonGroup.module.js";
1
+ import {ButtonGroup as $9b289607a838bf49$re_export$ButtonGroup} from "@adobe/react-spectrum/ButtonGroup";
2
2
 
3
3
  /*
4
4
  * Copyright 2020 Adobe. All rights reserved.
@@ -14,5 +14,5 @@ import {ButtonGroup as $bd4bfa55854eb3bf$export$69b1032f2ecdf404} from "./Button
14
14
 
15
15
 
16
16
 
17
- export {$bd4bfa55854eb3bf$export$69b1032f2ecdf404 as ButtonGroup};
17
+ export {$9b289607a838bf49$re_export$ButtonGroup as ButtonGroup};
18
18
  //# sourceMappingURL=module.js.map
@@ -1 +1 @@
1
- {"mappings":";;AAAA;;;;;;;;;;CAUC,GACD,0CAA0C","sources":["packages/@react-spectrum/buttongroup/src/index.ts"],"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/// <reference types=\"css-module-types\" />\nexport {ButtonGroup} from './ButtonGroup';\nexport type {SpectrumButtonGroupProps} from '@react-types/buttongroup';\n"],"names":[],"version":3,"file":"module.js.map"}
1
+ {"mappings":";;AAAA;;;;;;;;;;CAUC,GACD,0CAA0C","sources":["packages/@react-spectrum/buttongroup/src/index.ts"],"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/// <reference types=\"css-module-types\" />\nexport {ButtonGroup} from '@adobe/react-spectrum/ButtonGroup';\n\nexport type {SpectrumButtonGroupProps} from '@adobe/react-spectrum/ButtonGroup';\n"],"names":[],"version":3,"file":"module.js.map"}
@@ -0,0 +1,2 @@
1
+ export { ButtonGroup } from '@adobe/react-spectrum/ButtonGroup';
2
+ export type { SpectrumButtonGroupProps } from '@adobe/react-spectrum/ButtonGroup';
package/package.json CHANGED
@@ -1,20 +1,20 @@
1
1
  {
2
2
  "name": "@react-spectrum/buttongroup",
3
- "version": "3.6.29",
3
+ "version": "3.7.0",
4
4
  "description": "Spectrum UI components in React",
5
5
  "license": "Apache-2.0",
6
6
  "main": "dist/main.js",
7
7
  "module": "dist/module.js",
8
8
  "exports": {
9
- "source": "./src/index.ts",
10
- "types": [
11
- "./dist/types.d.ts",
12
- "./src/index.ts"
13
- ],
14
- "import": "./dist/import.mjs",
15
- "require": "./dist/main.js"
9
+ ".": {
10
+ "source": "./src/index.ts",
11
+ "types": "./dist/types/src/index.d.ts",
12
+ "import": "./dist/import.mjs",
13
+ "require": "./dist/main.js"
14
+ },
15
+ "./package.json": "./package.json"
16
16
  },
17
- "types": "dist/types.d.ts",
17
+ "types": "dist/types/src/index.d.ts",
18
18
  "source": "src/index.ts",
19
19
  "files": [
20
20
  "dist",
@@ -24,39 +24,22 @@
24
24
  "*.css"
25
25
  ],
26
26
  "targets": {
27
- "main": {
28
- "includeNodeModules": [
29
- "@adobe/spectrum-css-temp"
30
- ]
31
- },
32
- "module": {
33
- "includeNodeModules": [
34
- "@adobe/spectrum-css-temp"
35
- ]
36
- }
27
+ "types": false
37
28
  },
38
29
  "repository": {
39
30
  "type": "git",
40
31
  "url": "https://github.com/adobe/react-spectrum"
41
32
  },
42
33
  "dependencies": {
43
- "@react-aria/utils": "^3.33.1",
44
- "@react-spectrum/utils": "^3.12.12",
45
- "@react-types/buttongroup": "^3.3.23",
46
- "@react-types/shared": "^3.33.1",
34
+ "@adobe/react-spectrum": "3.47.0",
47
35
  "@swc/helpers": "^0.5.0"
48
36
  },
49
- "devDependencies": {
50
- "@adobe/spectrum-css-temp": "3.0.0-alpha.1",
51
- "@spectrum-icons/workflow": "^4.0.0"
52
- },
53
37
  "peerDependencies": {
54
- "@react-spectrum/provider": "^3.0.0",
55
38
  "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1",
56
39
  "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1"
57
40
  },
58
41
  "publishConfig": {
59
42
  "access": "public"
60
43
  },
61
- "gitHead": "8df187370053aa35f553cb388ad670f65e1ab371"
44
+ "gitHead": "a6999bdf494a2e9c0381a5881908328bdd22ddae"
62
45
  }
package/src/index.ts CHANGED
@@ -10,5 +10,6 @@
10
10
  * governing permissions and limitations under the License.
11
11
  */
12
12
  /// <reference types="css-module-types" />
13
- export {ButtonGroup} from './ButtonGroup';
14
- export type {SpectrumButtonGroupProps} from '@react-types/buttongroup';
13
+ export {ButtonGroup} from '@adobe/react-spectrum/ButtonGroup';
14
+
15
+ export type {SpectrumButtonGroupProps} from '@adobe/react-spectrum/ButtonGroup';
@@ -1,106 +0,0 @@
1
- require("./buttongroup.807718ea.css");
2
- var $2e9803b3bbead7d0$exports = require("./buttongroup_vars_css.main.js");
3
- var $6iGPs$reactspectrumutils = require("@react-spectrum/utils");
4
- var $6iGPs$reactariautils = require("@react-aria/utils");
5
- var $6iGPs$reactspectrumprovider = require("@react-spectrum/provider");
6
- var $6iGPs$react = require("react");
7
-
8
-
9
- function $parcel$interopDefault(a) {
10
- return a && a.__esModule ? a.default : a;
11
- }
12
-
13
- function $parcel$export(e, n, v, s) {
14
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
15
- }
16
-
17
- $parcel$export(module.exports, "ButtonGroup", () => $d384d3249418a107$export$69b1032f2ecdf404);
18
- /*
19
- * Copyright 2020 Adobe. All rights reserved.
20
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
21
- * you may not use this file except in compliance with the License. You may obtain a copy
22
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
23
- *
24
- * Unless required by applicable law or agreed to in writing, software distributed under
25
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
26
- * OF ANY KIND, either express or implied. See the License for the specific language
27
- * governing permissions and limitations under the License.
28
- */
29
-
30
-
31
-
32
-
33
- const $d384d3249418a107$export$69b1032f2ecdf404 = /*#__PURE__*/ (0, ($parcel$interopDefault($6iGPs$react))).forwardRef(function ButtonGroup(props, ref) {
34
- let { scale: scale } = (0, $6iGPs$reactspectrumprovider.useProvider)();
35
- props = (0, $6iGPs$reactspectrumprovider.useProviderProps)(props);
36
- props = (0, $6iGPs$reactspectrumutils.useSlotProps)(props, 'buttonGroup');
37
- let { children: children, orientation: orientation = 'horizontal', isDisabled: isDisabled, align: align = 'start', ...otherProps } = props;
38
- let { styleProps: styleProps } = (0, $6iGPs$reactspectrumutils.useStyleProps)(otherProps);
39
- let domRef = (0, $6iGPs$reactspectrumutils.useDOMRef)(ref);
40
- let [hasOverflow, setHasOverflow] = (0, $6iGPs$reactariautils.useValueEffect)(false);
41
- let checkForOverflow = (0, $6iGPs$react.useCallback)(()=>{
42
- let computeHasOverflow = ()=>{
43
- if (domRef.current && orientation === 'horizontal') {
44
- let buttonGroupChildren = Array.from(domRef.current.children);
45
- let maxX = domRef.current.offsetWidth + 1; // + 1 to account for rounding errors
46
- // If any buttons have negative X positions (align="end") or extend beyond
47
- // the width of the button group (align="start"), then switch to vertical.
48
- if (buttonGroupChildren.some((child)=>child.offsetLeft < 0 || child.offsetLeft + child.offsetWidth > maxX)) return true;
49
- return false;
50
- }
51
- };
52
- if (orientation === 'horizontal') setHasOverflow(function*() {
53
- // Force to horizontal for measurement.
54
- yield false;
55
- // Measure, and update if there is overflow.
56
- yield computeHasOverflow();
57
- });
58
- // eslint-disable-next-line react-hooks/exhaustive-deps
59
- }, [
60
- domRef,
61
- orientation,
62
- scale,
63
- setHasOverflow,
64
- children
65
- ]);
66
- // There are two main reasons we need to remeasure:
67
- // 1. Internal changes: Check for initial overflow or when orientation/scale/children change (from checkForOverflow dep array)
68
- (0, $6iGPs$reactariautils.useLayoutEffect)(()=>{
69
- checkForOverflow();
70
- }, [
71
- checkForOverflow
72
- ]);
73
- // 2. External changes: buttongroup won't change size due to any parents changing size, so listen to its container for size changes to figure out if we should remeasure
74
- let parent = (0, $6iGPs$react.useRef)(undefined);
75
- (0, $6iGPs$reactariautils.useLayoutEffect)(()=>{
76
- if (domRef.current) parent.current = domRef.current.parentElement;
77
- // eslint-disable-next-line react-hooks/exhaustive-deps
78
- }, [
79
- domRef.current
80
- ]);
81
- (0, $6iGPs$reactspectrumutils.useResizeObserver)({
82
- ref: parent,
83
- onResize: checkForOverflow
84
- });
85
- return /*#__PURE__*/ (0, ($parcel$interopDefault($6iGPs$react))).createElement("div", {
86
- ...(0, $6iGPs$reactariautils.filterDOMProps)(otherProps),
87
- ...styleProps,
88
- ref: domRef,
89
- className: (0, $6iGPs$reactspectrumutils.classNames)((0, ($parcel$interopDefault($2e9803b3bbead7d0$exports))), 'spectrum-ButtonGroup', {
90
- 'spectrum-ButtonGroup--vertical': orientation === 'vertical' || hasOverflow,
91
- 'spectrum-ButtonGroup--alignEnd': align === 'end',
92
- 'spectrum-ButtonGroup--alignCenter': align === 'center'
93
- }, styleProps.className)
94
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($6iGPs$react))).createElement((0, $6iGPs$reactspectrumutils.SlotProvider), {
95
- slots: {
96
- button: {
97
- UNSAFE_className: (0, $6iGPs$reactspectrumutils.classNames)((0, ($parcel$interopDefault($2e9803b3bbead7d0$exports))), 'spectrum-ButtonGroup-Button')
98
- }
99
- }
100
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($6iGPs$react))).createElement((0, $6iGPs$reactspectrumprovider.Provider), {
101
- isDisabled: isDisabled
102
- }, children)));
103
- });
104
-
105
-
106
- //# sourceMappingURL=ButtonGroup.main.js.map
@@ -1 +0,0 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAoBM,MAAM,0DAAc,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC,SAAS,YAAY,KAA+B,EAAE,GAA2B;IAC3H,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,wCAAU;IACxB,QAAQ,CAAA,GAAA,6CAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,sCAAW,EAAE,OAAO;IAE5B,IAAI,YACF,QAAQ,eACR,cAAc,0BACd,UAAU,SACV,QAAQ,SACR,GAAG,YACJ,GAAG;IAEJ,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,CAAC,aAAa,eAAe,GAAG,CAAA,GAAA,oCAAa,EAAE;IAEnD,IAAI,mBAAmB,CAAA,GAAA,wBAAU,EAAE;QACjC,IAAI,qBAAqB;YACvB,IAAI,OAAO,OAAO,IAAI,gBAAgB,cAAc;gBAClD,IAAI,sBAAsB,MAAM,IAAI,CAAC,OAAO,OAAO,CAAC,QAAQ;gBAC5D,IAAI,OAAO,OAAO,OAAO,CAAC,WAAW,GAAG,GAAG,qCAAqC;gBAChF,0EAA0E;gBAC1E,0EAA0E;gBAC1E,IAAI,oBAAoB,IAAI,CAAC,CAAA,QAAS,MAAM,UAAU,GAAG,KAAK,MAAM,UAAU,GAAG,MAAM,WAAW,GAAG,OACnG,OAAO;gBAET,OAAO;YACT;QACF;QACA,IAAI,gBAAgB,cAClB,eAAe;YACb,uCAAuC;YACvC,MAAM;YAEN,4CAA4C;YAC5C,MAAM;QACR;IAEJ,uDAAuD;IACvD,GAAG;QAAC;QAAQ;QAAa;QAAO;QAAgB;KAAS;IAEzD,mDAAmD;IACnD,8HAA8H;IAC9H,CAAA,GAAA,qCAAc,EAAE;QACd;IACF,GAAG;QAAC;KAAiB;IAErB,wKAAwK;IACxK,IAAI,SAAS,CAAA,GAAA,mBAAK,EAAe;IACjC,CAAA,GAAA,qCAAc,EAAE;QACd,IAAI,OAAO,OAAO,EAChB,OAAO,OAAO,GAAG,OAAO,OAAO,CAAC,aAAa;IAEjD,uDAAuD;IACvD,GAAG;QAAC,OAAO,OAAO;KAAC;IACnB,CAAA,GAAA,2CAAgB,EAAE;QAAC,KAAK;QAAQ,UAAU;IAAgB;IAE1D,qBACE,0DAAC;QACE,GAAG,CAAA,GAAA,oCAAa,EAAE,WAAW;QAC7B,GAAG,UAAU;QACd,KAAK;QACL,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,mDAAK,GACL,wBACA;YACE,kCAAkC,gBAAgB,cAAc;YAChE,kCAAkC,UAAU;YAC5C,qCAAqC,UAAU;QACjD,GACA,WAAW,SAAS;qBAGxB,0DAAC,CAAA,GAAA,sCAAW;QACV,OAAO;YACL,QAAQ;gBACN,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;YACvC;QACF;qBACA,0DAAC,CAAA,GAAA,qCAAO;QAAE,YAAY;OACnB;AAKX","sources":["packages/@react-spectrum/buttongroup/src/ButtonGroup.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\nimport {\n classNames,\n SlotProvider,\n useDOMRef,\n useResizeObserver,\n useSlotProps,\n useStyleProps\n} from '@react-spectrum/utils';\nimport {DOMRef} from '@react-types/shared';\nimport {filterDOMProps, useLayoutEffect, useValueEffect} from '@react-aria/utils';\nimport {Provider, useProvider, useProviderProps} from '@react-spectrum/provider';\nimport React, {useCallback, useRef} from 'react';\nimport {SpectrumButtonGroupProps} from '@react-types/buttongroup';\nimport styles from '@adobe/spectrum-css-temp/components/buttongroup/vars.css';\n\n/**\n * ButtonGroup handles overflow for a grouping of buttons whose actions are related to each other.\n */\nexport const ButtonGroup = React.forwardRef(function ButtonGroup(props: SpectrumButtonGroupProps, ref: DOMRef<HTMLDivElement>) {\n let {scale} = useProvider();\n props = useProviderProps(props);\n props = useSlotProps(props, 'buttonGroup');\n\n let {\n children,\n orientation = 'horizontal',\n isDisabled,\n align = 'start',\n ...otherProps\n } = props;\n\n let {styleProps} = useStyleProps(otherProps);\n let domRef = useDOMRef(ref);\n let [hasOverflow, setHasOverflow] = useValueEffect(false);\n\n let checkForOverflow = useCallback(() => {\n let computeHasOverflow = () => {\n if (domRef.current && orientation === 'horizontal') {\n let buttonGroupChildren = Array.from(domRef.current.children) as HTMLElement[];\n let maxX = domRef.current.offsetWidth + 1; // + 1 to account for rounding errors\n // If any buttons have negative X positions (align=\"end\") or extend beyond\n // the width of the button group (align=\"start\"), then switch to vertical.\n if (buttonGroupChildren.some(child => child.offsetLeft < 0 || child.offsetLeft + child.offsetWidth > maxX)) {\n return true;\n }\n return false;\n }\n };\n if (orientation === 'horizontal') {\n setHasOverflow(function* () {\n // Force to horizontal for measurement.\n yield false;\n\n // Measure, and update if there is overflow.\n yield computeHasOverflow();\n });\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [domRef, orientation, scale, setHasOverflow, children]);\n\n // There are two main reasons we need to remeasure:\n // 1. Internal changes: Check for initial overflow or when orientation/scale/children change (from checkForOverflow dep array)\n useLayoutEffect(() => {\n checkForOverflow();\n }, [checkForOverflow]);\n\n // 2. External changes: buttongroup won't change size due to any parents changing size, so listen to its container for size changes to figure out if we should remeasure\n let parent = useRef<HTMLElement>(undefined);\n useLayoutEffect(() => {\n if (domRef.current) {\n parent.current = domRef.current.parentElement as HTMLElement;\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [domRef.current]);\n useResizeObserver({ref: parent, onResize: checkForOverflow});\n\n return (\n <div\n {...filterDOMProps(otherProps)}\n {...styleProps}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-ButtonGroup',\n {\n 'spectrum-ButtonGroup--vertical': orientation === 'vertical' || hasOverflow,\n 'spectrum-ButtonGroup--alignEnd': align === 'end',\n 'spectrum-ButtonGroup--alignCenter': align === 'center'\n },\n styleProps.className\n )\n }>\n <SlotProvider\n slots={{\n button: {\n UNSAFE_className: classNames(styles, 'spectrum-ButtonGroup-Button')\n }\n }}>\n <Provider isDisabled={isDisabled}>\n {children}\n </Provider>\n </SlotProvider>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"ButtonGroup.main.js.map"}
@@ -1,101 +0,0 @@
1
- import "./buttongroup.807718ea.css";
2
- import $i2wAT$buttongroup_vars_cssmodulejs from "./buttongroup_vars_css.mjs";
3
- import {useSlotProps as $i2wAT$useSlotProps, useStyleProps as $i2wAT$useStyleProps, useDOMRef as $i2wAT$useDOMRef, useResizeObserver as $i2wAT$useResizeObserver, classNames as $i2wAT$classNames, SlotProvider as $i2wAT$SlotProvider} from "@react-spectrum/utils";
4
- import {useValueEffect as $i2wAT$useValueEffect, useLayoutEffect as $i2wAT$useLayoutEffect, filterDOMProps as $i2wAT$filterDOMProps} from "@react-aria/utils";
5
- import {useProvider as $i2wAT$useProvider, useProviderProps as $i2wAT$useProviderProps, Provider as $i2wAT$Provider} from "@react-spectrum/provider";
6
- import $i2wAT$react, {useCallback as $i2wAT$useCallback, useRef as $i2wAT$useRef} from "react";
7
-
8
-
9
- function $parcel$interopDefault(a) {
10
- return a && a.__esModule ? a.default : a;
11
- }
12
- /*
13
- * Copyright 2020 Adobe. All rights reserved.
14
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
15
- * you may not use this file except in compliance with the License. You may obtain a copy
16
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
17
- *
18
- * Unless required by applicable law or agreed to in writing, software distributed under
19
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
20
- * OF ANY KIND, either express or implied. See the License for the specific language
21
- * governing permissions and limitations under the License.
22
- */
23
-
24
-
25
-
26
-
27
- const $bd4bfa55854eb3bf$export$69b1032f2ecdf404 = /*#__PURE__*/ (0, $i2wAT$react).forwardRef(function ButtonGroup(props, ref) {
28
- let { scale: scale } = (0, $i2wAT$useProvider)();
29
- props = (0, $i2wAT$useProviderProps)(props);
30
- props = (0, $i2wAT$useSlotProps)(props, 'buttonGroup');
31
- let { children: children, orientation: orientation = 'horizontal', isDisabled: isDisabled, align: align = 'start', ...otherProps } = props;
32
- let { styleProps: styleProps } = (0, $i2wAT$useStyleProps)(otherProps);
33
- let domRef = (0, $i2wAT$useDOMRef)(ref);
34
- let [hasOverflow, setHasOverflow] = (0, $i2wAT$useValueEffect)(false);
35
- let checkForOverflow = (0, $i2wAT$useCallback)(()=>{
36
- let computeHasOverflow = ()=>{
37
- if (domRef.current && orientation === 'horizontal') {
38
- let buttonGroupChildren = Array.from(domRef.current.children);
39
- let maxX = domRef.current.offsetWidth + 1; // + 1 to account for rounding errors
40
- // If any buttons have negative X positions (align="end") or extend beyond
41
- // the width of the button group (align="start"), then switch to vertical.
42
- if (buttonGroupChildren.some((child)=>child.offsetLeft < 0 || child.offsetLeft + child.offsetWidth > maxX)) return true;
43
- return false;
44
- }
45
- };
46
- if (orientation === 'horizontal') setHasOverflow(function*() {
47
- // Force to horizontal for measurement.
48
- yield false;
49
- // Measure, and update if there is overflow.
50
- yield computeHasOverflow();
51
- });
52
- // eslint-disable-next-line react-hooks/exhaustive-deps
53
- }, [
54
- domRef,
55
- orientation,
56
- scale,
57
- setHasOverflow,
58
- children
59
- ]);
60
- // There are two main reasons we need to remeasure:
61
- // 1. Internal changes: Check for initial overflow or when orientation/scale/children change (from checkForOverflow dep array)
62
- (0, $i2wAT$useLayoutEffect)(()=>{
63
- checkForOverflow();
64
- }, [
65
- checkForOverflow
66
- ]);
67
- // 2. External changes: buttongroup won't change size due to any parents changing size, so listen to its container for size changes to figure out if we should remeasure
68
- let parent = (0, $i2wAT$useRef)(undefined);
69
- (0, $i2wAT$useLayoutEffect)(()=>{
70
- if (domRef.current) parent.current = domRef.current.parentElement;
71
- // eslint-disable-next-line react-hooks/exhaustive-deps
72
- }, [
73
- domRef.current
74
- ]);
75
- (0, $i2wAT$useResizeObserver)({
76
- ref: parent,
77
- onResize: checkForOverflow
78
- });
79
- return /*#__PURE__*/ (0, $i2wAT$react).createElement("div", {
80
- ...(0, $i2wAT$filterDOMProps)(otherProps),
81
- ...styleProps,
82
- ref: domRef,
83
- className: (0, $i2wAT$classNames)((0, ($parcel$interopDefault($i2wAT$buttongroup_vars_cssmodulejs))), 'spectrum-ButtonGroup', {
84
- 'spectrum-ButtonGroup--vertical': orientation === 'vertical' || hasOverflow,
85
- 'spectrum-ButtonGroup--alignEnd': align === 'end',
86
- 'spectrum-ButtonGroup--alignCenter': align === 'center'
87
- }, styleProps.className)
88
- }, /*#__PURE__*/ (0, $i2wAT$react).createElement((0, $i2wAT$SlotProvider), {
89
- slots: {
90
- button: {
91
- UNSAFE_className: (0, $i2wAT$classNames)((0, ($parcel$interopDefault($i2wAT$buttongroup_vars_cssmodulejs))), 'spectrum-ButtonGroup-Button')
92
- }
93
- }
94
- }, /*#__PURE__*/ (0, $i2wAT$react).createElement((0, $i2wAT$Provider), {
95
- isDisabled: isDisabled
96
- }, children)));
97
- });
98
-
99
-
100
- export {$bd4bfa55854eb3bf$export$69b1032f2ecdf404 as ButtonGroup};
101
- //# sourceMappingURL=ButtonGroup.module.js.map
@@ -1,101 +0,0 @@
1
- import "./buttongroup.807718ea.css";
2
- import $i2wAT$buttongroup_vars_cssmodulejs from "./buttongroup_vars_css.module.js";
3
- import {useSlotProps as $i2wAT$useSlotProps, useStyleProps as $i2wAT$useStyleProps, useDOMRef as $i2wAT$useDOMRef, useResizeObserver as $i2wAT$useResizeObserver, classNames as $i2wAT$classNames, SlotProvider as $i2wAT$SlotProvider} from "@react-spectrum/utils";
4
- import {useValueEffect as $i2wAT$useValueEffect, useLayoutEffect as $i2wAT$useLayoutEffect, filterDOMProps as $i2wAT$filterDOMProps} from "@react-aria/utils";
5
- import {useProvider as $i2wAT$useProvider, useProviderProps as $i2wAT$useProviderProps, Provider as $i2wAT$Provider} from "@react-spectrum/provider";
6
- import $i2wAT$react, {useCallback as $i2wAT$useCallback, useRef as $i2wAT$useRef} from "react";
7
-
8
-
9
- function $parcel$interopDefault(a) {
10
- return a && a.__esModule ? a.default : a;
11
- }
12
- /*
13
- * Copyright 2020 Adobe. All rights reserved.
14
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
15
- * you may not use this file except in compliance with the License. You may obtain a copy
16
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
17
- *
18
- * Unless required by applicable law or agreed to in writing, software distributed under
19
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
20
- * OF ANY KIND, either express or implied. See the License for the specific language
21
- * governing permissions and limitations under the License.
22
- */
23
-
24
-
25
-
26
-
27
- const $bd4bfa55854eb3bf$export$69b1032f2ecdf404 = /*#__PURE__*/ (0, $i2wAT$react).forwardRef(function ButtonGroup(props, ref) {
28
- let { scale: scale } = (0, $i2wAT$useProvider)();
29
- props = (0, $i2wAT$useProviderProps)(props);
30
- props = (0, $i2wAT$useSlotProps)(props, 'buttonGroup');
31
- let { children: children, orientation: orientation = 'horizontal', isDisabled: isDisabled, align: align = 'start', ...otherProps } = props;
32
- let { styleProps: styleProps } = (0, $i2wAT$useStyleProps)(otherProps);
33
- let domRef = (0, $i2wAT$useDOMRef)(ref);
34
- let [hasOverflow, setHasOverflow] = (0, $i2wAT$useValueEffect)(false);
35
- let checkForOverflow = (0, $i2wAT$useCallback)(()=>{
36
- let computeHasOverflow = ()=>{
37
- if (domRef.current && orientation === 'horizontal') {
38
- let buttonGroupChildren = Array.from(domRef.current.children);
39
- let maxX = domRef.current.offsetWidth + 1; // + 1 to account for rounding errors
40
- // If any buttons have negative X positions (align="end") or extend beyond
41
- // the width of the button group (align="start"), then switch to vertical.
42
- if (buttonGroupChildren.some((child)=>child.offsetLeft < 0 || child.offsetLeft + child.offsetWidth > maxX)) return true;
43
- return false;
44
- }
45
- };
46
- if (orientation === 'horizontal') setHasOverflow(function*() {
47
- // Force to horizontal for measurement.
48
- yield false;
49
- // Measure, and update if there is overflow.
50
- yield computeHasOverflow();
51
- });
52
- // eslint-disable-next-line react-hooks/exhaustive-deps
53
- }, [
54
- domRef,
55
- orientation,
56
- scale,
57
- setHasOverflow,
58
- children
59
- ]);
60
- // There are two main reasons we need to remeasure:
61
- // 1. Internal changes: Check for initial overflow or when orientation/scale/children change (from checkForOverflow dep array)
62
- (0, $i2wAT$useLayoutEffect)(()=>{
63
- checkForOverflow();
64
- }, [
65
- checkForOverflow
66
- ]);
67
- // 2. External changes: buttongroup won't change size due to any parents changing size, so listen to its container for size changes to figure out if we should remeasure
68
- let parent = (0, $i2wAT$useRef)(undefined);
69
- (0, $i2wAT$useLayoutEffect)(()=>{
70
- if (domRef.current) parent.current = domRef.current.parentElement;
71
- // eslint-disable-next-line react-hooks/exhaustive-deps
72
- }, [
73
- domRef.current
74
- ]);
75
- (0, $i2wAT$useResizeObserver)({
76
- ref: parent,
77
- onResize: checkForOverflow
78
- });
79
- return /*#__PURE__*/ (0, $i2wAT$react).createElement("div", {
80
- ...(0, $i2wAT$filterDOMProps)(otherProps),
81
- ...styleProps,
82
- ref: domRef,
83
- className: (0, $i2wAT$classNames)((0, ($parcel$interopDefault($i2wAT$buttongroup_vars_cssmodulejs))), 'spectrum-ButtonGroup', {
84
- 'spectrum-ButtonGroup--vertical': orientation === 'vertical' || hasOverflow,
85
- 'spectrum-ButtonGroup--alignEnd': align === 'end',
86
- 'spectrum-ButtonGroup--alignCenter': align === 'center'
87
- }, styleProps.className)
88
- }, /*#__PURE__*/ (0, $i2wAT$react).createElement((0, $i2wAT$SlotProvider), {
89
- slots: {
90
- button: {
91
- UNSAFE_className: (0, $i2wAT$classNames)((0, ($parcel$interopDefault($i2wAT$buttongroup_vars_cssmodulejs))), 'spectrum-ButtonGroup-Button')
92
- }
93
- }
94
- }, /*#__PURE__*/ (0, $i2wAT$react).createElement((0, $i2wAT$Provider), {
95
- isDisabled: isDisabled
96
- }, children)));
97
- });
98
-
99
-
100
- export {$bd4bfa55854eb3bf$export$69b1032f2ecdf404 as ButtonGroup};
101
- //# sourceMappingURL=ButtonGroup.module.js.map
@@ -1 +0,0 @@
1
- {"mappings":";;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAoBM,MAAM,0DAAc,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,YAAY,KAA+B,EAAE,GAA2B;IAC3H,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,kBAAU;IACxB,QAAQ,CAAA,GAAA,uBAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,mBAAW,EAAE,OAAO;IAE5B,IAAI,YACF,QAAQ,eACR,cAAc,0BACd,UAAU,SACV,QAAQ,SACR,GAAG,YACJ,GAAG;IAEJ,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,oBAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,CAAC,aAAa,eAAe,GAAG,CAAA,GAAA,qBAAa,EAAE;IAEnD,IAAI,mBAAmB,CAAA,GAAA,kBAAU,EAAE;QACjC,IAAI,qBAAqB;YACvB,IAAI,OAAO,OAAO,IAAI,gBAAgB,cAAc;gBAClD,IAAI,sBAAsB,MAAM,IAAI,CAAC,OAAO,OAAO,CAAC,QAAQ;gBAC5D,IAAI,OAAO,OAAO,OAAO,CAAC,WAAW,GAAG,GAAG,qCAAqC;gBAChF,0EAA0E;gBAC1E,0EAA0E;gBAC1E,IAAI,oBAAoB,IAAI,CAAC,CAAA,QAAS,MAAM,UAAU,GAAG,KAAK,MAAM,UAAU,GAAG,MAAM,WAAW,GAAG,OACnG,OAAO;gBAET,OAAO;YACT;QACF;QACA,IAAI,gBAAgB,cAClB,eAAe;YACb,uCAAuC;YACvC,MAAM;YAEN,4CAA4C;YAC5C,MAAM;QACR;IAEJ,uDAAuD;IACvD,GAAG;QAAC;QAAQ;QAAa;QAAO;QAAgB;KAAS;IAEzD,mDAAmD;IACnD,8HAA8H;IAC9H,CAAA,GAAA,sBAAc,EAAE;QACd;IACF,GAAG;QAAC;KAAiB;IAErB,wKAAwK;IACxK,IAAI,SAAS,CAAA,GAAA,aAAK,EAAe;IACjC,CAAA,GAAA,sBAAc,EAAE;QACd,IAAI,OAAO,OAAO,EAChB,OAAO,OAAO,GAAG,OAAO,OAAO,CAAC,aAAa;IAEjD,uDAAuD;IACvD,GAAG;QAAC,OAAO,OAAO;KAAC;IACnB,CAAA,GAAA,wBAAgB,EAAE;QAAC,KAAK;QAAQ,UAAU;IAAgB;IAE1D,qBACE,gCAAC;QACE,GAAG,CAAA,GAAA,qBAAa,EAAE,WAAW;QAC7B,GAAG,UAAU;QACd,KAAK;QACL,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,6DAAK,GACL,wBACA;YACE,kCAAkC,gBAAgB,cAAc;YAChE,kCAAkC,UAAU;YAC5C,qCAAqC,UAAU;QACjD,GACA,WAAW,SAAS;qBAGxB,gCAAC,CAAA,GAAA,mBAAW;QACV,OAAO;YACL,QAAQ;gBACN,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,6DAAK,GAAG;YACvC;QACF;qBACA,gCAAC,CAAA,GAAA,eAAO;QAAE,YAAY;OACnB;AAKX","sources":["packages/@react-spectrum/buttongroup/src/ButtonGroup.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\nimport {\n classNames,\n SlotProvider,\n useDOMRef,\n useResizeObserver,\n useSlotProps,\n useStyleProps\n} from '@react-spectrum/utils';\nimport {DOMRef} from '@react-types/shared';\nimport {filterDOMProps, useLayoutEffect, useValueEffect} from '@react-aria/utils';\nimport {Provider, useProvider, useProviderProps} from '@react-spectrum/provider';\nimport React, {useCallback, useRef} from 'react';\nimport {SpectrumButtonGroupProps} from '@react-types/buttongroup';\nimport styles from '@adobe/spectrum-css-temp/components/buttongroup/vars.css';\n\n/**\n * ButtonGroup handles overflow for a grouping of buttons whose actions are related to each other.\n */\nexport const ButtonGroup = React.forwardRef(function ButtonGroup(props: SpectrumButtonGroupProps, ref: DOMRef<HTMLDivElement>) {\n let {scale} = useProvider();\n props = useProviderProps(props);\n props = useSlotProps(props, 'buttonGroup');\n\n let {\n children,\n orientation = 'horizontal',\n isDisabled,\n align = 'start',\n ...otherProps\n } = props;\n\n let {styleProps} = useStyleProps(otherProps);\n let domRef = useDOMRef(ref);\n let [hasOverflow, setHasOverflow] = useValueEffect(false);\n\n let checkForOverflow = useCallback(() => {\n let computeHasOverflow = () => {\n if (domRef.current && orientation === 'horizontal') {\n let buttonGroupChildren = Array.from(domRef.current.children) as HTMLElement[];\n let maxX = domRef.current.offsetWidth + 1; // + 1 to account for rounding errors\n // If any buttons have negative X positions (align=\"end\") or extend beyond\n // the width of the button group (align=\"start\"), then switch to vertical.\n if (buttonGroupChildren.some(child => child.offsetLeft < 0 || child.offsetLeft + child.offsetWidth > maxX)) {\n return true;\n }\n return false;\n }\n };\n if (orientation === 'horizontal') {\n setHasOverflow(function* () {\n // Force to horizontal for measurement.\n yield false;\n\n // Measure, and update if there is overflow.\n yield computeHasOverflow();\n });\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [domRef, orientation, scale, setHasOverflow, children]);\n\n // There are two main reasons we need to remeasure:\n // 1. Internal changes: Check for initial overflow or when orientation/scale/children change (from checkForOverflow dep array)\n useLayoutEffect(() => {\n checkForOverflow();\n }, [checkForOverflow]);\n\n // 2. External changes: buttongroup won't change size due to any parents changing size, so listen to its container for size changes to figure out if we should remeasure\n let parent = useRef<HTMLElement>(undefined);\n useLayoutEffect(() => {\n if (domRef.current) {\n parent.current = domRef.current.parentElement as HTMLElement;\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [domRef.current]);\n useResizeObserver({ref: parent, onResize: checkForOverflow});\n\n return (\n <div\n {...filterDOMProps(otherProps)}\n {...styleProps}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-ButtonGroup',\n {\n 'spectrum-ButtonGroup--vertical': orientation === 'vertical' || hasOverflow,\n 'spectrum-ButtonGroup--alignEnd': align === 'end',\n 'spectrum-ButtonGroup--alignCenter': align === 'center'\n },\n styleProps.className\n )\n }>\n <SlotProvider\n slots={{\n button: {\n UNSAFE_className: classNames(styles, 'spectrum-ButtonGroup-Button')\n }\n }}>\n <Provider isDisabled={isDisabled}>\n {children}\n </Provider>\n </SlotProvider>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"ButtonGroup.module.js.map"}
@@ -1,40 +0,0 @@
1
- .NekGBa_spectrum-ButtonGroup {
2
- align-items: flex-start;
3
- display: inline-flex;
4
- position: relative;
5
- }
6
-
7
- .NekGBa_spectrum-ButtonGroup .NekGBa_spectrum-ButtonGroup-Button {
8
- flex-shrink: 0;
9
- }
10
-
11
- .NekGBa_spectrum-ButtonGroup .NekGBa_spectrum-ButtonGroup-Button + .NekGBa_spectrum-ButtonGroup-Button {
12
- margin-inline-start: var(--spectrum-buttongroup-button-gap-x, var(--spectrum-global-dimension-static-size-200));
13
- }
14
-
15
- .NekGBa_spectrum-ButtonGroup.NekGBa_spectrum-ButtonGroup--alignEnd {
16
- justify-content: flex-end;
17
- }
18
-
19
- .NekGBa_spectrum-ButtonGroup.NekGBa_spectrum-ButtonGroup--alignCenter {
20
- justify-content: center;
21
- }
22
-
23
- .NekGBa_spectrum-ButtonGroup--vertical {
24
- flex-direction: column;
25
- display: inline-flex;
26
- }
27
-
28
- .NekGBa_spectrum-ButtonGroup--vertical .NekGBa_spectrum-ButtonGroup-Button + .NekGBa_spectrum-ButtonGroup-Button {
29
- margin-block-start: var(--spectrum-buttongroup-button-gap-y, var(--spectrum-global-dimension-static-size-200));
30
- margin-inline-start: 0;
31
- }
32
-
33
- .NekGBa_spectrum-ButtonGroup--vertical.NekGBa_spectrum-ButtonGroup--alignEnd {
34
- align-items: flex-end;
35
- }
36
-
37
- .NekGBa_spectrum-ButtonGroup--vertical.NekGBa_spectrum-ButtonGroup--alignCenter {
38
- align-items: center;
39
- }
40
- /*# sourceMappingURL=buttongroup.807718ea.css.map */
@@ -1 +0,0 @@
1
- {"mappings":"AAwBA;;;;;;AAME;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAKF;;;;;AAIE;;;;;AAKA;;;;AAIA","sources":["packages/@adobe/spectrum-css-temp/components/buttongroup/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n"],"names":[],"version":3,"file":"buttongroup.807718ea.css.map"}
@@ -1,23 +0,0 @@
1
-
2
- function $parcel$export(e, n, v, s) {
3
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
4
- }
5
-
6
- $parcel$export(module.exports, "spectrum-ButtonGroup", () => $2e9803b3bbead7d0$export$a92faf51352ac608, (v) => $2e9803b3bbead7d0$export$a92faf51352ac608 = v);
7
- $parcel$export(module.exports, "spectrum-ButtonGroup--alignCenter", () => $2e9803b3bbead7d0$export$252bc7c4ae05757, (v) => $2e9803b3bbead7d0$export$252bc7c4ae05757 = v);
8
- $parcel$export(module.exports, "spectrum-ButtonGroup--alignEnd", () => $2e9803b3bbead7d0$export$30e96c53d7beca11, (v) => $2e9803b3bbead7d0$export$30e96c53d7beca11 = v);
9
- $parcel$export(module.exports, "spectrum-ButtonGroup--vertical", () => $2e9803b3bbead7d0$export$84d9c0e1917a4eaf, (v) => $2e9803b3bbead7d0$export$84d9c0e1917a4eaf = v);
10
- $parcel$export(module.exports, "spectrum-ButtonGroup-Button", () => $2e9803b3bbead7d0$export$7184de2337c1927f, (v) => $2e9803b3bbead7d0$export$7184de2337c1927f = v);
11
- var $2e9803b3bbead7d0$export$a92faf51352ac608;
12
- var $2e9803b3bbead7d0$export$252bc7c4ae05757;
13
- var $2e9803b3bbead7d0$export$30e96c53d7beca11;
14
- var $2e9803b3bbead7d0$export$84d9c0e1917a4eaf;
15
- var $2e9803b3bbead7d0$export$7184de2337c1927f;
16
- $2e9803b3bbead7d0$export$a92faf51352ac608 = `NekGBa_spectrum-ButtonGroup`;
17
- $2e9803b3bbead7d0$export$252bc7c4ae05757 = `NekGBa_spectrum-ButtonGroup--alignCenter`;
18
- $2e9803b3bbead7d0$export$30e96c53d7beca11 = `NekGBa_spectrum-ButtonGroup--alignEnd`;
19
- $2e9803b3bbead7d0$export$84d9c0e1917a4eaf = `NekGBa_spectrum-ButtonGroup--vertical`;
20
- $2e9803b3bbead7d0$export$7184de2337c1927f = `NekGBa_spectrum-ButtonGroup-Button`;
21
-
22
-
23
- //# sourceMappingURL=buttongroup_vars_css.main.js.map
@@ -1 +0,0 @@
1
- {"mappings":";;;;;;;;;;AAAA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AAJA,4CAAyC,CAAC,2BAA2B,CAAC;AACtE,2CAAsD,CAAC,wCAAwC,CAAC;AAChG,4CAAmD,CAAC,qCAAqC,CAAC;AAC1F,4CAAmD,CAAC,qCAAqC,CAAC;AAC1F,4CAAgD,CAAC,kCAAkC,CAAC","sources":["packages/@adobe/spectrum-css-temp/components/buttongroup/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n"],"names":[],"version":3,"file":"buttongroup_vars_css.main.js.map"}
@@ -1,25 +0,0 @@
1
-
2
- function $parcel$export(e, n, v, s) {
3
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
4
- }
5
- var $fddc5368d2db28a6$exports = {};
6
-
7
- $parcel$export($fddc5368d2db28a6$exports, "spectrum-ButtonGroup", () => $fddc5368d2db28a6$export$a92faf51352ac608, (v) => $fddc5368d2db28a6$export$a92faf51352ac608 = v);
8
- $parcel$export($fddc5368d2db28a6$exports, "spectrum-ButtonGroup--alignCenter", () => $fddc5368d2db28a6$export$252bc7c4ae05757, (v) => $fddc5368d2db28a6$export$252bc7c4ae05757 = v);
9
- $parcel$export($fddc5368d2db28a6$exports, "spectrum-ButtonGroup--alignEnd", () => $fddc5368d2db28a6$export$30e96c53d7beca11, (v) => $fddc5368d2db28a6$export$30e96c53d7beca11 = v);
10
- $parcel$export($fddc5368d2db28a6$exports, "spectrum-ButtonGroup--vertical", () => $fddc5368d2db28a6$export$84d9c0e1917a4eaf, (v) => $fddc5368d2db28a6$export$84d9c0e1917a4eaf = v);
11
- $parcel$export($fddc5368d2db28a6$exports, "spectrum-ButtonGroup-Button", () => $fddc5368d2db28a6$export$7184de2337c1927f, (v) => $fddc5368d2db28a6$export$7184de2337c1927f = v);
12
- var $fddc5368d2db28a6$export$a92faf51352ac608;
13
- var $fddc5368d2db28a6$export$252bc7c4ae05757;
14
- var $fddc5368d2db28a6$export$30e96c53d7beca11;
15
- var $fddc5368d2db28a6$export$84d9c0e1917a4eaf;
16
- var $fddc5368d2db28a6$export$7184de2337c1927f;
17
- $fddc5368d2db28a6$export$a92faf51352ac608 = `NekGBa_spectrum-ButtonGroup`;
18
- $fddc5368d2db28a6$export$252bc7c4ae05757 = `NekGBa_spectrum-ButtonGroup--alignCenter`;
19
- $fddc5368d2db28a6$export$30e96c53d7beca11 = `NekGBa_spectrum-ButtonGroup--alignEnd`;
20
- $fddc5368d2db28a6$export$84d9c0e1917a4eaf = `NekGBa_spectrum-ButtonGroup--vertical`;
21
- $fddc5368d2db28a6$export$7184de2337c1927f = `NekGBa_spectrum-ButtonGroup-Button`;
22
-
23
-
24
- export {$fddc5368d2db28a6$exports as default};
25
- //# sourceMappingURL=buttongroup_vars_css.module.js.map
@@ -1,25 +0,0 @@
1
-
2
- function $parcel$export(e, n, v, s) {
3
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
4
- }
5
- var $fddc5368d2db28a6$exports = {};
6
-
7
- $parcel$export($fddc5368d2db28a6$exports, "spectrum-ButtonGroup", () => $fddc5368d2db28a6$export$a92faf51352ac608, (v) => $fddc5368d2db28a6$export$a92faf51352ac608 = v);
8
- $parcel$export($fddc5368d2db28a6$exports, "spectrum-ButtonGroup--alignCenter", () => $fddc5368d2db28a6$export$252bc7c4ae05757, (v) => $fddc5368d2db28a6$export$252bc7c4ae05757 = v);
9
- $parcel$export($fddc5368d2db28a6$exports, "spectrum-ButtonGroup--alignEnd", () => $fddc5368d2db28a6$export$30e96c53d7beca11, (v) => $fddc5368d2db28a6$export$30e96c53d7beca11 = v);
10
- $parcel$export($fddc5368d2db28a6$exports, "spectrum-ButtonGroup--vertical", () => $fddc5368d2db28a6$export$84d9c0e1917a4eaf, (v) => $fddc5368d2db28a6$export$84d9c0e1917a4eaf = v);
11
- $parcel$export($fddc5368d2db28a6$exports, "spectrum-ButtonGroup-Button", () => $fddc5368d2db28a6$export$7184de2337c1927f, (v) => $fddc5368d2db28a6$export$7184de2337c1927f = v);
12
- var $fddc5368d2db28a6$export$a92faf51352ac608;
13
- var $fddc5368d2db28a6$export$252bc7c4ae05757;
14
- var $fddc5368d2db28a6$export$30e96c53d7beca11;
15
- var $fddc5368d2db28a6$export$84d9c0e1917a4eaf;
16
- var $fddc5368d2db28a6$export$7184de2337c1927f;
17
- $fddc5368d2db28a6$export$a92faf51352ac608 = `NekGBa_spectrum-ButtonGroup`;
18
- $fddc5368d2db28a6$export$252bc7c4ae05757 = `NekGBa_spectrum-ButtonGroup--alignCenter`;
19
- $fddc5368d2db28a6$export$30e96c53d7beca11 = `NekGBa_spectrum-ButtonGroup--alignEnd`;
20
- $fddc5368d2db28a6$export$84d9c0e1917a4eaf = `NekGBa_spectrum-ButtonGroup--vertical`;
21
- $fddc5368d2db28a6$export$7184de2337c1927f = `NekGBa_spectrum-ButtonGroup-Button`;
22
-
23
-
24
- export {$fddc5368d2db28a6$exports as default};
25
- //# sourceMappingURL=buttongroup_vars_css.module.js.map
@@ -1 +0,0 @@
1
- {"mappings":";;;;;;;;;;;AAAA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AAJA,4CAAyC,CAAC,2BAA2B,CAAC;AACtE,2CAAsD,CAAC,wCAAwC,CAAC;AAChG,4CAAmD,CAAC,qCAAqC,CAAC;AAC1F,4CAAmD,CAAC,qCAAqC,CAAC;AAC1F,4CAAgD,CAAC,kCAAkC,CAAC","sources":["packages/@adobe/spectrum-css-temp/components/buttongroup/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n"],"names":[],"version":3,"file":"buttongroup_vars_css.module.js.map"}
package/dist/types.d.ts DELETED
@@ -1,10 +0,0 @@
1
- import React from "react";
2
- import { SpectrumButtonGroupProps } from "@react-types/buttongroup";
3
- import { DOMRefValue } from "@react-types/shared";
4
- /**
5
- * ButtonGroup handles overflow for a grouping of buttons whose actions are related to each other.
6
- */
7
- export const ButtonGroup: React.ForwardRefExoticComponent<SpectrumButtonGroupProps & React.RefAttributes<DOMRefValue<HTMLDivElement>>>;
8
- export type { SpectrumButtonGroupProps } from '@react-types/buttongroup';
9
-
10
- //# sourceMappingURL=types.d.ts.map
@@ -1 +0,0 @@
1
- {"mappings":";;;AA2BA;;GAEG;AACH,OAAO,MAAM,yHAuFX,CAAC;ACxGH,YAAY,EAAC,wBAAwB,EAAC,MAAM,0BAA0B,CAAC","sources":["packages/@react-spectrum/buttongroup/src/packages/@react-spectrum/buttongroup/src/ButtonGroup.tsx","packages/@react-spectrum/buttongroup/src/packages/@react-spectrum/buttongroup/src/index.ts","packages/@react-spectrum/buttongroup/src/index.ts"],"sourcesContent":[null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n/// <reference types=\"css-module-types\" />\nexport {ButtonGroup} from './ButtonGroup';\nexport type {SpectrumButtonGroupProps} from '@react-types/buttongroup';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
@@ -1,118 +0,0 @@
1
- /*
2
- * Copyright 2020 Adobe. All rights reserved.
3
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
4
- * you may not use this file except in compliance with the License. You may obtain a copy
5
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
6
- *
7
- * Unless required by applicable law or agreed to in writing, software distributed under
8
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9
- * OF ANY KIND, either express or implied. See the License for the specific language
10
- * governing permissions and limitations under the License.
11
- */
12
-
13
- import {
14
- classNames,
15
- SlotProvider,
16
- useDOMRef,
17
- useResizeObserver,
18
- useSlotProps,
19
- useStyleProps
20
- } from '@react-spectrum/utils';
21
- import {DOMRef} from '@react-types/shared';
22
- import {filterDOMProps, useLayoutEffect, useValueEffect} from '@react-aria/utils';
23
- import {Provider, useProvider, useProviderProps} from '@react-spectrum/provider';
24
- import React, {useCallback, useRef} from 'react';
25
- import {SpectrumButtonGroupProps} from '@react-types/buttongroup';
26
- import styles from '@adobe/spectrum-css-temp/components/buttongroup/vars.css';
27
-
28
- /**
29
- * ButtonGroup handles overflow for a grouping of buttons whose actions are related to each other.
30
- */
31
- export const ButtonGroup = React.forwardRef(function ButtonGroup(props: SpectrumButtonGroupProps, ref: DOMRef<HTMLDivElement>) {
32
- let {scale} = useProvider();
33
- props = useProviderProps(props);
34
- props = useSlotProps(props, 'buttonGroup');
35
-
36
- let {
37
- children,
38
- orientation = 'horizontal',
39
- isDisabled,
40
- align = 'start',
41
- ...otherProps
42
- } = props;
43
-
44
- let {styleProps} = useStyleProps(otherProps);
45
- let domRef = useDOMRef(ref);
46
- let [hasOverflow, setHasOverflow] = useValueEffect(false);
47
-
48
- let checkForOverflow = useCallback(() => {
49
- let computeHasOverflow = () => {
50
- if (domRef.current && orientation === 'horizontal') {
51
- let buttonGroupChildren = Array.from(domRef.current.children) as HTMLElement[];
52
- let maxX = domRef.current.offsetWidth + 1; // + 1 to account for rounding errors
53
- // If any buttons have negative X positions (align="end") or extend beyond
54
- // the width of the button group (align="start"), then switch to vertical.
55
- if (buttonGroupChildren.some(child => child.offsetLeft < 0 || child.offsetLeft + child.offsetWidth > maxX)) {
56
- return true;
57
- }
58
- return false;
59
- }
60
- };
61
- if (orientation === 'horizontal') {
62
- setHasOverflow(function* () {
63
- // Force to horizontal for measurement.
64
- yield false;
65
-
66
- // Measure, and update if there is overflow.
67
- yield computeHasOverflow();
68
- });
69
- }
70
- // eslint-disable-next-line react-hooks/exhaustive-deps
71
- }, [domRef, orientation, scale, setHasOverflow, children]);
72
-
73
- // There are two main reasons we need to remeasure:
74
- // 1. Internal changes: Check for initial overflow or when orientation/scale/children change (from checkForOverflow dep array)
75
- useLayoutEffect(() => {
76
- checkForOverflow();
77
- }, [checkForOverflow]);
78
-
79
- // 2. External changes: buttongroup won't change size due to any parents changing size, so listen to its container for size changes to figure out if we should remeasure
80
- let parent = useRef<HTMLElement>(undefined);
81
- useLayoutEffect(() => {
82
- if (domRef.current) {
83
- parent.current = domRef.current.parentElement as HTMLElement;
84
- }
85
- // eslint-disable-next-line react-hooks/exhaustive-deps
86
- }, [domRef.current]);
87
- useResizeObserver({ref: parent, onResize: checkForOverflow});
88
-
89
- return (
90
- <div
91
- {...filterDOMProps(otherProps)}
92
- {...styleProps}
93
- ref={domRef}
94
- className={
95
- classNames(
96
- styles,
97
- 'spectrum-ButtonGroup',
98
- {
99
- 'spectrum-ButtonGroup--vertical': orientation === 'vertical' || hasOverflow,
100
- 'spectrum-ButtonGroup--alignEnd': align === 'end',
101
- 'spectrum-ButtonGroup--alignCenter': align === 'center'
102
- },
103
- styleProps.className
104
- )
105
- }>
106
- <SlotProvider
107
- slots={{
108
- button: {
109
- UNSAFE_className: classNames(styles, 'spectrum-ButtonGroup-Button')
110
- }
111
- }}>
112
- <Provider isDisabled={isDisabled}>
113
- {children}
114
- </Provider>
115
- </SlotProvider>
116
- </div>
117
- );
118
- });