@react-spectrum/layout 3.0.0-alpha.1 → 3.0.0-nightly-641446f65-240905

package/dist/Grid.module.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;AAAA;;;;;;;;;;CAUC;;;AAeD,MAAM,uCAAgC;IACpC,GAAG,CAAA,GAAA,qBAAa,CAAC;IACjB,UAAU;QAAC;QAAgB,CAAA,GAAA,uBAAe;KAAE;IAC5C,aAAa;QAAC;QAAmB;KAAmB;IACpD,UAAU;QAAC;QAAgB;KAAmB;IAC9C,OAAO;QAAC;QAAqB;KAAuB;IACpD,SAAS;QAAC;QAAuB;KAAkB;IACnD,MAAM;QAAC;QAAoB;KAAkB;IAC7C,KAAK;QAAC;QAAO,CAAA,GAAA,qBAAa;KAAE;IAC5B,QAAQ;QAAC;QAAU,CAAA,GAAA,qBAAa;KAAE;IAClC,WAAW;QAAC;QAAa,CAAA,GAAA,qBAAa;KAAE;IACxC,cAAc;QAAC;QAAgB,CAAA,GAAA,uBAAe;KAAE;IAChD,gBAAgB;QAAC;QAAkB,CAAA,GAAA,uBAAe;KAAE;IACpD,YAAY;QAAC;QAAc,CAAA,GAAA,uBAAe;KAAE;IAC5C,cAAc;QAAC;QAAgB,CAAA,GAAA,uBAAe;KAAE;AAClD;AAEA,SAAS,2BAAK,KAAgB,EAAE,GAA2B;IACzD,IAAI,YACF,QAAQ,EACR,GAAG,YACJ,GAAG;IACJ,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,oBAAY,EAAE,YAAY;IAC7C,WAAW,KAAK,CAAC,OAAO,GAAG,QAAQ,eAAe;IAClD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gCAAC;QAAK,GAAG,CAAA,GAAA,qBAAa,EAAE,WAAW;QAAG,GAAG,UAAU;QAAE,KAAK;OACvD;AAGP;AAQO,SAAS,0CAAO,KAAwC,EAAE,MAAyC;IACxG,OAAO,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE,wCAAkB,QAAQ,CAAC,CAAC;AACzD;AAQO,SAAS,0CAAO,GAAmB,EAAE,GAAmB;IAC7D,OAAO,CAAC,OAAO,EAAE,yCAAmB,KAAK,EAAE,EAAE,yCAAmB,KAAK,CAAC,CAAC;AACzE;AAOO,SAAS,0CAAW,SAAyB;IAClD,OAAO,CAAC,YAAY,EAAE,yCAAmB,WAAW,CAAC,CAAC;AACxD;AAEA,SAAS,6CAAuB,KAAK;IACnC,OAAO,MAAM,GAAG,CAAC,CAAA,IAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,IAAI,CAAC;AACvC;AAEA,SAAS,yCAAmB,KAAK;IAC/B,IAAI,kEAAkE,IAAI,CAAC,QACzE,OAAO;IAGT,OAAO,CAAA,GAAA,qBAAa,EAAE;AACxB;AAEA,SAAS,wCAAkB,KAAK;IAC9B,IAAI,MAAM,OAAO,CAAC,QAChB,OAAO,MAAM,GAAG,CAAC,0CAAoB,IAAI,CAAC;IAG5C,OAAO,yCAAmB;AAC5B;AAEA;;;CAGC,GACD,MAAM,0DAAQ,CAAA,GAAA,iBAAS,EAAE","sources":["packages/@react-spectrum/layout/src/Grid.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  baseStyleProps,\n  dimensionValue,\n  passthroughStyle,\n  StyleHandlers,\n  useDOMRef,\n  useStyleProps\n} from '@react-spectrum/utils';\nimport {DimensionValue, DOMRef} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {GridProps} from '@react-types/layout';\nimport React, {forwardRef} from 'react';\n\nconst gridStyleProps: StyleHandlers = {\n  ...baseStyleProps,\n  autoFlow: ['gridAutoFlow', passthroughStyle],\n  autoColumns: ['gridAutoColumns', gridDimensionValue],\n  autoRows: ['gridAutoRows', gridDimensionValue],\n  areas: ['gridTemplateAreas', gridTemplateAreasValue],\n  columns: ['gridTemplateColumns', gridTemplateValue],\n  rows: ['gridTemplateRows', gridTemplateValue],\n  gap: ['gap', dimensionValue],\n  rowGap: ['rowGap', dimensionValue],\n  columnGap: ['columnGap', dimensionValue],\n  justifyItems: ['justifyItems', passthroughStyle],\n  justifyContent: ['justifyContent', passthroughStyle],\n  alignItems: ['alignItems', passthroughStyle],\n  alignContent: ['alignContent', passthroughStyle]\n};\n\nfunction Grid(props: GridProps, ref: DOMRef<HTMLDivElement>) {\n  let {\n    children,\n    ...otherProps\n  } = props;\n  let {styleProps} = useStyleProps(otherProps, gridStyleProps);\n  styleProps.style.display = 'grid'; // inline-grid?\n  let domRef = useDOMRef(ref);\n\n  return (\n    <div {...filterDOMProps(otherProps)} {...styleProps} ref={domRef}>\n      {children}\n    </div>\n  );\n}\n\n/**\n * Can be used to make a repeating fragment of the columns or rows list.\n * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/repeat).\n * @param count - The number of times to repeat the fragment.\n * @param repeat - The fragment to repeat.\n */\nexport function repeat(count: number | 'auto-fill' | 'auto-fit', repeat: DimensionValue | DimensionValue[]): string {\n  return `repeat(${count}, ${gridTemplateValue(repeat)})`;\n}\n\n/**\n * Defines a size range greater than or equal to min and less than or equal to max.\n * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/minmax).\n * @param min - The minimum size.\n * @param max - The maximum size.\n */\nexport function minmax(min: DimensionValue, max: DimensionValue): string {\n  return `minmax(${gridDimensionValue(min)}, ${gridDimensionValue(max)})`;\n}\n\n/**\n * Clamps a given size to an available size.\n * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content).\n * @param dimension - The size to clamp.\n */\nexport function fitContent(dimension: DimensionValue): string {\n  return `fit-content(${gridDimensionValue(dimension)})`;\n}\n\nfunction gridTemplateAreasValue(value) {\n  return value.map(v => `\"${v}\"`).join('\\n');\n}\n\nfunction gridDimensionValue(value) {\n  if (/^max-content|min-content|minmax|auto|fit-content|repeat|subgrid/.test(value)) {\n    return value;\n  }\n\n  return dimensionValue(value);\n}\n\nfunction gridTemplateValue(value) {\n  if (Array.isArray(value)) {\n    return value.map(gridDimensionValue).join(' ');\n  }\n\n  return gridDimensionValue(value);\n}\n\n/**\n * A layout container using CSS grid. Supports Spectrum dimensions as values to\n * ensure consistent and adaptive sizing and spacing.\n */\nconst _Grid = forwardRef(Grid);\nexport {_Grid as Grid};\n"],"names":[],"version":3,"file":"Grid.module.js.map"}

package/dist/flex-gap.27391a03.css

@@ -0,0 +1,17 @@
+.NW91UW_flex-container, .NW91UW_flex {
+  display: flex;
+}
+
+.NW91UW_flex-gap {
+  --gap: 0px;
+  --column-gap: var(--gap);
+  --row-gap: var(--gap);
+  margin: calc(var(--row-gap) / -2) calc(var(--column-gap) / -2);
+  width: calc(100% + calc(var(--column-gap)  + 1px));
+  height: calc(100% + var(--row-gap));
+}
+
+.NW91UW_flex-container .NW91UW_flex-gap > * {
+  margin: calc(var(--row-gap) / 2) calc(var(--column-gap) / 2);
+}
+/*# sourceMappingURL=flex-gap.27391a03.css.map */

package/dist/flex-gap.27391a03.css.map

@@ -0,0 +1 @@
+{"mappings":"AAYA;;;;AASA;;;;;;;;;AAmBA","sources":["packages/@react-spectrum/layout/src/flex-gap.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.flex-container {\n  /* this is necessary so that the inner margins don't affect anything outside */\n  display: flex;\n}\n\n.flex {\n  display: flex;\n}\n\n.flex-gap {\n  --gap: 0px;\n  --column-gap: var(--gap);\n  --row-gap: var(--gap);\n\n  /* apply a negative margin to counteract the margin on each item at the edges */\n  margin: calc(var(--row-gap) / -2) calc(var(--column-gap) / -2);\n\n  /* increase the width and height to account for this margin */\n  /* Add 1px to fix rounding error in Safari (╯°□°)╯︵ ┻━┻ */\n  width: calc(100% + calc(var(--column-gap) + 1px));\n  height: calc(100% + var(--row-gap));\n}\n\n/* If the selector was .flex-gap > *, it wouldn't override when components have a margin 0 specified by a single\n * class selector, specificity is equal. Both are one class. Neither > nor * contribute to specificity.\n * We need to make it more specific, so we raise it by 1 class.\n */\n.flex-container .flex-gap > * {\n  /* apply half of the gap to each side of every item */\n  margin: calc(var(--row-gap) / 2) calc(var(--column-gap) / 2);\n}\n"],"names":[],"version":3,"file":"flex-gap.27391a03.css.map"}

package/dist/flex-gap_css.main.js

@@ -0,0 +1,17 @@
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+
+$parcel$export(module.exports, "flex", () => $12be0ef8be5abc46$export$97691fbb80847c19, (v) => $12be0ef8be5abc46$export$97691fbb80847c19 = v);
+$parcel$export(module.exports, "flex-container", () => $12be0ef8be5abc46$export$69d7a39fa31a000b, (v) => $12be0ef8be5abc46$export$69d7a39fa31a000b = v);
+$parcel$export(module.exports, "flex-gap", () => $12be0ef8be5abc46$export$31a9da8b58047a44, (v) => $12be0ef8be5abc46$export$31a9da8b58047a44 = v);
+var $12be0ef8be5abc46$export$97691fbb80847c19;
+var $12be0ef8be5abc46$export$69d7a39fa31a000b;
+var $12be0ef8be5abc46$export$31a9da8b58047a44;
+$12be0ef8be5abc46$export$97691fbb80847c19 = `NW91UW_flex`;
+$12be0ef8be5abc46$export$69d7a39fa31a000b = `NW91UW_flex-container`;
+$12be0ef8be5abc46$export$31a9da8b58047a44 = `NW91UW_flex-gap`;
+
+
+//# sourceMappingURL=flex-gap_css.main.js.map

package/dist/flex-gap_css.main.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;AAAA,IAAA;AACA,IAAA;AACA,IAAA;AAFA,4CAAyB,CAAC,WAAW,CAAC;AACtC,4CAAmC,CAAC,qBAAqB,CAAC;AAC1D,4CAA6B,CAAC,eAAe,CAAC","sources":["packages/@react-spectrum/layout/src/flex-gap.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.flex-container {\n  /* this is necessary so that the inner margins don't affect anything outside */\n  display: flex;\n}\n\n.flex {\n  display: flex;\n}\n\n.flex-gap {\n  --gap: 0px;\n  --column-gap: var(--gap);\n  --row-gap: var(--gap);\n\n  /* apply a negative margin to counteract the margin on each item at the edges */\n  margin: calc(var(--row-gap) / -2) calc(var(--column-gap) / -2);\n\n  /* increase the width and height to account for this margin */\n  /* Add 1px to fix rounding error in Safari (╯°□°)╯︵ ┻━┻ */\n  width: calc(100% + calc(var(--column-gap) + 1px));\n  height: calc(100% + var(--row-gap));\n}\n\n/* If the selector was .flex-gap > *, it wouldn't override when components have a margin 0 specified by a single\n * class selector, specificity is equal. Both are one class. Neither > nor * contribute to specificity.\n * We need to make it more specific, so we raise it by 1 class.\n */\n.flex-container .flex-gap > * {\n  /* apply half of the gap to each side of every item */\n  margin: calc(var(--row-gap) / 2) calc(var(--column-gap) / 2);\n}\n"],"names":[],"version":3,"file":"flex-gap_css.main.js.map"}

package/dist/flex-gap_css.mjs

@@ -0,0 +1,19 @@
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+var $01dd1839b5376a46$exports = {};
+
+$parcel$export($01dd1839b5376a46$exports, "flex", () => $01dd1839b5376a46$export$97691fbb80847c19, (v) => $01dd1839b5376a46$export$97691fbb80847c19 = v);
+$parcel$export($01dd1839b5376a46$exports, "flex-container", () => $01dd1839b5376a46$export$69d7a39fa31a000b, (v) => $01dd1839b5376a46$export$69d7a39fa31a000b = v);
+$parcel$export($01dd1839b5376a46$exports, "flex-gap", () => $01dd1839b5376a46$export$31a9da8b58047a44, (v) => $01dd1839b5376a46$export$31a9da8b58047a44 = v);
+var $01dd1839b5376a46$export$97691fbb80847c19;
+var $01dd1839b5376a46$export$69d7a39fa31a000b;
+var $01dd1839b5376a46$export$31a9da8b58047a44;
+$01dd1839b5376a46$export$97691fbb80847c19 = `NW91UW_flex`;
+$01dd1839b5376a46$export$69d7a39fa31a000b = `NW91UW_flex-container`;
+$01dd1839b5376a46$export$31a9da8b58047a44 = `NW91UW_flex-gap`;
+
+
+export {$01dd1839b5376a46$exports as default};
+//# sourceMappingURL=flex-gap_css.module.js.map

package/dist/flex-gap_css.module.js

@@ -0,0 +1,19 @@
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+var $01dd1839b5376a46$exports = {};
+
+$parcel$export($01dd1839b5376a46$exports, "flex", () => $01dd1839b5376a46$export$97691fbb80847c19, (v) => $01dd1839b5376a46$export$97691fbb80847c19 = v);
+$parcel$export($01dd1839b5376a46$exports, "flex-container", () => $01dd1839b5376a46$export$69d7a39fa31a000b, (v) => $01dd1839b5376a46$export$69d7a39fa31a000b = v);
+$parcel$export($01dd1839b5376a46$exports, "flex-gap", () => $01dd1839b5376a46$export$31a9da8b58047a44, (v) => $01dd1839b5376a46$export$31a9da8b58047a44 = v);
+var $01dd1839b5376a46$export$97691fbb80847c19;
+var $01dd1839b5376a46$export$69d7a39fa31a000b;
+var $01dd1839b5376a46$export$31a9da8b58047a44;
+$01dd1839b5376a46$export$97691fbb80847c19 = `NW91UW_flex`;
+$01dd1839b5376a46$export$69d7a39fa31a000b = `NW91UW_flex-container`;
+$01dd1839b5376a46$export$31a9da8b58047a44 = `NW91UW_flex-gap`;
+
+
+export {$01dd1839b5376a46$exports as default};
+//# sourceMappingURL=flex-gap_css.module.js.map

package/dist/flex-gap_css.module.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;AAAA,IAAA;AACA,IAAA;AACA,IAAA;AAFA,4CAAyB,CAAC,WAAW,CAAC;AACtC,4CAAmC,CAAC,qBAAqB,CAAC;AAC1D,4CAA6B,CAAC,eAAe,CAAC","sources":["packages/@react-spectrum/layout/src/flex-gap.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.flex-container {\n  /* this is necessary so that the inner margins don't affect anything outside */\n  display: flex;\n}\n\n.flex {\n  display: flex;\n}\n\n.flex-gap {\n  --gap: 0px;\n  --column-gap: var(--gap);\n  --row-gap: var(--gap);\n\n  /* apply a negative margin to counteract the margin on each item at the edges */\n  margin: calc(var(--row-gap) / -2) calc(var(--column-gap) / -2);\n\n  /* increase the width and height to account for this margin */\n  /* Add 1px to fix rounding error in Safari (╯°□°)╯︵ ┻━┻ */\n  width: calc(100% + calc(var(--column-gap) + 1px));\n  height: calc(100% + var(--row-gap));\n}\n\n/* If the selector was .flex-gap > *, it wouldn't override when components have a margin 0 specified by a single\n * class selector, specificity is equal. Both are one class. Neither > nor * contribute to specificity.\n * We need to make it more specific, so we raise it by 1 class.\n */\n.flex-container .flex-gap > * {\n  /* apply half of the gap to each side of every item */\n  margin: calc(var(--row-gap) / 2) calc(var(--column-gap) / 2);\n}\n"],"names":[],"version":3,"file":"flex-gap_css.module.js.map"}

package/dist/import.mjs

@@ -0,0 +1,20 @@
+import {fitContent as $994c48bfb00b620b$export$2f0b47b0911ce698, Grid as $994c48bfb00b620b$export$ef2184bd89960b14, minmax as $994c48bfb00b620b$export$9c1b655deaca4988, repeat as $994c48bfb00b620b$export$76d90c956114f2c2} from "./Grid.mjs";
+import {Flex as $884c64d19340d345$export$f51f4c4ede09e011} from "./Flex.mjs";
+
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ /// <reference types="css-module-types" />
+
+
+
+
+export {$994c48bfb00b620b$export$76d90c956114f2c2 as repeat, $994c48bfb00b620b$export$9c1b655deaca4988 as minmax, $994c48bfb00b620b$export$2f0b47b0911ce698 as fitContent, $994c48bfb00b620b$export$ef2184bd89960b14 as Grid, $884c64d19340d345$export$f51f4c4ede09e011 as Flex};
+//# sourceMappingURL=module.js.map

package/dist/main.js

@@ -1,59 +1,29 @@
-var _babelRuntimeHelpersExtends = $parcel$interopDefault(require("@babel/runtime/helpers/extends"));
+var $65aafe8662d00781$exports = require("./Grid.main.js");
+var $a2ef5497697e8437$exports = require("./Flex.main.js");
 
-var _babelRuntimeHelpersObjectWithoutProperties = $parcel$interopDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
-var _temp = require("@react-spectrum/utils");
-
-var filterDOMProps = _temp.filterDOMProps;
-var gridStyleProps = _temp.gridStyleProps;
-var useDOMRef = _temp.useDOMRef;
-var useStyleProps = _temp.useStyleProps;
-var flexStyleProps = _temp.flexStyleProps;
-
-var _react2 = require("react");
-
-var _react = $parcel$interopDefault(_react2);
-
-var forwardRef = _react2.forwardRef;
-
-function $parcel$interopDefault(a) {
-  return a && a.__esModule ? a.default : a;
-}
-
-function $bd62d28075b6b841c88fe57de44bdc3$var$Grid(props, ref) {
-  var children = props.children,
-      otherProps = _babelRuntimeHelpersObjectWithoutProperties(props, ["children"]);
-
-  var _useStyleProps = useStyleProps(otherProps, gridStyleProps),
-      styleProps = _useStyleProps.styleProps;
-
-  styleProps.style.display = 'grid'; // inline-grid?
-
-  var domRef = useDOMRef(ref);
-  return (/*#__PURE__*/_react.createElement("div", _babelRuntimeHelpersExtends({}, filterDOMProps(otherProps), styleProps, {
-      ref: domRef
-    }), children)
-  );
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
 
-var Grid = forwardRef($bd62d28075b6b841c88fe57de44bdc3$var$Grid);
-exports.Grid = Grid;
-
-function $ead627e26ff771b74d9888896ccfad$var$Flex(props, ref) {
-  var children = props.children,
-      otherProps = _babelRuntimeHelpersObjectWithoutProperties(props, ["children"]);
+$parcel$export(module.exports, "repeat", () => $65aafe8662d00781$exports.repeat);
+$parcel$export(module.exports, "minmax", () => $65aafe8662d00781$exports.minmax);
+$parcel$export(module.exports, "fitContent", () => $65aafe8662d00781$exports.fitContent);
+$parcel$export(module.exports, "Grid", () => $65aafe8662d00781$exports.Grid);
+$parcel$export(module.exports, "Flex", () => $a2ef5497697e8437$exports.Flex);
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ /// <reference types="css-module-types" />
 
-  var _useStyleProps = useStyleProps(otherProps, flexStyleProps),
-      styleProps = _useStyleProps.styleProps;
 
-  styleProps.style.display = 'flex'; // inline-flex?
 
-  var domRef = useDOMRef(ref);
-  return (/*#__PURE__*/_react.createElement("div", _babelRuntimeHelpersExtends({}, filterDOMProps(otherProps), styleProps, {
-      ref: domRef
-    }), children)
-  );
-}
 
-var Flex = forwardRef($ead627e26ff771b74d9888896ccfad$var$Flex);
-exports.Flex = Flex;
+//# sourceMappingURL=main.js.map

package/dist/main.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC,GAED,0CAA0C","sources":["packages/@react-spectrum/layout/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\n/// <reference types=\"css-module-types\" />\n\nexport {repeat, minmax, fitContent, Grid} from './Grid';\nexport {Flex} from './Flex';\nexport type {DimensionValue} from '@react-types/shared';\nexport type {FlexProps, GridProps} from '@react-types/layout';\n"],"names":[],"version":3,"file":"main.js.map"}

package/dist/module.js

@@ -1,44 +1,20 @@
-import _babelRuntimeHelpersEsmExtends from "@babel/runtime/helpers/esm/extends";
-import _babelRuntimeHelpersEsmObjectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import { filterDOMProps, gridStyleProps, useDOMRef, useStyleProps, flexStyleProps } from "@react-spectrum/utils";
-import _react, { forwardRef } from "react";
+import {fitContent as $994c48bfb00b620b$export$2f0b47b0911ce698, Grid as $994c48bfb00b620b$export$ef2184bd89960b14, minmax as $994c48bfb00b620b$export$9c1b655deaca4988, repeat as $994c48bfb00b620b$export$76d90c956114f2c2} from "./Grid.module.js";
+import {Flex as $884c64d19340d345$export$f51f4c4ede09e011} from "./Flex.module.js";
 
-function $d99f94699068126d2406add01649cb90$var$Grid(props, ref) {
-  let {
-    children
-  } = props,
-      otherProps = _babelRuntimeHelpersEsmObjectWithoutProperties(props, ["children"]);
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ /// <reference types="css-module-types" />
 
-  let {
-    styleProps
-  } = useStyleProps(otherProps, gridStyleProps);
-  styleProps.style.display = 'grid'; // inline-grid?
 
-  let domRef = useDOMRef(ref);
-  return (/*#__PURE__*/_react.createElement("div", _babelRuntimeHelpersEsmExtends({}, filterDOMProps(otherProps), styleProps, {
-      ref: domRef
-    }), children)
-  );
-}
 
-export const Grid = forwardRef($d99f94699068126d2406add01649cb90$var$Grid);
 
-function $d35d5a99ecac3fe7880f5be28ee4e7$var$Flex(props, ref) {
-  let {
-    children
-  } = props,
-      otherProps = _babelRuntimeHelpersEsmObjectWithoutProperties(props, ["children"]);
-
-  let {
-    styleProps
-  } = useStyleProps(otherProps, flexStyleProps);
-  styleProps.style.display = 'flex'; // inline-flex?
-
-  let domRef = useDOMRef(ref);
-  return (/*#__PURE__*/_react.createElement("div", _babelRuntimeHelpersEsmExtends({}, filterDOMProps(otherProps), styleProps, {
-      ref: domRef
-    }), children)
-  );
-}
-
-export const Flex = forwardRef($d35d5a99ecac3fe7880f5be28ee4e7$var$Flex);
+export {$994c48bfb00b620b$export$76d90c956114f2c2 as repeat, $994c48bfb00b620b$export$9c1b655deaca4988 as minmax, $994c48bfb00b620b$export$2f0b47b0911ce698 as fitContent, $994c48bfb00b620b$export$ef2184bd89960b14 as Grid, $884c64d19340d345$export$f51f4c4ede09e011 as Flex};
+//# sourceMappingURL=module.js.map

package/dist/module.js.map

@@ -0,0 +1 @@
+{"mappings":";;;AAAA;;;;;;;;;;CAUC,GAED,0CAA0C","sources":["packages/@react-spectrum/layout/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\n/// <reference types=\"css-module-types\" />\n\nexport {repeat, minmax, fitContent, Grid} from './Grid';\nexport {Flex} from './Flex';\nexport type {DimensionValue} from '@react-types/shared';\nexport type {FlexProps, GridProps} from '@react-types/layout';\n"],"names":[],"version":3,"file":"module.js.map"}

package/dist/types.d.ts

@@ -1,5 +1,37 @@
+import { DimensionValue, DOMRefValue } from "@react-types/shared";
 import { GridProps, FlexProps } from "@react-types/layout";
-export const Grid: React.ForwardRefExoticComponent<GridProps & React.RefAttributes<import("@react-types/shared").DOMRefValue<HTMLDivElement>>>;
-export const Flex: React.ForwardRefExoticComponent<FlexProps & React.RefAttributes<import("@react-types/shared").DOMRefValue<HTMLDivElement>>>;
+import React from "react";
+/**
+ * Can be used to make a repeating fragment of the columns or rows list.
+ * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/repeat).
+ * @param count - The number of times to repeat the fragment.
+ * @param repeat - The fragment to repeat.
+ */
+export function repeat(count: number | 'auto-fill' | 'auto-fit', repeat: DimensionValue | DimensionValue[]): string;
+/**
+ * Defines a size range greater than or equal to min and less than or equal to max.
+ * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/minmax).
+ * @param min - The minimum size.
+ * @param max - The maximum size.
+ */
+export function minmax(min: DimensionValue, max: DimensionValue): string;
+/**
+ * Clamps a given size to an available size.
+ * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content).
+ * @param dimension - The size to clamp.
+ */
+export function fitContent(dimension: DimensionValue): string;
+/**
+ * A layout container using CSS grid. Supports Spectrum dimensions as values to
+ * ensure consistent and adaptive sizing and spacing.
+ */
+export const Grid: React.ForwardRefExoticComponent<GridProps & React.RefAttributes<DOMRefValue<HTMLDivElement>>>;
+/**
+ * A layout container using flexbox. Provides Spectrum dimension values, and supports the gap
+ * property to define consistent spacing between items.
+ */
+export const Flex: React.ForwardRefExoticComponent<FlexProps & React.RefAttributes<DOMRefValue<HTMLDivElement>>>;
+export type { DimensionValue } from '@react-types/shared';
+export type { FlexProps, GridProps } from '@react-types/layout';
 
 //# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["/Users/govett/dev/react-spectrum/packages/@react-spectrum/layout/src/packages/@react-spectrum/layout/src/Grid.tsx","/Users/govett/dev/react-spectrum/packages/@react-spectrum/layout/src/packages/@react-spectrum/layout/src/Flex.tsx"],"names":[],"mappings":";AAsCA,OAAA,MAAM,iIAAwB,CAAC;ACL/B,OAAA,MAAM,iIAAwB,CAAC","file":"types.d.ts.map"}
+{"mappings":";;;AA0DA;;;;;GAKG;AACH,uBAAuB,KAAK,EAAE,MAAM,GAAG,WAAW,GAAG,UAAU,EAAE,QAAQ,cAAc,GAAG,cAAc,EAAE,GAAG,MAAM,CAElH;AAED;;;;;GAKG;AACH,uBAAuB,GAAG,EAAE,cAAc,EAAE,GAAG,EAAE,cAAc,GAAG,MAAM,CAEvE;AAED;;;;GAIG;AACH,2BAA2B,SAAS,EAAE,cAAc,GAAG,MAAM,CAE5D;AAsBD;;;GAGG;AACH,OAAA,MAAM,mGAAwB,CAAC;ACtB/B;;;GAGG;AACH,OAAA,MAAM,mGAAwB,CAAC;AC7E/B,YAAY,EAAC,cAAc,EAAC,MAAM,qBAAqB,CAAC;AACxD,YAAY,EAAC,SAAS,EAAE,SAAS,EAAC,MAAM,qBAAqB,CAAC","sources":["packages/@react-spectrum/layout/src/packages/@react-spectrum/layout/src/Grid.tsx","packages/@react-spectrum/layout/src/packages/@react-spectrum/layout/src/Flex.tsx","packages/@react-spectrum/layout/src/packages/@react-spectrum/layout/src/index.ts","packages/@react-spectrum/layout/src/index.ts"],"sourcesContent":[null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {repeat, minmax, fitContent, Grid} from './Grid';\nexport {Flex} from './Flex';\nexport type {DimensionValue} from '@react-types/shared';\nexport type {FlexProps, GridProps} from '@react-types/layout';\n"],"names":[],"version":3,"file":"types.d.ts.map"}

package/package.json

@@ -1,16 +1,24 @@
 {
   "name": "@react-spectrum/layout",
-  "version": "3.0.0-alpha.1",
+  "version": "3.0.0-nightly-641446f65-240905",
   "description": "Spectrum UI components in React",
   "license": "Apache-2.0",
   "main": "dist/main.js",
   "module": "dist/module.js",
+  "exports": {
+    "types": "./dist/types.d.ts",
+    "import": "./dist/import.mjs",
+    "require": "./dist/main.js"
+  },
   "types": "dist/types.d.ts",
   "source": "src/index.ts",
   "files": [
-    "dist"
+    "dist",
+    "src"
+  ],
+  "sideEffects": [
+    "*.css"
   ],
-  "sideEffects": false,
   "targets": {
     "main": {
       "includeNodeModules": [
@@ -25,24 +33,24 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/adobe-private/react-spectrum-v3"
+    "url": "https://github.com/adobe/react-spectrum"
   },
   "dependencies": {
-    "@babel/runtime": "^7.6.2",
-    "@react-aria/utils": "^3.0.0-rc.2",
-    "@react-spectrum/utils": "^3.0.0-rc.2",
-    "@react-types/layout": "^3.0.0-alpha.1",
-    "classnames": "^2.2.6"
+    "@react-aria/utils": "^3.0.0-nightly-641446f65-240905",
+    "@react-spectrum/utils": "^3.0.0-nightly-641446f65-240905",
+    "@react-types/layout": "^3.0.0-nightly-641446f65-240905",
+    "@react-types/shared": "^3.0.0-nightly-641446f65-240905",
+    "@swc/helpers": "^0.5.0"
   },
   "devDependencies": {
-    "@adobe/spectrum-css-temp": "^3.0.0-alpha.1"
+    "@adobe/spectrum-css-temp": "3.0.0-alpha.1"
   },
   "peerDependencies": {
-    "@react-spectrum/provider": "^3.0.0-rc.1",
-    "react": "^16.8.0"
+    "@react-spectrum/provider": "^3.0.0-nightly-641446f65-240905",
+    "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "207e6ee9076905c96638a7f81a367758872e1410"
-}
+  "stableVersion": "3.6.8"
+}

package/src/Flex.tsx

@@ -0,0 +1,95 @@
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+import {classNames, passthroughStyle, responsiveDimensionValue, StyleHandlers, useBreakpoint, useDOMRef, useStyleProps} from '@react-spectrum/utils';
+import {DOMRef} from '@react-types/shared';
+import {filterDOMProps} from '@react-aria/utils';
+import {FlexProps} from '@react-types/layout';
+import React, {forwardRef} from 'react';
+import styles from './flex-gap.css';
+
+const flexStyleProps: StyleHandlers = {
+  direction: ['flexDirection', passthroughStyle],
+  wrap: ['flexWrap', flexWrapValue],
+  justifyContent: ['justifyContent', flexAlignValue],
+  alignItems: ['alignItems', flexAlignValue],
+  alignContent: ['alignContent', flexAlignValue]
+};
+
+function Flex(props: FlexProps, ref: DOMRef<HTMLDivElement>) {
+  let {
+    children,
+    ...otherProps
+  } = props;
+  let breakpointProvider = useBreakpoint();
+  let matchedBreakpoints = breakpointProvider?.matchedBreakpoints || ['base'];
+  let {styleProps} = useStyleProps(otherProps);
+  let {styleProps: flexStyle} = useStyleProps(otherProps, flexStyleProps);
+  let domRef = useDOMRef(ref);
+
+  let style = {
+    ...styleProps.style,
+    ...flexStyle.style
+  };
+
+  if (props.gap != null) {
+    style.gap = responsiveDimensionValue(props.gap, matchedBreakpoints);
+  }
+
+  if (props.columnGap != null) {
+    style.columnGap = responsiveDimensionValue(props.columnGap, matchedBreakpoints);
+  }
+
+  if (props.rowGap != null) {
+    style.rowGap = responsiveDimensionValue(props.rowGap, matchedBreakpoints);
+  }
+
+  return (
+    <div {...filterDOMProps(otherProps)} className={classNames(styles, 'flex', styleProps.className)} style={style} ref={domRef}>
+      {children}
+    </div>
+  );
+}
+
+/**
+ * Normalize 'start' and 'end' alignment values to 'flex-start' and 'flex-end'
+ * in flex containers for browser compatibility.
+ */
+function flexAlignValue(value) {
+  if (value === 'start') {
+    return 'flex-start';
+  }
+
+  if (value === 'end') {
+    return 'flex-end';
+  }
+
+  return value;
+}
+
+/**
+ * Takes a boolean and translates it to flex wrap or nowrap.
+ */
+function flexWrapValue(value) {
+  if (typeof value === 'boolean') {
+    return value ? 'wrap' : 'nowrap';
+  }
+
+  return value;
+}
+
+/**
+ * A layout container using flexbox. Provides Spectrum dimension values, and supports the gap
+ * property to define consistent spacing between items.
+ */
+const _Flex = forwardRef(Flex);
+export {_Flex as Flex};

package/src/Grid.tsx

@@ -0,0 +1,113 @@
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+import {
+  baseStyleProps,
+  dimensionValue,
+  passthroughStyle,
+  StyleHandlers,
+  useDOMRef,
+  useStyleProps
+} from '@react-spectrum/utils';
+import {DimensionValue, DOMRef} from '@react-types/shared';
+import {filterDOMProps} from '@react-aria/utils';
+import {GridProps} from '@react-types/layout';
+import React, {forwardRef} from 'react';
+
+const gridStyleProps: StyleHandlers = {
+  ...baseStyleProps,
+  autoFlow: ['gridAutoFlow', passthroughStyle],
+  autoColumns: ['gridAutoColumns', gridDimensionValue],
+  autoRows: ['gridAutoRows', gridDimensionValue],
+  areas: ['gridTemplateAreas', gridTemplateAreasValue],
+  columns: ['gridTemplateColumns', gridTemplateValue],
+  rows: ['gridTemplateRows', gridTemplateValue],
+  gap: ['gap', dimensionValue],
+  rowGap: ['rowGap', dimensionValue],
+  columnGap: ['columnGap', dimensionValue],
+  justifyItems: ['justifyItems', passthroughStyle],
+  justifyContent: ['justifyContent', passthroughStyle],
+  alignItems: ['alignItems', passthroughStyle],
+  alignContent: ['alignContent', passthroughStyle]
+};
+
+function Grid(props: GridProps, ref: DOMRef<HTMLDivElement>) {
+  let {
+    children,
+    ...otherProps
+  } = props;
+  let {styleProps} = useStyleProps(otherProps, gridStyleProps);
+  styleProps.style.display = 'grid'; // inline-grid?
+  let domRef = useDOMRef(ref);
+
+  return (
+    <div {...filterDOMProps(otherProps)} {...styleProps} ref={domRef}>
+      {children}
+    </div>
+  );
+}
+
+/**
+ * Can be used to make a repeating fragment of the columns or rows list.
+ * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/repeat).
+ * @param count - The number of times to repeat the fragment.
+ * @param repeat - The fragment to repeat.
+ */
+export function repeat(count: number | 'auto-fill' | 'auto-fit', repeat: DimensionValue | DimensionValue[]): string {
+  return `repeat(${count}, ${gridTemplateValue(repeat)})`;
+}
+
+/**
+ * Defines a size range greater than or equal to min and less than or equal to max.
+ * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/minmax).
+ * @param min - The minimum size.
+ * @param max - The maximum size.
+ */
+export function minmax(min: DimensionValue, max: DimensionValue): string {
+  return `minmax(${gridDimensionValue(min)}, ${gridDimensionValue(max)})`;
+}
+
+/**
+ * Clamps a given size to an available size.
+ * See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content).
+ * @param dimension - The size to clamp.
+ */
+export function fitContent(dimension: DimensionValue): string {
+  return `fit-content(${gridDimensionValue(dimension)})`;
+}
+
+function gridTemplateAreasValue(value) {
+  return value.map(v => `"${v}"`).join('\n');
+}
+
+function gridDimensionValue(value) {
+  if (/^max-content|min-content|minmax|auto|fit-content|repeat|subgrid/.test(value)) {
+    return value;
+  }
+
+  return dimensionValue(value);
+}
+
+function gridTemplateValue(value) {
+  if (Array.isArray(value)) {
+    return value.map(gridDimensionValue).join(' ');
+  }
+
+  return gridDimensionValue(value);
+}
+
+/**
+ * A layout container using CSS grid. Supports Spectrum dimensions as values to
+ * ensure consistent and adaptive sizing and spacing.
+ */
+const _Grid = forwardRef(Grid);
+export {_Grid as Grid};