@react-spectrum/s2 3.0.0-nightly-e3ed3c7f6-250130 → 3.0.0-nightly-016590a4a-250131
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/Badge.cjs +2 -1
- package/dist/Badge.cjs.map +1 -1
- package/dist/Badge.css +6 -2
- package/dist/Badge.css.map +1 -1
- package/dist/Badge.mjs +2 -1
- package/dist/Badge.mjs.map +1 -1
- package/dist/Content.cjs.map +1 -1
- package/dist/Content.mjs.map +1 -1
- package/dist/Tabs.cjs +462 -166
- package/dist/Tabs.cjs.map +1 -1
- package/dist/Tabs.css +232 -116
- package/dist/Tabs.css.map +1 -1
- package/dist/Tabs.mjs +463 -167
- package/dist/Tabs.mjs.map +1 -1
- package/dist/TabsPicker.cjs +415 -0
- package/dist/TabsPicker.cjs.map +1 -0
- package/dist/TabsPicker.css +482 -0
- package/dist/TabsPicker.css.map +1 -0
- package/dist/TabsPicker.mjs +409 -0
- package/dist/TabsPicker.mjs.map +1 -0
- package/dist/types.d.ts +12 -7
- package/dist/types.d.ts.map +1 -1
- package/package.json +21 -20
- package/src/Badge.tsx +4 -1
- package/src/Content.tsx +2 -1
- package/src/Tabs.tsx +450 -144
- package/src/TabsPicker.tsx +350 -0
package/dist/Badge.cjs
CHANGED
package/dist/Badge.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA+CM,MAAM,0DAAe,CAAA,GAAA,0BAAY,EAAkE;AAE1G,MAAM
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA+CM,MAAM,0DAAe,CAAA,GAAA,0BAAY,EAAkE;AAE1G,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuIC,MAAM,0DAAQ,CAAA,GAAA,uBAAS,EAAE,SAAS,MAAM,MAAiB,EAAE,GAA2B;IAC3F,CAAC,QAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,QAAO,KAAK;IACnD,IAAI,YACF,QAAQ,WACR,UAAU,iBACV,OAAO,gBACP,YAAY,sBACZ,eAAe,QACf,GAAG,YACJ,GAAG,QAAO,gCAAgC;IAC3C,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,aAAa,CAAA,GAAA,sCAAI,EAAE,QAAQ,CAAC,OAAO,CAAC,OAAM,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;oBACZ,QAAQ;;;;;;;;;;;sBAOL;sCAAC;oBAAY;gBAClB;aAAE;YACF;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,OAAM,gBAAgB,IAAI,EAAC,IAAK,4BAAM;6BAAC;0BAAS;+BAAM;gBAAS,GAAG,OAAM,MAAM;gBAC1F,OAAO,OAAM,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' | 'chartreuse' | '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 * Sets the text behavior for the contents.\n * @default 'wrap'\n */\n overflowMode?: 'wrap' | 'truncate'\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: {\n default: 'baseline',\n ':has([slot=icon]:only-child)': 'center'\n },\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 chartreuse: '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 chartreuse: '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 chartreuse: '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 overflowMode = 'wrap',\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, {\n styles: style({\n paddingY: '--labelPadding', \n order: 1, \n overflowX: 'hidden', \n overflowY: 'hidden', \n textOverflow: 'ellipsis', \n whiteSpace: {overflowMode: {truncate: 'nowrap', wrap: 'normal'}}\n })({overflowMode})\n }],\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
CHANGED
|
@@ -53,8 +53,8 @@
|
|
|
53
53
|
justify-content: center;
|
|
54
54
|
}
|
|
55
55
|
|
|
56
|
-
.
|
|
57
|
-
align-items:
|
|
56
|
+
._5d {
|
|
57
|
+
align-items: baseline;
|
|
58
58
|
}
|
|
59
59
|
|
|
60
60
|
._zh {
|
|
@@ -483,6 +483,10 @@
|
|
|
483
483
|
line-height: 1.5;
|
|
484
484
|
}
|
|
485
485
|
|
|
486
|
+
._5-1dz4pg9c:has([slot="icon"]:only-child) {
|
|
487
|
+
align-items: center;
|
|
488
|
+
}
|
|
489
|
+
|
|
486
490
|
.F-1dz4pg9a:has([slot="icon"]:only-child) {
|
|
487
491
|
padding-inline-start: 0;
|
|
488
492
|
}
|
package/dist/Badge.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"AC2Dc;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;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;
|
|
1
|
+
{"mappings":"AC2Dc;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;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAwJI;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAUsC;;;;EACtC;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAnKJ;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA","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' | 'chartreuse' | '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 * Sets the text behavior for the contents.\n * @default 'wrap'\n */\n overflowMode?: 'wrap' | 'truncate'\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: {\n default: 'baseline',\n ':has([slot=icon]:only-child)': 'center'\n },\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 chartreuse: '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 chartreuse: '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 chartreuse: '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 overflowMode = 'wrap',\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, {\n styles: style({\n paddingY: '--labelPadding', \n order: 1, \n overflowX: 'hidden', \n overflowY: 'hidden', \n textOverflow: 'ellipsis', \n whiteSpace: {overflowMode: {truncate: 'nowrap', wrap: 'normal'}}\n })({overflowMode})\n }],\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
package/dist/Badge.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA+CM,MAAM,0DAAe,CAAA,GAAA,oBAAY,EAAkE;AAE1G,MAAM
|
|
1
|
+
{"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA+CM,MAAM,0DAAe,CAAA,GAAA,oBAAY,EAAkE;AAE1G,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuIC,MAAM,0DAAQ,CAAA,GAAA,iBAAS,EAAE,SAAS,MAAM,MAAiB,EAAE,GAA2B;IAC3F,CAAC,QAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,QAAO,KAAK;IACnD,IAAI,YACF,QAAQ,WACR,UAAU,iBACV,OAAO,gBACP,YAAY,sBACZ,eAAe,QACf,GAAG,YACJ,GAAG,QAAO,gCAAgC;IAC3C,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,aAAa,CAAA,GAAA,YAAI,EAAE,QAAQ,CAAC,OAAO,CAAC,OAAM,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;oBACZ,QAAQ;;;;;;;;;;;sBAOL;sCAAC;oBAAY;gBAClB;aAAE;YACF;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,OAAM,gBAAgB,IAAI,EAAC,IAAK,4BAAM;6BAAC;0BAAS;+BAAM;gBAAS,GAAG,OAAM,MAAM;gBAC1F,OAAO,OAAM,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' | 'chartreuse' | '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 * Sets the text behavior for the contents.\n * @default 'wrap'\n */\n overflowMode?: 'wrap' | 'truncate'\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: {\n default: 'baseline',\n ':has([slot=icon]:only-child)': 'center'\n },\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 chartreuse: '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 chartreuse: '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 chartreuse: '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 overflowMode = 'wrap',\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, {\n styles: style({\n paddingY: '--labelPadding', \n order: 1, \n overflowX: 'hidden', \n overflowY: 'hidden', \n textOverflow: 'ellipsis', \n whiteSpace: {overflowMode: {truncate: 'nowrap', wrap: 'normal'}}\n })({overflowMode})\n }],\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"}
|
package/dist/Content.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Content.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, Keyboard as KeyboardAria, Header as RACHeader, Heading as RACHeading, TextContext as RACTextContext, SlotProps, Text as TextAria} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {inertValue} from '@react-aria/utils';\nimport {StyleString} from '../style/types';\nimport {UnsafeStyles} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useIsSkeleton, useSkeletonText} from './Skeleton';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\ninterface ContentProps extends UnsafeStyles, SlotProps {\n children?: ReactNode,\n styles?: StyleString,\n isHidden?: boolean,\n id?: string\n}\n\ninterface HeadingProps extends ContentProps {\n level?: number\n}\n\nexport const HeadingContext = createContext<ContextValue<HeadingProps, DOMRefValue<HTMLHeadingElement>>>(null);\n\nexport const Heading = forwardRef(// Wrapper around RAC Heading to unmount when hidden.\nfunction Heading(props: HeadingProps, ref: DOMRef<HTMLHeadingElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, HeadingContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n\n return (\n <RACHeading\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const HeaderContext = createContext<ContextValue<ContentProps, DOMRefValue<HTMLElement>>>(null);\n\nexport const Header = forwardRef(function Header(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, HeaderContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n\n return (\n <RACHeader\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const ContentContext = createContext<ContextValue<ContentProps, DOMRefValue<HTMLDivElement>>>(null);\n\nexport const Content = forwardRef(function Content(props: ContentProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ContentContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <div\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const TextContext = createContext<ContextValue<ContentProps, DOMRefValue>>(null);\n\nexport const Text = forwardRef(function Text(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, TextContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, children, ...otherProps} = props;\n let racContext = useContext(RACTextContext);\n let isSkeleton = useIsSkeleton();\n [children, UNSAFE_style] = useSkeletonText(children, UNSAFE_style);\n if (isHidden) {\n return null;\n }\n\n let text = (\n <TextAria\n {...otherProps}\n ref={domRef}\n // @ts-ignore - compatibility with React < 19\n inert={inertValue(isSkeleton)}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined}\n data-rsp-slot=\"text\">\n {children}\n </TextAria>\n );\n\n if (slot && racContext && 'slots' in racContext && !racContext.slots?.[slot]) {\n return <RACTextContext.Provider value={null}>{text}</RACTextContext.Provider>;\n }\n\n return text;\n});\n\nexport const KeyboardContext = createContext<ContextValue<ContentProps, DOMRefValue>>({});\n\nexport const Keyboard = forwardRef(function Keyboard(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, KeyboardContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <KeyboardAria\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const FooterContext = createContext<ContextValue<ContentProps, DOMRefValue>>({});\n\nexport const Footer = forwardRef(function Footer(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, FooterContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <footer\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n"],"names":[],"version":3,"file":"Content.cjs.map"}
|
package/dist/Content.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Content.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, Keyboard as KeyboardAria, Header as RACHeader, Heading as RACHeading, TextContext as RACTextContext, SlotProps, Text as TextAria} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {inertValue} from '@react-aria/utils';\nimport {StyleString} from '../style/types';\nimport {UnsafeStyles} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useIsSkeleton, useSkeletonText} from './Skeleton';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\ninterface ContentProps extends UnsafeStyles, SlotProps {\n children?: ReactNode,\n styles?: StyleString,\n isHidden?: boolean,\n id?: string\n}\n\ninterface HeadingProps extends ContentProps {\n level?: number\n}\n\nexport const HeadingContext = createContext<ContextValue<HeadingProps, DOMRefValue<HTMLHeadingElement>>>(null);\n\nexport const Heading = forwardRef(// Wrapper around RAC Heading to unmount when hidden.\nfunction Heading(props: HeadingProps, ref: DOMRef<HTMLHeadingElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, HeadingContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n\n return (\n <RACHeading\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const HeaderContext = createContext<ContextValue<ContentProps, DOMRefValue<HTMLElement>>>(null);\n\nexport const Header = forwardRef(function Header(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, HeaderContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n\n return (\n <RACHeader\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const ContentContext = createContext<ContextValue<ContentProps, DOMRefValue<HTMLDivElement>>>(null);\n\nexport const Content = forwardRef(function Content(props: ContentProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ContentContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <div\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const TextContext = createContext<ContextValue<ContentProps, DOMRefValue>>(null);\n\nexport const Text = forwardRef(function Text(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, TextContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, children, ...otherProps} = props;\n let racContext = useContext(RACTextContext);\n let isSkeleton = useIsSkeleton();\n [children, UNSAFE_style] = useSkeletonText(children, UNSAFE_style);\n if (isHidden) {\n return null;\n }\n\n let text = (\n <TextAria\n {...otherProps}\n ref={domRef}\n // @ts-ignore - compatibility with React < 19\n inert={inertValue(isSkeleton)}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined}\n data-rsp-slot=\"text\">\n {children}\n </TextAria>\n );\n\n if (slot && racContext && 'slots' in racContext && !racContext.slots?.[slot]) {\n return <RACTextContext.Provider value={null}>{text}</RACTextContext.Provider>;\n }\n\n return text;\n});\n\nexport const KeyboardContext = createContext<ContextValue<ContentProps, DOMRefValue>>({});\n\nexport const Keyboard = forwardRef(function Keyboard(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, KeyboardContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <KeyboardAria\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const FooterContext = createContext<ContextValue<ContentProps, DOMRefValue>>({});\n\nexport const Footer = forwardRef(function Footer(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, FooterContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <footer\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n"],"names":[],"version":3,"file":"Content.mjs.map"}
|