@procore/core-react 11.24.1 → 11.24.2

package/dist/Form/Form.styles.js

@@ -26,7 +26,7 @@ function applyStylesOnlyToIE11(styles) {
 }
 export var StyledFormFieldMain = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledFormFieldMain",
-  componentId: "core-11_24_1__sc-ncj3pf-0"
+  componentId: "core-11_24_2__sc-ncj3pf-0"
 })(["-ms-grid-row:2;grid-row:2;", " ", " ", ""], function (_ref) {
   var $colStart = _ref.$colStart,
     $colEnd = _ref.$colEnd,
@@ -38,7 +38,7 @@ export var StyledFormFieldMain = /*#__PURE__*/styled.div.withConfig({
 }, applyStylesOnlyToIE11("\n      padding-left: ".concat(columnGutter, ";\n\n      &:nth-child(2) {\n        padding-left: 0;\n      }\n  ")));
 export var StyledFormFieldHeader = /*#__PURE__*/styled(StyledFieldHeader).withConfig({
   displayName: "StyledFormFieldHeader",
-  componentId: "core-11_24_1__sc-ncj3pf-1"
+  componentId: "core-11_24_2__sc-ncj3pf-1"
 })(["-ms-grid-row:1;grid-row:1;align-self:end;", " ", ""], function (_ref3) {
   var $colStart = _ref3.$colStart,
     $colEnd = _ref3.$colEnd,
@@ -47,7 +47,7 @@ export var StyledFormFieldHeader = /*#__PURE__*/styled(StyledFieldHeader).withCo
 }, applyStylesOnlyToIE11("\n    padding-left: ".concat(columnGutter, ";\n\n    &:first-child {\n      padding-left: 0;\n    }\n\n    ").concat(StyledFormFieldMain, " {\n      padding-left: ").concat(columnGutter, ";\n\n      &:nth-child(2) {\n        padding-left: 0;\n      }\n    }\n  ")));
 export var StyledFormFieldRequiredMark = /*#__PURE__*/styled(Required).withConfig({
   displayName: "StyledFormFieldRequiredMark",
-  componentId: "core-11_24_1__sc-ncj3pf-2"
+  componentId: "core-11_24_2__sc-ncj3pf-2"
 })(["padding-left:", "px;vertical-align:top;"], spacing.xs);
 export var dataQaFieldTooltipIcon = 'form-field-tooltip-icon';
 export var StyledFormFieldTooltipIcon = /*#__PURE__*/styled(Help).attrs(function () {
@@ -56,19 +56,19 @@ export var StyledFormFieldTooltipIcon = /*#__PURE__*/styled(Help).attrs(function
   };
 }).withConfig({
   displayName: "StyledFormFieldTooltipIcon",
-  componentId: "core-11_24_1__sc-ncj3pf-3"
+  componentId: "core-11_24_2__sc-ncj3pf-3"
 })(["margin-left:", "px;color:", ";vertical-align:middle;&:focus-visible{border-radius:50%;", " outline-offset:0;}"], spacing.sm, colors.gray45, getGapOutlineFocus);
 export var StyledFormFieldErrorIcon = /*#__PURE__*/styled(Error).withConfig({
   displayName: "StyledFormFieldErrorIcon",
-  componentId: "core-11_24_1__sc-ncj3pf-4"
+  componentId: "core-11_24_2__sc-ncj3pf-4"
 })(["vertical-align:sub;"]);
 export var StyledFormFieldBanner = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledFormFieldBanner",
-  componentId: "core-11_24_1__sc-ncj3pf-5"
+  componentId: "core-11_24_2__sc-ncj3pf-5"
 })(["display:flex;align-items:flex-start;min-height:22px;margin-top:", "px;margin-bottom:2px;word-break:break-word;word-wrap:break-word;color:", ";", ""], spacing.xs, colors.red50, getTypographyIntent('body'));
 export var StyledTraditionalFormColumn = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTraditionalFormColumn",
-  componentId: "core-11_24_1__sc-ncj3pf-6"
+  componentId: "core-11_24_2__sc-ncj3pf-6"
 })(["padding:", ";align-self:center;height:100%;&:nth-child(1){-ms-grid-column:1;}&:nth-child(2){-ms-grid-column:2;}&:nth-child(3){-ms-grid-column:3;}&:nth-child(4){-ms-grid-column:4;}", " ", ""], traditionalPadding, function (_ref4) {
   var _ref4$$fullWidth = _ref4.$fullWidth,
     $fullWidth = _ref4$$fullWidth === void 0 ? false : _ref4$$fullWidth;
@@ -80,26 +80,26 @@ export var StyledTraditionalFormColumn = /*#__PURE__*/styled.div.withConfig({
 });
 export var StyledTraditionalFormLabel = /*#__PURE__*/styled(Typography).withConfig({
   displayName: "StyledTraditionalFormLabel",
-  componentId: "core-11_24_1__sc-ncj3pf-7"
+  componentId: "core-11_24_2__sc-ncj3pf-7"
 })(["display:inline-block;word-break:break-word;word-wrap:break-word;", ""], function (_ref6) {
   var $view = _ref6.$view;
   return ['create', 'update'].includes($view) && css(["padding-top:", "px;"], spacing.sm);
 });
 export var StyledFormOutputTextArea = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledFormOutputTextArea",
-  componentId: "core-11_24_1__sc-ncj3pf-8"
+  componentId: "core-11_24_2__sc-ncj3pf-8"
 })(["white-space:pre-wrap;"]);
 export var StyledFormCheckboxInput = /*#__PURE__*/styled(Checkbox).withConfig({
   displayName: "StyledFormCheckboxInput",
-  componentId: "core-11_24_1__sc-ncj3pf-9"
+  componentId: "core-11_24_2__sc-ncj3pf-9"
 })(["margin-top:", "px;"], spacing.xs);
 export var StyledFormOutputFiledset = /*#__PURE__*/styled.fieldset.withConfig({
   displayName: "StyledFormOutputFiledset",
-  componentId: "core-11_24_1__sc-ncj3pf-10"
+  componentId: "core-11_24_2__sc-ncj3pf-10"
 })(["border:none;padding:0;margin-top:", "px;"], spacing.xs);
 export var StyledFormRow = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledFormRow",
