@primer/react 37.11.0 → 37.11.2

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.
@@ -1 +1 @@
1
- {"version":3,"file":"FormControl.d.ts","sourceRoot":"","sources":["../../src/FormControl/FormControl.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAYvC,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAA;AAavD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAClC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,GAAG,MAAM,CAAA;;eAnBG,KAAK,CAAC,SAAS;IAC1B;;OAEG;eACQ,OAAO;IAClB;;OAEG;SACE,MAAM;IACX;;OAEG;eACQ,OAAO;IAClB;;;OAGG;aACM,YAAY,GAAG,UAAU;gBACtB,MAAM;;;;;;;;;;;;;;;;;AAmQpB,wBAKE"}
1
+ {"version":3,"file":"FormControl.d.ts","sourceRoot":"","sources":["../../src/FormControl/FormControl.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAavC,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAA;AAavD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAClC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,GAAG,MAAM,CAAA;;eAnBG,KAAK,CAAC,SAAS;IAC1B;;OAEG;eACQ,OAAO;IAClB;;OAEG;SACE,MAAM;IACX;;OAEG;eACQ,OAAO;IAClB;;;OAGG;aACM,YAAY,GAAG,UAAU;gBACtB,MAAM;;;;;;;;;;;;;;;;;AAsPpB,wBAKE"}
@@ -10,6 +10,7 @@ var SelectPanel = require('../SelectPanel/SelectPanel.js');
10
10
  var TextInput = require('../TextInput/TextInput.js');
11
11
  var TextInputWithTokens = require('../TextInputWithTokens/TextInputWithTokens.js');
12
12
  var Textarea = require('../Textarea/Textarea.js');
13
+ var Box = require('../Box/Box.js');
13
14
  require('../internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.js');
14
15
  var CheckboxOrRadioGroupContext = require('../internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.js');
15
16
  var ValidationAnimationContainer = require('../internal/components/ValidationAnimationContainer.js');
@@ -113,10 +114,24 @@ const FormControl = /*#__PURE__*/React__default.default.forwardRef(({
113
114
  "data-has-caption": slots.caption ? '' : undefined
114
115
  }, slots.leadingVisual) : null, /*#__PURE__*/React__default.default.createElement(StyledLabelContainer, {
115
116
  className: FormControl_module.LabelContainer
116
- }, slots.label, slots.caption)) : /*#__PURE__*/React__default.default.createElement(StyledVerticalLayout, {
117
+ }, slots.label, slots.caption)) : /*#__PURE__*/React__default.default.createElement(Box, {
117
118
  ref: ref,
118
119
  "data-has-label": !isLabelHidden ? '' : undefined,
119
- sx: sx,
120
+ display: "flex",
121
+ flexDirection: "column",
122
+ alignItems: "flex-start",
123
+ sx: enabled ? sx : {
124
+ ...(isLabelHidden ? {
125
+ '> *:not(label) + *': {
126
+ marginTop: 1
127
+ }
128
+ } : {
129
+ '> * + *': {
130
+ marginTop: 1
131
+ }
132
+ }),
133
+ ...sx
134
+ },
120
135
  className: clsx.clsx(className, {
121
136
  [FormControl_module.ControlVerticalLayout]: enabled
122
137
  })
@@ -142,13 +157,9 @@ const StyledLabelContainer = toggleStyledComponent.toggleStyledComponent(feature
142
157
  displayName: "FormControl__StyledLabelContainer",
143
158
  componentId: "sc-1t6d2k4-2"
144
159
  })(["> *{padding-left:var(--stack-gap-condensed);}> label{font-weight:var(--base-text-weight-normal);}"]));
145
- const StyledVerticalLayout = toggleStyledComponent.toggleStyledComponent(featureFlags.cssModulesFlag, 'div', styled__default.default.div.withConfig({
146
- displayName: "FormControl__StyledVerticalLayout",
147
- componentId: "sc-1t6d2k4-3"
148
- })(["display:flex;flex-direction:column;align-items:flex-start;& > *:not(label) + *{margin-top:var(--base-size-4);}&:where([data-has-label]) > * + *{margin-top:var(--base-size-4);}", ""], sx.default));
149
160
  const StyledLeadingVisual = toggleStyledComponent.toggleStyledComponent(featureFlags.cssModulesFlag, 'div', styled__default.default.div.withConfig({
150
161
  displayName: "FormControl__StyledLeadingVisual",
151
- componentId: "sc-1t6d2k4-4"
162
+ componentId: "sc-1t6d2k4-3"
152
163
  })(["color:var(--fgColor-default);margin-left:var(--base-size-8);&:where([data-disabled]){color:var(--fgColor-muted);}> *{fill:currentColor;min-width:var(--text-body-size-large);min-height:var(--text-body-size-large);}> *:where([data-has-caption]){min-width:var(--base-size-24);min-height:var(--base-size-24);}"]));
153
164
  var FormControl$1 = Object.assign(FormControl, {
154
165
  Caption: FormControlCaption.FormControlCaption,
@@ -8,6 +8,7 @@ import { SelectPanel } from '../SelectPanel/SelectPanel.js';
8
8
  import TextInput from '../TextInput/TextInput.js';
9
9
  import TextInputWithTokens from '../TextInputWithTokens/TextInputWithTokens.js';
10
10
  import Textarea from '../Textarea/Textarea.js';
11
+ import Box from '../Box/Box.js';
11
12
  import '../internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.js';
12
13
  import CheckboxOrRadioGroupContext from '../internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.js';
13
14
  import ValidationAnimationContainer from '../internal/components/ValidationAnimationContainer.js';
@@ -106,10 +107,24 @@ const FormControl = /*#__PURE__*/React.forwardRef(({
106
107
  "data-has-caption": slots.caption ? '' : undefined
107
108
  }, slots.leadingVisual) : null, /*#__PURE__*/React.createElement(StyledLabelContainer, {
108
109
  className: classes.LabelContainer
109
- }, slots.label, slots.caption)) : /*#__PURE__*/React.createElement(StyledVerticalLayout, {
110
+ }, slots.label, slots.caption)) : /*#__PURE__*/React.createElement(Box, {
110
111
  ref: ref,
111
112
  "data-has-label": !isLabelHidden ? '' : undefined,
112
- sx: sx,
113
+ display: "flex",
114
+ flexDirection: "column",
115
+ alignItems: "flex-start",
116
+ sx: enabled ? sx : {
117
+ ...(isLabelHidden ? {
118
+ '> *:not(label) + *': {
119
+ marginTop: 1
120
+ }
121
+ } : {
122
+ '> * + *': {
123
+ marginTop: 1
124
+ }
125
+ }),
126
+ ...sx
127
+ },
113
128
  className: clsx(className, {
114
129
  [classes.ControlVerticalLayout]: enabled
115
130
  })
@@ -135,13 +150,9 @@ const StyledLabelContainer = toggleStyledComponent(cssModulesFlag, 'div', styled
135
150
  displayName: "FormControl__StyledLabelContainer",
136
151
  componentId: "sc-1t6d2k4-2"
137
152
  })(["> *{padding-left:var(--stack-gap-condensed);}> label{font-weight:var(--base-text-weight-normal);}"]));
138
- const StyledVerticalLayout = toggleStyledComponent(cssModulesFlag, 'div', styled.div.withConfig({
139
- displayName: "FormControl__StyledVerticalLayout",
140
- componentId: "sc-1t6d2k4-3"
141
- })(["display:flex;flex-direction:column;align-items:flex-start;& > *:not(label) + *{margin-top:var(--base-size-4);}&:where([data-has-label]) > * + *{margin-top:var(--base-size-4);}", ""], sx));
142
153
  const StyledLeadingVisual = toggleStyledComponent(cssModulesFlag, 'div', styled.div.withConfig({
143
154
  displayName: "FormControl__StyledLeadingVisual",
144
- componentId: "sc-1t6d2k4-4"
155
+ componentId: "sc-1t6d2k4-3"
145
156
  })(["color:var(--fgColor-default);margin-left:var(--base-size-8);&:where([data-disabled]){color:var(--fgColor-muted);}> *{fill:currentColor;min-width:var(--text-body-size-large);min-height:var(--text-body-size-large);}> *:where([data-has-caption]){min-width:var(--base-size-24);min-height:var(--base-size-24);}"]));
146
157
  var FormControl$1 = Object.assign(FormControl, {
147
158
  Caption: FormControlCaption,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primer/react",
3
- "version": "37.11.0",
3
+ "version": "37.11.2",
4
4
  "description": "An implementation of GitHub's Primer Design System using React",
5
5
  "main": "lib/index.js",
6
6
  "module": "lib-esm/index.js",
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=disabled.ActionBar.Figma.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"disabled.ActionBar.Figma.d.ts","sourceRoot":"","sources":["../../src/ActionBar/disabled.ActionBar.Figma.tsx"],"names":[],"mappings":""}
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=disabled.ActionBar.Figma.d.ts.map