@react-spectrum/s2 3.0.0-nightly-ab9fd5c68-241125 → 3.0.0-nightly-10a43de88-241127
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/Accordion.cjs +2 -5
- package/dist/Accordion.cjs.map +1 -1
- package/dist/Accordion.css.map +1 -1
- package/dist/Accordion.mjs +2 -5
- package/dist/Accordion.mjs.map +1 -1
- package/dist/ActionButton.cjs +2 -6
- package/dist/ActionButton.cjs.map +1 -1
- package/dist/ActionButton.css.map +1 -1
- package/dist/ActionButton.mjs +3 -7
- package/dist/ActionButton.mjs.map +1 -1
- package/dist/ActionButtonGroup.cjs +2 -5
- package/dist/ActionButtonGroup.cjs.map +1 -1
- package/dist/ActionButtonGroup.css.map +1 -1
- package/dist/ActionButtonGroup.mjs +2 -5
- package/dist/ActionButtonGroup.mjs.map +1 -1
- package/dist/ActionMenu.cjs +2 -5
- package/dist/ActionMenu.cjs.map +1 -1
- package/dist/ActionMenu.mjs +2 -5
- package/dist/ActionMenu.mjs.map +1 -1
- package/dist/AlertDialog.cjs +2 -5
- package/dist/AlertDialog.cjs.map +1 -1
- package/dist/AlertDialog.css.map +1 -1
- package/dist/AlertDialog.mjs +2 -5
- package/dist/AlertDialog.mjs.map +1 -1
- package/dist/Avatar.cjs +2 -5
- package/dist/Avatar.cjs.map +1 -1
- package/dist/Avatar.css.map +1 -1
- package/dist/Avatar.mjs +2 -5
- package/dist/Avatar.mjs.map +1 -1
- package/dist/AvatarGroup.cjs +2 -5
- package/dist/AvatarGroup.cjs.map +1 -1
- package/dist/AvatarGroup.css.map +1 -1
- package/dist/AvatarGroup.mjs +2 -5
- package/dist/AvatarGroup.mjs.map +1 -1
- package/dist/Badge.cjs +2 -5
- package/dist/Badge.cjs.map +1 -1
- package/dist/Badge.css.map +1 -1
- package/dist/Badge.mjs +2 -5
- package/dist/Badge.mjs.map +1 -1
- package/dist/Breadcrumbs.cjs +4 -6
- package/dist/Breadcrumbs.cjs.map +1 -1
- package/dist/Breadcrumbs.css.map +1 -1
- package/dist/Breadcrumbs.mjs +5 -7
- package/dist/Breadcrumbs.mjs.map +1 -1
- package/dist/Button.cjs +4 -12
- package/dist/Button.cjs.map +1 -1
- package/dist/Button.css.map +1 -1
- package/dist/Button.mjs +5 -13
- package/dist/Button.mjs.map +1 -1
- package/dist/ButtonGroup.cjs +2 -5
- package/dist/ButtonGroup.cjs.map +1 -1
- package/dist/ButtonGroup.css.map +1 -1
- package/dist/ButtonGroup.mjs +3 -6
- package/dist/ButtonGroup.mjs.map +1 -1
- package/dist/CardView.cjs +2 -3
- package/dist/CardView.cjs.map +1 -1
- package/dist/CardView.css.map +1 -1
- package/dist/CardView.mjs +3 -4
- package/dist/CardView.mjs.map +1 -1
- package/dist/Checkbox.cjs +2 -6
- package/dist/Checkbox.cjs.map +1 -1
- package/dist/Checkbox.css.map +1 -1
- package/dist/Checkbox.mjs +3 -7
- package/dist/Checkbox.mjs.map +1 -1
- package/dist/CheckboxGroup.cjs +2 -5
- package/dist/CheckboxGroup.cjs.map +1 -1
- package/dist/CheckboxGroup.css.map +1 -1
- package/dist/CheckboxGroup.mjs +3 -6
- package/dist/CheckboxGroup.mjs.map +1 -1
- package/dist/ClearButton.cjs +2 -3
- package/dist/ClearButton.cjs.map +1 -1
- package/dist/ClearButton.css.map +1 -1
- package/dist/ClearButton.mjs +2 -3
- package/dist/ClearButton.mjs.map +1 -1
- package/dist/CloseButton.cjs +2 -5
- package/dist/CloseButton.cjs.map +1 -1
- package/dist/CloseButton.css.map +1 -1
- package/dist/CloseButton.mjs +2 -5
- package/dist/CloseButton.mjs.map +1 -1
- package/dist/ColorArea.cjs +2 -5
- package/dist/ColorArea.cjs.map +1 -1
- package/dist/ColorArea.css.map +1 -1
- package/dist/ColorArea.mjs +2 -5
- package/dist/ColorArea.mjs.map +1 -1
- package/dist/ColorField.cjs +2 -5
- package/dist/ColorField.cjs.map +1 -1
- package/dist/ColorField.css.map +1 -1
- package/dist/ColorField.mjs +3 -6
- package/dist/ColorField.mjs.map +1 -1
- package/dist/ColorSlider.cjs +2 -5
- package/dist/ColorSlider.cjs.map +1 -1
- package/dist/ColorSlider.css.map +1 -1
- package/dist/ColorSlider.mjs +3 -6
- package/dist/ColorSlider.mjs.map +1 -1
- package/dist/ColorSwatch.cjs +2 -5
- package/dist/ColorSwatch.cjs.map +1 -1
- package/dist/ColorSwatch.css.map +1 -1
- package/dist/ColorSwatch.mjs +3 -6
- package/dist/ColorSwatch.mjs.map +1 -1
- package/dist/ColorSwatchPicker.cjs +2 -5
- package/dist/ColorSwatchPicker.cjs.map +1 -1
- package/dist/ColorSwatchPicker.css.map +1 -1
- package/dist/ColorSwatchPicker.mjs +2 -5
- package/dist/ColorSwatchPicker.mjs.map +1 -1
- package/dist/ColorWheel.cjs +2 -5
- package/dist/ColorWheel.cjs.map +1 -1
- package/dist/ColorWheel.css.map +1 -1
- package/dist/ColorWheel.mjs +2 -5
- package/dist/ColorWheel.mjs.map +1 -1
- package/dist/ComboBox.cjs +2 -5
- package/dist/ComboBox.cjs.map +1 -1
- package/dist/ComboBox.css.map +1 -1
- package/dist/ComboBox.mjs +3 -6
- package/dist/ComboBox.mjs.map +1 -1
- package/dist/Content.cjs +12 -19
- package/dist/Content.cjs.map +1 -1
- package/dist/Content.mjs +12 -19
- package/dist/Content.mjs.map +1 -1
- package/dist/ContextualHelp.cjs +2 -5
- package/dist/ContextualHelp.cjs.map +1 -1
- package/dist/ContextualHelp.css.map +1 -1
- package/dist/ContextualHelp.mjs +2 -5
- package/dist/ContextualHelp.mjs.map +1 -1
- package/dist/CustomDialog.cjs +2 -5
- package/dist/CustomDialog.cjs.map +1 -1
- package/dist/CustomDialog.css.map +1 -1
- package/dist/CustomDialog.mjs +2 -5
- package/dist/CustomDialog.mjs.map +1 -1
- package/dist/Dialog.cjs +2 -6
- package/dist/Dialog.cjs.map +1 -1
- package/dist/Dialog.css.map +1 -1
- package/dist/Dialog.mjs +2 -6
- package/dist/Dialog.mjs.map +1 -1
- package/dist/Disclosure.cjs +6 -15
- package/dist/Disclosure.cjs.map +1 -1
- package/dist/Disclosure.css.map +1 -1
- package/dist/Disclosure.mjs +7 -16
- package/dist/Disclosure.mjs.map +1 -1
- package/dist/Divider.cjs +2 -6
- package/dist/Divider.cjs.map +1 -1
- package/dist/Divider.css.map +1 -1
- package/dist/Divider.mjs +2 -6
- package/dist/Divider.mjs.map +1 -1
- package/dist/DropZone.cjs +2 -5
- package/dist/DropZone.cjs.map +1 -1
- package/dist/DropZone.css.map +1 -1
- package/dist/DropZone.mjs +2 -5
- package/dist/DropZone.mjs.map +1 -1
- package/dist/Field.cjs +6 -9
- package/dist/Field.cjs.map +1 -1
- package/dist/Field.css.map +1 -1
- package/dist/Field.mjs +6 -9
- package/dist/Field.mjs.map +1 -1
- package/dist/Form.cjs +2 -5
- package/dist/Form.cjs.map +1 -1
- package/dist/Form.css.map +1 -1
- package/dist/Form.mjs +2 -5
- package/dist/Form.mjs.map +1 -1
- package/dist/FullscreenDialog.cjs +2 -5
- package/dist/FullscreenDialog.cjs.map +1 -1
- package/dist/FullscreenDialog.css.map +1 -1
- package/dist/FullscreenDialog.mjs +2 -5
- package/dist/FullscreenDialog.mjs.map +1 -1
- package/dist/IllustratedMessage.cjs +2 -6
- package/dist/IllustratedMessage.cjs.map +1 -1
- package/dist/IllustratedMessage.css.map +1 -1
- package/dist/IllustratedMessage.mjs +2 -6
- package/dist/IllustratedMessage.mjs.map +1 -1
- package/dist/Image.cjs +2 -3
- package/dist/Image.cjs.map +1 -1
- package/dist/Image.css.map +1 -1
- package/dist/Image.mjs +3 -4
- package/dist/Image.mjs.map +1 -1
- package/dist/InlineAlert.cjs +2 -6
- package/dist/InlineAlert.cjs.map +1 -1
- package/dist/InlineAlert.css.map +1 -1
- package/dist/InlineAlert.mjs +3 -7
- package/dist/InlineAlert.mjs.map +1 -1
- package/dist/Link.cjs +2 -6
- package/dist/Link.cjs.map +1 -1
- package/dist/Link.css.map +1 -1
- package/dist/Link.mjs +3 -7
- package/dist/Link.mjs.map +1 -1
- package/dist/Menu.cjs +2 -5
- package/dist/Menu.cjs.map +1 -1
- package/dist/Menu.css.map +1 -1
- package/dist/Menu.mjs +3 -6
- package/dist/Menu.mjs.map +1 -1
- package/dist/Meter.cjs +2 -6
- package/dist/Meter.cjs.map +1 -1
- package/dist/Meter.css.map +1 -1
- package/dist/Meter.mjs +2 -6
- package/dist/Meter.mjs.map +1 -1
- package/dist/Modal.cjs +2 -5
- package/dist/Modal.cjs.map +1 -1
- package/dist/Modal.css.map +1 -1
- package/dist/Modal.mjs +3 -6
- package/dist/Modal.mjs.map +1 -1
- package/dist/NumberField.cjs +2 -5
- package/dist/NumberField.cjs.map +1 -1
- package/dist/NumberField.css.map +1 -1
- package/dist/NumberField.mjs +3 -6
- package/dist/NumberField.mjs.map +1 -1
- package/dist/Picker.cjs +2 -5
- package/dist/Picker.cjs.map +1 -1
- package/dist/Picker.css.map +1 -1
- package/dist/Picker.mjs +3 -6
- package/dist/Picker.mjs.map +1 -1
- package/dist/Popover.cjs +4 -8
- package/dist/Popover.cjs.map +1 -1
- package/dist/Popover.css.map +1 -1
- package/dist/Popover.mjs +5 -9
- package/dist/Popover.mjs.map +1 -1
- package/dist/ProgressBar.cjs +2 -6
- package/dist/ProgressBar.cjs.map +1 -1
- package/dist/ProgressBar.css.map +1 -1
- package/dist/ProgressBar.mjs +2 -6
- package/dist/ProgressBar.mjs.map +1 -1
- package/dist/ProgressCircle.cjs +2 -6
- package/dist/ProgressCircle.cjs.map +1 -1
- package/dist/ProgressCircle.css.map +1 -1
- package/dist/ProgressCircle.mjs +2 -6
- package/dist/ProgressCircle.mjs.map +1 -1
- package/dist/Radio.cjs +2 -6
- package/dist/Radio.cjs.map +1 -1
- package/dist/Radio.css.map +1 -1
- package/dist/Radio.mjs +3 -7
- package/dist/Radio.mjs.map +1 -1
- package/dist/RadioGroup.cjs +2 -6
- package/dist/RadioGroup.cjs.map +1 -1
- package/dist/RadioGroup.css.map +1 -1
- package/dist/RadioGroup.mjs +3 -7
- package/dist/RadioGroup.mjs.map +1 -1
- package/dist/RangeSlider.cjs +2 -3
- package/dist/RangeSlider.cjs.map +1 -1
- package/dist/RangeSlider.mjs +3 -4
- package/dist/RangeSlider.mjs.map +1 -1
- package/dist/SearchField.cjs +2 -5
- package/dist/SearchField.cjs.map +1 -1
- package/dist/SearchField.css.map +1 -1
- package/dist/SearchField.mjs +3 -6
- package/dist/SearchField.mjs.map +1 -1
- package/dist/SegmentedControl.cjs +5 -11
- package/dist/SegmentedControl.cjs.map +1 -1
- package/dist/SegmentedControl.css.map +1 -1
- package/dist/SegmentedControl.mjs +6 -12
- package/dist/SegmentedControl.mjs.map +1 -1
- package/dist/Slider.cjs +2 -3
- package/dist/Slider.cjs.map +1 -1
- package/dist/Slider.css.map +1 -1
- package/dist/Slider.mjs +3 -4
- package/dist/Slider.mjs.map +1 -1
- package/dist/StatusLight.cjs +2 -6
- package/dist/StatusLight.cjs.map +1 -1
- package/dist/StatusLight.css.map +1 -1
- package/dist/StatusLight.mjs +2 -6
- package/dist/StatusLight.mjs.map +1 -1
- package/dist/Switch.cjs +2 -6
- package/dist/Switch.cjs.map +1 -1
- package/dist/Switch.css.map +1 -1
- package/dist/Switch.mjs +3 -7
- package/dist/Switch.mjs.map +1 -1
- package/dist/TableView.cjs +9 -21
- package/dist/TableView.cjs.map +1 -1
- package/dist/TableView.css.map +1 -1
- package/dist/TableView.mjs +10 -22
- package/dist/TableView.mjs.map +1 -1
- package/dist/Tabs.cjs +2 -5
- package/dist/Tabs.cjs.map +1 -1
- package/dist/Tabs.css.map +1 -1
- package/dist/Tabs.mjs +2 -5
- package/dist/Tabs.mjs.map +1 -1
- package/dist/TagGroup.cjs +4 -6
- package/dist/TagGroup.cjs.map +1 -1
- package/dist/TagGroup.css.map +1 -1
- package/dist/TagGroup.mjs +4 -6
- package/dist/TagGroup.mjs.map +1 -1
- package/dist/TextField.cjs +8 -19
- package/dist/TextField.cjs.map +1 -1
- package/dist/TextField.css.map +1 -1
- package/dist/TextField.mjs +9 -20
- package/dist/TextField.mjs.map +1 -1
- package/dist/ToggleButton.cjs +2 -6
- package/dist/ToggleButton.cjs.map +1 -1
- package/dist/ToggleButton.css.map +1 -1
- package/dist/ToggleButton.mjs +2 -6
- package/dist/ToggleButton.mjs.map +1 -1
- package/dist/ToggleButtonGroup.cjs +2 -5
- package/dist/ToggleButtonGroup.cjs.map +1 -1
- package/dist/ToggleButtonGroup.mjs +2 -5
- package/dist/ToggleButtonGroup.mjs.map +1 -1
- package/dist/Tooltip.cjs +3 -6
- package/dist/Tooltip.cjs.map +1 -1
- package/dist/Tooltip.css.map +1 -1
- package/dist/Tooltip.mjs +4 -7
- package/dist/Tooltip.mjs.map +1 -1
- package/dist/types.d.ts +64 -64
- package/dist/types.d.ts.map +1 -1
- package/package.json +17 -17
- package/src/Accordion.tsx +5 -8
- package/src/ActionButton.tsx +6 -9
- package/src/ActionButtonGroup.tsx +5 -8
- package/src/ActionMenu.tsx +5 -8
- package/src/AlertDialog.tsx +5 -8
- package/src/Avatar.tsx +5 -8
- package/src/AvatarGroup.tsx +5 -8
- package/src/Badge.tsx +5 -8
- package/src/Breadcrumbs.tsx +6 -12
- package/src/Button.tsx +10 -16
- package/src/ButtonGroup.tsx +5 -8
- package/src/CardView.tsx +2 -5
- package/src/Checkbox.tsx +6 -9
- package/src/CheckboxGroup.tsx +5 -8
- package/src/ClearButton.tsx +2 -5
- package/src/CloseButton.tsx +5 -8
- package/src/ColorArea.tsx +5 -8
- package/src/ColorField.tsx +5 -8
- package/src/ColorSlider.tsx +5 -8
- package/src/ColorSwatch.tsx +5 -8
- package/src/ColorSwatchPicker.tsx +5 -8
- package/src/ColorWheel.tsx +5 -8
- package/src/ComboBox.tsx +5 -8
- package/src/Content.tsx +12 -30
- package/src/ContextualHelp.tsx +5 -8
- package/src/CustomDialog.tsx +5 -8
- package/src/Dialog.tsx +6 -9
- package/src/Disclosure.tsx +15 -24
- package/src/Divider.tsx +6 -9
- package/src/DropZone.tsx +5 -8
- package/src/Field.tsx +6 -15
- package/src/Form.tsx +5 -8
- package/src/FullscreenDialog.tsx +5 -8
- package/src/IllustratedMessage.tsx +6 -9
- package/src/Image.tsx +3 -6
- package/src/InlineAlert.tsx +6 -9
- package/src/Link.tsx +6 -9
- package/src/Menu.tsx +5 -8
- package/src/Meter.tsx +6 -9
- package/src/Modal.tsx +5 -8
- package/src/NumberField.tsx +5 -8
- package/src/Picker.tsx +5 -8
- package/src/Popover.tsx +9 -15
- package/src/ProgressBar.tsx +6 -9
- package/src/ProgressCircle.tsx +6 -9
- package/src/Radio.tsx +6 -9
- package/src/RadioGroup.tsx +6 -9
- package/src/RangeSlider.tsx +2 -5
- package/src/SearchField.tsx +5 -8
- package/src/SegmentedControl.tsx +10 -16
- package/src/Slider.tsx +2 -5
- package/src/StatusLight.tsx +6 -9
- package/src/Switch.tsx +6 -9
- package/src/TableView.tsx +20 -32
- package/src/Tabs.tsx +5 -8
- package/src/TagGroup.tsx +7 -14
- package/src/TextField.tsx +20 -28
- package/src/ToggleButton.tsx +6 -9
- package/src/ToggleButtonGroup.tsx +5 -8
- package/src/Tooltip.tsx +5 -9
package/dist/AlertDialog.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;AAqDD,MAAM;;;;;;;
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;AAqDD,MAAM;;;;;;;AAgBC,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAW;IAC7F,IAAI,kBAAkB,CAAA,GAAA,gDAA0B,EAAE,CAAA,GAAA,mDAAW,GAAG;IAChE,IAAI,mBACF,eAAe,eACf,WAAW,wBACX,oBAAoB,sBACpB,kBAAkB,6BAClB,yBAAyB,2BACzB,uBAAuB,YACvB,WAAW,KAAO,oBAClB,kBAAkB,KAAO,sBACzB,oBAAoB,KAAO,UAC3B,KAAK,YACL,QAAQ,WACR,UAAU,gBACX,GAAG;IAEJ,IAAI,gBAAgB;IACpB,IAAI,YAAY,gBACd,gBAAgB;SACX,IAAI,YAAY,eACrB,gBAAgB;IAGlB,qBACE,gCAAC,CAAA,GAAA,gCAAK;QACJ,MAAK;QACL,KAAK;QACL,MAAM,MAAM,IAAI;QAChB,cAAc,MAAM,YAAY;QAChC,kBAAmB,MAAM,gBAAgB,IAAI;kBAC5C,CAAC,SAAC,KAAK,EAAC,iBACP;;kCACE,gCAAC,CAAA,GAAA,mCAAO;wBACN,QAAQ;4BACN;gCAAC,CAAA,GAAA,qCAAU;gCAAG;oCAAC,QAAQ,2BAAK;iDAAC;oCAAO;gCAAE;6BAAE;yBACzC;kCACD,cAAA,gCAAC,CAAA,GAAA,iCAAM;4BAAE,MAAK;sCACZ,cAAA,iCAAC,CAAA,GAAA,wCAAa;;oCACX,YAAY,yBAAW,gCAAC,CAAA,GAAA,iCAAY;wCAAE,cAAY,gBAAgB,MAAM,CAAC;;oCACzE,YAAY,2BAAa,gCAAC,CAAA,GAAA,iCAAW;wCAAE,cAAY,gBAAgB,MAAM,CAAC;;oCAC1E;;;;;kCAIP,gCAAC,CAAA,GAAA,iCAAM;kCAAG;;kCACV,iCAAC,CAAA,GAAA,qCAAU;;4BACR,6BACC,gCAAC,CAAA,GAAA,gCAAK;gCACJ,SAAS,IAAM,CAAA,GAAA,2BAAI,EAAE,SAAS;gCAC9B,SAAQ;gCACR,WAAU;gCACV,WAAW,oBAAoB;0CAC9B;;4BAGJ,sCACC,gCAAC,CAAA,GAAA,gCAAK;gCACJ,SAAS,IAAM,CAAA,GAAA,2BAAI,EAAE,SAAS;gCAC9B,SAAQ;gCACR,YAAY;gCACZ,WAAU;gCACV,WAAW,oBAAoB;0CAC9B;;0CAGL,gCAAC,CAAA,GAAA,gCAAK;gCACJ,SAAS;gCACT,YAAY;gCACZ,WAAW,oBAAoB;gCAC/B,SAAS,IAAM,CAAA,GAAA,2BAAI,EAAE,SAAS;0CAC7B;;;;;;;AAOf","sources":["packages/@react-spectrum/s2/src/AlertDialog.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 AlertTriangle from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Button} from './Button';\nimport {ButtonGroup} from './ButtonGroup';\nimport {CenterBaseline} from './CenterBaseline';\nimport {chain} from '@react-aria/utils';\nimport {Content, Heading} from './Content';\nimport {Dialog} from './Dialog';\nimport {DOMProps, DOMRef} from '@react-types/shared';\nimport {forwardRef, ReactNode} from 'react';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport NoticeSquare from '../s2wf-icons/S2_Icon_AlertDiamond_20_N.svg';\nimport {Provider} from 'react-aria-components';\nimport {style} from '../style' with {type: 'macro'};\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\n\nexport interface AlertDialogProps extends DOMProps, UnsafeStyles {\n /** The [visual style](https://spectrum.adobe.com/page/alert-dialog/#Options) of the AlertDialog. */\n variant?: 'confirmation' | 'information' | 'destructive' | 'error' | 'warning',\n /** The title of the AlertDialog. */\n title: string,\n /** The contents of the AlertDialog. */\n children: ReactNode,\n /** The label to display within the cancel button. */\n cancelLabel?: string,\n /** The label to display within the confirm button. */\n primaryActionLabel: string,\n /** The label to display within the secondary button. */\n secondaryActionLabel?: string,\n /** Whether the primary button is disabled. */\n isPrimaryActionDisabled?: boolean,\n /** Whether the secondary button is disabled. */\n isSecondaryActionDisabled?: boolean,\n /** Handler that is called when the cancel button is pressed. */\n onCancel?: () => void,\n /** Handler that is called when the primary button is pressed. */\n onPrimaryAction?: () => void,\n /** Handler that is called when the secondary button is pressed. */\n onSecondaryAction?: () => void,\n /** Button to focus by default when the dialog opens. */\n autoFocusButton?: 'cancel' | 'primary' | 'secondary',\n /**\n * The size of the Dialog.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L'\n}\n\nconst icon = style({\n marginEnd: 8,\n '--iconPrimary': {\n type: 'fill',\n value: {\n variant: {\n error: 'negative',\n warning: 'notice'\n }\n }\n }\n});\n\n/**\n * AlertDialogs are a specific type of Dialog. They display important information that users need to acknowledge.\n */\nexport const AlertDialog = forwardRef(function AlertDialog(props: AlertDialogProps, ref: DOMRef) {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let {\n autoFocusButton,\n cancelLabel,\n secondaryActionLabel,\n primaryActionLabel,\n isSecondaryActionDisabled,\n isPrimaryActionDisabled,\n onCancel = () => {},\n onPrimaryAction = () => {},\n onSecondaryAction = () => {},\n title,\n children,\n variant = 'confirmation'\n } = props;\n\n let buttonVariant = 'primary';\n if (variant === 'confirmation') {\n buttonVariant = 'accent';\n } else if (variant === 'destructive') {\n buttonVariant = 'negative';\n }\n\n return (\n <Dialog\n role=\"alertdialog\"\n ref={ref}\n size={props.size}\n UNSAFE_style={props.UNSAFE_style}\n UNSAFE_className={(props.UNSAFE_className || '')}>\n {({close}) => (\n <>\n <Provider\n values={[\n [IconContext, {styles: icon({variant})}]\n ]}>\n <Heading slot=\"title\">\n <CenterBaseline>\n {variant === 'error' && <AlertTriangle aria-label={stringFormatter.format('dialog.alert')} />}\n {variant === 'warning' && <NoticeSquare aria-label={stringFormatter.format('dialog.alert')} />}\n {title}\n </CenterBaseline>\n </Heading>\n </Provider>\n <Content>{children}</Content>\n <ButtonGroup>\n {cancelLabel &&\n <Button\n onPress={() => chain(close(), onCancel())}\n variant=\"secondary\"\n fillStyle=\"outline\"\n autoFocus={autoFocusButton === 'cancel'}>\n {cancelLabel}\n </Button>\n }\n {secondaryActionLabel &&\n <Button\n onPress={() => chain(close(), onSecondaryAction())}\n variant=\"secondary\"\n isDisabled={isSecondaryActionDisabled}\n fillStyle=\"outline\"\n autoFocus={autoFocusButton === 'secondary'}>\n {secondaryActionLabel}\n </Button>\n }\n <Button\n variant={buttonVariant as 'primary' | 'accent' | 'negative'}\n isDisabled={isPrimaryActionDisabled}\n autoFocus={autoFocusButton === 'primary'}\n onPress={() => chain(close(), onPrimaryAction())}>\n {primaryActionLabel}\n </Button>\n </ButtonGroup>\n </>\n )}\n </Dialog>\n );\n});\n"],"names":[],"version":3,"file":"AlertDialog.cjs.map"}
|
package/dist/AlertDialog.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"AA+Da;;;;AAAA;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/AlertDialog.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 AlertTriangle from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Button} from './Button';\nimport {ButtonGroup} from './ButtonGroup';\nimport {CenterBaseline} from './CenterBaseline';\nimport {chain} from '@react-aria/utils';\nimport {Content, Heading} from './Content';\nimport {Dialog} from './Dialog';\nimport {DOMProps, DOMRef} from '@react-types/shared';\nimport {forwardRef, ReactNode} from 'react';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport NoticeSquare from '../s2wf-icons/S2_Icon_AlertDiamond_20_N.svg';\nimport {Provider} from 'react-aria-components';\nimport {style} from '../style' with {type: 'macro'};\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\n\nexport interface AlertDialogProps extends DOMProps, UnsafeStyles {\n /** The [visual style](https://spectrum.adobe.com/page/alert-dialog/#Options) of the AlertDialog. */\n variant?: 'confirmation' | 'information' | 'destructive' | 'error' | 'warning',\n /** The title of the AlertDialog. */\n title: string,\n /** The contents of the AlertDialog. */\n children: ReactNode,\n /** The label to display within the cancel button. */\n cancelLabel?: string,\n /** The label to display within the confirm button. */\n primaryActionLabel: string,\n /** The label to display within the secondary button. */\n secondaryActionLabel?: string,\n /** Whether the primary button is disabled. */\n isPrimaryActionDisabled?: boolean,\n /** Whether the secondary button is disabled. */\n isSecondaryActionDisabled?: boolean,\n /** Handler that is called when the cancel button is pressed. */\n onCancel?: () => void,\n /** Handler that is called when the primary button is pressed. */\n onPrimaryAction?: () => void,\n /** Handler that is called when the secondary button is pressed. */\n onSecondaryAction?: () => void,\n /** Button to focus by default when the dialog opens. */\n autoFocusButton?: 'cancel' | 'primary' | 'secondary',\n /**\n * The size of the Dialog.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L'\n}\n\nconst icon = style({\n marginEnd: 8,\n '--iconPrimary': {\n type: 'fill',\n value: {\n variant: {\n error: 'negative',\n warning: 'notice'\n }\n }\n }\n});\n\
|
|
1
|
+
{"mappings":"AA+Da;;;;AAAA;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/AlertDialog.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 AlertTriangle from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Button} from './Button';\nimport {ButtonGroup} from './ButtonGroup';\nimport {CenterBaseline} from './CenterBaseline';\nimport {chain} from '@react-aria/utils';\nimport {Content, Heading} from './Content';\nimport {Dialog} from './Dialog';\nimport {DOMProps, DOMRef} from '@react-types/shared';\nimport {forwardRef, ReactNode} from 'react';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport NoticeSquare from '../s2wf-icons/S2_Icon_AlertDiamond_20_N.svg';\nimport {Provider} from 'react-aria-components';\nimport {style} from '../style' with {type: 'macro'};\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\n\nexport interface AlertDialogProps extends DOMProps, UnsafeStyles {\n /** The [visual style](https://spectrum.adobe.com/page/alert-dialog/#Options) of the AlertDialog. */\n variant?: 'confirmation' | 'information' | 'destructive' | 'error' | 'warning',\n /** The title of the AlertDialog. */\n title: string,\n /** The contents of the AlertDialog. */\n children: ReactNode,\n /** The label to display within the cancel button. */\n cancelLabel?: string,\n /** The label to display within the confirm button. */\n primaryActionLabel: string,\n /** The label to display within the secondary button. */\n secondaryActionLabel?: string,\n /** Whether the primary button is disabled. */\n isPrimaryActionDisabled?: boolean,\n /** Whether the secondary button is disabled. */\n isSecondaryActionDisabled?: boolean,\n /** Handler that is called when the cancel button is pressed. */\n onCancel?: () => void,\n /** Handler that is called when the primary button is pressed. */\n onPrimaryAction?: () => void,\n /** Handler that is called when the secondary button is pressed. */\n onSecondaryAction?: () => void,\n /** Button to focus by default when the dialog opens. */\n autoFocusButton?: 'cancel' | 'primary' | 'secondary',\n /**\n * The size of the Dialog.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L'\n}\n\nconst icon = style({\n marginEnd: 8,\n '--iconPrimary': {\n type: 'fill',\n value: {\n variant: {\n error: 'negative',\n warning: 'notice'\n }\n }\n }\n});\n\n/**\n * AlertDialogs are a specific type of Dialog. They display important information that users need to acknowledge.\n */\nexport const AlertDialog = forwardRef(function AlertDialog(props: AlertDialogProps, ref: DOMRef) {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let {\n autoFocusButton,\n cancelLabel,\n secondaryActionLabel,\n primaryActionLabel,\n isSecondaryActionDisabled,\n isPrimaryActionDisabled,\n onCancel = () => {},\n onPrimaryAction = () => {},\n onSecondaryAction = () => {},\n title,\n children,\n variant = 'confirmation'\n } = props;\n\n let buttonVariant = 'primary';\n if (variant === 'confirmation') {\n buttonVariant = 'accent';\n } else if (variant === 'destructive') {\n buttonVariant = 'negative';\n }\n\n return (\n <Dialog\n role=\"alertdialog\"\n ref={ref}\n size={props.size}\n UNSAFE_style={props.UNSAFE_style}\n UNSAFE_className={(props.UNSAFE_className || '')}>\n {({close}) => (\n <>\n <Provider\n values={[\n [IconContext, {styles: icon({variant})}]\n ]}>\n <Heading slot=\"title\">\n <CenterBaseline>\n {variant === 'error' && <AlertTriangle aria-label={stringFormatter.format('dialog.alert')} />}\n {variant === 'warning' && <NoticeSquare aria-label={stringFormatter.format('dialog.alert')} />}\n {title}\n </CenterBaseline>\n </Heading>\n </Provider>\n <Content>{children}</Content>\n <ButtonGroup>\n {cancelLabel &&\n <Button\n onPress={() => chain(close(), onCancel())}\n variant=\"secondary\"\n fillStyle=\"outline\"\n autoFocus={autoFocusButton === 'cancel'}>\n {cancelLabel}\n </Button>\n }\n {secondaryActionLabel &&\n <Button\n onPress={() => chain(close(), onSecondaryAction())}\n variant=\"secondary\"\n isDisabled={isSecondaryActionDisabled}\n fillStyle=\"outline\"\n autoFocus={autoFocusButton === 'secondary'}>\n {secondaryActionLabel}\n </Button>\n }\n <Button\n variant={buttonVariant as 'primary' | 'accent' | 'negative'}\n isDisabled={isPrimaryActionDisabled}\n autoFocus={autoFocusButton === 'primary'}\n onPress={() => chain(close(), onPrimaryAction())}>\n {primaryActionLabel}\n </Button>\n </ButtonGroup>\n </>\n )}\n </Dialog>\n );\n});\n"],"names":[],"version":3,"file":"AlertDialog.css.map"}
|
package/dist/AlertDialog.mjs
CHANGED
|
@@ -49,7 +49,7 @@ const $94a8ad475d9a330c$var$icon = function anonymous(props) {
|
|
|
49
49
|
else if (props.variant === "error") rules += ' -rwx0fg_e-e';
|
|
50
50
|
return rules;
|
|
51
51
|
};
|
|
52
|
-
|
|
52
|
+
const $94a8ad475d9a330c$export$de466dd8317b0b75 = /*#__PURE__*/ (0, $2iZqV$forwardRef)(function AlertDialog(props, ref) {
|
|
53
53
|
let stringFormatter = (0, $2iZqV$useLocalizedStringFormatter)((0, ($parcel$interopDefault($2iZqV$intlStringsmjs))), '@react-spectrum/s2');
|
|
54
54
|
let { autoFocusButton: autoFocusButton, cancelLabel: cancelLabel, secondaryActionLabel: secondaryActionLabel, primaryActionLabel: primaryActionLabel, isSecondaryActionDisabled: isSecondaryActionDisabled, isPrimaryActionDisabled: isPrimaryActionDisabled, onCancel: onCancel = ()=>{}, onPrimaryAction: onPrimaryAction = ()=>{}, onSecondaryAction: onSecondaryAction = ()=>{}, title: title, children: children, variant: variant = 'confirmation' } = props;
|
|
55
55
|
let buttonVariant = 'primary';
|
|
@@ -121,10 +121,7 @@ function $94a8ad475d9a330c$var$AlertDialog(props, ref) {
|
|
|
121
121
|
]
|
|
122
122
|
})
|
|
123
123
|
});
|
|
124
|
-
}
|
|
125
|
-
/**
|
|
126
|
-
* AlertDialogs are a specific type of Dialog. They display important information that users need to acknowledge.
|
|
127
|
-
*/ let $94a8ad475d9a330c$export$de466dd8317b0b75 = /*#__PURE__*/ (0, $2iZqV$forwardRef)($94a8ad475d9a330c$var$AlertDialog);
|
|
124
|
+
});
|
|
128
125
|
|
|
129
126
|
|
|
130
127
|
export {$94a8ad475d9a330c$export$de466dd8317b0b75 as AlertDialog};
|
package/dist/AlertDialog.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;AAqDD,MAAM;;;;;;;
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;AAqDD,MAAM;;;;;;;AAgBC,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAW;IAC7F,IAAI,kBAAkB,CAAA,GAAA,kCAA0B,EAAE,CAAA,GAAA,+CAAW,GAAG;IAChE,IAAI,mBACF,eAAe,eACf,WAAW,wBACX,oBAAoB,sBACpB,kBAAkB,6BAClB,yBAAyB,2BACzB,uBAAuB,YACvB,WAAW,KAAO,oBAClB,kBAAkB,KAAO,sBACzB,oBAAoB,KAAO,UAC3B,KAAK,YACL,QAAQ,WACR,UAAU,gBACX,GAAG;IAEJ,IAAI,gBAAgB;IACpB,IAAI,YAAY,gBACd,gBAAgB;SACX,IAAI,YAAY,eACrB,gBAAgB;IAGlB,qBACE,gBAAC,CAAA,GAAA,yCAAK;QACJ,MAAK;QACL,KAAK;QACL,MAAM,MAAM,IAAI;QAChB,cAAc,MAAM,YAAY;QAChC,kBAAmB,MAAM,gBAAgB,IAAI;kBAC5C,CAAC,SAAC,KAAK,EAAC,iBACP;;kCACE,gBAAC,CAAA,GAAA,eAAO;wBACN,QAAQ;4BACN;gCAAC,CAAA,GAAA,yCAAU;gCAAG;oCAAC,QAAQ,2BAAK;iDAAC;oCAAO;gCAAE;6BAAE;yBACzC;kCACD,cAAA,gBAAC,CAAA,GAAA,yCAAM;4BAAE,MAAK;sCACZ,cAAA,iBAAC,CAAA,GAAA,yCAAa;;oCACX,YAAY,yBAAW,gBAAC,CAAA,GAAA,wCAAY;wCAAE,cAAY,gBAAgB,MAAM,CAAC;;oCACzE,YAAY,2BAAa,gBAAC,CAAA,GAAA,wCAAW;wCAAE,cAAY,gBAAgB,MAAM,CAAC;;oCAC1E;;;;;kCAIP,gBAAC,CAAA,GAAA,yCAAM;kCAAG;;kCACV,iBAAC,CAAA,GAAA,yCAAU;;4BACR,6BACC,gBAAC,CAAA,GAAA,yCAAK;gCACJ,SAAS,IAAM,CAAA,GAAA,YAAI,EAAE,SAAS;gCAC9B,SAAQ;gCACR,WAAU;gCACV,WAAW,oBAAoB;0CAC9B;;4BAGJ,sCACC,gBAAC,CAAA,GAAA,yCAAK;gCACJ,SAAS,IAAM,CAAA,GAAA,YAAI,EAAE,SAAS;gCAC9B,SAAQ;gCACR,YAAY;gCACZ,WAAU;gCACV,WAAW,oBAAoB;0CAC9B;;0CAGL,gBAAC,CAAA,GAAA,yCAAK;gCACJ,SAAS;gCACT,YAAY;gCACZ,WAAW,oBAAoB;gCAC/B,SAAS,IAAM,CAAA,GAAA,YAAI,EAAE,SAAS;0CAC7B;;;;;;;AAOf","sources":["packages/@react-spectrum/s2/src/AlertDialog.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 AlertTriangle from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Button} from './Button';\nimport {ButtonGroup} from './ButtonGroup';\nimport {CenterBaseline} from './CenterBaseline';\nimport {chain} from '@react-aria/utils';\nimport {Content, Heading} from './Content';\nimport {Dialog} from './Dialog';\nimport {DOMProps, DOMRef} from '@react-types/shared';\nimport {forwardRef, ReactNode} from 'react';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport NoticeSquare from '../s2wf-icons/S2_Icon_AlertDiamond_20_N.svg';\nimport {Provider} from 'react-aria-components';\nimport {style} from '../style' with {type: 'macro'};\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\n\nexport interface AlertDialogProps extends DOMProps, UnsafeStyles {\n /** The [visual style](https://spectrum.adobe.com/page/alert-dialog/#Options) of the AlertDialog. */\n variant?: 'confirmation' | 'information' | 'destructive' | 'error' | 'warning',\n /** The title of the AlertDialog. */\n title: string,\n /** The contents of the AlertDialog. */\n children: ReactNode,\n /** The label to display within the cancel button. */\n cancelLabel?: string,\n /** The label to display within the confirm button. */\n primaryActionLabel: string,\n /** The label to display within the secondary button. */\n secondaryActionLabel?: string,\n /** Whether the primary button is disabled. */\n isPrimaryActionDisabled?: boolean,\n /** Whether the secondary button is disabled. */\n isSecondaryActionDisabled?: boolean,\n /** Handler that is called when the cancel button is pressed. */\n onCancel?: () => void,\n /** Handler that is called when the primary button is pressed. */\n onPrimaryAction?: () => void,\n /** Handler that is called when the secondary button is pressed. */\n onSecondaryAction?: () => void,\n /** Button to focus by default when the dialog opens. */\n autoFocusButton?: 'cancel' | 'primary' | 'secondary',\n /**\n * The size of the Dialog.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L'\n}\n\nconst icon = style({\n marginEnd: 8,\n '--iconPrimary': {\n type: 'fill',\n value: {\n variant: {\n error: 'negative',\n warning: 'notice'\n }\n }\n }\n});\n\n/**\n * AlertDialogs are a specific type of Dialog. They display important information that users need to acknowledge.\n */\nexport const AlertDialog = forwardRef(function AlertDialog(props: AlertDialogProps, ref: DOMRef) {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let {\n autoFocusButton,\n cancelLabel,\n secondaryActionLabel,\n primaryActionLabel,\n isSecondaryActionDisabled,\n isPrimaryActionDisabled,\n onCancel = () => {},\n onPrimaryAction = () => {},\n onSecondaryAction = () => {},\n title,\n children,\n variant = 'confirmation'\n } = props;\n\n let buttonVariant = 'primary';\n if (variant === 'confirmation') {\n buttonVariant = 'accent';\n } else if (variant === 'destructive') {\n buttonVariant = 'negative';\n }\n\n return (\n <Dialog\n role=\"alertdialog\"\n ref={ref}\n size={props.size}\n UNSAFE_style={props.UNSAFE_style}\n UNSAFE_className={(props.UNSAFE_className || '')}>\n {({close}) => (\n <>\n <Provider\n values={[\n [IconContext, {styles: icon({variant})}]\n ]}>\n <Heading slot=\"title\">\n <CenterBaseline>\n {variant === 'error' && <AlertTriangle aria-label={stringFormatter.format('dialog.alert')} />}\n {variant === 'warning' && <NoticeSquare aria-label={stringFormatter.format('dialog.alert')} />}\n {title}\n </CenterBaseline>\n </Heading>\n </Provider>\n <Content>{children}</Content>\n <ButtonGroup>\n {cancelLabel &&\n <Button\n onPress={() => chain(close(), onCancel())}\n variant=\"secondary\"\n fillStyle=\"outline\"\n autoFocus={autoFocusButton === 'cancel'}>\n {cancelLabel}\n </Button>\n }\n {secondaryActionLabel &&\n <Button\n onPress={() => chain(close(), onSecondaryAction())}\n variant=\"secondary\"\n isDisabled={isSecondaryActionDisabled}\n fillStyle=\"outline\"\n autoFocus={autoFocusButton === 'secondary'}>\n {secondaryActionLabel}\n </Button>\n }\n <Button\n variant={buttonVariant as 'primary' | 'accent' | 'negative'}\n isDisabled={isPrimaryActionDisabled}\n autoFocus={autoFocusButton === 'primary'}\n onPress={() => chain(close(), onPrimaryAction())}>\n {primaryActionLabel}\n </Button>\n </ButtonGroup>\n </>\n )}\n </Dialog>\n );\n});\n"],"names":[],"version":3,"file":"AlertDialog.mjs.map"}
|
package/dist/Avatar.cjs
CHANGED
|
@@ -56,7 +56,7 @@ const $38071d9ce246d4cf$var$imageStyles = function anonymous(props, overrides) {
|
|
|
56
56
|
return rules;
|
|
57
57
|
};
|
|
58
58
|
const $38071d9ce246d4cf$export$a20dad690e1279e2 = /*#__PURE__*/ (0, $1YWJ0$react.createContext)(null);
|
|
59
|
-
|
|
59
|
+
const $38071d9ce246d4cf$export$e2255cf6045e8d47 = /*#__PURE__*/ (0, $1YWJ0$react.forwardRef)(function Avatar(props, ref) {
|
|
60
60
|
[props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $38071d9ce246d4cf$export$a20dad690e1279e2);
|
|
61
61
|
let domRef = (0, $1YWJ0$reactspectrumutils.useDOMRef)(ref);
|
|
62
62
|
let { alt: alt = '', src: src, UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className = '', size: size = 24, isOverBackground: isOverBackground, slot: slot = 'avatar', ...otherProps } = props;
|
|
@@ -80,10 +80,7 @@ function $38071d9ce246d4cf$var$Avatar(props, ref) {
|
|
|
80
80
|
}, props.styles),
|
|
81
81
|
src: src
|
|
82
82
|
});
|
|
83
|
-
}
|
|
84
|
-
/**
|
|
85
|
-
* An avatar is a thumbnail representation of an entity, such as a user or an organization.
|
|
86
|
-
*/ let $38071d9ce246d4cf$export$e2255cf6045e8d47 = /*#__PURE__*/ (0, $1YWJ0$react.forwardRef)($38071d9ce246d4cf$var$Avatar);
|
|
83
|
+
});
|
|
87
84
|
|
|
88
85
|
|
|
89
86
|
//# sourceMappingURL=Avatar.cjs.map
|
package/dist/Avatar.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA4BD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBC,MAAM,0DAAgB,CAAA,GAAA,0BAAY,EAA4D;
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA4BD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBC,MAAM,0DAAgB,CAAA,GAAA,0BAAY,EAA4D;AAK9F,MAAM,0DAAS,CAAA,GAAA,uBAAS,EAAE,SAAS,OAAO,KAAkB,EAAE,GAA6B;IAChG,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,OACF,MAAM,SACN,GAAG,gBACH,YAAY,oBACZ,mBAAmB,UACnB,OAAO,sBACP,gBAAgB,QAChB,OAAO,UACP,GAAG,YACJ,GAAG;IACJ,MAAM,WAAW,CAAA,GAAA,oCAAa,EAAE;IAEhC,IAAI,UAAU,OAAO,KAAK;IAC1B,IAAI,UAAU,QAAQ;IACtB,qBACE,gCAAC,CAAA,GAAA,+BAAI;QACF,GAAG,QAAQ;QACZ,KAAK;QACL,MAAM;QACN,KAAK;QACL,cAAc;YACZ,GAAG,YAAY;YACf,OAAO;YACP,QAAQ;QACV;QACA,kBAAkB;QAClB,QAAQ,kCAAY;8BAAC;qBAAkB;QAAO,GAAG,MAAM,MAAM;QAC7D,KAAK;;AAEX","sources":["packages/@react-spectrum/s2/src/Avatar.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 {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<AvatarProps, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.cjs.map"}
|
package/dist/Avatar.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"AAsCoB;;;;AAAA;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/Avatar.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 {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<AvatarProps, DOMRefValue<HTMLImageElement>>>(null);\n\
|
|
1
|
+
{"mappings":"AAsCoB;;;;AAAA;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/Avatar.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 {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<AvatarProps, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.css.map"}
|
package/dist/Avatar.mjs
CHANGED
|
@@ -49,7 +49,7 @@ const $3ffa2cd930156220$var$imageStyles = function anonymous(props, overrides) {
|
|
|
49
49
|
return rules;
|
|
50
50
|
};
|
|
51
51
|
const $3ffa2cd930156220$export$a20dad690e1279e2 = /*#__PURE__*/ (0, $lGIgj$createContext)(null);
|
|
52
|
-
|
|
52
|
+
const $3ffa2cd930156220$export$e2255cf6045e8d47 = /*#__PURE__*/ (0, $lGIgj$forwardRef)(function Avatar(props, ref) {
|
|
53
53
|
[props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $3ffa2cd930156220$export$a20dad690e1279e2);
|
|
54
54
|
let domRef = (0, $lGIgj$useDOMRef)(ref);
|
|
55
55
|
let { alt: alt = '', src: src, UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className = '', size: size = 24, isOverBackground: isOverBackground, slot: slot = 'avatar', ...otherProps } = props;
|
|
@@ -73,10 +73,7 @@ function $3ffa2cd930156220$var$Avatar(props, ref) {
|
|
|
73
73
|
}, props.styles),
|
|
74
74
|
src: src
|
|
75
75
|
});
|
|
76
|
-
}
|
|
77
|
-
/**
|
|
78
|
-
* An avatar is a thumbnail representation of an entity, such as a user or an organization.
|
|
79
|
-
*/ let $3ffa2cd930156220$export$e2255cf6045e8d47 = /*#__PURE__*/ (0, $lGIgj$forwardRef)($3ffa2cd930156220$var$Avatar);
|
|
76
|
+
});
|
|
80
77
|
|
|
81
78
|
|
|
82
79
|
export {$3ffa2cd930156220$export$a20dad690e1279e2 as AvatarContext, $3ffa2cd930156220$export$e2255cf6045e8d47 as Avatar};
|
package/dist/Avatar.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA4BD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBC,MAAM,0DAAgB,CAAA,GAAA,oBAAY,EAA4D;
|
|
1
|
+
{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA4BD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBC,MAAM,0DAAgB,CAAA,GAAA,oBAAY,EAA4D;AAK9F,MAAM,0DAAS,CAAA,GAAA,iBAAS,EAAE,SAAS,OAAO,KAAkB,EAAE,GAA6B;IAChG,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,OACF,MAAM,SACN,GAAG,gBACH,YAAY,oBACZ,mBAAmB,UACnB,OAAO,sBACP,gBAAgB,QAChB,OAAO,UACP,GAAG,YACJ,GAAG;IACJ,MAAM,WAAW,CAAA,GAAA,qBAAa,EAAE;IAEhC,IAAI,UAAU,OAAO,KAAK;IAC1B,IAAI,UAAU,QAAQ;IACtB,qBACE,gBAAC,CAAA,GAAA,yCAAI;QACF,GAAG,QAAQ;QACZ,KAAK;QACL,MAAM;QACN,KAAK;QACL,cAAc;YACZ,GAAG,YAAY;YACf,OAAO;YACP,QAAQ;QACV;QACA,kBAAkB;QAClB,QAAQ,kCAAY;8BAAC;qBAAkB;QAAO,GAAG,MAAM,MAAM;QAC7D,KAAK;;AAEX","sources":["packages/@react-spectrum/s2/src/Avatar.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 {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<AvatarProps, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.mjs.map"}
|
package/dist/AvatarGroup.cjs
CHANGED
|
@@ -172,7 +172,7 @@ const $5b7eb34c05dfeb90$var$container = function anonymous(props, overrides) {
|
|
|
172
172
|
rules += ' _1c';
|
|
173
173
|
return rules;
|
|
174
174
|
};
|
|
175
|
-
|
|
175
|
+
const $5b7eb34c05dfeb90$export$5b26ebaf2b105908 = /*#__PURE__*/ (0, $6mB16$react.forwardRef)(function AvatarGroup(props, ref) {
|
|
176
176
|
[props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $5b7eb34c05dfeb90$export$4f18251748129091);
|
|
177
177
|
let domRef = (0, $6mB16$reactspectrumutils.useDOMRef)(ref);
|
|
178
178
|
let { children: children, label: label, size: size = 24, styles: styles, UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className, ...otherProps } = props;
|
|
@@ -208,10 +208,7 @@ function $5b7eb34c05dfeb90$var$AvatarGroup(props, ref) {
|
|
|
208
208
|
]
|
|
209
209
|
})
|
|
210
210
|
});
|
|
211
|
-
}
|
|
212
|
-
/**
|
|
213
|
-
* An avatar group is a grouping of avatars that are related to each other.
|
|
214
|
-
*/ let $5b7eb34c05dfeb90$export$5b26ebaf2b105908 = /*#__PURE__*/ (0, $6mB16$react.forwardRef)($5b7eb34c05dfeb90$var$AvatarGroup);
|
|
211
|
+
});
|
|
215
212
|
|
|
216
213
|
|
|
217
214
|
//# sourceMappingURL=AvatarGroup.cjs.map
|
package/dist/AvatarGroup.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AA2BM,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAA+D;AAE7G,MAAM;AAON,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBN,MAAM;;;;;;;;
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AA2BM,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAA+D;AAE7G,MAAM;AAON,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBN,MAAM;;;;;;;;AAQC,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAA2B;IAC7G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,YAAC,QAAQ,SAAE,KAAK,QAAE,OAAO,YAAI,MAAM,gBAAE,YAAY,oBAAE,gBAAgB,EAAE,GAAG,YAAW,GAAG;IAC1F,IAAI,cAAC,UAAU,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,yBAAO,EAAE;QACtC,GAAG,KAAK;QACR,kBAAkB;IACpB;IAEA,qBACE,gCAAC,CAAA,GAAA,uCAAY,EAAE,QAAQ;QAAC,OAAO;YAAC,QAAQ;kBAAQ;YAAM,kBAAkB;QAAI;kBAC1E,cAAA,iCAAC;YACC,KAAK;YACJ,GAAG,CAAA,GAAA,oCAAa,EAAE,WAAW;YAC7B,GAAG,UAAU;YACd,MAAK;YACL,WAAW,AAAC,CAAA,oBAAoB,EAAC,IAAK,gCAAU,MAAM;YACtD,OAAO;gBACL,GAAG,YAAY;gBACf,UAAU,OAAO,KAAK;YACxB;;gBACC;gBACA,uBAAS,gCAAC;oBAAM,GAAG,UAAU;oBAAE,WAAW,2BAAK;wBAAC,MAAM,OAAO;oBAAK;8BAAK;;;;;AAIhF","sources":["packages/@react-spectrum/s2/src/AvatarGroup.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 {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {AvatarContext} from './Avatar';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, CSSProperties, forwardRef, ReactNode} from 'react';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLabel} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarGroupProps extends UnsafeStyles, DOMProps, AriaLabelingProps, SlotProps {\n /** Avatar children of the avatar group. */\n children: ReactNode,\n /** The label for the avatar group. */\n label?: string,\n /**\n * The size of the avatar group.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth\n}\n\nexport const AvatarGroupContext = createContext<ContextValue<AvatarGroupProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst avatar = style({\n marginStart: {\n default: '[calc(var(--size) / -4)]',\n ':first-child': 0\n }\n});\n\nconst text = style({\n marginStart: 8,\n truncate: true,\n font: {\n size: {\n 16: 'ui-xs',\n 20: 'ui-sm',\n 24: 'ui',\n 28: 'ui-lg',\n 32: 'ui-xl',\n 36: 'ui-2xl',\n 40: 'ui-3xl'\n }\n }\n});\n\nconst container = style({\n display: 'flex',\n alignItems: 'center'\n}, getAllowedOverrides({width: false}));\n\n/**\n * An avatar group is a grouping of avatars that are related to each other.\n */\nexport const AvatarGroup = forwardRef(function AvatarGroup(props: AvatarGroupProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarGroupContext);\n let domRef = useDOMRef(ref);\n let {children, label, size = 24, styles, UNSAFE_style, UNSAFE_className, ...otherProps} = props;\n let {labelProps, fieldProps} = useLabel({\n ...props,\n labelElementType: 'span'\n });\n\n return (\n <AvatarContext.Provider value={{styles: avatar, size, isOverBackground: true}}>\n <div\n ref={domRef}\n {...filterDOMProps(otherProps)}\n {...fieldProps}\n role=\"group\"\n className={(UNSAFE_className ?? '') + container(null, styles)}\n style={{\n ...UNSAFE_style,\n '--size': size / 16 + 'rem'\n } as CSSProperties}>\n {children}\n {label && <span {...labelProps} className={text({size: String(size)})}>{label}</span>}\n </div>\n </AvatarContext.Provider>\n );\n});\n"],"names":[],"version":3,"file":"AvatarGroup.cjs.map"}
|
package/dist/AvatarGroup.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"ACuCe;EAAA;;;;EAOF;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;;;;;;;;;;;;;EAAA;;;;EAAA;;;;EAgBK;;;;EAAA;;;;;AAvBH;EAAA;;;;EAOF;;;;EAAA;;;;;AAPE;;AAOF;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAgBK","sources":["0a4c7ff616b39f15","packages/@react-spectrum/s2/src/AvatarGroup.tsx"],"sourcesContent":["@import \"4466692f07e15352\";\n@import \"a5389b273a848c34\";\n@import \"443fa43b7b24f112\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {AvatarContext} from './Avatar';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, CSSProperties, forwardRef, ReactNode} from 'react';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLabel} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarGroupProps extends UnsafeStyles, DOMProps, AriaLabelingProps, SlotProps {\n /** Avatar children of the avatar group. */\n children: ReactNode,\n /** The label for the avatar group. */\n label?: string,\n /**\n * The size of the avatar group.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth\n}\n\nexport const AvatarGroupContext = createContext<ContextValue<AvatarGroupProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst avatar = style({\n marginStart: {\n default: '[calc(var(--size) / -4)]',\n ':first-child': 0\n }\n});\n\nconst text = style({\n marginStart: 8,\n truncate: true,\n font: {\n size: {\n 16: 'ui-xs',\n 20: 'ui-sm',\n 24: 'ui',\n 28: 'ui-lg',\n 32: 'ui-xl',\n 36: 'ui-2xl',\n 40: 'ui-3xl'\n }\n }\n});\n\nconst container = style({\n display: 'flex',\n alignItems: 'center'\n}, getAllowedOverrides({width: false}));\n\
|
|
1
|
+
{"mappings":"ACuCe;EAAA;;;;EAOF;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;;;;;;;;;;;;;EAAA;;;;EAAA;;;;EAgBK;;;;EAAA;;;;;AAvBH;EAAA;;;;EAOF;;;;EAAA;;;;;AAPE;;AAOF;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAgBK","sources":["0a4c7ff616b39f15","packages/@react-spectrum/s2/src/AvatarGroup.tsx"],"sourcesContent":["@import \"4466692f07e15352\";\n@import \"a5389b273a848c34\";\n@import \"443fa43b7b24f112\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {AvatarContext} from './Avatar';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, CSSProperties, forwardRef, ReactNode} from 'react';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLabel} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarGroupProps extends UnsafeStyles, DOMProps, AriaLabelingProps, SlotProps {\n /** Avatar children of the avatar group. */\n children: ReactNode,\n /** The label for the avatar group. */\n label?: string,\n /**\n * The size of the avatar group.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth\n}\n\nexport const AvatarGroupContext = createContext<ContextValue<AvatarGroupProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst avatar = style({\n marginStart: {\n default: '[calc(var(--size) / -4)]',\n ':first-child': 0\n }\n});\n\nconst text = style({\n marginStart: 8,\n truncate: true,\n font: {\n size: {\n 16: 'ui-xs',\n 20: 'ui-sm',\n 24: 'ui',\n 28: 'ui-lg',\n 32: 'ui-xl',\n 36: 'ui-2xl',\n 40: 'ui-3xl'\n }\n }\n});\n\nconst container = style({\n display: 'flex',\n alignItems: 'center'\n}, getAllowedOverrides({width: false}));\n\n/**\n * An avatar group is a grouping of avatars that are related to each other.\n */\nexport const AvatarGroup = forwardRef(function AvatarGroup(props: AvatarGroupProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarGroupContext);\n let domRef = useDOMRef(ref);\n let {children, label, size = 24, styles, UNSAFE_style, UNSAFE_className, ...otherProps} = props;\n let {labelProps, fieldProps} = useLabel({\n ...props,\n labelElementType: 'span'\n });\n\n return (\n <AvatarContext.Provider value={{styles: avatar, size, isOverBackground: true}}>\n <div\n ref={domRef}\n {...filterDOMProps(otherProps)}\n {...fieldProps}\n role=\"group\"\n className={(UNSAFE_className ?? '') + container(null, styles)}\n style={{\n ...UNSAFE_style,\n '--size': size / 16 + 'rem'\n } as CSSProperties}>\n {children}\n {label && <span {...labelProps} className={text({size: String(size)})}>{label}</span>}\n </div>\n </AvatarContext.Provider>\n );\n});\n"],"names":[],"version":3,"file":"AvatarGroup.css.map"}
|
package/dist/AvatarGroup.mjs
CHANGED
|
@@ -165,7 +165,7 @@ const $85e1de65a7290f4a$var$container = function anonymous(props, overrides) {
|
|
|
165
165
|
rules += ' _1c';
|
|
166
166
|
return rules;
|
|
167
167
|
};
|
|
168
|
-
|
|
168
|
+
const $85e1de65a7290f4a$export$5b26ebaf2b105908 = /*#__PURE__*/ (0, $6MvCt$forwardRef)(function AvatarGroup(props, ref) {
|
|
169
169
|
[props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $85e1de65a7290f4a$export$4f18251748129091);
|
|
170
170
|
let domRef = (0, $6MvCt$useDOMRef)(ref);
|
|
171
171
|
let { children: children, label: label, size: size = 24, styles: styles, UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className, ...otherProps } = props;
|
|
@@ -201,10 +201,7 @@ function $85e1de65a7290f4a$var$AvatarGroup(props, ref) {
|
|
|
201
201
|
]
|
|
202
202
|
})
|
|
203
203
|
});
|
|
204
|
-
}
|
|
205
|
-
/**
|
|
206
|
-
* An avatar group is a grouping of avatars that are related to each other.
|
|
207
|
-
*/ let $85e1de65a7290f4a$export$5b26ebaf2b105908 = /*#__PURE__*/ (0, $6MvCt$forwardRef)($85e1de65a7290f4a$var$AvatarGroup);
|
|
204
|
+
});
|
|
208
205
|
|
|
209
206
|
|
|
210
207
|
export {$85e1de65a7290f4a$export$4f18251748129091 as AvatarGroupContext, $85e1de65a7290f4a$export$5b26ebaf2b105908 as AvatarGroup};
|
package/dist/AvatarGroup.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AA2BM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAA+D;AAE7G,MAAM;AAON,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBN,MAAM;;;;;;;;
|
|
1
|
+
{"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AA2BM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAA+D;AAE7G,MAAM;AAON,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBN,MAAM;;;;;;;;AAQC,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAA2B;IAC7G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,YAAC,QAAQ,SAAE,KAAK,QAAE,OAAO,YAAI,MAAM,gBAAE,YAAY,oBAAE,gBAAgB,EAAE,GAAG,YAAW,GAAG;IAC1F,IAAI,cAAC,UAAU,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QACtC,GAAG,KAAK;QACR,kBAAkB;IACpB;IAEA,qBACE,gBAAC,CAAA,GAAA,yCAAY,EAAE,QAAQ;QAAC,OAAO;YAAC,QAAQ;kBAAQ;YAAM,kBAAkB;QAAI;kBAC1E,cAAA,iBAAC;YACC,KAAK;YACJ,GAAG,CAAA,GAAA,qBAAa,EAAE,WAAW;YAC7B,GAAG,UAAU;YACd,MAAK;YACL,WAAW,AAAC,CAAA,oBAAoB,EAAC,IAAK,gCAAU,MAAM;YACtD,OAAO;gBACL,GAAG,YAAY;gBACf,UAAU,OAAO,KAAK;YACxB;;gBACC;gBACA,uBAAS,gBAAC;oBAAM,GAAG,UAAU;oBAAE,WAAW,2BAAK;wBAAC,MAAM,OAAO;oBAAK;8BAAK;;;;;AAIhF","sources":["packages/@react-spectrum/s2/src/AvatarGroup.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 {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {AvatarContext} from './Avatar';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, CSSProperties, forwardRef, ReactNode} from 'react';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLabel} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarGroupProps extends UnsafeStyles, DOMProps, AriaLabelingProps, SlotProps {\n /** Avatar children of the avatar group. */\n children: ReactNode,\n /** The label for the avatar group. */\n label?: string,\n /**\n * The size of the avatar group.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth\n}\n\nexport const AvatarGroupContext = createContext<ContextValue<AvatarGroupProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst avatar = style({\n marginStart: {\n default: '[calc(var(--size) / -4)]',\n ':first-child': 0\n }\n});\n\nconst text = style({\n marginStart: 8,\n truncate: true,\n font: {\n size: {\n 16: 'ui-xs',\n 20: 'ui-sm',\n 24: 'ui',\n 28: 'ui-lg',\n 32: 'ui-xl',\n 36: 'ui-2xl',\n 40: 'ui-3xl'\n }\n }\n});\n\nconst container = style({\n display: 'flex',\n alignItems: 'center'\n}, getAllowedOverrides({width: false}));\n\n/**\n * An avatar group is a grouping of avatars that are related to each other.\n */\nexport const AvatarGroup = forwardRef(function AvatarGroup(props: AvatarGroupProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarGroupContext);\n let domRef = useDOMRef(ref);\n let {children, label, size = 24, styles, UNSAFE_style, UNSAFE_className, ...otherProps} = props;\n let {labelProps, fieldProps} = useLabel({\n ...props,\n labelElementType: 'span'\n });\n\n return (\n <AvatarContext.Provider value={{styles: avatar, size, isOverBackground: true}}>\n <div\n ref={domRef}\n {...filterDOMProps(otherProps)}\n {...fieldProps}\n role=\"group\"\n className={(UNSAFE_className ?? '') + container(null, styles)}\n style={{\n ...UNSAFE_style,\n '--size': size / 16 + 'rem'\n } as CSSProperties}>\n {children}\n {label && <span {...labelProps} className={text({size: String(size)})}>{label}</span>}\n </div>\n </AvatarContext.Provider>\n );\n});\n"],"names":[],"version":3,"file":"AvatarGroup.mjs.map"}
|
package/dist/Badge.cjs
CHANGED
|
@@ -200,7 +200,7 @@ const $660a621e3a266afc$var$badge = function anonymous(props, overrides) {
|
|
|
200
200
|
rules += ' -_375tp1_v-c';
|
|
201
201
|
return rules;
|
|
202
202
|
};
|
|
203
|
-
|
|
203
|
+
const $660a621e3a266afc$export$37acb3580601e69a = /*#__PURE__*/ (0, $26Nq1$react.forwardRef)(function Badge(props, ref) {
|
|
204
204
|
[props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $660a621e3a266afc$export$1d4627584e49159a);
|
|
205
205
|
let { children: children, variant: variant = 'neutral', size: size = 'S', fillStyle: fillStyle = 'bold', ...otherProps } = props; // useProviderProps(props) in v3
|
|
206
206
|
let domRef = (0, $26Nq1$reactspectrumutils.useDOMRef)(ref);
|
|
@@ -241,10 +241,7 @@ function $660a621e3a266afc$var$Badge(props, ref) {
|
|
|
241
241
|
})
|
|
242
242
|
})
|
|
243
243
|
});
|
|
244
|
-
}
|
|
245
|
-
/**
|
|
246
|
-
* Badges are used for showing a small amount of color-categorized metadata, ideal for getting a user's attention.
|
|
247
|
-
*/ let $660a621e3a266afc$export$37acb3580601e69a = /*#__PURE__*/ (0, $26Nq1$react.forwardRef)($660a621e3a266afc$var$Badge);
|
|
244
|
+
});
|
|
248
245
|
|
|
249
246
|
|
|
250
247
|
//# sourceMappingURL=Badge.cjs.map
|
package/dist/Badge.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA0CM,MAAM,0DAAe,CAAA,GAAA,0BAAY,EAAkE;AAE1G,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA0CM,MAAM,0DAAe,CAAA,GAAA,0BAAY,EAAkE;AAE1G,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoIC,MAAM,0DAAQ,CAAA,GAAA,uBAAS,EAAE,SAAS,MAAM,KAAiB,EAAE,GAA2B;IAC3F,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,YACF,QAAQ,WACR,UAAU,iBACV,OAAO,gBACP,YAAY,QACZ,GAAG,YACJ,GAAG,OAAO,gCAAgC;IAC3C,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,aAAa,CAAA,GAAA,sCAAI,EAAE,QAAQ,CAAC,OAAO,CAAC,MAAM,QAAQ,EAAE,KAAK,CAAC,CAAA,IAAK,eAAC,CAAA,GAAA,sCAAI,EAAE,cAAc,CAAC;IAEzF,qBACE,gCAAC,CAAA,GAAA,mCAAO;QACN,QAAQ;YACN;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBAAC,MAAM;gBAA+C;aAAE;YACtE;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,QAAQ,CAAA,GAAA,wCAAa,EAAE;wBAAC,MAAM;wBAAQ,MAAM;oBAAmB;oBAC/D,MAAM;gBACR;aAAE;SACH;kBACD,cAAA,gCAAC,CAAA,GAAA,yCAAc;sBACb,cAAA,gCAAC;gBACE,GAAG,CAAA,GAAA,oCAAa,EAAE,WAAW;gBAC9B,MAAK;gBACL,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,4BAAM;6BAAC;0BAAS;+BAAM;gBAAS,GAAG,MAAM,MAAM;gBAC1F,OAAO,MAAM,YAAY;gBACzB,KAAK;0BAEH,OAAO,aAAa,YAAY,2BAC5B,gCAAC,CAAA,GAAA,8BAAG;8BAAG;qBACP;;;;AAMhB","sources":["packages/@react-spectrum/s2/src/Badge.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 {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {ContextValue, Provider, SlotProps} from 'react-aria-components';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {fontRelative, lightDark, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport React, {createContext, forwardRef, ReactNode} from 'react';\nimport {SkeletonWrapper} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface BadgeStyleProps {\n /**\n * The size of the badge.\n *\n * @default 'S'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The variant changes the background color of the badge. When badge has a semantic meaning, they should use the variant for semantic colors.\n *\n * @default 'neutral'\n */\n variant?: 'accent' | 'informative' | 'neutral' | 'positive' | 'notice' | 'negative' | 'gray' | 'red' | 'orange' | 'yellow' | 'charteuse' | 'celery' | 'green' | 'seafoam' | 'cyan' | 'blue' | 'indigo' | 'purple' | 'fuchsia' | 'magenta' | 'pink' | 'turquoise' | 'brown' | 'cinnamon' | 'silver',\n /**\n * The fill of the badge.\n * @default 'bold'\n */\n fillStyle?: 'bold' | 'subtle' | 'outline'\n}\n\nexport interface BadgeProps extends DOMProps, AriaLabelingProps, StyleProps, BadgeStyleProps, SlotProps {\n /**\n * The content to display in the badge.\n */\n children: ReactNode\n}\n\nexport const BadgeContext = createContext<ContextValue<Partial<BadgeProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst badge = style<BadgeStyleProps>({\n display: 'flex',\n font: 'control',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: 'control',\n minHeight: 'control',\n paddingX: {\n default: 'edge-to-text',\n ':has([slot=icon]:only-child)': 0\n },\n '--labelPadding': {\n type: 'paddingTop',\n value: centerPadding()\n },\n aspectRatio: {\n ':has([slot=icon]:only-child)': 'square'\n },\n '--iconMargin': {\n type: 'marginTop',\n value: {\n default: fontRelative(-2),\n ':has([slot=icon]:only-child)': 0\n }\n },\n columnGap: 'text-to-visual',\n color: {\n fillStyle: {\n bold: {\n default: 'white',\n variant: {\n notice: 'black',\n orange: 'black',\n yellow: 'black',\n charteuse: 'black',\n celery: 'black'\n }\n },\n subtle: 'gray-1000',\n outline: 'gray-1000'\n }\n },\n backgroundColor: {\n fillStyle: {\n bold: {\n variant: {\n accent: 'accent',\n informative: 'informative',\n neutral: 'neutral-subdued',\n positive: 'positive',\n notice: 'notice',\n negative: 'negative',\n gray: 'gray',\n red: 'red',\n orange: 'orange',\n yellow: 'yellow',\n charteuse: 'chartreuse',\n celery: 'celery',\n green: 'green',\n seafoam: 'seafoam',\n cyan: 'cyan',\n blue: 'blue',\n indigo: 'indigo',\n purple: 'purple',\n fuchsia: 'fuchsia',\n magenta: 'magenta',\n pink: 'pink',\n turquoise: 'turquoise',\n brown: 'brown',\n cinnamon: 'cinnamon',\n silver: 'silver'\n }\n },\n subtle: {\n variant: {\n accent: 'accent-subtle',\n informative: 'informative-subtle',\n neutral: 'neutral-subtle',\n positive: 'positive-subtle',\n notice: 'notice-subtle',\n negative: 'negative-subtle',\n gray: 'gray-subtle',\n red: 'red-subtle',\n orange: 'orange-subtle',\n yellow: 'yellow-subtle',\n charteuse: 'chartreuse-subtle',\n celery: 'celery-subtle',\n green: 'green-subtle',\n seafoam: 'seafoam-subtle',\n cyan: 'cyan-subtle',\n blue: 'blue-subtle',\n indigo: 'indigo-subtle',\n purple: 'purple-subtle',\n fuchsia: 'fuchsia-subtle',\n magenta: 'magenta-subtle',\n pink: 'pink-subtle',\n turquoise: 'turquoise-subtle',\n brown: 'brown-subtle',\n cinnamon: 'cinnamon-subtle',\n silver: 'silver-subtle'\n }\n },\n outline: 'layer-2'\n }\n },\n borderStyle: 'solid',\n boxSizing: 'border-box',\n borderWidth: 2,\n borderColor: {\n default: 'transparent',\n fillStyle: {\n outline: {\n variant: {\n accent: lightDark('accent-800', 'accent-900'), // accent-visual-color\n informative: lightDark('informative-800', 'informative-900'), // informative-visual-color\n neutral: lightDark('gray-500', 'gray-600'), // neutral-visual-color\n positive: lightDark('positive-800', 'positive-900'), // positive-visual-color\n notice: lightDark('notice-800', 'notice-900'), // notice-visual-color\n negative: lightDark('negative-800', 'negative-900') // negative-visual-color\n }\n }\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n}, getAllowedOverrides());\n\n/**\n * Badges are used for showing a small amount of color-categorized metadata, ideal for getting a user's attention.\n */\nexport const Badge = forwardRef(function Badge(props: BadgeProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, BadgeContext);\n let {\n children,\n variant = 'neutral',\n size = 'S',\n fillStyle = 'bold',\n ...otherProps\n } = props; // useProviderProps(props) in v3\n let domRef = useDOMRef(ref);\n let isTextOnly = React.Children.toArray(props.children).every(c => !React.isValidElement(c));\n\n return (\n <Provider\n values={[\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n }]\n ]}>\n <SkeletonWrapper>\n <span\n {...filterDOMProps(otherProps)}\n role=\"presentation\"\n className={(props.UNSAFE_className || '') + badge({variant, size, fillStyle}, props.styles)}\n style={props.UNSAFE_style}\n ref={domRef}>\n {\n typeof children === 'string' || isTextOnly\n ? <Text>{children}</Text>\n : children\n }\n </span>\n </SkeletonWrapper>\n </Provider>\n );\n});\n"],"names":[],"version":3,"file":"Badge.cjs.map"}
|
package/dist/Badge.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"ACsDc;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;
|
|
1
|
+
{"mappings":"ACsDc;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAmJiB;;;;EAAA;;;;EAAA;;;;EAEyB;;;;EACtC;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAtJJ;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAmJiB","sources":["31052c90be0d94da","packages/@react-spectrum/s2/src/Badge.tsx"],"sourcesContent":["@import \"08c4d7ffd2baa021\";\n@import \"1aad76937c73131b\";\n@import \"7989dc282effbbd8\";\n@import \"a50d3ac159f93c2b\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {ContextValue, Provider, SlotProps} from 'react-aria-components';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {fontRelative, lightDark, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport React, {createContext, forwardRef, ReactNode} from 'react';\nimport {SkeletonWrapper} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface BadgeStyleProps {\n /**\n * The size of the badge.\n *\n * @default 'S'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The variant changes the background color of the badge. When badge has a semantic meaning, they should use the variant for semantic colors.\n *\n * @default 'neutral'\n */\n variant?: 'accent' | 'informative' | 'neutral' | 'positive' | 'notice' | 'negative' | 'gray' | 'red' | 'orange' | 'yellow' | 'charteuse' | 'celery' | 'green' | 'seafoam' | 'cyan' | 'blue' | 'indigo' | 'purple' | 'fuchsia' | 'magenta' | 'pink' | 'turquoise' | 'brown' | 'cinnamon' | 'silver',\n /**\n * The fill of the badge.\n * @default 'bold'\n */\n fillStyle?: 'bold' | 'subtle' | 'outline'\n}\n\nexport interface BadgeProps extends DOMProps, AriaLabelingProps, StyleProps, BadgeStyleProps, SlotProps {\n /**\n * The content to display in the badge.\n */\n children: ReactNode\n}\n\nexport const BadgeContext = createContext<ContextValue<Partial<BadgeProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst badge = style<BadgeStyleProps>({\n display: 'flex',\n font: 'control',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: 'control',\n minHeight: 'control',\n paddingX: {\n default: 'edge-to-text',\n ':has([slot=icon]:only-child)': 0\n },\n '--labelPadding': {\n type: 'paddingTop',\n value: centerPadding()\n },\n aspectRatio: {\n ':has([slot=icon]:only-child)': 'square'\n },\n '--iconMargin': {\n type: 'marginTop',\n value: {\n default: fontRelative(-2),\n ':has([slot=icon]:only-child)': 0\n }\n },\n columnGap: 'text-to-visual',\n color: {\n fillStyle: {\n bold: {\n default: 'white',\n variant: {\n notice: 'black',\n orange: 'black',\n yellow: 'black',\n charteuse: 'black',\n celery: 'black'\n }\n },\n subtle: 'gray-1000',\n outline: 'gray-1000'\n }\n },\n backgroundColor: {\n fillStyle: {\n bold: {\n variant: {\n accent: 'accent',\n informative: 'informative',\n neutral: 'neutral-subdued',\n positive: 'positive',\n notice: 'notice',\n negative: 'negative',\n gray: 'gray',\n red: 'red',\n orange: 'orange',\n yellow: 'yellow',\n charteuse: 'chartreuse',\n celery: 'celery',\n green: 'green',\n seafoam: 'seafoam',\n cyan: 'cyan',\n blue: 'blue',\n indigo: 'indigo',\n purple: 'purple',\n fuchsia: 'fuchsia',\n magenta: 'magenta',\n pink: 'pink',\n turquoise: 'turquoise',\n brown: 'brown',\n cinnamon: 'cinnamon',\n silver: 'silver'\n }\n },\n subtle: {\n variant: {\n accent: 'accent-subtle',\n informative: 'informative-subtle',\n neutral: 'neutral-subtle',\n positive: 'positive-subtle',\n notice: 'notice-subtle',\n negative: 'negative-subtle',\n gray: 'gray-subtle',\n red: 'red-subtle',\n orange: 'orange-subtle',\n yellow: 'yellow-subtle',\n charteuse: 'chartreuse-subtle',\n celery: 'celery-subtle',\n green: 'green-subtle',\n seafoam: 'seafoam-subtle',\n cyan: 'cyan-subtle',\n blue: 'blue-subtle',\n indigo: 'indigo-subtle',\n purple: 'purple-subtle',\n fuchsia: 'fuchsia-subtle',\n magenta: 'magenta-subtle',\n pink: 'pink-subtle',\n turquoise: 'turquoise-subtle',\n brown: 'brown-subtle',\n cinnamon: 'cinnamon-subtle',\n silver: 'silver-subtle'\n }\n },\n outline: 'layer-2'\n }\n },\n borderStyle: 'solid',\n boxSizing: 'border-box',\n borderWidth: 2,\n borderColor: {\n default: 'transparent',\n fillStyle: {\n outline: {\n variant: {\n accent: lightDark('accent-800', 'accent-900'), // accent-visual-color\n informative: lightDark('informative-800', 'informative-900'), // informative-visual-color\n neutral: lightDark('gray-500', 'gray-600'), // neutral-visual-color\n positive: lightDark('positive-800', 'positive-900'), // positive-visual-color\n notice: lightDark('notice-800', 'notice-900'), // notice-visual-color\n negative: lightDark('negative-800', 'negative-900') // negative-visual-color\n }\n }\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n}, getAllowedOverrides());\n\n/**\n * Badges are used for showing a small amount of color-categorized metadata, ideal for getting a user's attention.\n */\nexport const Badge = forwardRef(function Badge(props: BadgeProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, BadgeContext);\n let {\n children,\n variant = 'neutral',\n size = 'S',\n fillStyle = 'bold',\n ...otherProps\n } = props; // useProviderProps(props) in v3\n let domRef = useDOMRef(ref);\n let isTextOnly = React.Children.toArray(props.children).every(c => !React.isValidElement(c));\n\n return (\n <Provider\n values={[\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n }]\n ]}>\n <SkeletonWrapper>\n <span\n {...filterDOMProps(otherProps)}\n role=\"presentation\"\n className={(props.UNSAFE_className || '') + badge({variant, size, fillStyle}, props.styles)}\n style={props.UNSAFE_style}\n ref={domRef}>\n {\n typeof children === 'string' || isTextOnly\n ? <Text>{children}</Text>\n : children\n }\n </span>\n </SkeletonWrapper>\n </Provider>\n );\n});\n"],"names":[],"version":3,"file":"Badge.css.map"}
|
package/dist/Badge.mjs
CHANGED
|
@@ -189,7 +189,7 @@ const $6357025487dea614$var$badge = function anonymous(props, overrides) {
|
|
|
189
189
|
rules += ' -_375tp1_v-c';
|
|
190
190
|
return rules;
|
|
191
191
|
};
|
|
192
|
-
|
|
192
|
+
const $6357025487dea614$export$37acb3580601e69a = /*#__PURE__*/ (0, $22gMo$forwardRef)(function Badge(props, ref) {
|
|
193
193
|
[props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $6357025487dea614$export$1d4627584e49159a);
|
|
194
194
|
let { children: children, variant: variant = 'neutral', size: size = 'S', fillStyle: fillStyle = 'bold', ...otherProps } = props; // useProviderProps(props) in v3
|
|
195
195
|
let domRef = (0, $22gMo$useDOMRef)(ref);
|
|
@@ -230,10 +230,7 @@ function $6357025487dea614$var$Badge(props, ref) {
|
|
|
230
230
|
})
|
|
231
231
|
})
|
|
232
232
|
});
|
|
233
|
-
}
|
|
234
|
-
/**
|
|
235
|
-
* Badges are used for showing a small amount of color-categorized metadata, ideal for getting a user's attention.
|
|
236
|
-
*/ let $6357025487dea614$export$37acb3580601e69a = /*#__PURE__*/ (0, $22gMo$forwardRef)($6357025487dea614$var$Badge);
|
|
233
|
+
});
|
|
237
234
|
|
|
238
235
|
|
|
239
236
|
export {$6357025487dea614$export$1d4627584e49159a as BadgeContext, $6357025487dea614$export$37acb3580601e69a as Badge};
|
package/dist/Badge.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA0CM,MAAM,0DAAe,CAAA,GAAA,oBAAY,EAAkE;AAE1G,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA0CM,MAAM,0DAAe,CAAA,GAAA,oBAAY,EAAkE;AAE1G,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoIC,MAAM,0DAAQ,CAAA,GAAA,iBAAS,EAAE,SAAS,MAAM,KAAiB,EAAE,GAA2B;IAC3F,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,YACF,QAAQ,WACR,UAAU,iBACV,OAAO,gBACP,YAAY,QACZ,GAAG,YACJ,GAAG,OAAO,gCAAgC;IAC3C,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,aAAa,CAAA,GAAA,YAAI,EAAE,QAAQ,CAAC,OAAO,CAAC,MAAM,QAAQ,EAAE,KAAK,CAAC,CAAA,IAAK,eAAC,CAAA,GAAA,YAAI,EAAE,cAAc,CAAC;IAEzF,qBACE,gBAAC,CAAA,GAAA,eAAO;QACN,QAAQ;YACN;gBAAC,CAAA,GAAA,yCAAU;gBAAG;oBAAC,MAAM;gBAA+C;aAAE;YACtE;gBAAC,CAAA,GAAA,yCAAU;gBAAG;oBACZ,QAAQ,CAAA,GAAA,yCAAa,EAAE;wBAAC,MAAM;wBAAQ,MAAM;oBAAmB;oBAC/D,MAAM;gBACR;aAAE;SACH;kBACD,cAAA,gBAAC,CAAA,GAAA,yCAAc;sBACb,cAAA,gBAAC;gBACE,GAAG,CAAA,GAAA,qBAAa,EAAE,WAAW;gBAC9B,MAAK;gBACL,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,4BAAM;6BAAC;0BAAS;+BAAM;gBAAS,GAAG,MAAM,MAAM;gBAC1F,OAAO,MAAM,YAAY;gBACzB,KAAK;0BAEH,OAAO,aAAa,YAAY,2BAC5B,gBAAC,CAAA,GAAA,yCAAG;8BAAG;qBACP;;;;AAMhB","sources":["packages/@react-spectrum/s2/src/Badge.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 {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {ContextValue, Provider, SlotProps} from 'react-aria-components';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {fontRelative, lightDark, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport React, {createContext, forwardRef, ReactNode} from 'react';\nimport {SkeletonWrapper} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface BadgeStyleProps {\n /**\n * The size of the badge.\n *\n * @default 'S'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The variant changes the background color of the badge. When badge has a semantic meaning, they should use the variant for semantic colors.\n *\n * @default 'neutral'\n */\n variant?: 'accent' | 'informative' | 'neutral' | 'positive' | 'notice' | 'negative' | 'gray' | 'red' | 'orange' | 'yellow' | 'charteuse' | 'celery' | 'green' | 'seafoam' | 'cyan' | 'blue' | 'indigo' | 'purple' | 'fuchsia' | 'magenta' | 'pink' | 'turquoise' | 'brown' | 'cinnamon' | 'silver',\n /**\n * The fill of the badge.\n * @default 'bold'\n */\n fillStyle?: 'bold' | 'subtle' | 'outline'\n}\n\nexport interface BadgeProps extends DOMProps, AriaLabelingProps, StyleProps, BadgeStyleProps, SlotProps {\n /**\n * The content to display in the badge.\n */\n children: ReactNode\n}\n\nexport const BadgeContext = createContext<ContextValue<Partial<BadgeProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst badge = style<BadgeStyleProps>({\n display: 'flex',\n font: 'control',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: 'control',\n minHeight: 'control',\n paddingX: {\n default: 'edge-to-text',\n ':has([slot=icon]:only-child)': 0\n },\n '--labelPadding': {\n type: 'paddingTop',\n value: centerPadding()\n },\n aspectRatio: {\n ':has([slot=icon]:only-child)': 'square'\n },\n '--iconMargin': {\n type: 'marginTop',\n value: {\n default: fontRelative(-2),\n ':has([slot=icon]:only-child)': 0\n }\n },\n columnGap: 'text-to-visual',\n color: {\n fillStyle: {\n bold: {\n default: 'white',\n variant: {\n notice: 'black',\n orange: 'black',\n yellow: 'black',\n charteuse: 'black',\n celery: 'black'\n }\n },\n subtle: 'gray-1000',\n outline: 'gray-1000'\n }\n },\n backgroundColor: {\n fillStyle: {\n bold: {\n variant: {\n accent: 'accent',\n informative: 'informative',\n neutral: 'neutral-subdued',\n positive: 'positive',\n notice: 'notice',\n negative: 'negative',\n gray: 'gray',\n red: 'red',\n orange: 'orange',\n yellow: 'yellow',\n charteuse: 'chartreuse',\n celery: 'celery',\n green: 'green',\n seafoam: 'seafoam',\n cyan: 'cyan',\n blue: 'blue',\n indigo: 'indigo',\n purple: 'purple',\n fuchsia: 'fuchsia',\n magenta: 'magenta',\n pink: 'pink',\n turquoise: 'turquoise',\n brown: 'brown',\n cinnamon: 'cinnamon',\n silver: 'silver'\n }\n },\n subtle: {\n variant: {\n accent: 'accent-subtle',\n informative: 'informative-subtle',\n neutral: 'neutral-subtle',\n positive: 'positive-subtle',\n notice: 'notice-subtle',\n negative: 'negative-subtle',\n gray: 'gray-subtle',\n red: 'red-subtle',\n orange: 'orange-subtle',\n yellow: 'yellow-subtle',\n charteuse: 'chartreuse-subtle',\n celery: 'celery-subtle',\n green: 'green-subtle',\n seafoam: 'seafoam-subtle',\n cyan: 'cyan-subtle',\n blue: 'blue-subtle',\n indigo: 'indigo-subtle',\n purple: 'purple-subtle',\n fuchsia: 'fuchsia-subtle',\n magenta: 'magenta-subtle',\n pink: 'pink-subtle',\n turquoise: 'turquoise-subtle',\n brown: 'brown-subtle',\n cinnamon: 'cinnamon-subtle',\n silver: 'silver-subtle'\n }\n },\n outline: 'layer-2'\n }\n },\n borderStyle: 'solid',\n boxSizing: 'border-box',\n borderWidth: 2,\n borderColor: {\n default: 'transparent',\n fillStyle: {\n outline: {\n variant: {\n accent: lightDark('accent-800', 'accent-900'), // accent-visual-color\n informative: lightDark('informative-800', 'informative-900'), // informative-visual-color\n neutral: lightDark('gray-500', 'gray-600'), // neutral-visual-color\n positive: lightDark('positive-800', 'positive-900'), // positive-visual-color\n notice: lightDark('notice-800', 'notice-900'), // notice-visual-color\n negative: lightDark('negative-800', 'negative-900') // negative-visual-color\n }\n }\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n}, getAllowedOverrides());\n\n/**\n * Badges are used for showing a small amount of color-categorized metadata, ideal for getting a user's attention.\n */\nexport const Badge = forwardRef(function Badge(props: BadgeProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, BadgeContext);\n let {\n children,\n variant = 'neutral',\n size = 'S',\n fillStyle = 'bold',\n ...otherProps\n } = props; // useProviderProps(props) in v3\n let domRef = useDOMRef(ref);\n let isTextOnly = React.Children.toArray(props.children).every(c => !React.isValidElement(c));\n\n return (\n <Provider\n values={[\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n }]\n ]}>\n <SkeletonWrapper>\n <span\n {...filterDOMProps(otherProps)}\n role=\"presentation\"\n className={(props.UNSAFE_className || '') + badge({variant, size, fillStyle}, props.styles)}\n style={props.UNSAFE_style}\n ref={domRef}>\n {\n typeof children === 'string' || isTextOnly\n ? <Text>{children}</Text>\n : children\n }\n </span>\n </SkeletonWrapper>\n </Provider>\n );\n});\n"],"names":[],"version":3,"file":"Badge.mjs.map"}
|