-  componentId: "core-11_24_1__sc-ncj3pf-11"
+  componentId: "core-11_24_2__sc-ncj3pf-11"
 })(["", ""], function (_ref7) {
   var _ref7$$traditional = _ref7.$traditional,
     $traditional = _ref7$$traditional === void 0 ? false : _ref7$$traditional,
@@ -110,14 +110,14 @@ export var StyledFormRow = /*#__PURE__*/styled.div.withConfig({
 var formWrapper = /*#__PURE__*/css(["display:inherit;flex-direction:inherit;height:inherit;max-height:inherit;"]);
 export var StyledFormikForm = /*#__PURE__*/styled(FormikForm).withConfig({
   displayName: "StyledFormikForm",
-  componentId: "core-11_24_1__sc-ncj3pf-12"
+  componentId: "core-11_24_2__sc-ncj3pf-12"
 })(["", ""], formWrapper);
 export var StyledForm = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledForm",
-  componentId: "core-11_24_1__sc-ncj3pf-13"
+  componentId: "core-11_24_2__sc-ncj3pf-13"
 })(["", ""], formWrapper);
 export var StyledLabel = /*#__PURE__*/styled(Label).withConfig({
   displayName: "StyledLabel",
-  componentId: "core-11_24_1__sc-ncj3pf-14"
+  componentId: "core-11_24_2__sc-ncj3pf-14"
 })(["word-wrap:break-word;word-break:break-word;"]);
 //# sourceMappingURL=Form.styles.js.map

package/dist/Form/Form.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.styles.js","names":["Error","Help","Form","FormikForm","styled","css","Checkbox","StyledFieldHeader","Required","Label","Typography","getTypographyIntent","colors","getGapOutlineFocus","spacing","columnGutter","defaultLineHeight","textEditorOutputListPadding","traditionalBorder","traditionalBgGray","traditionalPadding","traditionalFontSize","traditionalLineHeight","getGridColumns","colStart","colEnd","colIeSpan","applyStylesOnlyToIE11","styles","StyledFormFieldMain","div","withConfig","displayName","componentId","_ref","$colStart","$colEnd","$colIeSpan","_ref2","$read","gray15","concat","StyledFormFieldHeader","_ref3","StyledFormFieldRequiredMark","xs","dataQaFieldTooltipIcon","StyledFormFieldTooltipIcon","attrs","sm","gray45","StyledFormFieldErrorIcon","StyledFormFieldBanner","red50","StyledTraditionalFormColumn","_ref4","_ref4$$fullWidth","$fullWidth","_ref5","_ref5$$output","$output","StyledTraditionalFormLabel","_ref6","$view","includes","StyledFormOutputTextArea","span","StyledFormCheckboxInput","StyledFormOutputFiledset","fieldset","StyledFormRow","_ref7","_ref7$$traditional","$traditional","_ref7$$read","white","formWrapper","StyledFormikForm","StyledForm","StyledLabel"],"sources":["../../src/Form/Form.styles.tsx"],"sourcesContent":["import { Error, Help } from '@procore/core-icons/dist'\nimport { Form as FormikForm } from 'formik'\nimport styled, { css } from 'styled-components'\nimport { Checkbox } from '../Checkbox'\nimport { StyledFieldHeader } from '../Field/Field.styles'\nimport { Required } from '../Required/Required'\nimport { Label } from '../Semantic/Semantic'\nimport { Typography } from '../Typography'\nimport { getTypographyIntent } from '../Typography/Typography.styles'\nimport { colors } from '../_styles/colors'\nimport { getGapOutlineFocus } from '../_styles/mixins'\nimport { spacing } from '../_styles/spacing'\nimport { View } from './Form.types'\n\nconst columnGutter = '24px'\nconst defaultLineHeight = '20px'\nconst textEditorOutputListPadding = '10px 0 10px 40px'\n\nconst traditionalBorder = 'rgb(216, 216, 216)'\nconst traditionalBgGray = 'rgb(242, 242, 242)'\nconst traditionalPadding = '10px'\nconst traditionalFontSize = '13px'\nconst traditionalLineHeight = '20px'\n\nfunction getGridColumns(colStart: number, colEnd: number, colIeSpan: number) {\n  return css`\n    -ms-grid-column: ${colStart};\n    grid-column-start: ${colStart};\n    grid-column-end: ${colEnd};\n    -ms-grid-column-span: ${colIeSpan};\n  `\n}\n\nfunction applyStylesOnlyToIE11(styles: string) {\n  return css`\n    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n      ${styles}\n    }\n  `\n}\n\nexport const StyledFormFieldMain = styled.div<{\n  $read: boolean\n  $colStart: number\n  $colEnd: number\n  $colIeSpan: number\n}>`\n  -ms-grid-row: 2;\n  grid-row: 2;\n\n  ${({ $colStart, $colEnd, $colIeSpan }) =>\n    getGridColumns($colStart, $colEnd, $colIeSpan)}\n\n  ${({ $read }) =>\n    $read &&\n    css`\n      word-wrap: break-word;\n      color: ${colors.gray15};\n      ${getTypographyIntent('body')};\n    `}\n\n  // IE11 support grid-column-gap\n  // bug: if a field's first column isn't at 1,\n  // the field will fill the padding and be wider\n  ${applyStylesOnlyToIE11(`\n      padding-left: ${columnGutter};\n\n      &:nth-child(2) {\n        padding-left: 0;\n      }\n  `)}\n`\n\nexport const StyledFormFieldHeader = styled(StyledFieldHeader)<{\n  $colStart: number\n  $colEnd: number\n  $colIeSpan: number\n}>`\n  -ms-grid-row: 1;\n  grid-row: 1;\n  align-self: end;\n\n  ${({ $colStart, $colEnd, $colIeSpan }) =>\n    getGridColumns($colStart, $colEnd, $colIeSpan)}\n\n  // IE11 support grid-column-gap\n  // bug: if a field's first column isn't at 1,\n  // the field will fill the padding and be wider\n  ${applyStylesOnlyToIE11(`\n    padding-left: ${columnGutter};\n\n    &:first-child {\n      padding-left: 0;\n    }\n\n    ${StyledFormFieldMain} {\n      padding-left: ${columnGutter};\n\n      &:nth-child(2) {\n        padding-left: 0;\n      }\n    }\n  `)}\n`\n\nexport const StyledFormFieldRequiredMark = styled(Required)`\n  padding-left: ${spacing.xs}px;\n  vertical-align: top;\n`\n\nexport const dataQaFieldTooltipIcon = 'form-field-tooltip-icon'\n\nexport const StyledFormFieldTooltipIcon = styled(Help).attrs(() => ({\n  'data-qa': dataQaFieldTooltipIcon,\n}))`\n  margin-left: ${spacing.sm}px;\n  color: ${colors.gray45};\n  vertical-align: middle;\n\n  &:focus-visible {\n    border-radius: 50%;\n    ${getGapOutlineFocus}\n    // Icon does not touch viewBox borders. Already has 1px gap\n    outline-offset: 0;\n  }\n`\n\nexport const StyledFormFieldErrorIcon = styled(Error)`\n  vertical-align: sub;\n`\n\nexport const StyledFormFieldBanner = styled.div`\n  display: flex;\n  align-items: flex-start;\n  min-height: 22px;\n  margin-top: ${spacing.xs}px;\n  margin-bottom: 2px;\n  word-break: break-word;\n  word-wrap: break-word;\n  color: ${colors.red50};\n\n  ${getTypographyIntent('body')}\n`\nexport const StyledTraditionalFormColumn = styled.div<{\n  $fullWidth?: boolean\n  $output?: boolean\n}>`\n  padding: ${traditionalPadding};\n  align-self: center;\n  height: 100%;\n\n  &:nth-child(1) {\n    -ms-grid-column: 1;\n  }\n  &:nth-child(2) {\n    -ms-grid-column: 2;\n  }\n  &:nth-child(3) {\n    -ms-grid-column: 3;\n  }\n  &:nth-child(4) {\n    -ms-grid-column: 4;\n  }\n\n  ${({ $fullWidth = false }) =>\n    $fullWidth &&\n    css`\n      grid-column: 2 / 5;\n      -ms-grid-column-span: 3;\n    `}\n\n  ${({ $output = false }) =>\n    $output &&\n    css`\n      font-weight: bold;\n      font-size: ${traditionalFontSize};\n      line-height: ${traditionalLineHeight};\n      word-wrap: break-word;\n    `}\n`\n\nexport const StyledTraditionalFormLabel = styled(Typography)<{ $view: View }>`\n  display: inline-block;\n  word-break: break-word;\n  word-wrap: break-word;\n\n  ${({ $view }) =>\n    ['create', 'update'].includes($view) &&\n    css`\n      padding-top: ${spacing.sm}px;\n    `}\n`\n\nexport const StyledFormOutputTextArea = styled.span`\n  white-space: pre-wrap;\n`\n\nexport const StyledFormCheckboxInput = styled(Checkbox)`\n  margin-top: ${spacing.xs}px;\n`\n\nexport const StyledFormOutputFiledset = styled.fieldset`\n  border: none;\n  padding: 0;\n  margin-top: ${spacing.xs}px;\n`\nexport const StyledFormRow = styled.div<{\n  $traditional?: boolean\n  $read?: boolean\n}>`\n  ${({ $traditional = false, $read = false }) =>\n    $traditional\n      ? css`\n          display: -ms-grid;\n          display: grid;\n          -ms-grid-columns: 20% 30% 20% 30%;\n          grid-template-columns: 20% 30% 20% 30%;\n          -ms-grid-rows: auto;\n          grid-template-rows: auto;\n          border-top: 1px solid ${traditionalBorder};\n          background-color: ${colors.white};\n\n          &:last-of-type {\n            border-bottom: 1px solid ${traditionalBorder};\n          }\n\n          ${$read &&\n          `\n            &:nth-child(2n + 1) {\n              background-color: ${traditionalBgGray};\n            }\n            \n            & > ${StyledTraditionalFormColumn}:nth-child(2) {\n              border-right: 1px solid ${traditionalBorder};\n      \n              &:last-child {\n                border-right: none;\n              }\n            }\n          `}\n        `\n      : css`\n          display: -ms-grid;\n          display: grid;\n          -ms-grid-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr)\n            minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr)\n            minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr)\n            minmax(0, 1fr);\n          grid-template-columns: repeat(12, minmax(0, 1fr));\n          -ms-grid-rows: minmax(${defaultLineHeight}, max-content)\n            minmax(${defaultLineHeight}, max-content);\n          grid-template-rows: minmax(${defaultLineHeight}, auto) minmax(\n              ${defaultLineHeight},\n              auto\n            );\n          justify-content: space-between;\n          grid-column-gap: ${columnGutter};\n        `}\n`\n\nconst formWrapper = css`\n  display: inherit;\n  flex-direction: inherit;\n  height: inherit;\n  max-height: inherit;\n`\n\nexport const StyledFormikForm = styled(FormikForm)`\n  ${formWrapper}\n`\n\nexport const StyledForm = styled.div`\n  ${formWrapper}\n`\n\nexport const StyledLabel = styled(Label)`\n  word-wrap: break-word;\n  word-break: break-word;\n`\n"],"mappings":"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"}
+{"version":3,"file":"Form.styles.js","names":["Error","Help","Form","FormikForm","styled","css","Checkbox","StyledFieldHeader","Required","Label","Typography","getTypographyIntent","colors","getGapOutlineFocus","spacing","columnGutter","defaultLineHeight","textEditorOutputListPadding","traditionalBorder","traditionalBgGray","traditionalPadding","traditionalFontSize","traditionalLineHeight","getGridColumns","colStart","colEnd","colIeSpan","applyStylesOnlyToIE11","styles","StyledFormFieldMain","div","withConfig","displayName","componentId","_ref","$colStart","$colEnd","$colIeSpan","_ref2","$read","gray15","concat","StyledFormFieldHeader","_ref3","StyledFormFieldRequiredMark","xs","dataQaFieldTooltipIcon","StyledFormFieldTooltipIcon","attrs","sm","gray45","StyledFormFieldErrorIcon","StyledFormFieldBanner","red50","StyledTraditionalFormColumn","_ref4","_ref4$$fullWidth","$fullWidth","_ref5","_ref5$$output","$output","StyledTraditionalFormLabel","_ref6","$view","includes","StyledFormOutputTextArea","span","StyledFormCheckboxInput","StyledFormOutputFiledset","fieldset","StyledFormRow","_ref7","_ref7$$traditional","$traditional","_ref7$$read","white","formWrapper","StyledFormikForm","StyledForm","StyledLabel"],"sources":["../../src/Form/Form.styles.tsx"],"sourcesContent":["import { Error, Help } from '@procore/core-icons/dist'\nimport { Form as FormikForm } from 'formik'\nimport styled, { css } from 'styled-components'\nimport { Checkbox } from '../Checkbox'\nimport { StyledFieldHeader } from '../Field/Field.styles'\nimport { Required } from '../Required/Required'\nimport { Label } from '../Semantic/Semantic'\nimport { Typography } from '../Typography'\nimport { getTypographyIntent } from '../Typography/Typography.styles'\nimport { colors } from '../_styles/colors'\nimport { getGapOutlineFocus } from '../_styles/mixins'\nimport { spacing } from '../_styles/spacing'\nimport type { View } from './Form.types'\n\nconst columnGutter = '24px'\nconst defaultLineHeight = '20px'\nconst textEditorOutputListPadding = '10px 0 10px 40px'\n\nconst traditionalBorder = 'rgb(216, 216, 216)'\nconst traditionalBgGray = 'rgb(242, 242, 242)'\nconst traditionalPadding = '10px'\nconst traditionalFontSize = '13px'\nconst traditionalLineHeight = '20px'\n\nfunction getGridColumns(colStart: number, colEnd: number, colIeSpan: number) {\n  return css`\n    -ms-grid-column: ${colStart};\n    grid-column-start: ${colStart};\n    grid-column-end: ${colEnd};\n    -ms-grid-column-span: ${colIeSpan};\n  `\n}\n\nfunction applyStylesOnlyToIE11(styles: string) {\n  return css`\n    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n      ${styles}\n    }\n  `\n}\n\nexport const StyledFormFieldMain = styled.div<{\n  $read: boolean\n  $colStart: number\n  $colEnd: number\n  $colIeSpan: number\n}>`\n  -ms-grid-row: 2;\n  grid-row: 2;\n\n  ${({ $colStart, $colEnd, $colIeSpan }) =>\n    getGridColumns($colStart, $colEnd, $colIeSpan)}\n\n  ${({ $read }) =>\n    $read &&\n    css`\n      word-wrap: break-word;\n      color: ${colors.gray15};\n      ${getTypographyIntent('body')};\n    `}\n\n  // IE11 support grid-column-gap\n  // bug: if a field's first column isn't at 1,\n  // the field will fill the padding and be wider\n  ${applyStylesOnlyToIE11(`\n      padding-left: ${columnGutter};\n\n      &:nth-child(2) {\n        padding-left: 0;\n      }\n  `)}\n`\n\nexport const StyledFormFieldHeader = styled(StyledFieldHeader)<{\n  $colStart: number\n  $colEnd: number\n  $colIeSpan: number\n}>`\n  -ms-grid-row: 1;\n  grid-row: 1;\n  align-self: end;\n\n  ${({ $colStart, $colEnd, $colIeSpan }) =>\n    getGridColumns($colStart, $colEnd, $colIeSpan)}\n\n  // IE11 support grid-column-gap\n  // bug: if a field's first column isn't at 1,\n  // the field will fill the padding and be wider\n  ${applyStylesOnlyToIE11(`\n    padding-left: ${columnGutter};\n\n    &:first-child {\n      padding-left: 0;\n    }\n\n    ${StyledFormFieldMain} {\n      padding-left: ${columnGutter};\n\n      &:nth-child(2) {\n        padding-left: 0;\n      }\n    }\n  `)}\n`\n\nexport const StyledFormFieldRequiredMark = styled(Required)`\n  padding-left: ${spacing.xs}px;\n  vertical-align: top;\n`\n\nexport const dataQaFieldTooltipIcon = 'form-field-tooltip-icon'\n\nexport const StyledFormFieldTooltipIcon = styled(Help).attrs(() => ({\n  'data-qa': dataQaFieldTooltipIcon,\n}))`\n  margin-left: ${spacing.sm}px;\n  color: ${colors.gray45};\n  vertical-align: middle;\n\n  &:focus-visible {\n    border-radius: 50%;\n    ${getGapOutlineFocus}\n    // Icon does not touch viewBox borders. Already has 1px gap\n    outline-offset: 0;\n  }\n`\n\nexport const StyledFormFieldErrorIcon = styled(Error)`\n  vertical-align: sub;\n`\n\nexport const StyledFormFieldBanner = styled.div`\n  display: flex;\n  align-items: flex-start;\n  min-height: 22px;\n  margin-top: ${spacing.xs}px;\n  margin-bottom: 2px;\n  word-break: break-word;\n  word-wrap: break-word;\n  color: ${colors.red50};\n\n  ${getTypographyIntent('body')}\n`\nexport const StyledTraditionalFormColumn = styled.div<{\n  $fullWidth?: boolean\n  $output?: boolean\n}>`\n  padding: ${traditionalPadding};\n  align-self: center;\n  height: 100%;\n\n  &:nth-child(1) {\n    -ms-grid-column: 1;\n  }\n  &:nth-child(2) {\n    -ms-grid-column: 2;\n  }\n  &:nth-child(3) {\n    -ms-grid-column: 3;\n  }\n  &:nth-child(4) {\n    -ms-grid-column: 4;\n  }\n\n  ${({ $fullWidth = false }) =>\n    $fullWidth &&\n    css`\n      grid-column: 2 / 5;\n      -ms-grid-column-span: 3;\n    `}\n\n  ${({ $output = false }) =>\n    $output &&\n    css`\n      font-weight: bold;\n      font-size: ${traditionalFontSize};\n      line-height: ${traditionalLineHeight};\n      word-wrap: break-word;\n    `}\n`\n\nexport const StyledTraditionalFormLabel = styled(Typography)<{ $view: View }>`\n  display: inline-block;\n  word-break: break-word;\n  word-wrap: break-word;\n\n  ${({ $view }) =>\n    ['create', 'update'].includes($view) &&\n    css`\n      padding-top: ${spacing.sm}px;\n    `}\n`\n\nexport const StyledFormOutputTextArea = styled.span`\n  white-space: pre-wrap;\n`\n\nexport const StyledFormCheckboxInput = styled(Checkbox)`\n  margin-top: ${spacing.xs}px;\n`\n\nexport const StyledFormOutputFiledset = styled.fieldset`\n  border: none;\n  padding: 0;\n  margin-top: ${spacing.xs}px;\n`\nexport const StyledFormRow = styled.div<{\n  $traditional?: boolean\n  $read?: boolean\n}>`\n  ${({ $traditional = false, $read = false }) =>\n    $traditional\n      ? css`\n          display: -ms-grid;\n          display: grid;\n          -ms-grid-columns: 20% 30% 20% 30%;\n          grid-template-columns: 20% 30% 20% 30%;\n          -ms-grid-rows: auto;\n          grid-template-rows: auto;\n          border-top: 1px solid ${traditionalBorder};\n          background-color: ${colors.white};\n\n          &:last-of-type {\n            border-bottom: 1px solid ${traditionalBorder};\n          }\n\n          ${$read &&\n          `\n            &:nth-child(2n + 1) {\n              background-color: ${traditionalBgGray};\n            }\n            \n            & > ${StyledTraditionalFormColumn}:nth-child(2) {\n              border-right: 1px solid ${traditionalBorder};\n      \n              &:last-child {\n                border-right: none;\n              }\n            }\n          `}\n        `\n      : css`\n          display: -ms-grid;\n          display: grid;\n          -ms-grid-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr)\n            minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr)\n            minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr)\n            minmax(0, 1fr);\n          grid-template-columns: repeat(12, minmax(0, 1fr));\n          -ms-grid-rows: minmax(${defaultLineHeight}, max-content)\n            minmax(${defaultLineHeight}, max-content);\n          grid-template-rows: minmax(${defaultLineHeight}, auto) minmax(\n              ${defaultLineHeight},\n              auto\n            );\n          justify-content: space-between;\n          grid-column-gap: ${columnGutter};\n        `}\n`\n\nconst formWrapper = css`\n  display: inherit;\n  flex-direction: inherit;\n  height: inherit;\n  max-height: inherit;\n`\n\nexport const StyledFormikForm = styled(FormikForm)`\n  ${formWrapper}\n`\n\nexport const StyledForm = styled.div`\n  ${formWrapper}\n`\n\nexport const StyledLabel = styled(Label)`\n  word-wrap: break-word;\n  word-break: break-word;\n`\n"],"mappings":"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"}

package/dist/Form/Form.types.d.ts

@@ -1,18 +1,18 @@
 /// <reference types="react" />
-import { FieldHelperProps, FieldInputProps, FieldMetaProps as FormikFieldMetaProps, FieldValidator, FormikConfig } from 'formik';
-import { CheckboxProps } from '../Checkbox/Checkbox.types';
-import { DateSelectProps } from '../DateSelect';
-import { GroupSelectProps } from '../GroupSelect/GroupSelect.types';
-import { InputProps } from '../Input/Input.types';
-import { MultiSelectProps } from '../MultiSelect/MultiSelect.types';
-import { CurrencyInputProps, InputValue as BaseNumberInputValueType, NumberInputProps } from '../NumberInput/NumberInput.types';
-import { PillSelectProps } from '../PillSelect/PillSelect.types';
-import { SelectButtonProps, SelectProps } from '../Select/Select.types';
-import { TextAreaProps } from '../TextArea/TextArea.types';
-import { TextEditorProps } from '../TextEditor';
-import { TieredSelectProps } from '../TieredSelect/TieredSelect.types';
-import { TooltipProps } from '../Tooltip/Tooltip.types';
-import { Props } from '../_utils/types';
+import type { FieldHelperProps, FieldInputProps, FieldMetaProps as FormikFieldMetaProps, FieldValidator, FormikConfig } from 'formik';
+import type { CheckboxProps } from '../Checkbox/Checkbox.types';
+import type { DateSelectProps } from '../DateSelect';
+import type { GroupSelectProps } from '../GroupSelect/GroupSelect.types';
+import type { InputProps } from '../Input/Input.types';
+import type { MultiSelectProps } from '../MultiSelect/MultiSelect.types';
+import type { CurrencyInputProps, InputValue as BaseNumberInputValueType, NumberInputProps } from '../NumberInput/NumberInput.types';
+import type { PillSelectProps } from '../PillSelect/PillSelect.types';
+import type { SelectButtonProps, SelectProps } from '../Select/Select.types';
+import type { TextAreaProps } from '../TextArea/TextArea.types';
+import type { TextEditorProps } from '../TextEditor';
+import type { TieredSelectProps } from '../TieredSelect/TieredSelect.types';
+import type { TooltipProps } from '../Tooltip/Tooltip.types';
+import type { Props } from '../_utils/types';
 export declare type ValueInArray<V> = V[keyof V];
 export declare type View = 'create' | 'read' | 'update';
 export declare type Layout = 'wxp' | 'traditional';

