@react-spectrum/s2 0.2.1-nightly.4979

package/dist/RadioGroup.mjs

@@ -0,0 +1,163 @@
+import "./RadioGroup.css";
+import {FieldLabel as $9afd80978c252040$export$1acdcf5a973a8414, HelpText as $9afd80978c252040$export$a67c0bc59081311a} from "./Field.mjs";
+import {FormContext as $9b916426527cebe7$export$c24727297075ec6a, useFormProps as $9b916426527cebe7$export$a6b5be5c6b451665} from "./Form.mjs";
+import {jsx as $fZVHt$jsx, jsxs as $fZVHt$jsxs, Fragment as $fZVHt$Fragment} from "react/jsx-runtime";
+import {RadioGroup as $fZVHt$RadioGroup} from "react-aria-components";
+import {useContext as $fZVHt$useContext, forwardRef as $fZVHt$forwardRef} from "react";
+import {useDOMRef as $fZVHt$useDOMRef} from "@react-spectrum/utils";
+
+/*
+ * Copyright 2024 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.
+ */ 
+
+
+
+
+
+function $9a2afae66771094f$var$RadioGroup(props, ref) {
+    let formContext = (0, $fZVHt$useContext)((0, $9b916426527cebe7$export$c24727297075ec6a));
+    props = (0, $9b916426527cebe7$export$a6b5be5c6b451665)(props);
+    let domRef = (0, $fZVHt$useDOMRef)(ref);
+    let { label: label, description: description, errorMessage: errorMessage, children: children, isEmphasized: isEmphasized, labelPosition: labelPosition = 'top', labelAlign: labelAlign = 'start', necessityIndicator: necessityIndicator = 'icon', size: size = 'M', orientation: orientation = 'vertical', UNSAFE_className: UNSAFE_className = '', UNSAFE_style: UNSAFE_style, ...groupProps } = props;
+    return /*#__PURE__*/ (0, $fZVHt$jsx)((0, $fZVHt$RadioGroup), {
+        ...groupProps,
+        ref: domRef,
+        style: UNSAFE_style,
+        className: UNSAFE_className + function anonymous(props, overrides) {
+            let rules = " .";
+            let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|l|q|r|_9|_8|h|_5|_4|__A|__c|__d|__a|__b|U|__Q|X|Z|V|W)[^\s]+/g) || [];
+            rules += matches.join('');
+            let $__a = false;
+            let $__b = false;
+            for (let p of matches){
+                if (/^\s*__a/.test(p)) $__a = true;
+                if (/^\s*__b/.test(p)) $__b = true;
+            }
+            rules += ' _Zf';
+            if (!$__a) {
+                if (props.isInForm) rules += ' __a-3t1y';
+            }
+            if (!$__b) {
+                if (props.isInForm) {
+                    if (props.labelPosition === "side") rules += ' __b-7u9dhl';
+                }
+            }
+            if (props.isInForm) rules += ' __h-1cwd7ud';
+            else {
+                if (props.labelPosition === "side") rules += ' __h-jyg4vb';
+                else if (props.labelPosition === "top") rules += ' __h-375yi6';
+            }
+            if (props.labelPosition === "side") rules += ' __i-jyg4vb';
+            else if (props.labelPosition === "top") rules += ' __i-fdenls';
+            if (props.labelPosition === "side") rules += ' __j-5eez8j';
+            else if (props.labelPosition === "top") rules += ' __j-xlaqir';
+            if (props.size === "XL") {
+                rules += ' _dbj';
+                rules += ' _di';
+            } else if (props.size === "L") {
+                rules += ' _dbh';
+                rules += ' _dg';
+            } else if (props.size === "S") {
+                rules += ' _dbd';
+                rules += ' _dc';
+            } else if (props.size === "XS") {
+                rules += ' _dbb';
+                rules += ' _da';
+            } else {
+                rules += ' _dbf';
+                rules += ' _de';
+            }
+            rules += ' _1d';
+            rules += ' _f-1x99dlob';
+            rules += ' _fa';
+            if (props.size === "XL") {
+                rules += ' -aqrvqh_k-bw';
+                rules += ' -aqrvqh_k-v';
+            } else if (props.size === "L") {
+                rules += ' -aqrvqh_k-bs';
+                rules += ' -aqrvqh_k-p';
+            } else if (props.size === "S") {
+                rules += ' -aqrvqh_k-bl';
+                rules += ' -aqrvqh_k-k';
+            } else if (props.size === "XS") {
+                rules += ' -aqrvqh_k-bj';
+                rules += ' -aqrvqh_k-i';
+            } else {
+                rules += ' -aqrvqh_k-bp';
+                rules += ' -aqrvqh_k-o';
+            }
+            rules += ' -_1inj1bc_i--vfy389';
+            rules += ' jd';
+            rules += ' __R-yksgrp';
+            return rules;
+        }({
+            size: size,
+            labelPosition: labelPosition,
+            isInForm: !!formContext
+        }, props.styles),
+        children: ({ isDisabled: isDisabled, isInvalid: isInvalid })=>/*#__PURE__*/ (0, $fZVHt$jsxs)((0, $fZVHt$Fragment), {
+                children: [
+                    /*#__PURE__*/ (0, $fZVHt$jsx)((0, $9afd80978c252040$export$1acdcf5a973a8414), {
+                        isDisabled: isDisabled,
+                        isRequired: props.isRequired,
+                        size: size,
+                        labelPosition: labelPosition,
+                        labelAlign: labelAlign,
+                        necessityIndicator: necessityIndicator,
+                        contextualHelp: props.contextualHelp,
+                        children: label
+                    }),
+                    /*#__PURE__*/ (0, $fZVHt$jsx)("div", {
+                        className: function anonymous(props) {
+                            let rules = " .";
+                            rules += ' __a-4cfph1';
+                            rules += ' __b-4cfph1';
+                            rules += ' __c-4cfph1';
+                            rules += ' __d-4cfph1';
+                            rules += ' _Zd';
+                            if (props.orientation === "horizontal") rules += ' _6a';
+                            else if (props.orientation === "vertical") rules += ' _6b';
+                            rules += ' _7a';
+                            rules += ' je';
+                            rules += ' i-1inj1bc';
+                            return rules;
+                        }({
+                            orientation: orientation
+                        }),
+                        children: /*#__PURE__*/ (0, $fZVHt$jsx)((0, $9b916426527cebe7$export$c24727297075ec6a).Provider, {
+                            value: {
+                                ...formContext,
+                                size: size,
+                                isEmphasized: isEmphasized
+                            },
+                            children: children
+                        })
+                    }),
+                    /*#__PURE__*/ (0, $fZVHt$jsx)((0, $9afd80978c252040$export$a67c0bc59081311a), {
+                        size: size,
+                        isDisabled: isDisabled,
+                        isInvalid: isInvalid,
+                        description: description,
+                        showErrorIcon: true,
+                        children: errorMessage
+                    })
+                ]
+            })
+    });
+}
+/**
+ * Radio groups allow users to select a single option from a list of mutually exclusive options.
+ * All possible options are exposed up front for users to compare.
+ */ let $9a2afae66771094f$export$a98f0dcb43a68a25 = /*#__PURE__*/ (0, $fZVHt$forwardRef)($9a2afae66771094f$var$RadioGroup);
+
+
+export {$9a2afae66771094f$export$a98f0dcb43a68a25 as RadioGroup};
+//# sourceMappingURL=RadioGroup.mjs.map

