@fluentui/react-radio 9.2.21 → 9.2.23

Sign up to get free protection for your applications and to get access to all the features.
package/CHANGELOG.md CHANGED
@@ -1,12 +1,35 @@
1
1
  # Change Log - @fluentui/react-radio
2
2
 
3
- This log was last generated on Mon, 20 May 2024 12:36:38 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 06 Jun 2024 15:22:27 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.2.23](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.2.23)
8
+
9
+ Thu, 06 Jun 2024 15:22:27 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.2.22..@fluentui/react-radio_v9.2.23)
11
+
12
+ ### Patches
13
+
14
+ - Bump @fluentui/react-field to v9.1.67 ([PR #31586](https://github.com/microsoft/fluentui/pull/31586) by beachball)
15
+ - Bump @fluentui/react-jsx-runtime to v9.0.39 ([PR #31586](https://github.com/microsoft/fluentui/pull/31586) by beachball)
16
+ - Bump @fluentui/react-label to v9.1.71 ([PR #31586](https://github.com/microsoft/fluentui/pull/31586) by beachball)
17
+ - Bump @fluentui/react-tabster to v9.21.5 ([PR #31586](https://github.com/microsoft/fluentui/pull/31586) by beachball)
18
+ - Bump @fluentui/react-utilities to v9.18.10 ([PR #31586](https://github.com/microsoft/fluentui/pull/31586) by beachball)
19
+
20
+ ## [9.2.22](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.2.22)
21
+
22
+ Thu, 23 May 2024 08:02:46 GMT
23
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.2.21..@fluentui/react-radio_v9.2.22)
24
+
25
+ ### Patches
26
+
27
+ - chore: replace usage of .shorthands() in styles ([PR #31449](https://github.com/microsoft/fluentui/pull/31449) by olfedias@microsoft.com)
28
+ - Bump @fluentui/react-tabster to v9.21.4 ([commit](https://github.com/microsoft/fluentui/commit/03599d609e8310b08c57d1f871cffbf717d79207) by beachball)
29
+
7
30
  ## [9.2.21](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.2.21)
8
31
 
9
- Mon, 20 May 2024 12:36:38 GMT
32
+ Mon, 20 May 2024 12:45:02 GMT
10
33
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.2.20..@fluentui/react-radio_v9.2.21)
11
34
 
12
35
  ### Patches
@@ -1,6 +1,6 @@
1
1
  import { createFocusOutlineStyle } from '@fluentui/react-tabster';
2
2
  import { tokens } from '@fluentui/react-theme';
3
- import { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';
3
+ import { __resetStyles, __styles, mergeClasses } from '@griffel/react';
4
4
  export const radioClassNames = {
5
5
  root: 'fui-Radio',
6
6
  indicator: 'fui-Radio__indicator',
@@ -9,9 +9,9 @@ export const radioClassNames = {
9
9
  };
10
10
  // The indicator size is used by the indicator and label styles
11
11
  const indicatorSize = '16px';
12
- const useRootBaseClassName = /*#__PURE__*/__resetStyles("rm0dkue", "rjjxb3w", {
13
- r: [".rm0dkue{display:inline-flex;position:relative;}", ".rm0dkue:focus{outline-style:none;}", ".rm0dkue:focus-visible{outline-style:none;}", ".rm0dkue[data-fui-focus-within]:focus-within{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}", ".rm0dkue[data-fui-focus-within]:focus-within::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}", ".rjjxb3w{display:inline-flex;position:relative;}", ".rjjxb3w:focus{outline-style:none;}", ".rjjxb3w:focus-visible{outline-style:none;}", ".rjjxb3w[data-fui-focus-within]:focus-within{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}", ".rjjxb3w[data-fui-focus-within]:focus-within::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"],
14
- s: ["@media (forced-colors: active){.rm0dkue[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}", "@media (forced-colors: active){.rjjxb3w[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"]
12
+ const useRootBaseClassName = /*#__PURE__*/__resetStyles("r1siqwd8", "rmnplyc", {
13
+ r: [".r1siqwd8{display:inline-flex;position:relative;}", ".r1siqwd8:focus{outline-style:none;}", ".r1siqwd8:focus-visible{outline-style:none;}", ".r1siqwd8[data-fui-focus-within]:focus-within{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}", ".r1siqwd8[data-fui-focus-within]:focus-within::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}", ".rmnplyc{display:inline-flex;position:relative;}", ".rmnplyc:focus{outline-style:none;}", ".rmnplyc:focus-visible{outline-style:none;}", ".rmnplyc[data-fui-focus-within]:focus-within{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}", ".rmnplyc[data-fui-focus-within]:focus-within::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"],
14
+ s: ["@media (forced-colors: active){.r1siqwd8[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}", "@media (forced-colors: active){.rmnplyc[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"]
15
15
  });
16
16
  const useRootStyles = /*#__PURE__*/__styles({
17
17
  vertical: {
@@ -44,10 +44,11 @@ const useIndicatorBaseClassName = /*#__PURE__*/__resetStyles("rwtekvw", null, ["
44
44
  const useLabelStyles = /*#__PURE__*/__styles({
45
45
  base: {
46
46
  qb2dma: "f7nlbp4",
47
- z8tnut: "f1kwiid1",
48
- z189sj: ["f1vdfbxk", "f1f5gg8d"],
49
- Byoj8tv: "f5b47ha",
50
- uwmqm3: ["f1f5gg8d", "f1vdfbxk"]
47
+ Byoj8tv: 0,
48
+ uwmqm3: 0,
49
+ z189sj: 0,
50
+ z8tnut: 0,
51
+ B0ocmuz: "f1f5q0n8"
51
52
  },
52
53
  after: {
53
54
  uwmqm3: ["fruq291", "f7x41pl"],
@@ -59,7 +60,9 @@ const useLabelStyles = /*#__PURE__*/__styles({
59
60
  fsow6f: "f17mccla"
60
61
  }
61
62
  }, {
62
- d: [".f7nlbp4{align-self:center;}", ".f1kwiid1{padding-top:var(--spacingVerticalS);}", ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}", ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}", ".f5b47ha{padding-bottom:var(--spacingVerticalS);}", ".fruq291{padding-left:var(--spacingHorizontalXS);}", ".f7x41pl{padding-right:var(--spacingHorizontalXS);}", ".fjzwpt6{margin-top:calc((16px - var(--lineHeightBase300)) / 2);}", ".fh6j2fo{margin-bottom:calc((16px - var(--lineHeightBase300)) / 2);}", ".f1ywm7hm{padding-top:var(--spacingVerticalXS);}", ".f17mccla{text-align:center;}"]
63
+ d: [".f7nlbp4{align-self:center;}", [".f1f5q0n8{padding:var(--spacingVerticalS) var(--spacingHorizontalS);}", {
64
+ p: -1
65
+ }], ".fruq291{padding-left:var(--spacingHorizontalXS);}", ".f7x41pl{padding-right:var(--spacingHorizontalXS);}", ".fjzwpt6{margin-top:calc((16px - var(--lineHeightBase300)) / 2);}", ".fh6j2fo{margin-bottom:calc((16px - var(--lineHeightBase300)) / 2);}", ".f1ywm7hm{padding-top:var(--spacingVerticalXS);}", ".f17mccla{text-align:center;}"]
63
66
  });
64
67
  /**
65
68
  * Apply styling to the Radio slots based on the state
@@ -1 +1 @@
1
- {"version":3,"names":["createFocusOutlineStyle","tokens","__resetStyles","__styles","mergeClasses","shorthands","radioClassNames","root","indicator","input","label","indicatorSize","useRootBaseClassName","r","s","useRootStyles","vertical","Beiy3e4","Bt984gj","d","useInputBaseClassName","useInputStyles","below","a9b677","Bqenvij","defaultIndicator","Blbys7f","customIndicator","Bj53wkj","useIndicatorBaseClassName","useLabelStyles","base","qb2dma","z8tnut","z189sj","Byoj8tv","uwmqm3","after","B6of3ja","jrapky","fsow6f","useRadioStyles_unstable","state","labelPosition","rootBaseClassName","rootStyles","className","inputBaseClassName","inputStyles","children","indicatorBaseClassName","labelStyles"],"sources":["useRadioStyles.styles.js"],"sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nexport const radioClassNames = {\n root: 'fui-Radio',\n indicator: 'fui-Radio__indicator',\n input: 'fui-Radio__input',\n label: 'fui-Radio__label'\n};\n// The indicator size is used by the indicator and label styles\nconst indicatorSize = '16px';\nconst useRootBaseClassName = makeResetStyles({\n display: 'inline-flex',\n position: 'relative',\n ...createFocusOutlineStyle({\n style: {},\n selector: 'focus-within'\n })\n});\nconst useRootStyles = makeStyles({\n vertical: {\n flexDirection: 'column',\n alignItems: 'center'\n }\n});\nconst useInputBaseClassName = makeResetStyles({\n position: 'absolute',\n left: 0,\n top: 0,\n width: `calc(${indicatorSize} + 2 * ${tokens.spacingHorizontalS})`,\n height: '100%',\n boxSizing: 'border-box',\n margin: 0,\n opacity: 0,\n ':enabled': {\n cursor: 'pointer',\n [`& ~ .${radioClassNames.label}`]: {\n cursor: 'pointer'\n }\n },\n // Colors for the unchecked state\n ':enabled:not(:checked)': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground3\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorNeutralStrokeAccessible,\n '@media (forced-colors: active)': {\n borderColor: 'ButtonBorder'\n }\n },\n ':hover': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground2\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorNeutralStrokeAccessibleHover\n }\n },\n ':hover:active': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground1\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorNeutralStrokeAccessiblePressed\n }\n }\n },\n // Colors for the checked state\n ':enabled:checked': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground1\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorCompoundBrandStroke,\n color: tokens.colorCompoundBrandForeground1,\n '@media (forced-colors: active)': {\n borderColor: 'Highlight',\n color: 'Highlight',\n '::after': {\n backgroundColor: 'Highlight'\n }\n }\n },\n ':hover': {\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorCompoundBrandStrokeHover,\n color: tokens.colorCompoundBrandForeground1Hover\n }\n },\n ':hover:active': {\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorCompoundBrandStrokePressed,\n color: tokens.colorCompoundBrandForeground1Pressed\n }\n }\n },\n // Colors for the disabled state\n ':disabled': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n cursor: 'default',\n '@media (forced-colors: active)': {\n color: 'GrayText'\n }\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorNeutralStrokeDisabled,\n color: tokens.colorNeutralForegroundDisabled,\n '@media (forced-colors: active)': {\n borderColor: 'GrayText',\n color: 'GrayText',\n '::after': {\n backgroundColor: 'GrayText'\n }\n }\n }\n }\n});\nconst useInputStyles = makeStyles({\n below: {\n width: '100%',\n height: `calc(${indicatorSize} + 2 * ${tokens.spacingVerticalS})`\n },\n // If the indicator has no children, use the ::after pseudo-element for the checked state\n defaultIndicator: {\n [`:checked ~ .${radioClassNames.indicator}::after`]: {\n content: '\"\"'\n }\n },\n // If the indicator has a child, hide it until the radio is checked\n customIndicator: {\n [`:not(:checked) ~ .${radioClassNames.indicator} > *`]: {\n opacity: '0'\n }\n }\n});\nconst useIndicatorBaseClassName = makeResetStyles({\n position: 'relative',\n width: indicatorSize,\n height: indicatorSize,\n fontSize: '12px',\n boxSizing: 'border-box',\n flexShrink: 0,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n overflow: 'hidden',\n border: tokens.strokeWidthThin + ' solid',\n borderRadius: tokens.borderRadiusCircular,\n margin: tokens.spacingVerticalS + ' ' + tokens.spacingHorizontalS,\n fill: 'currentColor',\n pointerEvents: 'none',\n '::after': {\n position: 'absolute',\n width: indicatorSize,\n height: indicatorSize,\n borderRadius: tokens.borderRadiusCircular,\n // Use a transform to avoid pixel rounding errors at 125% DPI\n // https://github.com/microsoft/fluentui/issues/30025\n transform: 'scale(0.625)',\n backgroundColor: 'currentColor'\n }\n});\n// Can't use makeResetStyles here because Label is a component that may itself use makeResetStyles.\nconst useLabelStyles = makeStyles({\n base: {\n alignSelf: 'center',\n ...shorthands.padding(tokens.spacingVerticalS, tokens.spacingHorizontalS)\n },\n after: {\n paddingLeft: tokens.spacingHorizontalXS,\n // Use a (negative) margin to account for the difference between the indicator's height and the label's line height.\n // This prevents the label from expanding the height of the Radio, but preserves line height if the label wraps.\n marginTop: `calc((${indicatorSize} - ${tokens.lineHeightBase300}) / 2)`,\n marginBottom: `calc((${indicatorSize} - ${tokens.lineHeightBase300}) / 2)`\n },\n below: {\n paddingTop: tokens.spacingVerticalXS,\n textAlign: 'center'\n }\n});\n/**\n * Apply styling to the Radio slots based on the state\n */ export const useRadioStyles_unstable = (state)=>{\n const { labelPosition } = state;\n const rootBaseClassName = useRootBaseClassName();\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(radioClassNames.root, rootBaseClassName, labelPosition === 'below' && rootStyles.vertical, state.root.className);\n const inputBaseClassName = useInputBaseClassName();\n const inputStyles = useInputStyles();\n state.input.className = mergeClasses(radioClassNames.input, inputBaseClassName, labelPosition === 'below' && inputStyles.below, state.indicator.children ? inputStyles.customIndicator : inputStyles.defaultIndicator, state.input.className);\n const indicatorBaseClassName = useIndicatorBaseClassName();\n state.indicator.className = mergeClasses(radioClassNames.indicator, indicatorBaseClassName, state.indicator.className);\n const labelStyles = useLabelStyles();\n if (state.label) {\n state.label.className = mergeClasses(radioClassNames.label, labelStyles.base, labelStyles[labelPosition], state.label.className);\n }\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["createFocusOutlineStyle","tokens","__resetStyles","__styles","mergeClasses","radioClassNames","root","indicator","input","label","indicatorSize","useRootBaseClassName","r","s","useRootStyles","vertical","Beiy3e4","Bt984gj","d","useInputBaseClassName","useInputStyles","below","a9b677","Bqenvij","defaultIndicator","Blbys7f","customIndicator","Bj53wkj","useIndicatorBaseClassName","useLabelStyles","base","qb2dma","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","after","B6of3ja","jrapky","fsow6f","p","useRadioStyles_unstable","state","labelPosition","rootBaseClassName","rootStyles","className","inputBaseClassName","inputStyles","children","indicatorBaseClassName","labelStyles"],"sources":["useRadioStyles.styles.js"],"sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nexport const radioClassNames = {\n root: 'fui-Radio',\n indicator: 'fui-Radio__indicator',\n input: 'fui-Radio__input',\n label: 'fui-Radio__label'\n};\n// The indicator size is used by the indicator and label styles\nconst indicatorSize = '16px';\nconst useRootBaseClassName = makeResetStyles({\n display: 'inline-flex',\n position: 'relative',\n ...createFocusOutlineStyle({\n style: {},\n selector: 'focus-within'\n })\n});\nconst useRootStyles = makeStyles({\n vertical: {\n flexDirection: 'column',\n alignItems: 'center'\n }\n});\nconst useInputBaseClassName = makeResetStyles({\n position: 'absolute',\n left: 0,\n top: 0,\n width: `calc(${indicatorSize} + 2 * ${tokens.spacingHorizontalS})`,\n height: '100%',\n boxSizing: 'border-box',\n margin: 0,\n opacity: 0,\n ':enabled': {\n cursor: 'pointer',\n [`& ~ .${radioClassNames.label}`]: {\n cursor: 'pointer'\n }\n },\n // Colors for the unchecked state\n ':enabled:not(:checked)': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground3\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorNeutralStrokeAccessible,\n '@media (forced-colors: active)': {\n borderColor: 'ButtonBorder'\n }\n },\n ':hover': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground2\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorNeutralStrokeAccessibleHover\n }\n },\n ':hover:active': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground1\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorNeutralStrokeAccessiblePressed\n }\n }\n },\n // Colors for the checked state\n ':enabled:checked': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground1\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorCompoundBrandStroke,\n color: tokens.colorCompoundBrandForeground1,\n '@media (forced-colors: active)': {\n borderColor: 'Highlight',\n color: 'Highlight',\n '::after': {\n backgroundColor: 'Highlight'\n }\n }\n },\n ':hover': {\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorCompoundBrandStrokeHover,\n color: tokens.colorCompoundBrandForeground1Hover\n }\n },\n ':hover:active': {\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorCompoundBrandStrokePressed,\n color: tokens.colorCompoundBrandForeground1Pressed\n }\n }\n },\n // Colors for the disabled state\n ':disabled': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n cursor: 'default',\n '@media (forced-colors: active)': {\n color: 'GrayText'\n }\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n borderColor: tokens.colorNeutralStrokeDisabled,\n color: tokens.colorNeutralForegroundDisabled,\n '@media (forced-colors: active)': {\n borderColor: 'GrayText',\n color: 'GrayText',\n '::after': {\n backgroundColor: 'GrayText'\n }\n }\n }\n }\n});\nconst useInputStyles = makeStyles({\n below: {\n width: '100%',\n height: `calc(${indicatorSize} + 2 * ${tokens.spacingVerticalS})`\n },\n // If the indicator has no children, use the ::after pseudo-element for the checked state\n defaultIndicator: {\n [`:checked ~ .${radioClassNames.indicator}::after`]: {\n content: '\"\"'\n }\n },\n // If the indicator has a child, hide it until the radio is checked\n customIndicator: {\n [`:not(:checked) ~ .${radioClassNames.indicator} > *`]: {\n opacity: '0'\n }\n }\n});\nconst useIndicatorBaseClassName = makeResetStyles({\n position: 'relative',\n width: indicatorSize,\n height: indicatorSize,\n fontSize: '12px',\n boxSizing: 'border-box',\n flexShrink: 0,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n overflow: 'hidden',\n border: tokens.strokeWidthThin + ' solid',\n borderRadius: tokens.borderRadiusCircular,\n margin: tokens.spacingVerticalS + ' ' + tokens.spacingHorizontalS,\n fill: 'currentColor',\n pointerEvents: 'none',\n '::after': {\n position: 'absolute',\n width: indicatorSize,\n height: indicatorSize,\n borderRadius: tokens.borderRadiusCircular,\n // Use a transform to avoid pixel rounding errors at 125% DPI\n // https://github.com/microsoft/fluentui/issues/30025\n transform: 'scale(0.625)',\n backgroundColor: 'currentColor'\n }\n});\n// Can't use makeResetStyles here because Label is a component that may itself use makeResetStyles.\nconst useLabelStyles = makeStyles({\n base: {\n alignSelf: 'center',\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS}`\n },\n after: {\n paddingLeft: tokens.spacingHorizontalXS,\n // Use a (negative) margin to account for the difference between the indicator's height and the label's line height.\n // This prevents the label from expanding the height of the Radio, but preserves line height if the label wraps.\n marginTop: `calc((${indicatorSize} - ${tokens.lineHeightBase300}) / 2)`,\n marginBottom: `calc((${indicatorSize} - ${tokens.lineHeightBase300}) / 2)`\n },\n below: {\n paddingTop: tokens.spacingVerticalXS,\n textAlign: 'center'\n }\n});\n/**\n * Apply styling to the Radio slots based on the state\n */ export const useRadioStyles_unstable = (state)=>{\n const { labelPosition } = state;\n const rootBaseClassName = useRootBaseClassName();\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(radioClassNames.root, rootBaseClassName, labelPosition === 'below' && rootStyles.vertical, state.root.className);\n const inputBaseClassName = useInputBaseClassName();\n const inputStyles = useInputStyles();\n state.input.className = mergeClasses(radioClassNames.input, inputBaseClassName, labelPosition === 'below' && inputStyles.below, state.indicator.children ? inputStyles.customIndicator : inputStyles.defaultIndicator, state.input.className);\n const indicatorBaseClassName = useIndicatorBaseClassName();\n state.indicator.className = mergeClasses(radioClassNames.indicator, indicatorBaseClassName, state.indicator.className);\n const labelStyles = useLabelStyles();\n if (state.label) {\n state.label.className = mergeClasses(radioClassNames.label, labelStyles.base, labelStyles[labelPosition], state.label.className);\n }\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
@@ -25,22 +25,22 @@ const radioClassNames = {
25
25
  };
26
26
  // The indicator size is used by the indicator and label styles
27
27
  const indicatorSize = '16px';
28
- const useRootBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("rm0dkue", "rjjxb3w", {
28
+ const useRootBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r1siqwd8", "rmnplyc", {
29
29
  r: [
30
- ".rm0dkue{display:inline-flex;position:relative;}",
31
- ".rm0dkue:focus{outline-style:none;}",
32
- ".rm0dkue:focus-visible{outline-style:none;}",
33
- ".rm0dkue[data-fui-focus-within]:focus-within{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
34
- ".rm0dkue[data-fui-focus-within]:focus-within::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}",
35
- ".rjjxb3w{display:inline-flex;position:relative;}",
36
- ".rjjxb3w:focus{outline-style:none;}",
37
- ".rjjxb3w:focus-visible{outline-style:none;}",
38
- ".rjjxb3w[data-fui-focus-within]:focus-within{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
39
- ".rjjxb3w[data-fui-focus-within]:focus-within::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
30
+ ".r1siqwd8{display:inline-flex;position:relative;}",
31
+ ".r1siqwd8:focus{outline-style:none;}",
32
+ ".r1siqwd8:focus-visible{outline-style:none;}",
33
+ ".r1siqwd8[data-fui-focus-within]:focus-within{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
34
+ ".r1siqwd8[data-fui-focus-within]:focus-within::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}",
35
+ ".rmnplyc{display:inline-flex;position:relative;}",
36
+ ".rmnplyc:focus{outline-style:none;}",
37
+ ".rmnplyc:focus-visible{outline-style:none;}",
38
+ ".rmnplyc[data-fui-focus-within]:focus-within{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
39
+ ".rmnplyc[data-fui-focus-within]:focus-within::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
40
40
  ],
41
41
  s: [
42
- "@media (forced-colors: active){.rm0dkue[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
43
- "@media (forced-colors: active){.rjjxb3w[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"
42
+ "@media (forced-colors: active){.r1siqwd8[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
43
+ "@media (forced-colors: active){.rmnplyc[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"
44
44
  ]
45
45
  });
46
46
  const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
@@ -125,16 +125,11 @@ const useIndicatorBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("rwtek
125
125
  const useLabelStyles = /*#__PURE__*/ (0, _react.__styles)({
126
126
  base: {
127
127
  qb2dma: "f7nlbp4",
128
- z8tnut: "f1kwiid1",
129
- z189sj: [
130
- "f1vdfbxk",
131
- "f1f5gg8d"
132
- ],
133
- Byoj8tv: "f5b47ha",
134
- uwmqm3: [
135
- "f1f5gg8d",
136
- "f1vdfbxk"
137
- ]
128
+ Byoj8tv: 0,
129
+ uwmqm3: 0,
130
+ z189sj: 0,
131
+ z8tnut: 0,
132
+ B0ocmuz: "f1f5q0n8"
138
133
  },
139
134
  after: {
140
135
  uwmqm3: [
@@ -151,10 +146,12 @@ const useLabelStyles = /*#__PURE__*/ (0, _react.__styles)({
151
146
  }, {
152
147
  d: [
153
148
  ".f7nlbp4{align-self:center;}",
154
- ".f1kwiid1{padding-top:var(--spacingVerticalS);}",
155
- ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}",
156
- ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}",
157
- ".f5b47ha{padding-bottom:var(--spacingVerticalS);}",
149
+ [
150
+ ".f1f5q0n8{padding:var(--spacingVerticalS) var(--spacingHorizontalS);}",
151
+ {
152
+ p: -1
153
+ }
154
+ ],
158
155
  ".fruq291{padding-left:var(--spacingHorizontalXS);}",
159
156
  ".f7x41pl{padding-right:var(--spacingHorizontalXS);}",
160
157
  ".fjzwpt6{margin-top:calc((16px - var(--lineHeightBase300)) / 2);}",
@@ -1 +1 @@
1
- {"version":3,"sources":["useRadioStyles.styles.js"],"sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';\nexport const radioClassNames = {\n root: 'fui-Radio',\n indicator: 'fui-Radio__indicator',\n input: 'fui-Radio__input',\n label: 'fui-Radio__label'\n};\n// The indicator size is used by the indicator and label styles\nconst indicatorSize = '16px';\nconst useRootBaseClassName = /*#__PURE__*/__resetStyles(\"rm0dkue\", \"rjjxb3w\", {\n r: [\".rm0dkue{display:inline-flex;position:relative;}\", \".rm0dkue:focus{outline-style:none;}\", \".rm0dkue:focus-visible{outline-style:none;}\", \".rm0dkue[data-fui-focus-within]:focus-within{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}\", \".rm0dkue[data-fui-focus-within]:focus-within::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}\", \".rjjxb3w{display:inline-flex;position:relative;}\", \".rjjxb3w:focus{outline-style:none;}\", \".rjjxb3w:focus-visible{outline-style:none;}\", \".rjjxb3w[data-fui-focus-within]:focus-within{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}\", \".rjjxb3w[data-fui-focus-within]:focus-within::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}\"],\n s: [\"@media (forced-colors: active){.rm0dkue[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}\", \"@media (forced-colors: active){.rjjxb3w[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}\"]\n});\nconst useRootStyles = /*#__PURE__*/__styles({\n vertical: {\n Beiy3e4: \"f1vx9l62\",\n Bt984gj: \"f122n59\"\n }\n}, {\n d: [\".f1vx9l62{flex-direction:column;}\", \".f122n59{align-items:center;}\"]\n});\nconst useInputBaseClassName = /*#__PURE__*/__resetStyles(\"rg1upok\", \"rzwdzb4\", {\n r: [\".rg1upok{position:absolute;left:0;top:0;width:calc(16px + 2 * var(--spacingHorizontalS));height:100%;box-sizing:border-box;margin:0;opacity:0;}\", \".rg1upok:enabled{cursor:pointer;}\", \".rg1upok:enabled~.fui-Radio__label{cursor:pointer;}\", \".rg1upok:enabled:not(:checked)~.fui-Radio__label{color:var(--colorNeutralForeground3);}\", \".rg1upok:enabled:not(:checked)~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessible);}\", \".rg1upok:enabled:not(:checked):hover~.fui-Radio__label{color:var(--colorNeutralForeground2);}\", \".rg1upok:enabled:not(:checked):hover~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessibleHover);}\", \".rg1upok:enabled:not(:checked):hover:active~.fui-Radio__label{color:var(--colorNeutralForeground1);}\", \".rg1upok:enabled:not(:checked):hover:active~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessiblePressed);}\", \".rg1upok:enabled:checked~.fui-Radio__label{color:var(--colorNeutralForeground1);}\", \".rg1upok:enabled:checked~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStroke);color:var(--colorCompoundBrandForeground1);}\", \".rg1upok:enabled:checked:hover~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStrokeHover);color:var(--colorCompoundBrandForeground1Hover);}\", \".rg1upok:enabled:checked:hover:active~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStrokePressed);color:var(--colorCompoundBrandForeground1Pressed);}\", \".rg1upok:disabled~.fui-Radio__label{color:var(--colorNeutralForegroundDisabled);cursor:default;}\", \".rg1upok:disabled~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeDisabled);color:var(--colorNeutralForegroundDisabled);}\", \".rzwdzb4{position:absolute;right:0;top:0;width:calc(16px + 2 * var(--spacingHorizontalS));height:100%;box-sizing:border-box;margin:0;opacity:0;}\", \".rzwdzb4:enabled{cursor:pointer;}\", \".rzwdzb4:enabled~.fui-Radio__label{cursor:pointer;}\", \".rzwdzb4:enabled:not(:checked)~.fui-Radio__label{color:var(--colorNeutralForeground3);}\", \".rzwdzb4:enabled:not(:checked)~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessible);}\", \".rzwdzb4:enabled:not(:checked):hover~.fui-Radio__label{color:var(--colorNeutralForeground2);}\", \".rzwdzb4:enabled:not(:checked):hover~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessibleHover);}\", \".rzwdzb4:enabled:not(:checked):hover:active~.fui-Radio__label{color:var(--colorNeutralForeground1);}\", \".rzwdzb4:enabled:not(:checked):hover:active~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessiblePressed);}\", \".rzwdzb4:enabled:checked~.fui-Radio__label{color:var(--colorNeutralForeground1);}\", \".rzwdzb4:enabled:checked~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStroke);color:var(--colorCompoundBrandForeground1);}\", \".rzwdzb4:enabled:checked:hover~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStrokeHover);color:var(--colorCompoundBrandForeground1Hover);}\", \".rzwdzb4:enabled:checked:hover:active~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStrokePressed);color:var(--colorCompoundBrandForeground1Pressed);}\", \".rzwdzb4:disabled~.fui-Radio__label{color:var(--colorNeutralForegroundDisabled);cursor:default;}\", \".rzwdzb4:disabled~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeDisabled);color:var(--colorNeutralForegroundDisabled);}\"],\n s: [\"@media (forced-colors: active){.rg1upok:enabled:not(:checked)~.fui-Radio__indicator{border-color:ButtonBorder;}}\", \"@media (forced-colors: active){.rg1upok:enabled:checked~.fui-Radio__indicator{border-color:Highlight;color:Highlight;}.rg1upok:enabled:checked~.fui-Radio__indicator::after{background-color:Highlight;}}\", \"@media (forced-colors: active){.rg1upok:disabled~.fui-Radio__label{color:GrayText;}}\", \"@media (forced-colors: active){.rg1upok:disabled~.fui-Radio__indicator{border-color:GrayText;color:GrayText;}.rg1upok:disabled~.fui-Radio__indicator::after{background-color:GrayText;}}\", \"@media (forced-colors: active){.rzwdzb4:enabled:not(:checked)~.fui-Radio__indicator{border-color:ButtonBorder;}}\", \"@media (forced-colors: active){.rzwdzb4:enabled:checked~.fui-Radio__indicator{border-color:Highlight;color:Highlight;}.rzwdzb4:enabled:checked~.fui-Radio__indicator::after{background-color:Highlight;}}\", \"@media (forced-colors: active){.rzwdzb4:disabled~.fui-Radio__label{color:GrayText;}}\", \"@media (forced-colors: active){.rzwdzb4:disabled~.fui-Radio__indicator{border-color:GrayText;color:GrayText;}.rzwdzb4:disabled~.fui-Radio__indicator::after{background-color:GrayText;}}\"]\n});\nconst useInputStyles = /*#__PURE__*/__styles({\n below: {\n a9b677: \"fly5x3f\",\n Bqenvij: \"f1je6zif\"\n },\n defaultIndicator: {\n Blbys7f: \"f9ma1gx\"\n },\n customIndicator: {\n Bj53wkj: \"f12zxao0\"\n }\n}, {\n d: [\".fly5x3f{width:100%;}\", \".f1je6zif{height:calc(16px + 2 * var(--spacingVerticalS));}\", \".f9ma1gx:checked~.fui-Radio__indicator::after{content:\\\"\\\";}\", \".f12zxao0:not(:checked)~.fui-Radio__indicator>*{opacity:0;}\"]\n});\nconst useIndicatorBaseClassName = /*#__PURE__*/__resetStyles(\"rwtekvw\", null, [\".rwtekvw{position:relative;width:16px;height:16px;font-size:12px;box-sizing:border-box;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border:var(--strokeWidthThin) solid;border-radius:var(--borderRadiusCircular);margin:var(--spacingVerticalS) var(--spacingHorizontalS);fill:currentColor;pointer-events:none;}\", \".rwtekvw::after{position:absolute;width:16px;height:16px;border-radius:var(--borderRadiusCircular);transform:scale(0.625);background-color:currentColor;}\"]);\n// Can't use makeResetStyles here because Label is a component that may itself use makeResetStyles.\nconst useLabelStyles = /*#__PURE__*/__styles({\n base: {\n qb2dma: \"f7nlbp4\",\n z8tnut: \"f1kwiid1\",\n z189sj: [\"f1vdfbxk\", \"f1f5gg8d\"],\n Byoj8tv: \"f5b47ha\",\n uwmqm3: [\"f1f5gg8d\", \"f1vdfbxk\"]\n },\n after: {\n uwmqm3: [\"fruq291\", \"f7x41pl\"],\n B6of3ja: \"fjzwpt6\",\n jrapky: \"fh6j2fo\"\n },\n below: {\n z8tnut: \"f1ywm7hm\",\n fsow6f: \"f17mccla\"\n }\n}, {\n d: [\".f7nlbp4{align-self:center;}\", \".f1kwiid1{padding-top:var(--spacingVerticalS);}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".f5b47ha{padding-bottom:var(--spacingVerticalS);}\", \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".fjzwpt6{margin-top:calc((16px - var(--lineHeightBase300)) / 2);}\", \".fh6j2fo{margin-bottom:calc((16px - var(--lineHeightBase300)) / 2);}\", \".f1ywm7hm{padding-top:var(--spacingVerticalXS);}\", \".f17mccla{text-align:center;}\"]\n});\n/**\n * Apply styling to the Radio slots based on the state\n */\nexport const useRadioStyles_unstable = state => {\n const {\n labelPosition\n } = state;\n const rootBaseClassName = useRootBaseClassName();\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(radioClassNames.root, rootBaseClassName, labelPosition === 'below' && rootStyles.vertical, state.root.className);\n const inputBaseClassName = useInputBaseClassName();\n const inputStyles = useInputStyles();\n state.input.className = mergeClasses(radioClassNames.input, inputBaseClassName, labelPosition === 'below' && inputStyles.below, state.indicator.children ? inputStyles.customIndicator : inputStyles.defaultIndicator, state.input.className);\n const indicatorBaseClassName = useIndicatorBaseClassName();\n state.indicator.className = mergeClasses(radioClassNames.indicator, indicatorBaseClassName, state.indicator.className);\n const labelStyles = useLabelStyles();\n if (state.label) {\n state.label.className = mergeClasses(radioClassNames.label, labelStyles.base, labelStyles[labelPosition], state.label.className);\n }\n return state;\n};\n//# sourceMappingURL=useRadioStyles.styles.js.map"],"names":["radioClassNames","useRadioStyles_unstable","root","indicator","input","label","indicatorSize","useRootBaseClassName","__resetStyles","r","s","useRootStyles","__styles","vertical","Beiy3e4","Bt984gj","d","useInputBaseClassName","useInputStyles","below","a9b677","Bqenvij","defaultIndicator","Blbys7f","customIndicator","Bj53wkj","useIndicatorBaseClassName","useLabelStyles","base","qb2dma","z8tnut","z189sj","Byoj8tv","uwmqm3","after","B6of3ja","jrapky","fsow6f","state","labelPosition","rootBaseClassName","rootStyles","className","mergeClasses","inputBaseClassName","inputStyles","children","indicatorBaseClassName","labelStyles"],"mappings":"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"}
1
+ {"version":3,"sources":["useRadioStyles.styles.js"],"sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { __resetStyles, __styles, mergeClasses } from '@griffel/react';\nexport const radioClassNames = {\n root: 'fui-Radio',\n indicator: 'fui-Radio__indicator',\n input: 'fui-Radio__input',\n label: 'fui-Radio__label'\n};\n// The indicator size is used by the indicator and label styles\nconst indicatorSize = '16px';\nconst useRootBaseClassName = /*#__PURE__*/__resetStyles(\"r1siqwd8\", \"rmnplyc\", {\n r: [\".r1siqwd8{display:inline-flex;position:relative;}\", \".r1siqwd8:focus{outline-style:none;}\", \".r1siqwd8:focus-visible{outline-style:none;}\", \".r1siqwd8[data-fui-focus-within]:focus-within{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}\", \".r1siqwd8[data-fui-focus-within]:focus-within::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}\", \".rmnplyc{display:inline-flex;position:relative;}\", \".rmnplyc:focus{outline-style:none;}\", \".rmnplyc:focus-visible{outline-style:none;}\", \".rmnplyc[data-fui-focus-within]:focus-within{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}\", \".rmnplyc[data-fui-focus-within]:focus-within::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}\"],\n s: [\"@media (forced-colors: active){.r1siqwd8[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}\", \"@media (forced-colors: active){.rmnplyc[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}\"]\n});\nconst useRootStyles = /*#__PURE__*/__styles({\n vertical: {\n Beiy3e4: \"f1vx9l62\",\n Bt984gj: \"f122n59\"\n }\n}, {\n d: [\".f1vx9l62{flex-direction:column;}\", \".f122n59{align-items:center;}\"]\n});\nconst useInputBaseClassName = /*#__PURE__*/__resetStyles(\"rg1upok\", \"rzwdzb4\", {\n r: [\".rg1upok{position:absolute;left:0;top:0;width:calc(16px + 2 * var(--spacingHorizontalS));height:100%;box-sizing:border-box;margin:0;opacity:0;}\", \".rg1upok:enabled{cursor:pointer;}\", \".rg1upok:enabled~.fui-Radio__label{cursor:pointer;}\", \".rg1upok:enabled:not(:checked)~.fui-Radio__label{color:var(--colorNeutralForeground3);}\", \".rg1upok:enabled:not(:checked)~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessible);}\", \".rg1upok:enabled:not(:checked):hover~.fui-Radio__label{color:var(--colorNeutralForeground2);}\", \".rg1upok:enabled:not(:checked):hover~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessibleHover);}\", \".rg1upok:enabled:not(:checked):hover:active~.fui-Radio__label{color:var(--colorNeutralForeground1);}\", \".rg1upok:enabled:not(:checked):hover:active~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessiblePressed);}\", \".rg1upok:enabled:checked~.fui-Radio__label{color:var(--colorNeutralForeground1);}\", \".rg1upok:enabled:checked~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStroke);color:var(--colorCompoundBrandForeground1);}\", \".rg1upok:enabled:checked:hover~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStrokeHover);color:var(--colorCompoundBrandForeground1Hover);}\", \".rg1upok:enabled:checked:hover:active~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStrokePressed);color:var(--colorCompoundBrandForeground1Pressed);}\", \".rg1upok:disabled~.fui-Radio__label{color:var(--colorNeutralForegroundDisabled);cursor:default;}\", \".rg1upok:disabled~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeDisabled);color:var(--colorNeutralForegroundDisabled);}\", \".rzwdzb4{position:absolute;right:0;top:0;width:calc(16px + 2 * var(--spacingHorizontalS));height:100%;box-sizing:border-box;margin:0;opacity:0;}\", \".rzwdzb4:enabled{cursor:pointer;}\", \".rzwdzb4:enabled~.fui-Radio__label{cursor:pointer;}\", \".rzwdzb4:enabled:not(:checked)~.fui-Radio__label{color:var(--colorNeutralForeground3);}\", \".rzwdzb4:enabled:not(:checked)~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessible);}\", \".rzwdzb4:enabled:not(:checked):hover~.fui-Radio__label{color:var(--colorNeutralForeground2);}\", \".rzwdzb4:enabled:not(:checked):hover~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessibleHover);}\", \".rzwdzb4:enabled:not(:checked):hover:active~.fui-Radio__label{color:var(--colorNeutralForeground1);}\", \".rzwdzb4:enabled:not(:checked):hover:active~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeAccessiblePressed);}\", \".rzwdzb4:enabled:checked~.fui-Radio__label{color:var(--colorNeutralForeground1);}\", \".rzwdzb4:enabled:checked~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStroke);color:var(--colorCompoundBrandForeground1);}\", \".rzwdzb4:enabled:checked:hover~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStrokeHover);color:var(--colorCompoundBrandForeground1Hover);}\", \".rzwdzb4:enabled:checked:hover:active~.fui-Radio__indicator{border-color:var(--colorCompoundBrandStrokePressed);color:var(--colorCompoundBrandForeground1Pressed);}\", \".rzwdzb4:disabled~.fui-Radio__label{color:var(--colorNeutralForegroundDisabled);cursor:default;}\", \".rzwdzb4:disabled~.fui-Radio__indicator{border-color:var(--colorNeutralStrokeDisabled);color:var(--colorNeutralForegroundDisabled);}\"],\n s: [\"@media (forced-colors: active){.rg1upok:enabled:not(:checked)~.fui-Radio__indicator{border-color:ButtonBorder;}}\", \"@media (forced-colors: active){.rg1upok:enabled:checked~.fui-Radio__indicator{border-color:Highlight;color:Highlight;}.rg1upok:enabled:checked~.fui-Radio__indicator::after{background-color:Highlight;}}\", \"@media (forced-colors: active){.rg1upok:disabled~.fui-Radio__label{color:GrayText;}}\", \"@media (forced-colors: active){.rg1upok:disabled~.fui-Radio__indicator{border-color:GrayText;color:GrayText;}.rg1upok:disabled~.fui-Radio__indicator::after{background-color:GrayText;}}\", \"@media (forced-colors: active){.rzwdzb4:enabled:not(:checked)~.fui-Radio__indicator{border-color:ButtonBorder;}}\", \"@media (forced-colors: active){.rzwdzb4:enabled:checked~.fui-Radio__indicator{border-color:Highlight;color:Highlight;}.rzwdzb4:enabled:checked~.fui-Radio__indicator::after{background-color:Highlight;}}\", \"@media (forced-colors: active){.rzwdzb4:disabled~.fui-Radio__label{color:GrayText;}}\", \"@media (forced-colors: active){.rzwdzb4:disabled~.fui-Radio__indicator{border-color:GrayText;color:GrayText;}.rzwdzb4:disabled~.fui-Radio__indicator::after{background-color:GrayText;}}\"]\n});\nconst useInputStyles = /*#__PURE__*/__styles({\n below: {\n a9b677: \"fly5x3f\",\n Bqenvij: \"f1je6zif\"\n },\n defaultIndicator: {\n Blbys7f: \"f9ma1gx\"\n },\n customIndicator: {\n Bj53wkj: \"f12zxao0\"\n }\n}, {\n d: [\".fly5x3f{width:100%;}\", \".f1je6zif{height:calc(16px + 2 * var(--spacingVerticalS));}\", \".f9ma1gx:checked~.fui-Radio__indicator::after{content:\\\"\\\";}\", \".f12zxao0:not(:checked)~.fui-Radio__indicator>*{opacity:0;}\"]\n});\nconst useIndicatorBaseClassName = /*#__PURE__*/__resetStyles(\"rwtekvw\", null, [\".rwtekvw{position:relative;width:16px;height:16px;font-size:12px;box-sizing:border-box;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border:var(--strokeWidthThin) solid;border-radius:var(--borderRadiusCircular);margin:var(--spacingVerticalS) var(--spacingHorizontalS);fill:currentColor;pointer-events:none;}\", \".rwtekvw::after{position:absolute;width:16px;height:16px;border-radius:var(--borderRadiusCircular);transform:scale(0.625);background-color:currentColor;}\"]);\n// Can't use makeResetStyles here because Label is a component that may itself use makeResetStyles.\nconst useLabelStyles = /*#__PURE__*/__styles({\n base: {\n qb2dma: \"f7nlbp4\",\n Byoj8tv: 0,\n uwmqm3: 0,\n z189sj: 0,\n z8tnut: 0,\n B0ocmuz: \"f1f5q0n8\"\n },\n after: {\n uwmqm3: [\"fruq291\", \"f7x41pl\"],\n B6of3ja: \"fjzwpt6\",\n jrapky: \"fh6j2fo\"\n },\n below: {\n z8tnut: \"f1ywm7hm\",\n fsow6f: \"f17mccla\"\n }\n}, {\n d: [\".f7nlbp4{align-self:center;}\", [\".f1f5q0n8{padding:var(--spacingVerticalS) var(--spacingHorizontalS);}\", {\n p: -1\n }], \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".fjzwpt6{margin-top:calc((16px - var(--lineHeightBase300)) / 2);}\", \".fh6j2fo{margin-bottom:calc((16px - var(--lineHeightBase300)) / 2);}\", \".f1ywm7hm{padding-top:var(--spacingVerticalXS);}\", \".f17mccla{text-align:center;}\"]\n});\n/**\n * Apply styling to the Radio slots based on the state\n */\nexport const useRadioStyles_unstable = state => {\n const {\n labelPosition\n } = state;\n const rootBaseClassName = useRootBaseClassName();\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(radioClassNames.root, rootBaseClassName, labelPosition === 'below' && rootStyles.vertical, state.root.className);\n const inputBaseClassName = useInputBaseClassName();\n const inputStyles = useInputStyles();\n state.input.className = mergeClasses(radioClassNames.input, inputBaseClassName, labelPosition === 'below' && inputStyles.below, state.indicator.children ? inputStyles.customIndicator : inputStyles.defaultIndicator, state.input.className);\n const indicatorBaseClassName = useIndicatorBaseClassName();\n state.indicator.className = mergeClasses(radioClassNames.indicator, indicatorBaseClassName, state.indicator.className);\n const labelStyles = useLabelStyles();\n if (state.label) {\n state.label.className = mergeClasses(radioClassNames.label, labelStyles.base, labelStyles[labelPosition], state.label.className);\n }\n return state;\n};\n//# sourceMappingURL=useRadioStyles.styles.js.map"],"names":["radioClassNames","useRadioStyles_unstable","root","indicator","input","label","indicatorSize","useRootBaseClassName","__resetStyles","r","s","useRootStyles","__styles","vertical","Beiy3e4","Bt984gj","d","useInputBaseClassName","useInputStyles","below","a9b677","Bqenvij","defaultIndicator","Blbys7f","customIndicator","Bj53wkj","useIndicatorBaseClassName","useLabelStyles","base","qb2dma","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","after","B6of3ja","jrapky","fsow6f","p","state","labelPosition","rootBaseClassName","rootStyles","className","mergeClasses","inputBaseClassName","inputStyles","children","indicatorBaseClassName","labelStyles"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-radio",
3
- "version": "9.2.21",
3
+ "version": "9.2.23",
4
4
  "description": "Fluent UI Radio component",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -33,13 +33,13 @@
33
33
  "@fluentui/scripts-tasks": "*"
34
34
  },
35
35
  "dependencies": {
36
- "@fluentui/react-field": "^9.1.66",
37
- "@fluentui/react-jsx-runtime": "^9.0.38",
38
- "@fluentui/react-label": "^9.1.70",
36
+ "@fluentui/react-field": "^9.1.67",
37
+ "@fluentui/react-jsx-runtime": "^9.0.39",
38
+ "@fluentui/react-label": "^9.1.71",
39
39
  "@fluentui/react-shared-contexts": "^9.19.0",
40
- "@fluentui/react-tabster": "^9.21.3",
40
+ "@fluentui/react-tabster": "^9.21.5",
41
41
  "@fluentui/react-theme": "^9.1.19",
42
- "@fluentui/react-utilities": "^9.18.9",
42
+ "@fluentui/react-utilities": "^9.18.10",
43
43
  "@griffel/react": "^1.5.22",
44
44
  "@swc/helpers": "^0.5.1"
45
45
  },