package/dist/Form/Form.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.types.js","names":[],"sources":["../../src/Form/Form.types.ts"],"sourcesContent":["import {\n  FieldHelperProps,\n  FieldInputProps,\n  FieldMetaProps as FormikFieldMetaProps,\n  FieldValidator,\n  FormikConfig,\n} from 'formik'\nimport { CheckboxProps } from '../Checkbox/Checkbox.types'\nimport { DateSelectProps } from '../DateSelect'\nimport { GroupSelectProps } from '../GroupSelect/GroupSelect.types'\nimport { InputProps } from '../Input/Input.types'\nimport { MultiSelectProps } from '../MultiSelect/MultiSelect.types'\nimport {\n  CurrencyInputProps,\n  InputValue as BaseNumberInputValueType,\n  NumberInputProps,\n} from '../NumberInput/NumberInput.types'\nimport { PillSelectProps } from '../PillSelect/PillSelect.types'\nimport { SelectButtonProps, SelectProps } from '../Select/Select.types'\nimport { TextAreaProps } from '../TextArea/TextArea.types'\nimport { TextEditorProps } from '../TextEditor'\nimport { TieredSelectProps } from '../TieredSelect/TieredSelect.types'\nimport { TooltipProps } from '../Tooltip/Tooltip.types'\nimport { Props } from '../_utils/types'\n\nexport type ValueInArray<V> = V[keyof V]\nexport type View = 'create' | 'read' | 'update'\nexport type Layout = 'wxp' | 'traditional'\n\nexport interface FormContextAPI {\n  /**\n   * @since 10.19.0\n   */\n  different: boolean\n  /**\n   * @since 10.19.0\n   */\n  disabled: boolean\n  /**\n   * @since 10.19.0\n   */\n  enableReinitialize?: boolean\n  /**\n   * @since 10.19.0\n   */\n  setFieldDifferent: (key: string, different: boolean) => void\n\n  /**\n   * A <a href=\"https://github.com/jquense/yup\">Yup</a> object schema to\n   * validate all values.\n   * <CodeBlock>\n   *  {`Yup.object().shape({\n   *    input_name: Yup.mixed().required()\n   *  })`}\n   * </CodeBlock>\n   * This is a great way to get error messages into the component. In\n   * addition, if using Yup for required, those fields will automatically\n   * get the required asterisk and highlight error.\n   * @since 10.19.0\n   */\n  validationSchema?: FormikConfig<unknown>['validationSchema']\n\n  /**\n   * Toggle between modern and traditional form styles. Leave blank for the\n   * modern label-above layout.\n   * @since 10.19.0\n   */\n  variant: Layout\n\n  /**\n   * Determines show or edit state of form.\n   * @default 'create'\n   * @since 10.19.0\n   */\n  view: View\n}\n\ninterface FieldMetaProps<Value>\n  extends Omit<FormikFieldMetaProps<Value>, 'error'> {\n  /**\n   * @since 10.19.0\n   */\n  disabled: boolean\n  /**\n   * @since 10.19.0\n   */\n  error: boolean\n  /**\n   * @since 10.19.0\n   */\n  required: boolean\n  /**\n   * @since 10.19.0\n   */\n  view: View\n}\n\nexport interface FieldConfig {\n  /**\n   * @since 10.19.0\n   */\n  disabled?: boolean\n  /**\n   * @since 10.19.0\n   */\n  error?: boolean | string\n  /**\n   * @since 10.19.0\n   */\n  getId?: (item: any) => string | number\n  /**\n   * @since 10.19.0\n   */\n  name: string\n  /**\n   * @since 10.19.0\n   */\n  required?: boolean\n  /**\n   * @since 10.19.0\n   */\n  validate?: FieldValidator\n  /**\n   * @since 10.19.0\n   */\n  view?: View\n}\n\nexport interface FormFieldAPI<Value> {\n  /**\n   * @since 10.19.0\n   */\n  input: FieldInputProps<Value>\n  /**\n   * @since 10.19.0\n   */\n  helpers: {\n    setValue: (\n      value: Value,\n      shouldValidate?: boolean,\n      shouldMarkDifferent?: boolean\n    ) => void\n    setTouched: FieldHelperProps<Value>['setTouched']\n    setError: FieldHelperProps<Value>['setError']\n  }\n\n  /**\n   * @since 10.19.0\n   */\n  messages: {\n    error?: string\n  }\n  /**\n   * @since 10.19.0\n   */\n  meta: FieldMetaProps<Value>\n}\n\nexport interface FormProps<Values> extends Partial<FormikConfig<Values>> {\n  /**\n   * @since 10.19.0\n   */\n  children: React.ReactNode\n\n  /**\n   * Enable a browser confirmation about losing of unsaved data when the\n   * form values are visually different from the initial values. Uses\n   * `window.onbeforeunload` and `window.confirm` for dialogs(Modal, Tearsheet).\n   * **Requires `onSubmit` to return a promise to remove onbeforeunload.**\n   */\n  enableConfirmNavigation?: boolean\n\n  /**\n   * Disable all fields at once.\n   * @default false\n   */\n  disabled?: boolean\n\n  /**\n   * Toggle between modern and traditional form styles. Leave blank for the modern label-above layout.\n   *\n   */\n  variant?: Layout\n\n  /**\n   * Determines show or edit state of form.\n   * @default 'create'\n   */\n  view?: View\n}\n\nexport type FormFieldValueComponentProps<Value = any> = {\n  field: FormFieldAPI<Value>\n}\n\nexport type ComponentWithFieldProp<\n  Value,\n  Props extends FormFieldValueComponentProps<Value>\n> =\n  | React.FunctionComponent<Props>\n  | React.ForwardRefExoticComponent<Props>\n  | ((p: Props) => React.ReactNode)\n\nexport interface BaseFieldProps<\n  Value,\n  ComponentProps extends FormFieldValueComponentProps<Value>\n> {\n  /**\n   * Customize the input component, either a single component for all views\n   * or an object with the keys of the views to render on that particular\n   * view. This input component will receive the <Code>field</Code> prop.\n   * If using TypeScript, these components will need to extend a specific\n   * type from Core React, read more about the{' '}\n   * <a href=\"#typescript-and-as-prop-components\">props per view</a>.\n   * <br />\n   * <br />\n   * One of:\n   * <br />\n   * <Code>ReactComponent</Code>or\n   * <Code>\n   * {\n   *    '{ read: ReactComponent, create: ReactComponent, update: ReactComponent }'\n   * }\n   * </Code>\n   * @since 10.19.0\n   */\n  as?:\n    | ComponentWithFieldProp<Value, ComponentProps>\n    | { [V in View]: ComponentWithFieldProp<Value, ComponentProps> }\n\n  /**\n   * A subcomponent to render on a particular view.\n   * <br />\n   * <br />\n   * One or all of:\n   * <br />\n   * <Code>Form.X.Create, Form.X.Read, Form.X.Update</Code>\n   * @since 10.19.0\n   */\n  children?: ((field: FormFieldAPI<Value>) => React.ReactNode) | React.ReactNode\n\n  /**\n   * Starting location of column. For traditional variant, this does not exist\n   * and is not necessary.\n   * @since 10.19.0\n   * */\n  colStart?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n\n  /**\n   * Width of column. For traditional variant, will be either 6 or 12.\n   * @default 6\n   * @since 10.19.0\n   */\n  colWidth?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n  /**\n   * @since 10.19.0\n   */\n  ['data-qa']?: string\n\n  /**\n   * Specify disabled. Field disabled replaces the overall Form disabled state.\n   * @since 10.19.0\n   */\n  disabled?: boolean\n  /**\n   * @since 10.19.0\n   */\n  error?: boolean | string\n  /**\n   * @since 10.19.0\n   */\n  label?: string\n\n  /**\n   * Key path in store. Accepts <Code>bracket[notation]</Code> or{' '}\n   * <Code>dot.notation</Code>.\n   * @since 10.19.0\n   */\n  name: string\n\n  /**\n   * The required asterisk if not using Yup <Code>required</Code>\n   * <CodeBlock>\n   * {`<Form\n   * validationSchema={Yup.object().shape({\n   *  input_name: Yup.mixed().required(),\n   * })}>`}\n   * </CodeBlock>\n   * @since 10.19.0\n   */\n  required?: boolean\n\n  /**\n   * @since 10.19.0\n   */\n  tooltip?: TooltipProps['overlay']\n\n  /**\n   * The validate function from Formik for single field validation.\n   * <CodeBlock>\n   *  {`(value: Value = any) => undefined | string | Promise<Value>`}\n   * </CodeBlock>\n   * @since 10.19.0\n   */\n  validate?: FieldValidator\n\n  /**\n   * Determines show or edit state of field.\n   * @since 10.19.0\n   */\n  view?: View\n}\n\nexport interface TraditionalBaseFieldProps<\n  Value,\n  ComponentProps extends FormFieldValueComponentProps<Value>\n> extends Omit<BaseFieldProps<Value, ComponentProps>, 'colWidth' | 'colStart'> {\n  /**\n   * @since 10.19.0\n   */\n  colWidth?: 6 | 12\n}\n\nexport interface FormFieldProps<Value>\n  extends Omit<\n    BaseFieldProps<Value, FormFieldValueComponentProps<Value>>,\n    'children'\n  > {\n  /**\n   * @since 10.19.0\n   */\n  children?:\n    | React.ReactElement<\n        BaseFieldProps<Value, FormFieldValueComponentProps<Value>>\n      >\n    | React.ReactElement<\n        BaseFieldProps<Value, FormFieldValueComponentProps<Value>>\n      >[]\n}\n\nexport type OptionList<OptionShape = any> = {\n  /**\n   * <div>\n   *  The id of an option{' '}\n   *  <Code>{'(option: OptionItem) => string | number'}</Code>\n   * </div>\n   * <br />\n   * <div>\n   *  Default:\n   *  <Code>{'(option: OptionItem) => option.id'}</Code>\n   * </div>\n   * @since 10.19.0\n   */\n  getId: (option: OptionShape) => string | number\n\n  /**\n   * <div>\n   *  The display label of an option\n   *  <Code>{'(option: OptionItem) => string'}</Code>\n   * </div>\n   * <br />\n   * <div>\n   *  Default:\n   *  <Code>{'(option: OptionItem) => option.label || option.name'}</Code>\n   * </div>\n   * @since 10.19.0\n   */\n  getLabel: (option: OptionShape) => string\n\n  /**\n   * @since 10.19.0\n   */\n  options?: OptionShape[]\n}\n\nexport interface FormErrorBannerProps {\n  /**\n   * @since 10.19.0\n   */\n  i18nScope?: string\n  /**\n   * @since 10.19.0\n   */\n  item: string\n}\n\n// MAKE\n\nexport type ViewFieldProps<\n  Value,\n  FieldTypeProps extends FormFieldProps<Value>,\n  ComponentProps extends FormFieldValueComponentProps<Value>\n> = Partial<Omit<FieldTypeProps, 'children'>> & {\n  /**\n   * @since 10.19.0\n   */\n  children?: BaseFieldProps<Value, ComponentProps>['children']\n}\n\n// TEXT\n\nexport type FieldTextValueType = string\n\nexport interface FieldTextComponentProps<Value = FieldTextValueType>\n  extends FormFieldValueComponentProps<Value>,\n    InputProps {}\nexport interface FormTextProps<Value = FieldTextValueType>\n  extends FormFieldProps<Value>,\n    Omit<InputProps, 'name' | 'children' | 'error'> {}\n\n// NUMBER\n\nexport type FieldNumberValueType = BaseNumberInputValueType\n\nexport interface FieldNumberComponentProps<Value = FieldNumberValueType>\n  extends FormFieldValueComponentProps<Value>,\n    NumberInputProps {}\n\nexport interface FormNumberProps<Value = FieldNumberValueType>\n  extends FormFieldProps<Value>,\n    Omit<NumberInputProps, 'name' | 'children' | 'error'> {}\n\n// CURRENCY\n\nexport type FieldCurrencyValueType = BaseNumberInputValueType\n\nexport interface FieldCurrencyComponentProps<Value = FieldCurrencyValueType>\n  extends FormFieldValueComponentProps<Value>,\n    CurrencyInputProps {}\n\nexport interface FormCurrencyProps<Value = FieldCurrencyValueType>\n  extends FormFieldProps<Value>,\n    Omit<CurrencyInputProps, 'name' | 'children' | 'error'> {}\n\n// DATE\nexport type FieldDateValueType = null | string | Date\n\nexport interface FieldDateComponentProps<Value = FieldDateValueType>\n  extends FormFieldValueComponentProps<Value>,\n    DateSelectProps {}\n\nexport interface FormDateProps<Value = FieldDateValueType>\n  extends FormFieldProps<Value>,\n    Omit<DateSelectProps, 'error'> {}\n\n// CHECKBOX\n\nexport type FieldCheckboxValueType = boolean\n\nexport interface FieldCheckboxComponentProps<Value = FieldCheckboxValueType>\n  extends FormFieldValueComponentProps<Value>,\n    CheckboxProps {\n  /**\n   * @since 10.19.0\n   */\n  i18nScope?: string\n}\n\nexport interface FormCheckboxProps<Value = FieldCheckboxValueType>\n  extends FormFieldProps<Value>,\n    Omit<CheckboxProps, 'name' | 'error' | 'children'> {\n  /**\n   * @since 10.19.0\n   */\n  i18nScope?: string\n}\n\n// TEXTAREA\n\nexport type FieldTextAreaValueType = string\n\nexport interface FieldTextAreaComponentProps<Value = FieldTextAreaValueType>\n  extends FormFieldValueComponentProps<Value>,\n    TextAreaProps {}\nexport interface FormTextAreaProps<Value = FieldTextAreaValueType>\n  extends FormFieldProps<Value>,\n    Omit<TextAreaProps, 'name' | 'error' | 'children'> {}\n\n// RICHTEXT\n\nexport type FieldRichTextValueType = string\n\nexport interface FieldRichTextComponentProps<Value = FieldRichTextValueType>\n  extends FormFieldValueComponentProps<Value>,\n    TextEditorProps {}\n\nexport interface FormRichTextProps<Value = FieldRichTextValueType>\n  extends Omit<FormFieldProps<Value>, 'error'>,\n    TextEditorProps {}\n\n// RADIO BUTTONS\n\nexport type FieldRadioButtonsValueType = any\n\nexport interface FieldRadioButtonsComponentProps<\n  Value = FieldRadioButtonsValueType\n> extends FormFieldValueComponentProps<Value>,\n    Partial<OptionList<Value>>,\n    Pick<Props, 'className' | 'style'> {\n  /**\n   * @since 10.19.0\n   */\n  isDisabledOption?: (option: Value) => boolean\n}\n\nexport interface FormRadioButtonsProps<Value = FieldRadioButtonsValueType>\n  extends FormFieldProps<Value>,\n    Partial<OptionList<Value>>,\n    Pick<Props, 'className' | 'style'>,\n    Pick<FieldRadioButtonsComponentProps, 'isDisabledOption'> {}\n\n// CHECKBOXES\n\nexport type FieldCheckboxesValueType = any[]\n\nexport interface FieldCheckboxesComponentProps<Value = FieldCheckboxesValueType>\n  extends FormFieldValueComponentProps<Value>,\n    Partial<OptionList<ValueInArray<Value>>>,\n    Pick<Props, 'className' | 'style'> {\n  /**\n   * @since 10.19.0\n   */\n  isDisabledOption?: (option: Value) => boolean\n  /**\n   * @since 10.19.0\n   */\n  isIndeterminateOption?: (option: Value) => boolean\n}\n\nexport interface FormCheckboxesProps<Value = FieldCheckboxesValueType>\n  extends FormFieldProps<Value>,\n    Partial<OptionList<ValueInArray<Value>>>,\n    Pick<Props, 'className' | 'style'>,\n    Pick<\n      FieldCheckboxesComponentProps,\n      'isDisabledOption' | 'isIndeterminateOption'\n    > {}\n\n// SELECT\n\nexport type FieldSelectValueType = any\nexport type FieldSelectOptionItem = FieldSelectValueType\nexport type FieldSelectGroupItem = any\nexport type FieldSelectGroupHeader = FieldSelectGroupItem & {\n  isGroupHeader: boolean\n}\n\nexport interface GroupedOptionsConfig<OptionItem, GroupItem>\n  extends OptionList<OptionItem> {\n  /**\n   * @since 10.19.0\n   */\n  comparator?: (query: string, value: string) => boolean\n  /**\n   * @since 10.19.0\n   */\n  getGroup: (option: OptionItem) => number | string\n  /**\n   * <div>\n   *  The id of group{' '}\n   *  <Code>{'(group: GroupItem) => string | number'}</Code>\n   * </div>\n   * <br />\n   * <div>\n   *  Default:\n   *  <Code>{'(group) => group.id'}</Code>\n   * </div>\n   * @since 10.19.0\n   */\n  groupGetId: (group: GroupItem) => number | string\n  /**\n   * @since 10.19.0\n   */\n  optgroups?: GroupItem[]\n  /**\n   * @since 10.19.0\n   */\n  value?: OptionItem\n}\n\nexport interface FieldSelectComponentProps<\n  Value = FieldSelectValueType,\n  OptionItem = FieldSelectOptionItem,\n  GroupItem = FieldSelectGroupItem\n> extends FormFieldValueComponentProps<Value>,\n    Partial<OptionList<OptionItem>>,\n    Omit<SelectProps, 'onClear' | 'onSearch' | 'error' | 'children'> {\n  /**\n   * Callback for each entry in <Code>options</Code> to define relation to\n   * group in <Code>optgroups</Code>\n   * <Code>{'(option: OptionItem) => string | number'}</Code>\n   * @since 10.19.0\n   * */\n  getGroup?: (option: OptionItem) => number | string\n  /**\n   * @since 10.19.0\n   */\n  groupGetId?: (group: GroupItem) => number | string\n\n  /**\n   * <div>\n   *  The display label of a group\n   *  <Code>{'(group: GroupItem) => string'}</Code>\n   * </div>\n   * <br />\n   * <div>\n   *  Default:\n   *  <Code>{'(group: GroupItem) => group.label || group.name'}</Code>\n   * </div>\n   * @since 10.19.0\n   */\n  groupGetLabel?: (group: GroupItem) => string\n\n  /**\n   * Callback for rendering header for each entry in <Code>optgroups</Code>\n   * <Code>{'(group: GroupItem) => React.ReactNode'}</Code>\n   * @since 10.19.0\n   */\n  groupHeaderRenderer?: (group: GroupItem) => React.ReactNode\n\n  /**\n   * If nothing is selected, suggest this option. From{' '}\n   * <Code>{'Select.Option suggested'}</Code>.\n   * <Code>{'(option: OptionItem) => boolean'}</Code>\n   * @since 10.19.0\n   */\n  isSuggestedOption?: (option: OptionItem) => boolean\n\n  /**\n   * Array of available option groups\n   * @since 10.19.0\n   */\n  optgroups?: GroupItem[]\n\n  /**\n   * Callback for rendering each <Code>option</Code>\n   * <Code>{'(option: OptionItem) => React.ReactNode'}</Code>\n   * @since 10.19.0\n   */\n  optionRenderer?: (option: OptionItem) => React.ReactNode\n  /**\n   * @since 10.19.0\n   */\n  onBlur?: (e: React.FocusEvent<HTMLDivElement>) => void\n\n  /**\n   * Callback for when cleared. Default enabled, has clear icon.\n   * @since 10.19.0\n   */\n  onClear?: false | SelectButtonProps['onClear']\n\n  /**\n   * Callback for when searching. Default enabled, has seach bar in menu.\n   * @since 10.19.0\n   */\n  onSearch?: false | SelectProps['onSearch']\n\n  /**\n   * <div>Customize how search works</div>\n   * <Code>{'(query: string, value: string) => boolean'}</Code>\n   * @since 10.19.0\n   */\n  searchComparator?: (query: string, value: string) => boolean\n}\nexport interface FormSelectProps<\n  Value = FieldSelectValueType,\n  OptionItem = FieldSelectOptionItem,\n  GroupItem = FieldSelectGroupItem\n> extends FormFieldProps<Value>,\n    Partial<OptionList<OptionItem>>,\n    Pick<\n      FieldSelectComponentProps<Value, OptionItem, GroupItem>,\n      | 'getGroup'\n      | 'groupGetId'\n      | 'groupGetLabel'\n      | 'groupHeaderRenderer'\n      | 'isSuggestedOption'\n      | 'onBlur'\n      | 'onClear'\n      | 'optgroups'\n      | 'onSearch'\n      | 'optionRenderer'\n      | 'searchComparator'\n    >,\n    Omit<\n      SelectProps,\n      'onClear' | 'onSearch' | 'error' | 'children' | 'label'\n    > {}\n\n// PILL SELECT\n\nexport type FieldPillSelectValueType = any\n\ninterface PillSelectCommon\n  extends Omit<PillSelectProps, 'children' | 'onClear' | 'error' | 'value'> {\n  /**\n   * @since 10.19.0\n   */\n  onClear?: false | PillSelectProps['onClear']\n}\n\nexport interface FieldPillSelectComponentProps<Value = FieldPillSelectValueType>\n  extends FormFieldValueComponentProps<Value>,\n    PillSelectCommon {}\n\nexport interface FormPillSelectProps<Value = FieldPillSelectValueType>\n  extends FormFieldProps<Value>,\n    PillSelectCommon {}\n\n// MULTISELECT\n\nexport type FieldMultiSelectValueType = any[]\n\ninterface MultiSelectCommon<Value>\n  extends Partial<OptionList<ValueInArray<Value>>>,\n    Omit<MultiSelectProps, 'options' | 'getLabel' | 'getId' | 'error'> {}\n\nexport interface FieldMultiSelectComponentProps<\n  Value = FieldMultiSelectValueType\n> extends FormFieldValueComponentProps<Value>,\n    MultiSelectCommon<Value> {}\n\nexport interface FormMultiSelectProps<Value = FieldMultiSelectValueType>\n  extends FormFieldProps<Value>,\n    MultiSelectCommon<Value> {}\n\n// GROUP SELECT\n\nexport type FieldGroupSelectValueType = any[]\n\ninterface GroupSelectCommon<Value>\n  extends Partial<OptionList<Value[keyof Value]>>,\n    Omit<GroupSelectProps, 'options' | 'getLabel' | 'getId' | 'error'> {}\n\nexport interface FieldGroupSelectComponentProps<\n  Value = FieldGroupSelectValueType\n> extends FormFieldValueComponentProps<Value>,\n    GroupSelectCommon<Value> {}\n\nexport interface FormGroupSelectProps<Value = FieldGroupSelectValueType>\n  extends FormFieldProps<Value>,\n    GroupSelectCommon<Value> {}\n\n// TIERED SELECT\n\nexport type FieldTieredSelectValueType = any[]\n\ninterface TieredSelectCommon<Value>\n  extends Partial<OptionList<Value[keyof Value]>>,\n    Omit<\n      TieredSelectProps,\n      'options' | 'getLabel' | 'getId' | 'error' | 'children'\n    > {}\n\nexport interface FieldTieredSelectComponentProps<\n  Value = FieldTieredSelectValueType\n> extends FormFieldValueComponentProps<Value>,\n    TieredSelectCommon<Value> {}\n\nexport interface FormTieredSelectProps<Value = FieldTieredSelectValueType>\n  extends FormFieldProps<Value>,\n    TieredSelectCommon<Value> {}\n"],"mappings":""}
+{"version":3,"file":"Form.types.js","names":[],"sources":["../../src/Form/Form.types.ts"],"sourcesContent":["import type {\n  FieldHelperProps,\n  FieldInputProps,\n  FieldMetaProps as FormikFieldMetaProps,\n  FieldValidator,\n  FormikConfig,\n} from 'formik'\nimport type { CheckboxProps } from '../Checkbox/Checkbox.types'\nimport type { DateSelectProps } from '../DateSelect'\nimport type { GroupSelectProps } from '../GroupSelect/GroupSelect.types'\nimport type { InputProps } from '../Input/Input.types'\nimport type { MultiSelectProps } from '../MultiSelect/MultiSelect.types'\nimport type {\n  CurrencyInputProps,\n  InputValue as BaseNumberInputValueType,\n  NumberInputProps,\n} from '../NumberInput/NumberInput.types'\nimport type { PillSelectProps } from '../PillSelect/PillSelect.types'\nimport type { SelectButtonProps, SelectProps } from '../Select/Select.types'\nimport type { TextAreaProps } from '../TextArea/TextArea.types'\nimport type { TextEditorProps } from '../TextEditor'\nimport type { TieredSelectProps } from '../TieredSelect/TieredSelect.types'\nimport type { TooltipProps } from '../Tooltip/Tooltip.types'\nimport type { Props } from '../_utils/types'\n\nexport type ValueInArray<V> = V[keyof V]\nexport type View = 'create' | 'read' | 'update'\nexport type Layout = 'wxp' | 'traditional'\n\nexport interface FormContextAPI {\n  /**\n   * @since 10.19.0\n   */\n  different: boolean\n  /**\n   * @since 10.19.0\n   */\n  disabled: boolean\n  /**\n   * @since 10.19.0\n   */\n  enableReinitialize?: boolean\n  /**\n   * @since 10.19.0\n   */\n  setFieldDifferent: (key: string, different: boolean) => void\n\n  /**\n   * A <a href=\"https://github.com/jquense/yup\">Yup</a> object schema to\n   * validate all values.\n   * <CodeBlock>\n   *  {`Yup.object().shape({\n   *    input_name: Yup.mixed().required()\n   *  })`}\n   * </CodeBlock>\n   * This is a great way to get error messages into the component. In\n   * addition, if using Yup for required, those fields will automatically\n   * get the required asterisk and highlight error.\n   * @since 10.19.0\n   */\n  validationSchema?: FormikConfig<unknown>['validationSchema']\n\n  /**\n   * Toggle between modern and traditional form styles. Leave blank for the\n   * modern label-above layout.\n   * @since 10.19.0\n   */\n  variant: Layout\n\n  /**\n   * Determines show or edit state of form.\n   * @default 'create'\n   * @since 10.19.0\n   */\n  view: View\n}\n\ninterface FieldMetaProps<Value>\n  extends Omit<FormikFieldMetaProps<Value>, 'error'> {\n  /**\n   * @since 10.19.0\n   */\n  disabled: boolean\n  /**\n   * @since 10.19.0\n   */\n  error: boolean\n  /**\n   * @since 10.19.0\n   */\n  required: boolean\n  /**\n   * @since 10.19.0\n   */\n  view: View\n}\n\nexport interface FieldConfig {\n  /**\n   * @since 10.19.0\n   */\n  disabled?: boolean\n  /**\n   * @since 10.19.0\n   */\n  error?: boolean | string\n  /**\n   * @since 10.19.0\n   */\n  getId?: (item: any) => string | number\n  /**\n   * @since 10.19.0\n   */\n  name: string\n  /**\n   * @since 10.19.0\n   */\n  required?: boolean\n  /**\n   * @since 10.19.0\n   */\n  validate?: FieldValidator\n  /**\n   * @since 10.19.0\n   */\n  view?: View\n}\n\nexport interface FormFieldAPI<Value> {\n  /**\n   * @since 10.19.0\n   */\n  input: FieldInputProps<Value>\n  /**\n   * @since 10.19.0\n   */\n  helpers: {\n    setValue: (\n      value: Value,\n      shouldValidate?: boolean,\n      shouldMarkDifferent?: boolean\n    ) => void\n    setTouched: FieldHelperProps<Value>['setTouched']\n    setError: FieldHelperProps<Value>['setError']\n  }\n\n  /**\n   * @since 10.19.0\n   */\n  messages: {\n    error?: string\n  }\n  /**\n   * @since 10.19.0\n   */\n  meta: FieldMetaProps<Value>\n}\n\nexport interface FormProps<Values> extends Partial<FormikConfig<Values>> {\n  /**\n   * @since 10.19.0\n   */\n  children: React.ReactNode\n\n  /**\n   * Enable a browser confirmation about losing of unsaved data when the\n   * form values are visually different from the initial values. Uses\n   * `window.onbeforeunload` and `window.confirm` for dialogs(Modal, Tearsheet).\n   * **Requires `onSubmit` to return a promise to remove onbeforeunload.**\n   */\n  enableConfirmNavigation?: boolean\n\n  /**\n   * Disable all fields at once.\n   * @default false\n   */\n  disabled?: boolean\n\n  /**\n   * Toggle between modern and traditional form styles. Leave blank for the modern label-above layout.\n   *\n   */\n  variant?: Layout\n\n  /**\n   * Determines show or edit state of form.\n   * @default 'create'\n   */\n  view?: View\n}\n\nexport type FormFieldValueComponentProps<Value = any> = {\n  field: FormFieldAPI<Value>\n}\n\nexport type ComponentWithFieldProp<\n  Value,\n  Props extends FormFieldValueComponentProps<Value>\n> =\n  | React.FunctionComponent<Props>\n  | React.ForwardRefExoticComponent<Props>\n  | ((p: Props) => React.ReactNode)\n\nexport interface BaseFieldProps<\n  Value,\n  ComponentProps extends FormFieldValueComponentProps<Value>\n> {\n  /**\n   * Customize the input component, either a single component for all views\n   * or an object with the keys of the views to render on that particular\n   * view. This input component will receive the <Code>field</Code> prop.\n   * If using TypeScript, these components will need to extend a specific\n   * type from Core React, read more about the{' '}\n   * <a href=\"#typescript-and-as-prop-components\">props per view</a>.\n   * <br />\n   * <br />\n   * One of:\n   * <br />\n   * <Code>ReactComponent</Code>or\n   * <Code>\n   * {\n   *    '{ read: ReactComponent, create: ReactComponent, update: ReactComponent }'\n   * }\n   * </Code>\n   * @since 10.19.0\n   */\n  as?:\n    | ComponentWithFieldProp<Value, ComponentProps>\n    | { [V in View]: ComponentWithFieldProp<Value, ComponentProps> }\n\n  /**\n   * A subcomponent to render on a particular view.\n   * <br />\n   * <br />\n   * One or all of:\n   * <br />\n   * <Code>Form.X.Create, Form.X.Read, Form.X.Update</Code>\n   * @since 10.19.0\n   */\n  children?: ((field: FormFieldAPI<Value>) => React.ReactNode) | React.ReactNode\n\n  /**\n   * Starting location of column. For traditional variant, this does not exist\n   * and is not necessary.\n   * @since 10.19.0\n   * */\n  colStart?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n\n  /**\n   * Width of column. For traditional variant, will be either 6 or 12.\n   * @default 6\n   * @since 10.19.0\n   */\n  colWidth?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n  /**\n   * @since 10.19.0\n   */\n  ['data-qa']?: string\n\n  /**\n   * Specify disabled. Field disabled replaces the overall Form disabled state.\n   * @since 10.19.0\n   */\n  disabled?: boolean\n  /**\n   * @since 10.19.0\n   */\n  error?: boolean | string\n  /**\n   * @since 10.19.0\n   */\n  label?: string\n\n  /**\n   * Key path in store. Accepts <Code>bracket[notation]</Code> or{' '}\n   * <Code>dot.notation</Code>.\n   * @since 10.19.0\n   */\n  name: string\n\n  /**\n   * The required asterisk if not using Yup <Code>required</Code>\n   * <CodeBlock>\n   * {`<Form\n   * validationSchema={Yup.object().shape({\n   *  input_name: Yup.mixed().required(),\n   * })}>`}\n   * </CodeBlock>\n   * @since 10.19.0\n   */\n  required?: boolean\n\n  /**\n   * @since 10.19.0\n   */\n  tooltip?: TooltipProps['overlay']\n\n  /**\n   * The validate function from Formik for single field validation.\n   * <CodeBlock>\n   *  {`(value: Value = any) => undefined | string | Promise<Value>`}\n   * </CodeBlock>\n   * @since 10.19.0\n   */\n  validate?: FieldValidator\n\n  /**\n   * Determines show or edit state of field.\n   * @since 10.19.0\n   */\n  view?: View\n}\n\nexport interface TraditionalBaseFieldProps<\n  Value,\n  ComponentProps extends FormFieldValueComponentProps<Value>\n> extends Omit<BaseFieldProps<Value, ComponentProps>, 'colWidth' | 'colStart'> {\n  /**\n   * @since 10.19.0\n   */\n  colWidth?: 6 | 12\n}\n\nexport interface FormFieldProps<Value>\n  extends Omit<\n    BaseFieldProps<Value, FormFieldValueComponentProps<Value>>,\n    'children'\n  > {\n  /**\n   * @since 10.19.0\n   */\n  children?:\n    | React.ReactElement<\n        BaseFieldProps<Value, FormFieldValueComponentProps<Value>>\n      >\n    | React.ReactElement<\n        BaseFieldProps<Value, FormFieldValueComponentProps<Value>>\n      >[]\n}\n\nexport type OptionList<OptionShape = any> = {\n  /**\n   * <div>\n   *  The id of an option{' '}\n   *  <Code>{'(option: OptionItem) => string | number'}</Code>\n   * </div>\n   * <br />\n   * <div>\n   *  Default:\n   *  <Code>{'(option: OptionItem) => option.id'}</Code>\n   * </div>\n   * @since 10.19.0\n   */\n  getId: (option: OptionShape) => string | number\n\n  /**\n   * <div>\n   *  The display label of an option\n   *  <Code>{'(option: OptionItem) => string'}</Code>\n   * </div>\n   * <br />\n   * <div>\n   *  Default:\n   *  <Code>{'(option: OptionItem) => option.label || option.name'}</Code>\n   * </div>\n   * @since 10.19.0\n   */\n  getLabel: (option: OptionShape) => string\n\n  /**\n   * @since 10.19.0\n   */\n  options?: OptionShape[]\n}\n\nexport interface FormErrorBannerProps {\n  /**\n   * @since 10.19.0\n   */\n  i18nScope?: string\n  /**\n   * @since 10.19.0\n   */\n  item: string\n}\n\n// MAKE\n\nexport type ViewFieldProps<\n  Value,\n  FieldTypeProps extends FormFieldProps<Value>,\n  ComponentProps extends FormFieldValueComponentProps<Value>\n> = Partial<Omit<FieldTypeProps, 'children'>> & {\n  /**\n   * @since 10.19.0\n   */\n  children?: BaseFieldProps<Value, ComponentProps>['children']\n}\n\n// TEXT\n\nexport type FieldTextValueType = string\n\nexport interface FieldTextComponentProps<Value = FieldTextValueType>\n  extends FormFieldValueComponentProps<Value>,\n    InputProps {}\nexport interface FormTextProps<Value = FieldTextValueType>\n  extends FormFieldProps<Value>,\n    Omit<InputProps, 'name' | 'children' | 'error'> {}\n\n// NUMBER\n\nexport type FieldNumberValueType = BaseNumberInputValueType\n\nexport interface FieldNumberComponentProps<Value = FieldNumberValueType>\n  extends FormFieldValueComponentProps<Value>,\n    NumberInputProps {}\n\nexport interface FormNumberProps<Value = FieldNumberValueType>\n  extends FormFieldProps<Value>,\n    Omit<NumberInputProps, 'name' | 'children' | 'error'> {}\n\n// CURRENCY\n\nexport type FieldCurrencyValueType = BaseNumberInputValueType\n\nexport interface FieldCurrencyComponentProps<Value = FieldCurrencyValueType>\n  extends FormFieldValueComponentProps<Value>,\n    CurrencyInputProps {}\n\nexport interface FormCurrencyProps<Value = FieldCurrencyValueType>\n  extends FormFieldProps<Value>,\n    Omit<CurrencyInputProps, 'name' | 'children' | 'error'> {}\n\n// DATE\nexport type FieldDateValueType = null | string | Date\n\nexport interface FieldDateComponentProps<Value = FieldDateValueType>\n  extends FormFieldValueComponentProps<Value>,\n    DateSelectProps {}\n\nexport interface FormDateProps<Value = FieldDateValueType>\n  extends FormFieldProps<Value>,\n    Omit<DateSelectProps, 'error'> {}\n\n// CHECKBOX\n\nexport type FieldCheckboxValueType = boolean\n\nexport interface FieldCheckboxComponentProps<Value = FieldCheckboxValueType>\n  extends FormFieldValueComponentProps<Value>,\n    CheckboxProps {\n  /**\n   * @since 10.19.0\n   */\n  i18nScope?: string\n}\n\nexport interface FormCheckboxProps<Value = FieldCheckboxValueType>\n  extends FormFieldProps<Value>,\n    Omit<CheckboxProps, 'name' | 'error' | 'children'> {\n  /**\n   * @since 10.19.0\n   */\n  i18nScope?: string\n}\n\n// TEXTAREA\n\nexport type FieldTextAreaValueType = string\n\nexport interface FieldTextAreaComponentProps<Value = FieldTextAreaValueType>\n  extends FormFieldValueComponentProps<Value>,\n    TextAreaProps {}\nexport interface FormTextAreaProps<Value = FieldTextAreaValueType>\n  extends FormFieldProps<Value>,\n    Omit<TextAreaProps, 'name' | 'error' | 'children'> {}\n\n// RICHTEXT\n\nexport type FieldRichTextValueType = string\n\nexport interface FieldRichTextComponentProps<Value = FieldRichTextValueType>\n  extends FormFieldValueComponentProps<Value>,\n    TextEditorProps {}\n\nexport interface FormRichTextProps<Value = FieldRichTextValueType>\n  extends Omit<FormFieldProps<Value>, 'error'>,\n    TextEditorProps {}\n\n// RADIO BUTTONS\n\nexport type FieldRadioButtonsValueType = any\n\nexport interface FieldRadioButtonsComponentProps<\n  Value = FieldRadioButtonsValueType\n> extends FormFieldValueComponentProps<Value>,\n    Partial<OptionList<Value>>,\n    Pick<Props, 'className' | 'style'> {\n  /**\n   * @since 10.19.0\n   */\n  isDisabledOption?: (option: Value) => boolean\n}\n\nexport interface FormRadioButtonsProps<Value = FieldRadioButtonsValueType>\n  extends FormFieldProps<Value>,\n    Partial<OptionList<Value>>,\n    Pick<Props, 'className' | 'style'>,\n    Pick<FieldRadioButtonsComponentProps, 'isDisabledOption'> {}\n\n// CHECKBOXES\n\nexport type FieldCheckboxesValueType = any[]\n\nexport interface FieldCheckboxesComponentProps<Value = FieldCheckboxesValueType>\n  extends FormFieldValueComponentProps<Value>,\n    Partial<OptionList<ValueInArray<Value>>>,\n    Pick<Props, 'className' | 'style'> {\n  /**\n   * @since 10.19.0\n   */\n  isDisabledOption?: (option: Value) => boolean\n  /**\n   * @since 10.19.0\n   */\n  isIndeterminateOption?: (option: Value) => boolean\n}\n\nexport interface FormCheckboxesProps<Value = FieldCheckboxesValueType>\n  extends FormFieldProps<Value>,\n    Partial<OptionList<ValueInArray<Value>>>,\n    Pick<Props, 'className' | 'style'>,\n    Pick<\n      FieldCheckboxesComponentProps,\n      'isDisabledOption' | 'isIndeterminateOption'\n    > {}\n\n// SELECT\n\nexport type FieldSelectValueType = any\nexport type FieldSelectOptionItem = FieldSelectValueType\nexport type FieldSelectGroupItem = any\nexport type FieldSelectGroupHeader = FieldSelectGroupItem & {\n  isGroupHeader: boolean\n}\n\nexport interface GroupedOptionsConfig<OptionItem, GroupItem>\n  extends OptionList<OptionItem> {\n  /**\n   * @since 10.19.0\n   */\n  comparator?: (query: string, value: string) => boolean\n  /**\n   * @since 10.19.0\n   */\n  getGroup: (option: OptionItem) => number | string\n  /**\n   * <div>\n   *  The id of group{' '}\n   *  <Code>{'(group: GroupItem) => string | number'}</Code>\n   * </div>\n   * <br />\n   * <div>\n   *  Default:\n   *  <Code>{'(group) => group.id'}</Code>\n   * </div>\n   * @since 10.19.0\n   */\n  groupGetId: (group: GroupItem) => number | string\n  /**\n   * @since 10.19.0\n   */\n  optgroups?: GroupItem[]\n  /**\n   * @since 10.19.0\n   */\n  value?: OptionItem\n}\n\nexport interface FieldSelectComponentProps<\n  Value = FieldSelectValueType,\n  OptionItem = FieldSelectOptionItem,\n  GroupItem = FieldSelectGroupItem\n> extends FormFieldValueComponentProps<Value>,\n    Partial<OptionList<OptionItem>>,\n    Omit<SelectProps, 'onClear' | 'onSearch' | 'error' | 'children'> {\n  /**\n   * Callback for each entry in <Code>options</Code> to define relation to\n   * group in <Code>optgroups</Code>\n   * <Code>{'(option: OptionItem) => string | number'}</Code>\n   * @since 10.19.0\n   * */\n  getGroup?: (option: OptionItem) => number | string\n  /**\n   * @since 10.19.0\n   */\n  groupGetId?: (group: GroupItem) => number | string\n\n  /**\n   * <div>\n   *  The display label of a group\n   *  <Code>{'(group: GroupItem) => string'}</Code>\n   * </div>\n   * <br />\n   * <div>\n   *  Default:\n   *  <Code>{'(group: GroupItem) => group.label || group.name'}</Code>\n   * </div>\n   * @since 10.19.0\n   */\n  groupGetLabel?: (group: GroupItem) => string\n\n  /**\n   * Callback for rendering header for each entry in <Code>optgroups</Code>\n   * <Code>{'(group: GroupItem) => React.ReactNode'}</Code>\n   * @since 10.19.0\n   */\n  groupHeaderRenderer?: (group: GroupItem) => React.ReactNode\n\n  /**\n   * If nothing is selected, suggest this option. From{' '}\n   * <Code>{'Select.Option suggested'}</Code>.\n   * <Code>{'(option: OptionItem) => boolean'}</Code>\n   * @since 10.19.0\n   */\n  isSuggestedOption?: (option: OptionItem) => boolean\n\n  /**\n   * Array of available option groups\n   * @since 10.19.0\n   */\n  optgroups?: GroupItem[]\n\n  /**\n   * Callback for rendering each <Code>option</Code>\n   * <Code>{'(option: OptionItem) => React.ReactNode'}</Code>\n   * @since 10.19.0\n   */\n  optionRenderer?: (option: OptionItem) => React.ReactNode\n  /**\n   * @since 10.19.0\n   */\n  onBlur?: (e: React.FocusEvent<HTMLDivElement>) => void\n\n  /**\n   * Callback for when cleared. Default enabled, has clear icon.\n   * @since 10.19.0\n   */\n  onClear?: false | SelectButtonProps['onClear']\n\n  /**\n   * Callback for when searching. Default enabled, has seach bar in menu.\n   * @since 10.19.0\n   */\n  onSearch?: false | SelectProps['onSearch']\n\n  /**\n   * <div>Customize how search works</div>\n   * <Code>{'(query: string, value: string) => boolean'}</Code>\n   * @since 10.19.0\n   */\n  searchComparator?: (query: string, value: string) => boolean\n}\nexport interface FormSelectProps<\n  Value = FieldSelectValueType,\n  OptionItem = FieldSelectOptionItem,\n  GroupItem = FieldSelectGroupItem\n> extends FormFieldProps<Value>,\n    Partial<OptionList<OptionItem>>,\n    Pick<\n      FieldSelectComponentProps<Value, OptionItem, GroupItem>,\n      | 'getGroup'\n      | 'groupGetId'\n      | 'groupGetLabel'\n      | 'groupHeaderRenderer'\n      | 'isSuggestedOption'\n      | 'onBlur'\n      | 'onClear'\n      | 'optgroups'\n      | 'onSearch'\n      | 'optionRenderer'\n      | 'searchComparator'\n    >,\n    Omit<\n      SelectProps,\n      'onClear' | 'onSearch' | 'error' | 'children' | 'label'\n    > {}\n\n// PILL SELECT\n\nexport type FieldPillSelectValueType = any\n\ninterface PillSelectCommon\n  extends Omit<PillSelectProps, 'children' | 'onClear' | 'error' | 'value'> {\n  /**\n   * @since 10.19.0\n   */\n  onClear?: false | PillSelectProps['onClear']\n}\n\nexport interface FieldPillSelectComponentProps<Value = FieldPillSelectValueType>\n  extends FormFieldValueComponentProps<Value>,\n    PillSelectCommon {}\n\nexport interface FormPillSelectProps<Value = FieldPillSelectValueType>\n  extends FormFieldProps<Value>,\n    PillSelectCommon {}\n\n// MULTISELECT\n\nexport type FieldMultiSelectValueType = any[]\n\ninterface MultiSelectCommon<Value>\n  extends Partial<OptionList<ValueInArray<Value>>>,\n    Omit<MultiSelectProps, 'options' | 'getLabel' | 'getId' | 'error'> {}\n\nexport interface FieldMultiSelectComponentProps<\n  Value = FieldMultiSelectValueType\n> extends FormFieldValueComponentProps<Value>,\n    MultiSelectCommon<Value> {}\n\nexport interface FormMultiSelectProps<Value = FieldMultiSelectValueType>\n  extends FormFieldProps<Value>,\n    MultiSelectCommon<Value> {}\n\n// GROUP SELECT\n\nexport type FieldGroupSelectValueType = any[]\n\ninterface GroupSelectCommon<Value>\n  extends Partial<OptionList<Value[keyof Value]>>,\n    Omit<GroupSelectProps, 'options' | 'getLabel' | 'getId' | 'error'> {}\n\nexport interface FieldGroupSelectComponentProps<\n  Value = FieldGroupSelectValueType\n> extends FormFieldValueComponentProps<Value>,\n    GroupSelectCommon<Value> {}\n\nexport interface FormGroupSelectProps<Value = FieldGroupSelectValueType>\n  extends FormFieldProps<Value>,\n    GroupSelectCommon<Value> {}\n\n// TIERED SELECT\n\nexport type FieldTieredSelectValueType = any[]\n\ninterface TieredSelectCommon<Value>\n  extends Partial<OptionList<Value[keyof Value]>>,\n    Omit<\n      TieredSelectProps,\n      'options' | 'getLabel' | 'getId' | 'error' | 'children'\n    > {}\n\nexport interface FieldTieredSelectComponentProps<\n  Value = FieldTieredSelectValueType\n> extends FormFieldValueComponentProps<Value>,\n    TieredSelectCommon<Value> {}\n\nexport interface FormTieredSelectProps<Value = FieldTieredSelectValueType>\n  extends FormFieldProps<Value>,\n    TieredSelectCommon<Value> {}\n"],"mappings":""}