package/dist/RadioGroup.mjs.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAqCD,SAAS,iCAAW,KAAsB,EAAE,GAA2B;IACrE,IAAI,cAAc,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAU;IACvC,QAAQ,CAAA,GAAA,yCAAW,EAAE;IACrB,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,IAAI,SACF,KAAK,eACL,WAAW,gBACX,YAAY,YACZ,QAAQ,gBACR,YAAY,iBACZ,gBAAgB,mBAChB,aAAa,6BACb,qBAAqB,cACrB,OAAO,kBACP,cAAc,8BACd,mBAAmB,kBACnB,YAAY,EACZ,GAAG,YACJ,GAAG;IAEJ,qBACE,gBAAC,CAAA,GAAA,iBAAa;QACX,GAAG,UAAU;QACd,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAOJ;kBACxB;2BACA;YACA,UAAU,CAAC,CAAC;QACd,GAAG,MAAM,MAAM;kBACd,CAAC,cAAC,UAAU,aAAE,SAAS,EAAC,iBACvB;;kCACE,gBAAC,CAAA,GAAA,yCAAS;wBACR,YAAY;wBACZ,YAAY,MAAM,UAAU;wBAC5B,MAAM;wBACN,eAAe;wBACf,YAAY;wBACZ,oBAAoB;wBACpB,gBAAgB,MAAM,cAAc;kCACnC;;kCAEH,gBAAC;wBACC,WAAW;;;;;;;;;;;;;0BAcR;yCAAC;wBAAW;kCACf,cAAA,gBAAC,CAAA,GAAA,yCAAU,EAAE,QAAQ;4BAAC,OAAO;gCAAC,GAAG,WAAW;sCAAE;8CAAM;4BAAY;sCAC7D;;;kCAGL,gBAAC,CAAA,GAAA,yCAAO;wBACN,MAAM;wBACN,YAAY;wBACZ,WAAW;wBACX,aAAa;wBACb,aAAa;kCACZ;;;;;AAMb;AAEA;;;CAGC,GACD,IAAI,4CAAc,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/RadioGroup.tsx"],"sourcesContent":["/*\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\nimport {\n  RadioGroup as AriaRadioGroup,\n  RadioGroupProps as AriaRadioGroupProps\n} from 'react-aria-components';\nimport {DOMRef, HelpTextProps, Orientation, SpectrumLabelableProps} from '@react-types/shared';\nimport {field, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldLabel, HelpText} from './Field';\nimport {FormContext, useFormProps} from './Form';\nimport React, {forwardRef, ReactNode, useContext} from 'react';\nimport {style} from '../style/spectrum-theme' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\n\nexport interface RadioGroupProps extends Omit<AriaRadioGroupProps, 'className' | 'style' | 'children'>, StyleProps, SpectrumLabelableProps, HelpTextProps {\n  /**\n   * The Radios contained within the RadioGroup.\n   */\n  children?: ReactNode,\n  /**\n   * The size of the RadioGroup.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL',\n  /**\n   * The axis the radio elements should align with.\n   *\n   * @default 'vertical'\n   */\n  orientation?: Orientation,\n  /**\n   * Whether the RadioGroup should be displayed with an emphasized style.\n   */\n  isEmphasized?: boolean\n}\n\nfunction RadioGroup(props: RadioGroupProps, ref: DOMRef<HTMLDivElement>) {\n  let formContext = useContext(FormContext);\n  props = useFormProps(props);\n  let domRef = useDOMRef(ref);\n\n  let {\n    label,\n    description,\n    errorMessage,\n    children,\n    isEmphasized,\n    labelPosition = 'top',\n    labelAlign = 'start',\n    necessityIndicator = 'icon',\n    size = 'M',\n    orientation = 'vertical',\n    UNSAFE_className = '',\n    UNSAFE_style,\n    ...groupProps\n  } = props;\n\n  return (\n    <AriaRadioGroup\n      {...groupProps}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={UNSAFE_className + style({\n        ...field(),\n        // Double the usual gap because of the internal padding within checkbox that spectrum has.\n        '--field-gap': {\n          type: 'rowGap',\n          value: '[calc(var(--field-height) - 1lh)]'\n        }\n      }, getAllowedOverrides())({\n        size,\n        labelPosition,\n        isInForm: !!formContext\n      }, props.styles)}>\n      {({isDisabled, isInvalid}) => (\n        <>\n          <FieldLabel\n            isDisabled={isDisabled}\n            isRequired={props.isRequired}\n            size={size}\n            labelPosition={labelPosition}\n            labelAlign={labelAlign}\n            necessityIndicator={necessityIndicator}\n            contextualHelp={props.contextualHelp}>\n            {label}\n          </FieldLabel>\n          <div\n            className={style({\n              gridArea: 'input',\n              display: 'flex',\n              flexDirection: {\n                orientation: {\n                  vertical: 'column',\n                  horizontal: 'row'\n                }\n              },\n              flexWrap: 'wrap',\n              // Spectrum uses a fixed spacing value for horizontal (column),\n              // but the gap changes depending on t-shirt size in vertical (row).\n              columnGap: 16,\n              rowGap: '--field-gap'\n            })({orientation})}>\n            <FormContext.Provider value={{...formContext, size, isEmphasized}}>\n              {children}\n            </FormContext.Provider>\n          </div>\n          <HelpText\n            size={size}\n            isDisabled={isDisabled}\n            isInvalid={isInvalid}\n            description={description}\n            showErrorIcon>\n            {errorMessage}\n          </HelpText>\n        </>\n      )}\n    </AriaRadioGroup>\n  );\n}\n\n/**\n * Radio groups allow users to select a single option from a list of mutually exclusive options.\n * All possible options are exposed up front for users to compare.\n */\nlet _RadioGroup = /*#__PURE__*/ forwardRef(RadioGroup);\nexport {_RadioGroup as RadioGroup};\n"],"names":[],"version":3,"file":"RadioGroup.mjs.map"}

package/dist/RangeSlider.cjs

@@ -0,0 +1,150 @@
+var $e937566cb5c6349c$exports = require("./Slider.cjs");
+var $bfa4962d90c8af48$exports = require("./Form.cjs");
+var $2061c83559b50a66$exports = require("./pressScale.cjs");
+var $lbQ1p$reactjsxruntime = require("react/jsx-runtime");
+var $lbQ1p$react = require("react");
+var $lbQ1p$reactariacomponents = require("react-aria-components");
+var $lbQ1p$reactspectrumutils = require("@react-spectrum/utils");
+var $lbQ1p$reactariai18n = require("@react-aria/i18n");
+
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+
+$parcel$export(module.exports, "RangeSlider", () => $bf1a51351cead47b$export$826424dabc3dd705);
+/*
+ * Copyright 2024 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.
+ */ 
+
+
+
+
+
+
+
+function $bf1a51351cead47b$var$RangeSlider(props, ref) {
+    let formContext = (0, $lbQ1p$react.useContext)((0, $bfa4962d90c8af48$exports.FormContext));
+    props = (0, $bfa4962d90c8af48$exports.useFormProps)(props);
+    let { labelPosition: labelPosition = 'top', size: size = 'M', isEmphasized: isEmphasized, trackStyle: trackStyle = 'thin', thumbStyle: thumbStyle = 'default' } = props;
+    let lowerThumbRef = (0, $lbQ1p$react.useRef)(null);
+    let upperThumbRef = (0, $lbQ1p$react.useRef)(null);
+    let inputRef = (0, $lbQ1p$react.useRef)(null); // TODO: need to pass inputRef to SliderThumb when we release the next version of RAC 1.3.0
+    let domRef = (0, $lbQ1p$reactspectrumutils.useFocusableRef)(ref, inputRef);
+    let { direction: direction } = (0, $lbQ1p$reactariai18n.useLocale)();
+    let cssDirection = direction === 'rtl' ? 'right' : 'left';
+    return /*#__PURE__*/ (0, $lbQ1p$reactjsxruntime.jsx)((0, $e937566cb5c6349c$exports.SliderBase), {
+        ...props,
+        value: props.value ? [
+            props.value.start,
+            props.value.end
+        ] : undefined,
+        defaultValue: props.defaultValue ? [
+            props.defaultValue.start,
+            props.defaultValue.end
+        ] : [
+            props.minValue ?? 0,
+            props.maxValue ?? 100
+        ],
+        onChange: (v)=>props.onChange?.({
+                start: v[0],
+                end: v[1]
+            }),
+        onChangeEnd: (v)=>props.onChangeEnd?.({
+                start: v[0],
+                end: v[1]
+            }),
+        sliderRef: domRef,
+        children: /*#__PURE__*/ (0, $lbQ1p$reactjsxruntime.jsx)((0, $lbQ1p$reactariacomponents.SliderTrack), {
+            className: (0, $e937566cb5c6349c$exports.track)({
+                size: size,
+                labelPosition: labelPosition,
+                isInForm: !!formContext
+            }),
+            children: ({ state: state, isDisabled: isDisabled })=>/*#__PURE__*/ (0, $lbQ1p$reactjsxruntime.jsxs)((0, $lbQ1p$reactjsxruntime.Fragment), {
+                    children: [
+                        /*#__PURE__*/ (0, $lbQ1p$reactjsxruntime.jsx)("div", {
+                            className: (0, $e937566cb5c6349c$exports.upperTrack)({
+                                isDisabled: isDisabled,
+                                trackStyle: trackStyle
+                            })
+                        }),
+                        /*#__PURE__*/ (0, $lbQ1p$reactjsxruntime.jsx)("div", {
+                            style: {
+                                width: `${Math.abs(state.getThumbPercent(0) - state.getThumbPercent(1)) * 100}%`,
+                                [cssDirection]: `${state.getThumbPercent(0) * 100}%`
+                            },
+                            className: (0, $e937566cb5c6349c$exports.filledTrack)({
+                                isDisabled: isDisabled,
+                                isEmphasized: isEmphasized,
+                                trackStyle: trackStyle
+                            })
+                        }),
+                        /*#__PURE__*/ (0, $lbQ1p$reactjsxruntime.jsx)((0, $lbQ1p$reactariacomponents.SliderThumb), {
+                            className: (0, $e937566cb5c6349c$exports.thumbContainer),
+                            index: 0,
+                            name: props.startName,
+                            "aria-label": "minimum",
+                            ref: lowerThumbRef,
+                            style: (renderProps)=>(0, $2061c83559b50a66$exports.pressScale)(lowerThumbRef, {
+                                    transform: 'translate(-50%, -50%)',
+                                    zIndex: state.getThumbPercent(0) === 1 ? 1 : undefined
+                                })({
+                                    ...renderProps,
+                                    isPressed: renderProps.isDragging
+                                }),
+                            children: (renderProps)=>/*#__PURE__*/ (0, $lbQ1p$reactjsxruntime.jsx)("div", {
+                                    className: (0, $e937566cb5c6349c$exports.thumbHitArea)({
+                                        size: size
+                                    }),
+                                    children: /*#__PURE__*/ (0, $lbQ1p$reactjsxruntime.jsx)("div", {
+                                        className: (0, $e937566cb5c6349c$exports.thumb)({
+                                            ...renderProps,
+                                            size: size,
+                                            thumbStyle: thumbStyle
+                                        })
+                                    })
+                                })
+                        }),
+                        /*#__PURE__*/ (0, $lbQ1p$reactjsxruntime.jsx)((0, $lbQ1p$reactariacomponents.SliderThumb), {
+                            className: (0, $e937566cb5c6349c$exports.thumbContainer),
+                            index: 1,
+                            name: props.endName,
+                            "aria-label": "maximum",
+                            ref: upperThumbRef,
+                            style: (renderProps)=>(0, $2061c83559b50a66$exports.pressScale)(upperThumbRef, {
+                                    transform: 'translate(-50%, -50%)'
+                                })({
+                                    ...renderProps,
+                                    isPressed: renderProps.isDragging
+                                }),
+                            children: (renderProps)=>/*#__PURE__*/ (0, $lbQ1p$reactjsxruntime.jsx)("div", {
+                                    className: (0, $e937566cb5c6349c$exports.thumbHitArea)({
+                                        size: size
+                                    }),
+                                    children: /*#__PURE__*/ (0, $lbQ1p$reactjsxruntime.jsx)("div", {
+                                        className: (0, $e937566cb5c6349c$exports.thumb)({
+                                            ...renderProps,
+                                            size: size,
+                                            thumbStyle: thumbStyle
+                                        })
+                                    })
+                                })
+                        })
+                    ]
+                })
+        })
+    });
+}
+let $bf1a51351cead47b$export$826424dabc3dd705 = /*#__PURE__*/ (0, $lbQ1p$react.forwardRef)($bf1a51351cead47b$var$RangeSlider);
+
+
+//# sourceMappingURL=RangeSlider.cjs.map

package/dist/RangeSlider.cjs.map

@@ -0,0 +1 @@
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/RangeSlider.tsx"],"sourcesContent":["/*\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\nimport {filledTrack, SliderBase, SliderBaseProps, thumb, thumbContainer, thumbHitArea, track, upperTrack} from './Slider';\nimport {FocusableRef, RangeValue} from '@react-types/shared';\nimport {FormContext, useFormProps} from './Form';\nimport {forwardRef, useContext, useRef} from 'react';\nimport {pressScale} from './pressScale';\nimport {\n  SliderThumb,\n  SliderTrack\n} from 'react-aria-components';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useLocale} from '@react-aria/i18n';\n\nexport interface RangeSliderProps extends Omit<SliderBaseProps<RangeValue<number>>, 'children'> {\n  /**\n   * The name of the start input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefname).\n   */\n  startName?: string,\n  /**\n   * The name of the end input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefname).\n   */\n  endName?: string\n}\n\nfunction RangeSlider(props: RangeSliderProps, ref: FocusableRef<HTMLDivElement>) {\n  let formContext = useContext(FormContext);\n  props = useFormProps(props);\n  let {\n    labelPosition = 'top', \n    size = 'M',\n    isEmphasized,\n    trackStyle = 'thin',\n    thumbStyle = 'default'\n  } = props; \n  let lowerThumbRef = useRef(null);\n  let upperThumbRef = useRef(null);\n  let inputRef = useRef(null); // TODO: need to pass inputRef to SliderThumb when we release the next version of RAC 1.3.0\n  let domRef = useFocusableRef(ref, inputRef);\n\n  let {direction} = useLocale();\n  let cssDirection = direction === 'rtl' ? 'right' : 'left';\n\n  return (\n    <SliderBase\n      {...props}\n      value={props.value ? [props.value.start, props.value.end] : undefined}\n      defaultValue={props.defaultValue ? [props.defaultValue.start, props.defaultValue.end] : [props.minValue ?? 0, props.maxValue ?? 100]}\n      onChange={v => props.onChange?.({start: v[0], end: v[1]})}\n      onChangeEnd={v => props.onChangeEnd?.({start: v[0], end: v[1]})}\n      sliderRef={domRef}>\n      <SliderTrack\n        className={track({size, labelPosition, isInForm: !!formContext})}>\n        {({state, isDisabled}) => (\n          <>\n            <div className={upperTrack({isDisabled, trackStyle})} />\n            <div style={{width: `${Math.abs(state.getThumbPercent(0) - state.getThumbPercent(1)) * 100}%`, [cssDirection]: `${state.getThumbPercent(0) * 100}%`}} className={filledTrack({isDisabled, isEmphasized, trackStyle})} />\n            {/* TODO: translations */}\n            <SliderThumb className={thumbContainer} index={0} name={props.startName} aria-label=\"minimum\" ref={lowerThumbRef} style={(renderProps) => pressScale(lowerThumbRef, {transform: 'translate(-50%, -50%)', zIndex: state.getThumbPercent(0) === 1 ? 1 : undefined})({...renderProps, isPressed: renderProps.isDragging})}>\n              {(renderProps) => (\n                <div className={thumbHitArea({size})}>\n                  <div\n                    className={thumb({\n                      ...renderProps,\n                      size,\n                      thumbStyle\n                    })} />\n                </div>\n              )}\n            </SliderThumb>\n            <SliderThumb  className={thumbContainer} index={1} name={props.endName} aria-label=\"maximum\" ref={upperThumbRef} style={(renderProps) => pressScale(upperThumbRef, {transform: 'translate(-50%, -50%)'})({...renderProps, isPressed: renderProps.isDragging})}>\n              {(renderProps) => (\n                <div className={thumbHitArea({size})}>\n                  <div\n                    className={thumb({\n                      ...renderProps,\n                      size,\n                      thumbStyle\n                    })} />\n                </div>\n              )}\n            </SliderThumb>\n          </>\n        )}\n      </SliderTrack>\n    </SliderBase>\n  );\n}\n\nlet _RangeSlider = /*#__PURE__*/ forwardRef(RangeSlider);\nexport {_RangeSlider as RangeSlider};\n"],"names":[],"version":3,"file":"RangeSlider.cjs.map"}

package/dist/RangeSlider.mjs

@@ -0,0 +1,145 @@
+import {filledTrack as $8128d8480e67c400$export$847ceef3bc944d02, SliderBase as $8128d8480e67c400$export$9418495bb635ebde, thumb as $8128d8480e67c400$export$becc9140d0e846f8, thumbContainer as $8128d8480e67c400$export$7814bee2738c4c3, thumbHitArea as $8128d8480e67c400$export$f120a3c6038107a5, track as $8128d8480e67c400$export$6b2a7d5132615086, upperTrack as $8128d8480e67c400$export$1e1dc99b6e2204f1} from "./Slider.mjs";
+import {FormContext as $9b916426527cebe7$export$c24727297075ec6a, useFormProps as $9b916426527cebe7$export$a6b5be5c6b451665} from "./Form.mjs";
+import {pressScale as $10ea7662e51a285b$export$56e8cba416805d8d} from "./pressScale.mjs";
+import {jsx as $DNS9q$jsx, jsxs as $DNS9q$jsxs, Fragment as $DNS9q$Fragment} from "react/jsx-runtime";
+import {useContext as $DNS9q$useContext, useRef as $DNS9q$useRef, forwardRef as $DNS9q$forwardRef} from "react";
+import {SliderTrack as $DNS9q$SliderTrack, SliderThumb as $DNS9q$SliderThumb} from "react-aria-components";
+import {useFocusableRef as $DNS9q$useFocusableRef} from "@react-spectrum/utils";
+import {useLocale as $DNS9q$useLocale} from "@react-aria/i18n";
+
+/*
+ * Copyright 2024 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.
+ */ 
+
+
+
+
+
+
+
+function $c683c8ad68e59901$var$RangeSlider(props, ref) {
+    let formContext = (0, $DNS9q$useContext)((0, $9b916426527cebe7$export$c24727297075ec6a));
+    props = (0, $9b916426527cebe7$export$a6b5be5c6b451665)(props);
+    let { labelPosition: labelPosition = 'top', size: size = 'M', isEmphasized: isEmphasized, trackStyle: trackStyle = 'thin', thumbStyle: thumbStyle = 'default' } = props;
+    let lowerThumbRef = (0, $DNS9q$useRef)(null);
+    let upperThumbRef = (0, $DNS9q$useRef)(null);
+    let inputRef = (0, $DNS9q$useRef)(null); // TODO: need to pass inputRef to SliderThumb when we release the next version of RAC 1.3.0
+    let domRef = (0, $DNS9q$useFocusableRef)(ref, inputRef);
+    let { direction: direction } = (0, $DNS9q$useLocale)();
+    let cssDirection = direction === 'rtl' ? 'right' : 'left';
+    return /*#__PURE__*/ (0, $DNS9q$jsx)((0, $8128d8480e67c400$export$9418495bb635ebde), {
+        ...props,
+        value: props.value ? [
+            props.value.start,
+            props.value.end
+        ] : undefined,
+        defaultValue: props.defaultValue ? [
+            props.defaultValue.start,
+            props.defaultValue.end
+        ] : [
+            props.minValue ?? 0,
+            props.maxValue ?? 100
+        ],
+        onChange: (v)=>props.onChange?.({
+                start: v[0],
+                end: v[1]
+            }),
+        onChangeEnd: (v)=>props.onChangeEnd?.({
+                start: v[0],
+                end: v[1]
+            }),
+        sliderRef: domRef,
+        children: /*#__PURE__*/ (0, $DNS9q$jsx)((0, $DNS9q$SliderTrack), {
+            className: (0, $8128d8480e67c400$export$6b2a7d5132615086)({
+                size: size,
+                labelPosition: labelPosition,
+                isInForm: !!formContext
+            }),
+            children: ({ state: state, isDisabled: isDisabled })=>/*#__PURE__*/ (0, $DNS9q$jsxs)((0, $DNS9q$Fragment), {
+                    children: [
+                        /*#__PURE__*/ (0, $DNS9q$jsx)("div", {
+                            className: (0, $8128d8480e67c400$export$1e1dc99b6e2204f1)({
+                                isDisabled: isDisabled,
+                                trackStyle: trackStyle
+                            })
+                        }),
+                        /*#__PURE__*/ (0, $DNS9q$jsx)("div", {
+                            style: {
+                                width: `${Math.abs(state.getThumbPercent(0) - state.getThumbPercent(1)) * 100}%`,
+                                [cssDirection]: `${state.getThumbPercent(0) * 100}%`
+                            },
+                            className: (0, $8128d8480e67c400$export$847ceef3bc944d02)({
+                                isDisabled: isDisabled,
+                                isEmphasized: isEmphasized,
+                                trackStyle: trackStyle
+                            })
+                        }),
+                        /*#__PURE__*/ (0, $DNS9q$jsx)((0, $DNS9q$SliderThumb), {
+                            className: (0, $8128d8480e67c400$export$7814bee2738c4c3),
+                            index: 0,
+                            name: props.startName,
+                            "aria-label": "minimum",
+                            ref: lowerThumbRef,
+                            style: (renderProps)=>(0, $10ea7662e51a285b$export$56e8cba416805d8d)(lowerThumbRef, {
+                                    transform: 'translate(-50%, -50%)',
+                                    zIndex: state.getThumbPercent(0) === 1 ? 1 : undefined
+                                })({
+                                    ...renderProps,
+                                    isPressed: renderProps.isDragging
+                                }),
+                            children: (renderProps)=>/*#__PURE__*/ (0, $DNS9q$jsx)("div", {
+                                    className: (0, $8128d8480e67c400$export$f120a3c6038107a5)({
+                                        size: size
+                                    }),
+                                    children: /*#__PURE__*/ (0, $DNS9q$jsx)("div", {
+                                        className: (0, $8128d8480e67c400$export$becc9140d0e846f8)({
+                                            ...renderProps,
+                                            size: size,
+                                            thumbStyle: thumbStyle
+                                        })
+                                    })
+                                })
+                        }),
+                        /*#__PURE__*/ (0, $DNS9q$jsx)((0, $DNS9q$SliderThumb), {
+                            className: (0, $8128d8480e67c400$export$7814bee2738c4c3),
+                            index: 1,
+                            name: props.endName,
+                            "aria-label": "maximum",
+                            ref: upperThumbRef,
+                            style: (renderProps)=>(0, $10ea7662e51a285b$export$56e8cba416805d8d)(upperThumbRef, {
+                                    transform: 'translate(-50%, -50%)'
+                                })({
+                                    ...renderProps,
+                                    isPressed: renderProps.isDragging
+                                }),
+                            children: (renderProps)=>/*#__PURE__*/ (0, $DNS9q$jsx)("div", {
+                                    className: (0, $8128d8480e67c400$export$f120a3c6038107a5)({
+                                        size: size
+                                    }),
+                                    children: /*#__PURE__*/ (0, $DNS9q$jsx)("div", {
+                                        className: (0, $8128d8480e67c400$export$becc9140d0e846f8)({
+                                            ...renderProps,
+                                            size: size,
+                                            thumbStyle: thumbStyle
+                                        })
+                                    })
+                                })
+                        })
+                    ]
+                })
+        })
+    });
+}
+let $c683c8ad68e59901$export$826424dabc3dd705 = /*#__PURE__*/ (0, $DNS9q$forwardRef)($c683c8ad68e59901$var$RangeSlider);
+
+
+export {$c683c8ad68e59901$export$826424dabc3dd705 as RangeSlider};
+//# sourceMappingURL=RangeSlider.mjs.map

package/dist/RangeSlider.mjs.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;AAyBD,SAAS,kCAAY,KAAuB,EAAE,GAAiC;IAC7E,IAAI,cAAc,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAU;IACvC,QAAQ,CAAA,GAAA,yCAAW,EAAE;IACrB,IAAI,iBACF,gBAAgB,aAChB,OAAO,mBACP,YAAY,cACZ,aAAa,oBACb,aAAa,WACd,GAAG;IACJ,IAAI,gBAAgB,CAAA,GAAA,aAAK,EAAE;IAC3B,IAAI,gBAAgB,CAAA,GAAA,aAAK,EAAE;IAC3B,IAAI,WAAW,CAAA,GAAA,aAAK,EAAE,OAAO,2FAA2F;IACxH,IAAI,SAAS,CAAA,GAAA,sBAAc,EAAE,KAAK;IAElC,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ;IAC1B,IAAI,eAAe,cAAc,QAAQ,UAAU;IAEnD,qBACE,gBAAC,CAAA,GAAA,yCAAS;QACP,GAAG,KAAK;QACT,OAAO,MAAM,KAAK,GAAG;YAAC,MAAM,KAAK,CAAC,KAAK;YAAE,MAAM,KAAK,CAAC,GAAG;SAAC,GAAG;QAC5D,cAAc,MAAM,YAAY,GAAG;YAAC,MAAM,YAAY,CAAC,KAAK;YAAE,MAAM,YAAY,CAAC,GAAG;SAAC,GAAG;YAAC,MAAM,QAAQ,IAAI;YAAG,MAAM,QAAQ,IAAI;SAAI;QACpI,UAAU,CAAA,IAAK,MAAM,QAAQ,GAAG;gBAAC,OAAO,CAAC,CAAC,EAAE;gBAAE,KAAK,CAAC,CAAC,EAAE;YAAA;QACvD,aAAa,CAAA,IAAK,MAAM,WAAW,GAAG;gBAAC,OAAO,CAAC,CAAC,EAAE;gBAAE,KAAK,CAAC,CAAC,EAAE;YAAA;QAC7D,WAAW;kBACX,cAAA,gBAAC,CAAA,GAAA,kBAAU;YACT,WAAW,CAAA,GAAA,yCAAI,EAAE;sBAAC;+BAAM;gBAAe,UAAU,CAAC,CAAC;YAAW;sBAC7D,CAAC,SAAC,KAAK,cAAE,UAAU,EAAC,iBACnB;;sCACE,gBAAC;4BAAI,WAAW,CAAA,GAAA,yCAAS,EAAE;4CAAC;4CAAY;4BAAU;;sCAClD,gBAAC;4BAAI,OAAO;gCAAC,OAAO,CAAC,EAAE,KAAK,GAAG,CAAC,MAAM,eAAe,CAAC,KAAK,MAAM,eAAe,CAAC,MAAM,IAAI,CAAC,CAAC;gCAAE,CAAC,aAAa,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC,KAAK,IAAI,CAAC,CAAC;4BAAA;4BAAG,WAAW,CAAA,GAAA,yCAAU,EAAE;4CAAC;8CAAY;4CAAc;4BAAU;;sCAElN,gBAAC,CAAA,GAAA,kBAAU;4BAAE,WAAW,CAAA,GAAA,wCAAa;4BAAG,OAAO;4BAAG,MAAM,MAAM,SAAS;4BAAE,cAAW;4BAAU,KAAK;4BAAe,OAAO,CAAC,cAAgB,CAAA,GAAA,yCAAS,EAAE,eAAe;oCAAC,WAAW;oCAAyB,QAAQ,MAAM,eAAe,CAAC,OAAO,IAAI,IAAI;gCAAS,GAAG;oCAAC,GAAG,WAAW;oCAAE,WAAW,YAAY,UAAU;gCAAA;sCACjT,CAAC,4BACA,gBAAC;oCAAI,WAAW,CAAA,GAAA,yCAAW,EAAE;8CAAC;oCAAI;8CAChC,cAAA,gBAAC;wCACC,WAAW,CAAA,GAAA,yCAAI,EAAE;4CACf,GAAG,WAAW;kDACd;wDACA;wCACF;;;;sCAIR,gBAAC,CAAA,GAAA,kBAAU;4BAAG,WAAW,CAAA,GAAA,wCAAa;4BAAG,OAAO;4BAAG,MAAM,MAAM,OAAO;4BAAE,cAAW;4BAAU,KAAK;4BAAe,OAAO,CAAC,cAAgB,CAAA,GAAA,yCAAS,EAAE,eAAe;oCAAC,WAAW;gCAAuB,GAAG;oCAAC,GAAG,WAAW;oCAAE,WAAW,YAAY,UAAU;gCAAA;sCACxP,CAAC,4BACA,gBAAC;oCAAI,WAAW,CAAA,GAAA,yCAAW,EAAE;8CAAC;oCAAI;8CAChC,cAAA,gBAAC;wCACC,WAAW,CAAA,GAAA,yCAAI,EAAE;4CACf,GAAG,WAAW;kDACd;wDACA;wCACF;;;;;;;;AASpB;AAEA,IAAI,4CAAe,WAAW,GAAG,CAAA,GAAA,iBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/RangeSlider.tsx"],"sourcesContent":["/*\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\nimport {filledTrack, SliderBase, SliderBaseProps, thumb, thumbContainer, thumbHitArea, track, upperTrack} from './Slider';\nimport {FocusableRef, RangeValue} from '@react-types/shared';\nimport {FormContext, useFormProps} from './Form';\nimport {forwardRef, useContext, useRef} from 'react';\nimport {pressScale} from './pressScale';\nimport {\n  SliderThumb,\n  SliderTrack\n} from 'react-aria-components';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useLocale} from '@react-aria/i18n';\n\nexport interface RangeSliderProps extends Omit<SliderBaseProps<RangeValue<number>>, 'children'> {\n  /**\n   * The name of the start input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefname).\n   */\n  startName?: string,\n  /**\n   * The name of the end input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefname).\n   */\n  endName?: string\n}\n\nfunction RangeSlider(props: RangeSliderProps, ref: FocusableRef<HTMLDivElement>) {\n  let formContext = useContext(FormContext);\n  props = useFormProps(props);\n  let {\n    labelPosition = 'top', \n    size = 'M',\n    isEmphasized,\n    trackStyle = 'thin',\n    thumbStyle = 'default'\n  } = props; \n  let lowerThumbRef = useRef(null);\n  let upperThumbRef = useRef(null);\n  let inputRef = useRef(null); // TODO: need to pass inputRef to SliderThumb when we release the next version of RAC 1.3.0\n  let domRef = useFocusableRef(ref, inputRef);\n\n  let {direction} = useLocale();\n  let cssDirection = direction === 'rtl' ? 'right' : 'left';\n\n  return (\n    <SliderBase\n      {...props}\n      value={props.value ? [props.value.start, props.value.end] : undefined}\n      defaultValue={props.defaultValue ? [props.defaultValue.start, props.defaultValue.end] : [props.minValue ?? 0, props.maxValue ?? 100]}\n      onChange={v => props.onChange?.({start: v[0], end: v[1]})}\n      onChangeEnd={v => props.onChangeEnd?.({start: v[0], end: v[1]})}\n      sliderRef={domRef}>\n      <SliderTrack\n        className={track({size, labelPosition, isInForm: !!formContext})}>\n        {({state, isDisabled}) => (\n          <>\n            <div className={upperTrack({isDisabled, trackStyle})} />\n            <div style={{width: `${Math.abs(state.getThumbPercent(0) - state.getThumbPercent(1)) * 100}%`, [cssDirection]: `${state.getThumbPercent(0) * 100}%`}} className={filledTrack({isDisabled, isEmphasized, trackStyle})} />\n            {/* TODO: translations */}\n            <SliderThumb className={thumbContainer} index={0} name={props.startName} aria-label=\"minimum\" ref={lowerThumbRef} style={(renderProps) => pressScale(lowerThumbRef, {transform: 'translate(-50%, -50%)', zIndex: state.getThumbPercent(0) === 1 ? 1 : undefined})({...renderProps, isPressed: renderProps.isDragging})}>\n              {(renderProps) => (\n                <div className={thumbHitArea({size})}>\n                  <div\n                    className={thumb({\n                      ...renderProps,\n                      size,\n                      thumbStyle\n                    })} />\n                </div>\n              )}\n            </SliderThumb>\n            <SliderThumb  className={thumbContainer} index={1} name={props.endName} aria-label=\"maximum\" ref={upperThumbRef} style={(renderProps) => pressScale(upperThumbRef, {transform: 'translate(-50%, -50%)'})({...renderProps, isPressed: renderProps.isDragging})}>\n              {(renderProps) => (\n                <div className={thumbHitArea({size})}>\n                  <div\n                    className={thumb({\n                      ...renderProps,\n                      size,\n                      thumbStyle\n                    })} />\n                </div>\n              )}\n            </SliderThumb>\n          </>\n        )}\n      </SliderTrack>\n    </SliderBase>\n  );\n}\n\nlet _RangeSlider = /*#__PURE__*/ forwardRef(RangeSlider);\nexport {_RangeSlider as RangeSlider};\n"],"names":[],"version":3,"file":"RangeSlider.mjs.map"}

package/dist/S2_AddSize100.cjs

@@ -0,0 +1,27 @@
+var $aKpyU$reactjsxruntime = require("react/jsx-runtime");
+require("react");
+
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+
+$parcel$export(module.exports, "default", () => $3404a88866fa78e3$export$2e2bcd8739ae039);
+
+
+const $3404a88866fa78e3$var$SvgS2AddSize100 = (props)=>/*#__PURE__*/ (0, $aKpyU$reactjsxruntime.jsx)("svg", {
+        "data-name": "ICONS",
+        xmlns: "http://www.w3.org/2000/svg",
+        width: 10,
+        height: 10,
+        viewBox: "0 0 10 10",
+        ...props,
+        children: /*#__PURE__*/ (0, $aKpyU$reactjsxruntime.jsx)("path", {
+            d: "M8.5 4H6V1.5a1 1 0 1 0-2 0V4H1.5a1 1 0 1 0 0 2H4v2.5a1 1 0 1 0 2 0V6h2.5a1 1 0 1 0 0-2Z",
+            fill: "var(--iconPrimary, #222)"
+        })
+    });
+var $3404a88866fa78e3$export$2e2bcd8739ae039 = $3404a88866fa78e3$var$SvgS2AddSize100;
+
+
+//# sourceMappingURL=S2_AddSize100.cjs.map

package/dist/S2_AddSize100.cjs.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;AACA,MAAM,wCAAkB,CAAA,sBAAS,gCAAC;QAAI,aAAU;QAAQ,OAAM;QAA6B,OAAO;QAAI,QAAQ;QAAI,SAAQ;QAAa,GAAG,KAAK;kBAAE,cAAA,gCAAC;YAAK,GAAE;YAA0F,MAAK;;;IACxP,2CAAe","sources":["packages/@react-spectrum/s2/ui-icons/S2_AddSize100.svg"],"sourcesContent":["<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<svg id=\"g\" data-name=\"ICONS\" xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 10 10\">\n  <path d=\"m8.5,4h-2.5V1.5c0-.55273-.44727-1-1-1s-1,.44727-1,1v2.5H1.5c-.55273,0-1,.44727-1,1s.44727,1,1,1h2.5v2.5c0,.55273.44727,1,1,1s1-.44727,1-1v-2.5h2.5c.55273,0,1-.44727,1-1s-.44727-1-1-1Z\" fill=\"var(--iconPrimary, #222)\" stroke-width=\"0\"/>\n</svg>"],"names":[],"version":3,"file":"S2_AddSize100.cjs.map"}

package/dist/S2_AddSize100.mjs

@@ -0,0 +1,22 @@
+import {jsx as $82IjT$jsx} from "react/jsx-runtime";
+import "react";
+
+
+
+const $ae45ad1f32cde709$var$SvgS2AddSize100 = (props)=>/*#__PURE__*/ (0, $82IjT$jsx)("svg", {
+        "data-name": "ICONS",
+        xmlns: "http://www.w3.org/2000/svg",
+        width: 10,
+        height: 10,
+        viewBox: "0 0 10 10",
+        ...props,
+        children: /*#__PURE__*/ (0, $82IjT$jsx)("path", {
+            d: "M8.5 4H6V1.5a1 1 0 1 0-2 0V4H1.5a1 1 0 1 0 0 2H4v2.5a1 1 0 1 0 2 0V6h2.5a1 1 0 1 0 0-2Z",
+            fill: "var(--iconPrimary, #222)"
+        })
+    });
+var $ae45ad1f32cde709$export$2e2bcd8739ae039 = $ae45ad1f32cde709$var$SvgS2AddSize100;
+
+
+export {$ae45ad1f32cde709$export$2e2bcd8739ae039 as default};
+//# sourceMappingURL=S2_AddSize100.mjs.map

package/dist/S2_AddSize100.mjs.map

@@ -0,0 +1 @@
+{"mappings":";;;;;AACA,MAAM,wCAAkB,CAAA,sBAAS,gBAAC;QAAI,aAAU;QAAQ,OAAM;QAA6B,OAAO;QAAI,QAAQ;QAAI,SAAQ;QAAa,GAAG,KAAK;kBAAE,cAAA,gBAAC;YAAK,GAAE;YAA0F,MAAK;;;IACxP,2CAAe","sources":["packages/@react-spectrum/s2/ui-icons/S2_AddSize100.svg"],"sourcesContent":["<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<svg id=\"g\" data-name=\"ICONS\" xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 10 10\">\n  <path d=\"m8.5,4h-2.5V1.5c0-.55273-.44727-1-1-1s-1,.44727-1,1v2.5H1.5c-.55273,0-1,.44727-1,1s.44727,1,1,1h2.5v2.5c0,.55273.44727,1,1,1s1-.44727,1-1v-2.5h2.5c.55273,0,1-.44727,1-1s-.44727-1-1-1Z\" fill=\"var(--iconPrimary, #222)\" stroke-width=\"0\"/>\n</svg>"],"names":[],"version":3,"file":"S2_AddSize100.mjs.map"}

package/dist/S2_AddSize200.cjs

@@ -0,0 +1,27 @@
+var $jDkIZ$reactjsxruntime = require("react/jsx-runtime");
+require("react");
+
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+
+$parcel$export(module.exports, "default", () => $b51f0c0e80ec4a84$export$2e2bcd8739ae039);
+
+
+const $b51f0c0e80ec4a84$var$SvgS2AddSize200 = (props)=>/*#__PURE__*/ (0, $jDkIZ$reactjsxruntime.jsx)("svg", {
+        "data-name": "ICONS",
+        xmlns: "http://www.w3.org/2000/svg",
+        width: 12,
+        height: 12,
+        viewBox: "0 0 12 12",
+        ...props,
+        children: /*#__PURE__*/ (0, $jDkIZ$reactjsxruntime.jsx)("path", {
+            d: "M10.021 4.959h-2.98v-2.98a1.04 1.04 0 1 0-2.082 0v2.98h-2.98a1.04 1.04 0 1 0 0 2.082h2.98v2.98a1.04 1.04 0 1 0 2.082 0v-2.98h2.98a1.04 1.04 0 1 0 0-2.082Z",
+            fill: "var(--iconPrimary, #222)"
+        })
+    });
+var $b51f0c0e80ec4a84$export$2e2bcd8739ae039 = $b51f0c0e80ec4a84$var$SvgS2AddSize200;
+
+
+//# sourceMappingURL=S2_AddSize200.cjs.map

package/dist/S2_AddSize200.cjs.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;AACA,MAAM,wCAAkB,CAAA,sBAAS,gCAAC;QAAI,aAAU;QAAQ,OAAM;QAA6B,OAAO;QAAI,QAAQ;QAAI,SAAQ;QAAa,GAAG,KAAK;kBAAE,cAAA,gCAAC;YAAK,GAAE;YAA6J,MAAK;;;IAC3T,2CAAe","sources":["packages/@react-spectrum/s2/ui-icons/S2_AddSize200.svg"],"sourcesContent":["<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<svg id=\"g\" data-name=\"ICONS\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\">\n  <path d=\"m10.02148,4.95898h-2.98047V1.97852c0-.5752-.46582-1.04102-1.04102-1.04102s-1.04102.46582-1.04102,1.04102v2.98047H1.97852c-.5752,0-1.04102.46582-1.04102,1.04102s.46582,1.04102,1.04102,1.04102h2.98047v2.98047c0,.5752.46582,1.04102,1.04102,1.04102s1.04102-.46582,1.04102-1.04102v-2.98047h2.98047c.5752,0,1.04102-.46582,1.04102-1.04102s-.46582-1.04102-1.04102-1.04102Z\" fill=\"var(--iconPrimary, #222)\" stroke-width=\"0\"/>\n</svg>"],"names":[],"version":3,"file":"S2_AddSize200.cjs.map"}

package/dist/S2_AddSize200.mjs

@@ -0,0 +1,22 @@
+import {jsx as $kc2Fi$jsx} from "react/jsx-runtime";
+import "react";
+
+
+
+const $4d258b231a7c4c0f$var$SvgS2AddSize200 = (props)=>/*#__PURE__*/ (0, $kc2Fi$jsx)("svg", {
+        "data-name": "ICONS",
+        xmlns: "http://www.w3.org/2000/svg",
+        width: 12,
+        height: 12,
+        viewBox: "0 0 12 12",
+        ...props,
+        children: /*#__PURE__*/ (0, $kc2Fi$jsx)("path", {
+            d: "M10.021 4.959h-2.98v-2.98a1.04 1.04 0 1 0-2.082 0v2.98h-2.98a1.04 1.04 0 1 0 0 2.082h2.98v2.98a1.04 1.04 0 1 0 2.082 0v-2.98h2.98a1.04 1.04 0 1 0 0-2.082Z",
+            fill: "var(--iconPrimary, #222)"
+        })
+    });
+var $4d258b231a7c4c0f$export$2e2bcd8739ae039 = $4d258b231a7c4c0f$var$SvgS2AddSize200;
+
+
+export {$4d258b231a7c4c0f$export$2e2bcd8739ae039 as default};
+//# sourceMappingURL=S2_AddSize200.mjs.map

package/dist/S2_AddSize200.mjs.map

@@ -0,0 +1 @@
+{"mappings":";;;;;AACA,MAAM,wCAAkB,CAAA,sBAAS,gBAAC;QAAI,aAAU;QAAQ,OAAM;QAA6B,OAAO;QAAI,QAAQ;QAAI,SAAQ;QAAa,GAAG,KAAK;kBAAE,cAAA,gBAAC;YAAK,GAAE;YAA6J,MAAK;;;IAC3T,2CAAe","sources":["packages/@react-spectrum/s2/ui-icons/S2_AddSize200.svg"],"sourcesContent":["<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<svg id=\"g\" data-name=\"ICONS\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\">\n  <path d=\"m10.02148,4.95898h-2.98047V1.97852c0-.5752-.46582-1.04102-1.04102-1.04102s-1.04102.46582-1.04102,1.04102v2.98047H1.97852c-.5752,0-1.04102.46582-1.04102,1.04102s.46582,1.04102,1.04102,1.04102h2.98047v2.98047c0,.5752.46582,1.04102,1.04102,1.04102s1.04102-.46582,1.04102-1.04102v-2.98047h2.98047c.5752,0,1.04102-.46582,1.04102-1.04102s-.46582-1.04102-1.04102-1.04102Z\" fill=\"var(--iconPrimary, #222)\" stroke-width=\"0\"/>\n</svg>"],"names":[],"version":3,"file":"S2_AddSize200.mjs.map"}