package/dist/Form/stories/util.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Form } from '../../index';
-import { PillColor } from '../../Pill';
+import type { PillColor } from '../../Pill';
 export declare function FormDebugger(props?: any): JSX.Element;
 interface SingleFormProps {
     component?: any;

package/dist/Form/stories/util.js.map

@@ -1 +1 @@
-{"version":3,"file":"util.js","names":["pick","React","Box","Button","Form","useFormContext","stylesFormDebugger","backgroundColor","color","fontSize","FormDebugger","props","arguments","length","undefined","fields","record","Object","keys","createElement","flex","padding","margin","style","whiteSpace","JSON","stringify","SingleForm","_ref","_ref$component","component","FieldComponent","Field","debug","initialValue","view","variant","_objectWithoutProperties","_excluded","columnOne","colStart","columnTwo","enableReinitialize","initialValues","value","onSubmit","values","alert","Row","_extends","name","label","disabled","error","DemoForm","_ref2","_ref2$view","_ref2$enableConfirmNa","enableConfirmNavigation","Promise","resolve","Text","Number","required","tooltip","Select","options","formSelectOptions","MultiSelect","getGroup","option","groupAssociation","groupGetId","group","uuid","groupGetLabel","displayName","optgroups","formSelectGroupOptions","PillSelect","formPillSelectOptions","TieredSelect","formTieredSelectOptions","GroupSelect","formGroupSelectOptions","groups","formGroupSelectGroups","textAlign","marginTop","marginBottom","type","BaseCRU","Fragment","id","map","_objectSpread","groupOpt","find","groupId","nextGroupId","formInitialValues","text","number","checkbox","checkboxes","currency","date","Date","textarea","select","multiselect","pillselect","groupselect","tieredselect","radiobuttons","richtext"],"sources":["../../../src/Form/stories/util.tsx"],"sourcesContent":["import { pick } from 'ramda'\nimport React from 'react'\nimport { Box, Button, Form, useFormContext } from '../../index'\nimport { PillColor } from '../../Pill'\n\nconst stylesFormDebugger = {\n  backgroundColor: '#444',\n  color: '#f1f1f1',\n  fontSize: '0.8rem',\n}\n\nexport function FormDebugger(props: any = {}) {\n  const fields = useFormContext()\n\n  let record = {}\n  if (!Object.keys(props).length) {\n    record = fields\n  } else {\n    record = pick(Object.keys(props), fields)\n  }\n\n  return (\n    <Box flex=\"1\" padding=\"md\" margin=\"lg none\" style={stylesFormDebugger}>\n      <pre style={{ whiteSpace: 'break-spaces' }}>\n        {JSON.stringify(record, null, 2)}\n      </pre>\n    </Box>\n  )\n}\n\ninterface SingleFormProps {\n  component?: any\n  debug?: boolean\n  initialValue?: any\n  variant?: React.ComponentProps<typeof Form>['variant']\n  view?: React.ComponentProps<typeof Form>['view']\n}\n\n/**\n * Takes a Form Field component, e.g. Form.Select, and creates\n * a full Form of one view and variant. Empty value examples,\n * examples with values, various text or state formats.\n */\nconst SingleForm = ({\n  component: FieldComponent = Form.Field,\n  debug,\n  initialValue,\n  view,\n  variant,\n  ...props\n}: SingleFormProps) => {\n  // removes colStart from DOM for traditional variant\n  const columnOne = variant === 'traditional' ? {} : { colStart: 1 }\n  const columnTwo = variant === 'traditional' ? {} : { colStart: 7 }\n  return (\n    <Form\n      enableReinitialize\n      initialValues={{\n        value: initialValue,\n      }}\n      variant={variant}\n      view={view}\n      onSubmit={(values) => alert(JSON.stringify(values, null, 2))}\n    >\n      <Form.Form>\n        {debug && <FormDebugger />}\n        <Form.Row>\n          <FieldComponent\n            name=\"empty\"\n            label=\"Empty Text\"\n            {...columnOne}\n            {...props}\n          />\n          <FieldComponent\n            name=\"value\"\n            label=\"Initial Value Text\"\n            {...columnTwo}\n            {...props}\n          />\n        </Form.Row>\n        <Form.Row>\n          <FieldComponent\n            name=\"empty\"\n            disabled\n            label=\"Disabled Empty Text\"\n            {...columnOne}\n            {...props}\n          />\n          <FieldComponent\n            name=\"value\"\n            disabled\n            label=\"Disabled Initial Value Text\"\n            {...columnTwo}\n            {...props}\n          />\n        </Form.Row>\n        <Form.Row>\n          <FieldComponent\n            name=\"empty\"\n            error\n            label=\"Error Boolean Empty Text\"\n            {...columnOne}\n            {...props}\n          />\n          <FieldComponent\n            name=\"value\"\n            error=\"Some error message that should be read red\"\n            label=\"Error Message Initial Value Text\"\n            {...columnTwo}\n            {...props}\n          />\n        </Form.Row>\n      </Form.Form>\n    </Form>\n  )\n}\n\ninterface DemoFormProps {\n  view?: React.ComponentProps<typeof Form>['view']\n  enableConfirmNavigation?: React.ComponentProps<\n    typeof Form\n  >['enableConfirmNavigation']\n}\nexport const DemoForm = ({\n  view = 'create',\n  enableConfirmNavigation = true,\n}: DemoFormProps) => {\n  return (\n    <Form\n      view={view}\n      onSubmit={(...args) => {\n        alert(JSON.stringify(args[0], null, 2))\n\n        return Promise.resolve()\n      }}\n      enableConfirmNavigation={enableConfirmNavigation}\n    >\n      <Form.Form>\n        <Form.Row>\n          <Form.Text name=\"text\" label=\"Text\" colStart={1} />\n          <Form.Number\n            name=\"number\"\n            label=\"Number\"\n            required\n            tooltip=\"An example tooltip for any field, this value goes directly to the Tooltip overlay prop\"\n            colStart={7}\n          />\n        </Form.Row>\n        <Form.Row>\n          <Form.Select\n            name=\"select\"\n            label=\"Select\"\n            options={formSelectOptions}\n            colStart={1}\n          />\n          <Form.MultiSelect\n            name=\"multiselect\"\n            label=\"MultiSelect\"\n            options={formSelectOptions}\n            colStart={7}\n          />\n        </Form.Row>\n        <Form.Row>\n          <Form.Select\n            name=\"select\"\n            label=\"Select with Groups\"\n            getGroup={(option) => option.groupAssociation}\n            groupGetId={(group) => group.uuid}\n            groupGetLabel={(group) => group.displayName}\n            options={formSelectOptions}\n            optgroups={formSelectGroupOptions}\n          />\n          <Form.PillSelect\n            name=\"pillselect\"\n            label=\"Status\"\n            options={formPillSelectOptions}\n            colStart={7}\n          />\n        </Form.Row>\n        <Form.Row>\n          <Form.TieredSelect\n            name=\"tieredselect\"\n            label=\"Tiered Select\"\n            options={formTieredSelectOptions}\n            colStart={1}\n          />\n          <Form.GroupSelect\n            name=\"groupselect\"\n            label=\"Group Select for Distribution\"\n            options={formGroupSelectOptions}\n            groups={formGroupSelectGroups}\n            colStart={7}\n          />\n        </Form.Row>\n        <Box textAlign=\"center\" marginTop=\"sm\" marginBottom=\"xl\">\n          <Button variant=\"secondary\" type=\"reset\">\n            Reset\n          </Button>{' '}\n          <Button type=\"submit\">Save</Button>\n        </Box>\n      </Form.Form>\n    </Form>\n  )\n}\n\n/** All variations for a field. views, with values, no values, text variations, etc.\n * @example\n *  <BaseCRU\n      component={Form.Number}\n      initialValue={100}\n    />\n */\nexport function BaseCRU<Element extends React.JSXElementConstructor<any>>(\n  props: Omit<SingleFormProps, 'component'> & { component: Element } & Omit<\n      React.ComponentProps<Element>,\n      'name'\n    >\n) {\n  return (\n    <>\n      <h1>Standard</h1>\n      <h2>Create</h2>\n      <SingleForm view=\"create\" {...props} />\n      <h2>Read</h2>\n      <SingleForm view=\"read\" {...props} />\n      <h2>Update</h2>\n      <SingleForm view=\"update\" {...props} />\n      <h1>Traditional</h1>\n      <h2>Create</h2>\n      <SingleForm view=\"create\" variant=\"traditional\" {...props} />\n      <h2>Read</h2>\n      <SingleForm view=\"read\" variant=\"traditional\" {...props} />\n      <h2>Update</h2>\n      <SingleForm view=\"update\" variant=\"traditional\" {...props} />\n    </>\n  )\n}\n\nexport const formGroupSelectOptions = [\n  { id: 5139977, label: 'Cat' },\n  { id: 1279548, label: 'Cow' },\n  { id: 1690, label: 'Duck' },\n  { id: 3116635, label: 'Crocodile' },\n  { id: 1037291, label: 'Dog' },\n  { id: 1987946, label: 'Elephant' },\n  { id: 1665038, label: 'Fox' },\n  { id: 10338, label: 'Frog' },\n  { id: 4177019, label: 'Giraffe' },\n  { id: 5136274, label: 'Lion' },\n  { id: 1819065, label: 'Owl' },\n  { id: 3733119, label: 'Parrot' },\n  { id: 2142072, label: 'Pig' },\n  { id: 1360365, label: 'Wolf' },\n]\n\nexport const formGroupSelectGroups = [\n  {\n    id: 180604,\n    label: 'Group #1',\n    options: [5139977, 1037291, 1279548, 5136274],\n  },\n  { id: 183915, label: 'Group #2', options: [1037291, 1279548] },\n  { id: 187138, label: 'Group #3', options: [1665038, 10338] },\n  { id: 127496, label: 'Group #4', options: [3116635, 1819065] },\n  { id: 126261, label: 'Group #5', options: [1690] },\n].map((group) => ({\n  ...group,\n  options: group.options.map((groupOpt) =>\n    formGroupSelectOptions.find((option) => option.id === groupOpt)\n  ),\n}))\n\nexport const formTieredSelectOptions = [\n  {\n    id: 1,\n    groupId: null,\n    nextGroupId: 10,\n    label: 'Apple Farm',\n  },\n  {\n    id: 3,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Sports R Us',\n  },\n  {\n    id: 4,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Sail It Again Ports',\n  },\n  {\n    id: 5,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Dublix',\n  },\n  {\n    id: 6,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'The Hardees Boys',\n  },\n  {\n    id: 7,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Carls Senior',\n  },\n  {\n    id: 8,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Tar J',\n  },\n  {\n    id: 9,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Innovation Station',\n  },\n  {\n    id: 10,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Innovation Nation',\n  },\n  {\n    id: 11,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Global Studios',\n  },\n  {\n    id: 12,\n    groupId: null,\n    nextGroupId: 30,\n    label: \"Ralphie's\",\n  },\n  {\n    id: 13,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Humble State University',\n  },\n  {\n    id: 14,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Test Driven Devolvement',\n  },\n  {\n    id: 15,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'The Drilling Company',\n  },\n  {\n    id: 16,\n    groupId: null,\n    nextGroupId: 30,\n    label:\n      'Wrapping text that is very long and will definitely wrap onto two or more lines',\n  },\n  {\n    id: 17,\n    groupId: 10,\n    nextGroupId: 100,\n    label: 'Granny Smith',\n  },\n  {\n    id: 18,\n    groupId: 10,\n    nextGroupId: 101,\n    label: 'Gala',\n  },\n  {\n    id: 21,\n    groupId: 30,\n    nextGroupId: 300,\n    label: 'Project Basketball',\n  },\n  {\n    id: 22,\n    groupId: 30,\n    nextGroupId: 301,\n    label: 'Table Tennis',\n  },\n  {\n    id: 23,\n    groupId: 30,\n    label: 'Table Ten',\n  },\n  {\n    id: 24,\n    groupId: 100,\n    label: 'Michigan',\n  },\n  {\n    id: 25,\n    groupId: 101,\n    label: 'Washington',\n  },\n  {\n    id: 26,\n    groupId: 200,\n    label: 'Georgia',\n  },\n  {\n    id: 27,\n    groupId: 201,\n    label: 'California',\n  },\n  {\n    id: 28,\n    groupId: 300,\n    label: 'Toronto',\n  },\n  {\n    id: 29,\n    groupId: 301,\n    nextGroupId: 302,\n    label: 'Court Complex Uno',\n  },\n  {\n    id: 30,\n    groupId: 302,\n    nextGroupId: 303,\n    label: 'Wrap',\n  },\n  {\n    id: 31,\n    groupId: 303,\n    nextGroupId: 304,\n    label: 'Wrap',\n  },\n  {\n    id: 32,\n    groupId: 304,\n    nextGroupId: 305,\n    label: 'Wrap',\n  },\n  {\n    id: 33,\n    groupId: 305,\n    nextGroupId: 306,\n    label: 'Wrap',\n  },\n  {\n    id: 34,\n    groupId: 306,\n    nextGroupId: 307,\n    label: 'Wrap',\n  },\n  {\n    id: 35,\n    groupId: 307,\n    label: 'Wrap',\n  },\n]\n\nexport const formSelectOptions = [\n  { id: 1, label: 'Option Example Uno', groupAssociation: 1 },\n  { id: 2, label: 'Item Deux 2', groupAssociation: 2 },\n  { id: 3, label: 'Three Three Three', groupAssociation: 1 },\n  {\n    id: 4,\n    label: 'Next Item In List Is Design System Design System',\n    groupAssociation: 2,\n  },\n  { id: 5, label: '5 Entries', groupAssociation: 2 },\n  {\n    id: 6,\n    label:\n      'Another Option With A Longer Amount of Important Information To Read',\n    groupAssociation: 3,\n  },\n]\n\nexport const formSelectGroupOptions = [\n  { uuid: 1, displayName: 'Group 1' },\n  {\n    uuid: 2,\n    displayName: 'Group Having a Longer Group Label, Group Two Is That Group',\n  },\n  { uuid: 3, displayName: 'Group 3' },\n]\n\nexport const formPillSelectOptions: {\n  id: string\n  label: string\n  color: PillColor\n}[] = [\n  { id: '1', label: 'Questionable', color: 'yellow' },\n  { id: '2', label: 'False', color: 'red' },\n  { id: '3', label: 'The Sky Is Blue', color: 'blue' },\n  { id: '4', label: 'Pending Resolution', color: 'gray' },\n  {\n    id: '5',\n    label: 'A very long STATUS that has to wrap cause it is so long',\n    color: 'green',\n  },\n]\n\nexport const formInitialValues = {\n  text: 'Hello String',\n  number: 123456.789,\n  checkbox: true,\n  checkboxes: [formSelectOptions[1], formSelectOptions[2]],\n  currency: 1200300.55,\n  date: new Date(2020, 9, 31, 14, 30, 42), // Halloween, a Saturday at 2:30 PM\n  textarea: 'Hello\\nWorld  !!\\n\\n    Hello    World',\n  select: formSelectOptions[1],\n  multiselect: [\n    formSelectOptions[1],\n    formSelectOptions[3],\n    formSelectOptions[0],\n  ],\n  pillselect: formPillSelectOptions[0],\n  groupselect: [formGroupSelectOptions[0], formGroupSelectOptions[2]],\n  tieredselect: [\n    {\n      id: 4,\n      groupId: null,\n      nextGroupId: 30,\n      label: 'Sail It Again Ports',\n    },\n    {\n      id: 22,\n      groupId: 30,\n      nextGroupId: 301,\n      label: 'Table Tennis',\n    },\n    {\n      id: 29,\n      groupId: 301,\n      nextGroupId: 302,\n      label: 'Court Complex Uno',\n    },\n  ],\n  radiobuttons: formSelectOptions[5],\n  richtext:\n    '<p><span style=\"font-size: 18pt; background-color: #00ff00;\">Rich Text Is <strong>Bold</strong></span></p> ',\n}\n"],"mappings":"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"}
+{"version":3,"file":"util.js","names":["pick","React","Box","Button","Form","useFormContext","stylesFormDebugger","backgroundColor","color","fontSize","FormDebugger","props","arguments","length","undefined","fields","record","Object","keys","createElement","flex","padding","margin","style","whiteSpace","JSON","stringify","SingleForm","_ref","_ref$component","component","FieldComponent","Field","debug","initialValue","view","variant","_objectWithoutProperties","_excluded","columnOne","colStart","columnTwo","enableReinitialize","initialValues","value","onSubmit","values","alert","Row","_extends","name","label","disabled","error","DemoForm","_ref2","_ref2$view","_ref2$enableConfirmNa","enableConfirmNavigation","Promise","resolve","Text","Number","required","tooltip","Select","options","formSelectOptions","MultiSelect","getGroup","option","groupAssociation","groupGetId","group","uuid","groupGetLabel","displayName","optgroups","formSelectGroupOptions","PillSelect","formPillSelectOptions","TieredSelect","formTieredSelectOptions","GroupSelect","formGroupSelectOptions","groups","formGroupSelectGroups","textAlign","marginTop","marginBottom","type","BaseCRU","Fragment","id","map","_objectSpread","groupOpt","find","groupId","nextGroupId","formInitialValues","text","number","checkbox","checkboxes","currency","date","Date","textarea","select","multiselect","pillselect","groupselect","tieredselect","radiobuttons","richtext"],"sources":["../../../src/Form/stories/util.tsx"],"sourcesContent":["import { pick } from 'ramda'\nimport React from 'react'\nimport { Box, Button, Form, useFormContext } from '../../index'\nimport type { PillColor } from '../../Pill'\n\nconst stylesFormDebugger = {\n  backgroundColor: '#444',\n  color: '#f1f1f1',\n  fontSize: '0.8rem',\n}\n\nexport function FormDebugger(props: any = {}) {\n  const fields = useFormContext()\n\n  let record = {}\n  if (!Object.keys(props).length) {\n    record = fields\n  } else {\n    record = pick(Object.keys(props), fields)\n  }\n\n  return (\n    <Box flex=\"1\" padding=\"md\" margin=\"lg none\" style={stylesFormDebugger}>\n      <pre style={{ whiteSpace: 'break-spaces' }}>\n        {JSON.stringify(record, null, 2)}\n      </pre>\n    </Box>\n  )\n}\n\ninterface SingleFormProps {\n  component?: any\n  debug?: boolean\n  initialValue?: any\n  variant?: React.ComponentProps<typeof Form>['variant']\n  view?: React.ComponentProps<typeof Form>['view']\n}\n\n/**\n * Takes a Form Field component, e.g. Form.Select, and creates\n * a full Form of one view and variant. Empty value examples,\n * examples with values, various text or state formats.\n */\nconst SingleForm = ({\n  component: FieldComponent = Form.Field,\n  debug,\n  initialValue,\n  view,\n  variant,\n  ...props\n}: SingleFormProps) => {\n  // removes colStart from DOM for traditional variant\n  const columnOne = variant === 'traditional' ? {} : { colStart: 1 }\n  const columnTwo = variant === 'traditional' ? {} : { colStart: 7 }\n  return (\n    <Form\n      enableReinitialize\n      initialValues={{\n        value: initialValue,\n      }}\n      variant={variant}\n      view={view}\n      onSubmit={(values) => alert(JSON.stringify(values, null, 2))}\n    >\n      <Form.Form>\n        {debug && <FormDebugger />}\n        <Form.Row>\n          <FieldComponent\n            name=\"empty\"\n            label=\"Empty Text\"\n            {...columnOne}\n            {...props}\n          />\n          <FieldComponent\n            name=\"value\"\n            label=\"Initial Value Text\"\n            {...columnTwo}\n            {...props}\n          />\n        </Form.Row>\n        <Form.Row>\n          <FieldComponent\n            name=\"empty\"\n            disabled\n            label=\"Disabled Empty Text\"\n            {...columnOne}\n            {...props}\n          />\n          <FieldComponent\n            name=\"value\"\n            disabled\n            label=\"Disabled Initial Value Text\"\n            {...columnTwo}\n            {...props}\n          />\n        </Form.Row>\n        <Form.Row>\n          <FieldComponent\n            name=\"empty\"\n            error\n            label=\"Error Boolean Empty Text\"\n            {...columnOne}\n            {...props}\n          />\n          <FieldComponent\n            name=\"value\"\n            error=\"Some error message that should be read red\"\n            label=\"Error Message Initial Value Text\"\n            {...columnTwo}\n            {...props}\n          />\n        </Form.Row>\n      </Form.Form>\n    </Form>\n  )\n}\n\ninterface DemoFormProps {\n  view?: React.ComponentProps<typeof Form>['view']\n  enableConfirmNavigation?: React.ComponentProps<\n    typeof Form\n  >['enableConfirmNavigation']\n}\nexport const DemoForm = ({\n  view = 'create',\n  enableConfirmNavigation = true,\n}: DemoFormProps) => {\n  return (\n    <Form\n      view={view}\n      onSubmit={(...args) => {\n        alert(JSON.stringify(args[0], null, 2))\n\n        return Promise.resolve()\n      }}\n      enableConfirmNavigation={enableConfirmNavigation}\n    >\n      <Form.Form>\n        <Form.Row>\n          <Form.Text name=\"text\" label=\"Text\" colStart={1} />\n          <Form.Number\n            name=\"number\"\n            label=\"Number\"\n            required\n            tooltip=\"An example tooltip for any field, this value goes directly to the Tooltip overlay prop\"\n            colStart={7}\n          />\n        </Form.Row>\n        <Form.Row>\n          <Form.Select\n            name=\"select\"\n            label=\"Select\"\n            options={formSelectOptions}\n            colStart={1}\n          />\n          <Form.MultiSelect\n            name=\"multiselect\"\n            label=\"MultiSelect\"\n            options={formSelectOptions}\n            colStart={7}\n          />\n        </Form.Row>\n        <Form.Row>\n          <Form.Select\n            name=\"select\"\n            label=\"Select with Groups\"\n            getGroup={(option) => option.groupAssociation}\n            groupGetId={(group) => group.uuid}\n            groupGetLabel={(group) => group.displayName}\n            options={formSelectOptions}\n            optgroups={formSelectGroupOptions}\n          />\n          <Form.PillSelect\n            name=\"pillselect\"\n            label=\"Status\"\n            options={formPillSelectOptions}\n            colStart={7}\n          />\n        </Form.Row>\n        <Form.Row>\n          <Form.TieredSelect\n            name=\"tieredselect\"\n            label=\"Tiered Select\"\n            options={formTieredSelectOptions}\n            colStart={1}\n          />\n          <Form.GroupSelect\n            name=\"groupselect\"\n            label=\"Group Select for Distribution\"\n            options={formGroupSelectOptions}\n            groups={formGroupSelectGroups}\n            colStart={7}\n          />\n        </Form.Row>\n        <Box textAlign=\"center\" marginTop=\"sm\" marginBottom=\"xl\">\n          <Button variant=\"secondary\" type=\"reset\">\n            Reset\n          </Button>{' '}\n          <Button type=\"submit\">Save</Button>\n        </Box>\n      </Form.Form>\n    </Form>\n  )\n}\n\n/** All variations for a field. views, with values, no values, text variations, etc.\n * @example\n *  <BaseCRU\n      component={Form.Number}\n      initialValue={100}\n    />\n */\nexport function BaseCRU<Element extends React.JSXElementConstructor<any>>(\n  props: Omit<SingleFormProps, 'component'> & { component: Element } & Omit<\n      React.ComponentProps<Element>,\n      'name'\n    >\n) {\n  return (\n    <>\n      <h1>Standard</h1>\n      <h2>Create</h2>\n      <SingleForm view=\"create\" {...props} />\n      <h2>Read</h2>\n      <SingleForm view=\"read\" {...props} />\n      <h2>Update</h2>\n      <SingleForm view=\"update\" {...props} />\n      <h1>Traditional</h1>\n      <h2>Create</h2>\n      <SingleForm view=\"create\" variant=\"traditional\" {...props} />\n      <h2>Read</h2>\n      <SingleForm view=\"read\" variant=\"traditional\" {...props} />\n      <h2>Update</h2>\n      <SingleForm view=\"update\" variant=\"traditional\" {...props} />\n    </>\n  )\n}\n\nexport const formGroupSelectOptions = [\n  { id: 5139977, label: 'Cat' },\n  { id: 1279548, label: 'Cow' },\n  { id: 1690, label: 'Duck' },\n  { id: 3116635, label: 'Crocodile' },\n  { id: 1037291, label: 'Dog' },\n  { id: 1987946, label: 'Elephant' },\n  { id: 1665038, label: 'Fox' },\n  { id: 10338, label: 'Frog' },\n  { id: 4177019, label: 'Giraffe' },\n  { id: 5136274, label: 'Lion' },\n  { id: 1819065, label: 'Owl' },\n  { id: 3733119, label: 'Parrot' },\n  { id: 2142072, label: 'Pig' },\n  { id: 1360365, label: 'Wolf' },\n]\n\nexport const formGroupSelectGroups = [\n  {\n    id: 180604,\n    label: 'Group #1',\n    options: [5139977, 1037291, 1279548, 5136274],\n  },\n  { id: 183915, label: 'Group #2', options: [1037291, 1279548] },\n  { id: 187138, label: 'Group #3', options: [1665038, 10338] },\n  { id: 127496, label: 'Group #4', options: [3116635, 1819065] },\n  { id: 126261, label: 'Group #5', options: [1690] },\n].map((group) => ({\n  ...group,\n  options: group.options.map((groupOpt) =>\n    formGroupSelectOptions.find((option) => option.id === groupOpt)\n  ),\n}))\n\nexport const formTieredSelectOptions = [\n  {\n    id: 1,\n    groupId: null,\n    nextGroupId: 10,\n    label: 'Apple Farm',\n  },\n  {\n    id: 3,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Sports R Us',\n  },\n  {\n    id: 4,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Sail It Again Ports',\n  },\n  {\n    id: 5,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Dublix',\n  },\n  {\n    id: 6,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'The Hardees Boys',\n  },\n  {\n    id: 7,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Carls Senior',\n  },\n  {\n    id: 8,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Tar J',\n  },\n  {\n    id: 9,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Innovation Station',\n  },\n  {\n    id: 10,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Innovation Nation',\n  },\n  {\n    id: 11,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Global Studios',\n  },\n  {\n    id: 12,\n    groupId: null,\n    nextGroupId: 30,\n    label: \"Ralphie's\",\n  },\n  {\n    id: 13,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Humble State University',\n  },\n  {\n    id: 14,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'Test Driven Devolvement',\n  },\n  {\n    id: 15,\n    groupId: null,\n    nextGroupId: 30,\n    label: 'The Drilling Company',\n  },\n  {\n    id: 16,\n    groupId: null,\n    nextGroupId: 30,\n    label:\n      'Wrapping text that is very long and will definitely wrap onto two or more lines',\n  },\n  {\n    id: 17,\n    groupId: 10,\n    nextGroupId: 100,\n    label: 'Granny Smith',\n  },\n  {\n    id: 18,\n    groupId: 10,\n    nextGroupId: 101,\n    label: 'Gala',\n  },\n  {\n    id: 21,\n    groupId: 30,\n    nextGroupId: 300,\n    label: 'Project Basketball',\n  },\n  {\n    id: 22,\n    groupId: 30,\n    nextGroupId: 301,\n    label: 'Table Tennis',\n  },\n  {\n    id: 23,\n    groupId: 30,\n    label: 'Table Ten',\n  },\n  {\n    id: 24,\n    groupId: 100,\n    label: 'Michigan',\n  },\n  {\n    id: 25,\n    groupId: 101,\n    label: 'Washington',\n  },\n  {\n    id: 26,\n    groupId: 200,\n    label: 'Georgia',\n  },\n  {\n    id: 27,\n    groupId: 201,\n    label: 'California',\n  },\n  {\n    id: 28,\n    groupId: 300,\n    label: 'Toronto',\n  },\n  {\n    id: 29,\n    groupId: 301,\n    nextGroupId: 302,\n    label: 'Court Complex Uno',\n  },\n  {\n    id: 30,\n    groupId: 302,\n    nextGroupId: 303,\n    label: 'Wrap',\n  },\n  {\n    id: 31,\n    groupId: 303,\n    nextGroupId: 304,\n    label: 'Wrap',\n  },\n  {\n    id: 32,\n    groupId: 304,\n    nextGroupId: 305,\n    label: 'Wrap',\n  },\n  {\n    id: 33,\n    groupId: 305,\n    nextGroupId: 306,\n    label: 'Wrap',\n  },\n  {\n    id: 34,\n    groupId: 306,\n    nextGroupId: 307,\n    label: 'Wrap',\n  },\n  {\n    id: 35,\n    groupId: 307,\n    label: 'Wrap',\n  },\n]\n\nexport const formSelectOptions = [\n  { id: 1, label: 'Option Example Uno', groupAssociation: 1 },\n  { id: 2, label: 'Item Deux 2', groupAssociation: 2 },\n  { id: 3, label: 'Three Three Three', groupAssociation: 1 },\n  {\n    id: 4,\n    label: 'Next Item In List Is Design System Design System',\n    groupAssociation: 2,\n  },\n  { id: 5, label: '5 Entries', groupAssociation: 2 },\n  {\n    id: 6,\n    label:\n      'Another Option With A Longer Amount of Important Information To Read',\n    groupAssociation: 3,\n  },\n]\n\nexport const formSelectGroupOptions = [\n  { uuid: 1, displayName: 'Group 1' },\n  {\n    uuid: 2,\n    displayName: 'Group Having a Longer Group Label, Group Two Is That Group',\n  },\n  { uuid: 3, displayName: 'Group 3' },\n]\n\nexport const formPillSelectOptions: {\n  id: string\n  label: string\n  color: PillColor\n}[] = [\n  { id: '1', label: 'Questionable', color: 'yellow' },\n  { id: '2', label: 'False', color: 'red' },\n  { id: '3', label: 'The Sky Is Blue', color: 'blue' },\n  { id: '4', label: 'Pending Resolution', color: 'gray' },\n  {\n    id: '5',\n    label: 'A very long STATUS that has to wrap cause it is so long',\n    color: 'green',\n  },\n]\n\nexport const formInitialValues = {\n  text: 'Hello String',\n  number: 123456.789,\n  checkbox: true,\n  checkboxes: [formSelectOptions[1], formSelectOptions[2]],\n  currency: 1200300.55,\n  date: new Date(2020, 9, 31, 14, 30, 42), // Halloween, a Saturday at 2:30 PM\n  textarea: 'Hello\\nWorld  !!\\n\\n    Hello    World',\n  select: formSelectOptions[1],\n  multiselect: [\n    formSelectOptions[1],\n    formSelectOptions[3],\n    formSelectOptions[0],\n  ],\n  pillselect: formPillSelectOptions[0],\n  groupselect: [formGroupSelectOptions[0], formGroupSelectOptions[2]],\n  tieredselect: [\n    {\n      id: 4,\n      groupId: null,\n      nextGroupId: 30,\n      label: 'Sail It Again Ports',\n    },\n    {\n      id: 22,\n      groupId: 30,\n      nextGroupId: 301,\n      label: 'Table Tennis',\n    },\n    {\n      id: 29,\n      groupId: 301,\n      nextGroupId: 302,\n      label: 'Court Complex Uno',\n    },\n  ],\n  radiobuttons: formSelectOptions[5],\n  richtext:\n    '<p><span style=\"font-size: 18pt; background-color: #00ff00;\">Rich Text Is <strong>Bold</strong></span></p> ',\n}\n"],"mappings":"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"}

package/dist/Grid/Grid.constants.d.ts

@@ -1,4 +1,4 @@
-import { GridBreakpoint } from './Grid.types';
+import type { GridBreakpoint } from './Grid.types';
 export declare const breakpointRawMinWidthValues: Record<GridBreakpoint, number>;
 export declare const breakpointMinWidthValues: Record<GridBreakpoint, string>;
 export declare const breakpointsSmallToLarge: GridBreakpoint[];

package/dist/Grid/Grid.constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"Grid.constants.js","names":["breakpointRawMinWidthValues","mobileLg","tabletSm","tabletMd","tabletLg","desktopSm","desktopMd","breakpointMinWidthValues","concat","breakpointsSmallToLarge"],"sources":["../../src/Grid/Grid.constants.ts"],"sourcesContent":["import { GridBreakpoint } from './Grid.types'\n\nexport const breakpointRawMinWidthValues: Record<GridBreakpoint, number> = {\n  mobileLg: 0,\n  tabletSm: 576,\n  tabletMd: 768,\n  tabletLg: 992,\n  desktopSm: 1200,\n  desktopMd: 1400,\n}\n\nexport const breakpointMinWidthValues: Record<GridBreakpoint, string> = {\n  mobileLg: `${breakpointRawMinWidthValues.mobileLg}px`,\n  tabletSm: `${breakpointRawMinWidthValues.tabletSm}px`,\n  tabletMd: `${breakpointRawMinWidthValues.tabletMd}px`,\n  tabletLg: `${breakpointRawMinWidthValues.tabletLg}px`,\n  desktopSm: `${breakpointRawMinWidthValues.desktopSm}px`,\n  desktopMd: `${breakpointRawMinWidthValues.desktopMd}px`,\n}\n\nexport const breakpointsSmallToLarge: GridBreakpoint[] = [\n  'mobileLg',\n  'tabletSm',\n  'tabletMd',\n  'tabletLg',\n  'desktopSm',\n  'desktopMd',\n]\n"],"mappings":"AAEA,OAAO,IAAMA,2BAA2D,GAAG;EACzEC,QAAQ,EAAE,CAAC;EACXC,QAAQ,EAAE,GAAG;EACbC,QAAQ,EAAE,GAAG;EACbC,QAAQ,EAAE,GAAG;EACbC,SAAS,EAAE,IAAI;EACfC,SAAS,EAAE;AACb,CAAC;AAED,OAAO,IAAMC,wBAAwD,GAAG;EACtEN,QAAQ,KAAAO,MAAA,CAAKR,2BAA2B,CAACC,QAAQ,OAAI;EACrDC,QAAQ,KAAAM,MAAA,CAAKR,2BAA2B,CAACE,QAAQ,OAAI;EACrDC,QAAQ,KAAAK,MAAA,CAAKR,2BAA2B,CAACG,QAAQ,OAAI;EACrDC,QAAQ,KAAAI,MAAA,CAAKR,2BAA2B,CAACI,QAAQ,OAAI;EACrDC,SAAS,KAAAG,MAAA,CAAKR,2BAA2B,CAACK,SAAS,OAAI;EACvDC,SAAS,KAAAE,MAAA,CAAKR,2BAA2B,CAACM,SAAS;AACrD,CAAC;AAED,OAAO,IAAMG,uBAAyC,GAAG,CACvD,UAAU,EACV,UAAU,EACV,UAAU,EACV,UAAU,EACV,WAAW,EACX,WAAW,CACZ"}
+{"version":3,"file":"Grid.constants.js","names":["breakpointRawMinWidthValues","mobileLg","tabletSm","tabletMd","tabletLg","desktopSm","desktopMd","breakpointMinWidthValues","concat","breakpointsSmallToLarge"],"sources":["../../src/Grid/Grid.constants.ts"],"sourcesContent":["import type { GridBreakpoint } from './Grid.types'\n\nexport const breakpointRawMinWidthValues: Record<GridBreakpoint, number> = {\n  mobileLg: 0,\n  tabletSm: 576,\n  tabletMd: 768,\n  tabletLg: 992,\n  desktopSm: 1200,\n  desktopMd: 1400,\n}\n\nexport const breakpointMinWidthValues: Record<GridBreakpoint, string> = {\n  mobileLg: `${breakpointRawMinWidthValues.mobileLg}px`,\n  tabletSm: `${breakpointRawMinWidthValues.tabletSm}px`,\n  tabletMd: `${breakpointRawMinWidthValues.tabletMd}px`,\n  tabletLg: `${breakpointRawMinWidthValues.tabletLg}px`,\n  desktopSm: `${breakpointRawMinWidthValues.desktopSm}px`,\n  desktopMd: `${breakpointRawMinWidthValues.desktopMd}px`,\n}\n\nexport const breakpointsSmallToLarge: GridBreakpoint[] = [\n  'mobileLg',\n  'tabletSm',\n  'tabletMd',\n  'tabletLg',\n  'desktopSm',\n  'desktopMd',\n]\n"],"mappings":"AAEA,OAAO,IAAMA,2BAA2D,GAAG;EACzEC,QAAQ,EAAE,CAAC;EACXC,QAAQ,EAAE,GAAG;EACbC,QAAQ,EAAE,GAAG;EACbC,QAAQ,EAAE,GAAG;EACbC,SAAS,EAAE,IAAI;EACfC,SAAS,EAAE;AACb,CAAC;AAED,OAAO,IAAMC,wBAAwD,GAAG;EACtEN,QAAQ,KAAAO,MAAA,CAAKR,2BAA2B,CAACC,QAAQ,OAAI;EACrDC,QAAQ,KAAAM,MAAA,CAAKR,2BAA2B,CAACE,QAAQ,OAAI;EACrDC,QAAQ,KAAAK,MAAA,CAAKR,2BAA2B,CAACG,QAAQ,OAAI;EACrDC,QAAQ,KAAAI,MAAA,CAAKR,2BAA2B,CAACI,QAAQ,OAAI;EACrDC,SAAS,KAAAG,MAAA,CAAKR,2BAA2B,CAACK,SAAS,OAAI;EACvDC,SAAS,KAAAE,MAAA,CAAKR,2BAA2B,CAACM,SAAS;AACrD,CAAC;AAED,OAAO,IAAMG,uBAAyC,GAAG,CACvD,UAAU,EACV,UAAU,EACV,UAAU,EACV,UAAU,EACV,WAAW,EACX,WAAW,CACZ"}

package/dist/Grid/Grid.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { GridColProps, GridProps, GridRowProps } from './Grid.types';
+import type { GridColProps, GridProps, GridRowProps } from './Grid.types';
 declare function BaseGrid({ gutterX, gutterY, colStackCap, ...props }: GridProps): JSX.Element;
 export declare const Grid: typeof BaseGrid & {
     Row: React.ForwardRefExoticComponent<GridRowProps & React.RefAttributes<HTMLDivElement>>;

package/dist/Grid/Grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"Grid.js","names":["React","addSubcomponents","StyledGridCol","StyledGridRow","overrideIfNotDefined","defaultContextShape","gutterX","gutterY","colStackCap","GridContext","createContext","BaseGrid","_ref","props","_objectWithoutProperties","_excluded","gridContextValue","createElement","Provider","value","GridRow","forwardRef","ref","_React$useContext","useContext","_extends","$gutterX","$gutterY","GridCol","_ref2","_ref2$colWidth","colWidth","offset","colStart","_excluded2","_React$useContext2","colStackBreakpoint","$span","$offset","$colStackBreakpoint","Grid","Row","Col"],"sources":["../../src/Grid/Grid.tsx"],"sourcesContent":["import React from 'react'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport { StyledGridCol, StyledGridRow } from './Grid.styles'\nimport {\n  GridColProps,\n  GridContextShape,\n  GridProps,\n  GridRowProps,\n} from './Grid.types'\nimport { overrideIfNotDefined } from './Grid.utils'\n\nconst defaultContextShape: GridContextShape = {\n  gutterX: 'none',\n  gutterY: 'none',\n  colStackCap: 'mobileLg',\n}\nconst GridContext = React.createContext<GridContextShape>(defaultContextShape)\n\nfunction BaseGrid({ gutterX, gutterY, colStackCap, ...props }: GridProps) {\n  const gridContextValue = overrideIfNotDefined(defaultContextShape, {\n    gutterX,\n    gutterY,\n    colStackCap,\n  })\n  return (\n    <GridContext.Provider value={gridContextValue}>\n      <div {...props} />\n    </GridContext.Provider>\n  )\n}\n\nconst GridRow = React.forwardRef<HTMLDivElement, GridRowProps>(function GridRow(\n  props,\n  ref\n) {\n  const { gutterX, gutterY } = React.useContext(GridContext)\n  return (\n    <StyledGridRow {...props} $gutterX={gutterX} $gutterY={gutterY} ref={ref} />\n  )\n})\n\nconst GridCol = React.forwardRef<HTMLDivElement, GridColProps>(function GridCol(\n  { colWidth = 'auto', colStart: offset, ...props },\n  ref\n) {\n  const {\n    gutterX,\n    gutterY,\n    colStackCap: colStackBreakpoint,\n  } = React.useContext(GridContext)\n  return (\n    <StyledGridCol\n      {...props}\n      ref={ref}\n      $span={colWidth}\n      $offset={offset}\n      $gutterX={gutterX}\n      $gutterY={gutterY}\n      $colStackBreakpoint={colStackBreakpoint}\n    />\n  )\n})\n\nexport const Grid = addSubcomponents(\n  {\n    Row: GridRow,\n    Col: GridCol,\n  },\n  BaseGrid\n)\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,gBAAgB,QAAQ,4BAA4B;AAC7D,SAASC,aAAa,EAAEC,aAAa,QAAQ,eAAe;AAO5D,SAASC,oBAAoB,QAAQ,cAAc;AAEnD,IAAMC,mBAAqC,GAAG;EAC5CC,OAAO,EAAE,MAAM;EACfC,OAAO,EAAE,MAAM;EACfC,WAAW,EAAE;AACf,CAAC;AACD,IAAMC,WAAW,gBAAGT,KAAK,CAACU,aAAa,CAAmBL,mBAAmB,CAAC;AAE9E,SAASM,QAAQA,CAAAC,IAAA,EAAyD;EAAA,IAAtDN,OAAO,GAAAM,IAAA,CAAPN,OAAO;IAAEC,OAAO,GAAAK,IAAA,CAAPL,OAAO;IAAEC,WAAW,GAAAI,IAAA,CAAXJ,WAAW;IAAKK,KAAK,GAAAC,wBAAA,CAAAF,IAAA,EAAAG,SAAA;EACzD,IAAMC,gBAAgB,GAAGZ,oBAAoB,CAACC,mBAAmB,EAAE;IACjEC,OAAO,EAAPA,OAAO;IACPC,OAAO,EAAPA,OAAO;IACPC,WAAW,EAAXA;EACF,CAAC,CAAC;EACF,oBACER,KAAA,CAAAiB,aAAA,CAACR,WAAW,CAACS,QAAQ;IAACC,KAAK,EAAEH;EAAiB,gBAC5ChB,KAAA,CAAAiB,aAAA,QAASJ,KAAQ,CACG,CAAC;AAE3B;AAEA,IAAMO,OAAO,gBAAGpB,KAAK,CAACqB,UAAU,CAA+B,SAASD,OAAOA,CAC7EP,KAAK,EACLS,GAAG,EACH;EACA,IAAAC,iBAAA,GAA6BvB,KAAK,CAACwB,UAAU,CAACf,WAAW,CAAC;IAAlDH,OAAO,GAAAiB,iBAAA,CAAPjB,OAAO;IAAEC,OAAO,GAAAgB,iBAAA,CAAPhB,OAAO;EACxB,oBACEP,KAAA,CAAAiB,aAAA,CAACd,aAAa,EAAAsB,QAAA,KAAKZ,KAAK;IAAEa,QAAQ,EAAEpB,OAAQ;IAACqB,QAAQ,EAAEpB,OAAQ;IAACe,GAAG,EAAEA;EAAI,EAAE,CAAC;AAEhF,CAAC,CAAC;AAEF,IAAMM,OAAO,gBAAG5B,KAAK,CAACqB,UAAU,CAA+B,SAASO,OAAOA,CAAAC,KAAA,EAE7EP,GAAG,EACH;EAAA,IAAAQ,cAAA,GAAAD,KAAA,CAFEE,QAAQ;IAARA,QAAQ,GAAAD,cAAA,cAAG,MAAM,GAAAA,cAAA;IAAYE,MAAM,GAAAH,KAAA,CAAhBI,QAAQ;IAAapB,KAAK,GAAAC,wBAAA,CAAAe,KAAA,EAAAK,UAAA;EAG/C,IAAAC,kBAAA,GAIInC,KAAK,CAACwB,UAAU,CAACf,WAAW,CAAC;IAH/BH,OAAO,GAAA6B,kBAAA,CAAP7B,OAAO;IACPC,OAAO,GAAA4B,kBAAA,CAAP5B,OAAO;IACM6B,kBAAkB,GAAAD,kBAAA,CAA/B3B,WAAW;EAEb,oBACER,KAAA,CAAAiB,aAAA,CAACf,aAAa,EAAAuB,QAAA,KACRZ,KAAK;IACTS,GAAG,EAAEA,GAAI;IACTe,KAAK,EAAEN,QAAS;IAChBO,OAAO,EAAEN,MAAO;IAChBN,QAAQ,EAAEpB,OAAQ;IAClBqB,QAAQ,EAAEpB,OAAQ;IAClBgC,mBAAmB,EAAEH;EAAmB,EACzC,CAAC;AAEN,CAAC,CAAC;AAEF,OAAO,IAAMI,IAAI,GAAGvC,gBAAgB,CAClC;EACEwC,GAAG,EAAErB,OAAO;EACZsB,GAAG,EAAEd;AACP,CAAC,EACDjB,QACF,CAAC"}
+{"version":3,"file":"Grid.js","names":["React","addSubcomponents","StyledGridCol","StyledGridRow","overrideIfNotDefined","defaultContextShape","gutterX","gutterY","colStackCap","GridContext","createContext","BaseGrid","_ref","props","_objectWithoutProperties","_excluded","gridContextValue","createElement","Provider","value","GridRow","forwardRef","ref","_React$useContext","useContext","_extends","$gutterX","$gutterY","GridCol","_ref2","_ref2$colWidth","colWidth","offset","colStart","_excluded2","_React$useContext2","colStackBreakpoint","$span","$offset","$colStackBreakpoint","Grid","Row","Col"],"sources":["../../src/Grid/Grid.tsx"],"sourcesContent":["import React from 'react'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport { StyledGridCol, StyledGridRow } from './Grid.styles'\nimport type {\n  GridColProps,\n  GridContextShape,\n  GridProps,\n  GridRowProps,\n} from './Grid.types'\nimport { overrideIfNotDefined } from './Grid.utils'\n\nconst defaultContextShape: GridContextShape = {\n  gutterX: 'none',\n  gutterY: 'none',\n  colStackCap: 'mobileLg',\n}\nconst GridContext = React.createContext<GridContextShape>(defaultContextShape)\n\nfunction BaseGrid({ gutterX, gutterY, colStackCap, ...props }: GridProps) {\n  const gridContextValue = overrideIfNotDefined(defaultContextShape, {\n    gutterX,\n    gutterY,\n    colStackCap,\n  })\n  return (\n    <GridContext.Provider value={gridContextValue}>\n      <div {...props} />\n    </GridContext.Provider>\n  )\n}\n\nconst GridRow = React.forwardRef<HTMLDivElement, GridRowProps>(function GridRow(\n  props,\n  ref\n) {\n  const { gutterX, gutterY } = React.useContext(GridContext)\n  return (\n    <StyledGridRow {...props} $gutterX={gutterX} $gutterY={gutterY} ref={ref} />\n  )\n})\n\nconst GridCol = React.forwardRef<HTMLDivElement, GridColProps>(function GridCol(\n  { colWidth = 'auto', colStart: offset, ...props },\n  ref\n) {\n  const {\n    gutterX,\n    gutterY,\n    colStackCap: colStackBreakpoint,\n  } = React.useContext(GridContext)\n  return (\n    <StyledGridCol\n      {...props}\n      ref={ref}\n      $span={colWidth}\n      $offset={offset}\n      $gutterX={gutterX}\n      $gutterY={gutterY}\n      $colStackBreakpoint={colStackBreakpoint}\n    />\n  )\n})\n\nexport const Grid = addSubcomponents(\n  {\n    Row: GridRow,\n    Col: GridCol,\n  },\n  BaseGrid\n)\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,gBAAgB,QAAQ,4BAA4B;AAC7D,SAASC,aAAa,EAAEC,aAAa,QAAQ,eAAe;AAO5D,SAASC,oBAAoB,QAAQ,cAAc;AAEnD,IAAMC,mBAAqC,GAAG;EAC5CC,OAAO,EAAE,MAAM;EACfC,OAAO,EAAE,MAAM;EACfC,WAAW,EAAE;AACf,CAAC;AACD,IAAMC,WAAW,gBAAGT,KAAK,CAACU,aAAa,CAAmBL,mBAAmB,CAAC;AAE9E,SAASM,QAAQA,CAAAC,IAAA,EAAyD;EAAA,IAAtDN,OAAO,GAAAM,IAAA,CAAPN,OAAO;IAAEC,OAAO,GAAAK,IAAA,CAAPL,OAAO;IAAEC,WAAW,GAAAI,IAAA,CAAXJ,WAAW;IAAKK,KAAK,GAAAC,wBAAA,CAAAF,IAAA,EAAAG,SAAA;EACzD,IAAMC,gBAAgB,GAAGZ,oBAAoB,CAACC,mBAAmB,EAAE;IACjEC,OAAO,EAAPA,OAAO;IACPC,OAAO,EAAPA,OAAO;IACPC,WAAW,EAAXA;EACF,CAAC,CAAC;EACF,oBACER,KAAA,CAAAiB,aAAA,CAACR,WAAW,CAACS,QAAQ;IAACC,KAAK,EAAEH;EAAiB,gBAC5ChB,KAAA,CAAAiB,aAAA,QAASJ,KAAQ,CACG,CAAC;AAE3B;AAEA,IAAMO,OAAO,gBAAGpB,KAAK,CAACqB,UAAU,CAA+B,SAASD,OAAOA,CAC7EP,KAAK,EACLS,GAAG,EACH;EACA,IAAAC,iBAAA,GAA6BvB,KAAK,CAACwB,UAAU,CAACf,WAAW,CAAC;IAAlDH,OAAO,GAAAiB,iBAAA,CAAPjB,OAAO;IAAEC,OAAO,GAAAgB,iBAAA,CAAPhB,OAAO;EACxB,oBACEP,KAAA,CAAAiB,aAAA,CAACd,aAAa,EAAAsB,QAAA,KAAKZ,KAAK;IAAEa,QAAQ,EAAEpB,OAAQ;IAACqB,QAAQ,EAAEpB,OAAQ;IAACe,GAAG,EAAEA;EAAI,EAAE,CAAC;AAEhF,CAAC,CAAC;AAEF,IAAMM,OAAO,gBAAG5B,KAAK,CAACqB,UAAU,CAA+B,SAASO,OAAOA,CAAAC,KAAA,EAE7EP,GAAG,EACH;EAAA,IAAAQ,cAAA,GAAAD,KAAA,CAFEE,QAAQ;IAARA,QAAQ,GAAAD,cAAA,cAAG,MAAM,GAAAA,cAAA;IAAYE,MAAM,GAAAH,KAAA,CAAhBI,QAAQ;IAAapB,KAAK,GAAAC,wBAAA,CAAAe,KAAA,EAAAK,UAAA;EAG/C,IAAAC,kBAAA,GAIInC,KAAK,CAACwB,UAAU,CAACf,WAAW,CAAC;IAH/BH,OAAO,GAAA6B,kBAAA,CAAP7B,OAAO;IACPC,OAAO,GAAA4B,kBAAA,CAAP5B,OAAO;IACM6B,kBAAkB,GAAAD,kBAAA,CAA/B3B,WAAW;EAEb,oBACER,KAAA,CAAAiB,aAAA,CAACf,aAAa,EAAAuB,QAAA,KACRZ,KAAK;IACTS,GAAG,EAAEA,GAAI;IACTe,KAAK,EAAEN,QAAS;IAChBO,OAAO,EAAEN,MAAO;IAChBN,QAAQ,EAAEpB,OAAQ;IAClBqB,QAAQ,EAAEpB,OAAQ;IAClBgC,mBAAmB,EAAEH;EAAmB,EACzC,CAAC;AAEN,CAAC,CAAC;AAEF,OAAO,IAAMI,IAAI,GAAGvC,gBAAgB,CAClC;EACEwC,GAAG,EAAErB,OAAO;EACZsB,GAAG,EAAEd;AACP,CAAC,EACDjB,QACF,CAAC"}

package/dist/Grid/Grid.styles.d.ts

@@ -1,4 +1,4 @@
-import { GridBreakpoint, GridColProps, GridProps } from './Grid.types';
+import type { GridBreakpoint, GridColProps, GridProps } from './Grid.types';
 export declare const StyledGridRow: import("styled-components").StyledComponent<"div", any, {
     $gutterX: GridProps['gutterX'];
     $gutterY: GridProps['gutterY'];

package/dist/Grid/Grid.styles.js

@@ -75,7 +75,7 @@ var getRowGutterVertical = function getRowGutterVertical(gutterY, breakpoint) {
 };
 export var StyledGridRow = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledGridRow",
-  componentId: "core-11_24_1__sc-8pinsp-0"
+  componentId: "core-11_24_2__sc-8pinsp-0"
 })(["", " display:flex;flex-wrap:wrap;"], function (_ref) {
   var $gutterX = _ref.$gutterX,
     $gutterY = _ref.$gutterY;
@@ -87,7 +87,7 @@ export var StyledGridRow = /*#__PURE__*/styled.div.withConfig({
 });
 export var StyledGridCol = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledGridCol",
-  componentId: "core-11_24_1__sc-8pinsp-1"
+  componentId: "core-11_24_2__sc-8pinsp-1"
 })(["flex-shrink:0;width:100%;max-width:100%;", ""], function (_ref2) {
   var $span = _ref2.$span,
     $offset = _ref2.$offset,