@channel.io/bezier-react 1.5.0 → 1.6.0

package/dist/esm/components/Forms/FormControl/FormControl.styled.mjs

@@ -0,0 +1,32 @@
+import { styled as FoundationStyled } from '../../../foundation/FoundationStyledComponent.mjs';
+
+const LEFT_LABEL_MIN_WIDTH = 150;
+const Box = /*#__PURE__*/FoundationStyled.div.withConfig({
+  displayName: "FormControlstyled__Box",
+  componentId: "sc-1ae9o3x-0"
+})(["position:relative;", ""], ({
+  interpolation
+}) => interpolation);
+const TopLabelWrapper = /*#__PURE__*/FoundationStyled(Box).withConfig({
+  displayName: "FormControlstyled__TopLabelWrapper",
+  componentId: "sc-1ae9o3x-1"
+})(["padding:0 2px;margin-bottom:4px;"]);
+const TopHelperTextWrapper = /*#__PURE__*/FoundationStyled(Box).withConfig({
+  displayName: "FormControlstyled__TopHelperTextWrapper",
+  componentId: "sc-1ae9o3x-2"
+})(["padding:0 2px;margin-top:4px;"]);
+const Grid = /*#__PURE__*/FoundationStyled(Box).withConfig({
+  displayName: "FormControlstyled__Grid",
+  componentId: "sc-1ae9o3x-3"
+})(["display:grid;grid-template-rows:repeat(2,auto);grid-template-columns:", "px 1fr;grid-column-gap:12px;align-items:center;"], LEFT_LABEL_MIN_WIDTH);
+const LeftLabelWrapper = /*#__PURE__*/FoundationStyled(Box).withConfig({
+  displayName: "FormControlstyled__LeftLabelWrapper",
+  componentId: "sc-1ae9o3x-4"
+})(["display:flex;grid-row:1 / 1;grid-column:1 / 1;align-items:center;align-self:start;height:var(--bezier-form-control-left-label-wrapper-height);"]);
+const LeftHelperTextWrapper = /*#__PURE__*/FoundationStyled(TopHelperTextWrapper).withConfig({
+  displayName: "FormControlstyled__LeftHelperTextWrapper",
+  componentId: "sc-1ae9o3x-5"
+})(["grid-row:2 / 2;grid-column:2;"]);
+
+export { Grid, LeftHelperTextWrapper, LeftLabelWrapper, TopHelperTextWrapper, TopLabelWrapper };
+//# sourceMappingURL=FormControl.styled.mjs.map

package/dist/esm/components/Forms/FormControl/FormControl.styled.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormControl.styled.mjs","sources":["../../../../../src/components/Forms/FormControl/FormControl.styled.ts"],"sourcesContent":["import { styled } from '~/src/foundation'\n\nimport { type InterpolationProps } from '~/src/types/Foundation'\n\nconst LEFT_LABEL_MIN_WIDTH = 150\n\nconst Box = styled.div<InterpolationProps>`\n  position: relative;\n  ${({ interpolation }) => interpolation}\n`\n\nexport const TopLabelWrapper = styled(Box)`\n  padding: 0 2px;\n  margin-bottom: 4px;\n`\n\nexport const TopHelperTextWrapper = styled(Box)`\n  padding: 0 2px;\n  margin-top: 4px;\n`\n\nexport const Grid = styled(Box)`\n  display: grid;\n  grid-template-rows: repeat(2, auto);\n  grid-template-columns: ${LEFT_LABEL_MIN_WIDTH}px 1fr;\n  grid-column-gap: 12px;\n  align-items: center;\n`\n\nexport const LeftLabelWrapper = styled(Box)`\n  display: flex;\n  grid-row: 1 / 1;\n  grid-column: 1 / 1;\n  align-items: center;\n  align-self: start;\n  height: var(--bezier-form-control-left-label-wrapper-height);\n`\n\nexport const LeftHelperTextWrapper = styled(TopHelperTextWrapper)`\n  grid-row: 2 / 2;\n  grid-column: 2;\n`\n"],"names":["LEFT_LABEL_MIN_WIDTH","Box","styled","div","withConfig","displayName","componentId","interpolation","TopLabelWrapper","TopHelperTextWrapper","Grid","LeftLabelWrapper","LeftHelperTextWrapper"],"mappings":";;AAIA,MAAMA,oBAAoB,GAAG,GAAG,CAAA;AAEhC,MAAMC,GAAG,gBAAGC,gBAAM,CAACC,GAAG,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,wBAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAAA,CAAA,CAAA,CAAA,oBAAA,EAAA,EAAA,CAAA,EAElB,CAAC;AAAEC,EAAAA,aAAAA;AAAc,CAAC,KAAKA,aAAa,CACvC,CAAA;AAEM,MAAMC,eAAe,gBAAGN,gBAAM,CAACD,GAAG,CAAC,CAAAG,UAAA,CAAA;EAAAC,WAAA,EAAA,oCAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAGzC,CAAA,CAAA,CAAA,kCAAA,CAAA,EAAA;AAEM,MAAMG,oBAAoB,gBAAGP,gBAAM,CAACD,GAAG,CAAC,CAAAG,UAAA,CAAA;EAAAC,WAAA,EAAA,yCAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAG9C,CAAA,CAAA,CAAA,+BAAA,CAAA,EAAA;AAEM,MAAMI,IAAI,gBAAGR,gBAAM,CAACD,GAAG,CAAC,CAAAG,UAAA,CAAA;EAAAC,WAAA,EAAA,yBAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAAA,CAAA,CAAA,CAAA,uEAAA,EAAA,iDAAA,CAAA,EAGJN,oBAAoB,EAG9C;AAEM,MAAMW,gBAAgB,gBAAGT,gBAAM,CAACD,GAAG,CAAC,CAAAG,UAAA,CAAA;EAAAC,WAAA,EAAA,qCAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAO1C,CAAA,CAAA,CAAA,gJAAA,CAAA,EAAA;AAEM,MAAMM,qBAAqB,gBAAGV,gBAAM,CAACO,oBAAoB,CAAC,CAAAL,UAAA,CAAA;EAAAC,WAAA,EAAA,0CAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAGhE,CAAA,CAAA,CAAA,+BAAA,CAAA;;;;"}

package/dist/esm/components/Forms/FormControl/FormControlContext.mjs

@@ -0,0 +1,6 @@
+import { createContext } from 'react';
+
+const FormControlContext = /*#__PURE__*/createContext(undefined);
+
+export { FormControlContext };
+//# sourceMappingURL=FormControlContext.mjs.map

package/dist/esm/components/Forms/FormControl/FormControlContext.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormControlContext.mjs","sources":["../../../../../src/components/Forms/FormControl/FormControlContext.ts"],"sourcesContent":["import { createContext } from 'react'\n\nimport { type FormControlContextValue } from '~/src/components/Forms/FormControl'\n\nexport const FormControlContext = createContext<FormControlContextValue | undefined>(undefined)\n"],"names":["FormControlContext","createContext","undefined"],"mappings":";;MAIaA,kBAAkB,gBAAGC,aAAa,CAAsCC,SAAS;;;;"}

package/dist/esm/components/Forms/FormFieldSize.mjs

@@ -0,0 +1,11 @@
+var FormFieldSize = /*#__PURE__*/function (FormFieldSize) {
+  FormFieldSize[FormFieldSize["XL"] = 54] = "XL";
+  FormFieldSize[FormFieldSize["L"] = 44] = "L";
+  FormFieldSize[FormFieldSize["M"] = 36] = "M";
+  FormFieldSize[FormFieldSize["XS"] = 28] = "XS";
+  return FormFieldSize;
+}(FormFieldSize || {});
+var FormFieldSize$1 = FormFieldSize;
+
+export { FormFieldSize$1 as default };
+//# sourceMappingURL=FormFieldSize.mjs.map

package/dist/esm/components/Forms/FormFieldSize.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormFieldSize.mjs","sources":["../../../../src/components/Forms/FormFieldSize.ts"],"sourcesContent":["enum FormFieldSize {\n  XL = 54,\n  L = 44,\n  M = 36,\n  XS = 28,\n}\n\nexport default FormFieldSize\n"],"names":["FormFieldSize"],"mappings":"AAAKA,IAAAA,aAAa,0BAAbA,aAAa,EAAA;AAAbA,EAAAA,aAAa,CAAbA,aAAa,CAAA,IAAA,CAAA,GAAA,EAAA,CAAA,GAAA,IAAA,CAAA;AAAbA,EAAAA,aAAa,CAAbA,aAAa,CAAA,GAAA,CAAA,GAAA,EAAA,CAAA,GAAA,GAAA,CAAA;AAAbA,EAAAA,aAAa,CAAbA,aAAa,CAAA,GAAA,CAAA,GAAA,EAAA,CAAA,GAAA,GAAA,CAAA;AAAbA,EAAAA,aAAa,CAAbA,aAAa,CAAA,IAAA,CAAA,GAAA,EAAA,CAAA,GAAA,IAAA,CAAA;AAAA,EAAA,OAAbA,aAAa,CAAA;AAAA,CAAA,CAAbA,aAAa,IAAA,EAAA,CAAA,CAAA;AAOlB,sBAAeA,aAAa;;;;"}

package/dist/esm/components/Forms/FormGroup/FormGroup.mjs

@@ -0,0 +1,38 @@
+import React__default, { forwardRef } from 'react';
+import useMergeRefs from '../../../hooks/useMergeRefs.mjs';
+import { noop } from '../../../utils/functionUtils.mjs';
+import useFormControlContext from '../useFormControlContext.mjs';
+import { Stack } from './FormGroup.styled.mjs';
+
+const FORM_GROUP_TEST_ID = 'bezier-react-form-group';
+function FormGroup({
+  testId = FORM_GROUP_TEST_ID,
+  spacing = 6,
+  direction = 'vertical',
+  role = 'group',
+  children,
+  ...rest
+}, forwardedRef) {
+  const contextValue = useFormControlContext();
+  const {
+    ref,
+    ...ownProps
+  } = contextValue?.getGroupProps(rest) ?? {
+    ref: noop,
+    ...rest
+  };
+  const mergedRef = useMergeRefs(ref, forwardedRef);
+  return /*#__PURE__*/React__default.createElement(Stack, Object.assign({}, ownProps, {
+    "data-testid": testId,
+    ref: mergedRef,
+    justify: "start",
+    align: "stretch",
+    spacing: spacing,
+    direction: direction,
+    role: role
+  }), children);
+}
+var FormGroup$1 = /*#__PURE__*/forwardRef(FormGroup);
+
+export { FormGroup$1 as default };
+//# sourceMappingURL=FormGroup.mjs.map

package/dist/esm/components/Forms/FormGroup/FormGroup.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormGroup.mjs","sources":["../../../../../src/components/Forms/FormGroup/FormGroup.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport useMergeRefs from '~/src/hooks/useMergeRefs'\nimport { noop } from '~/src/utils/functionUtils'\n\nimport useFormControlContext from '~/src/components/Forms/useFormControlContext'\n\nimport type FormGroupProps from './FormGroup.types'\n\nimport * as Styled from './FormGroup.styled'\n\nconst FORM_GROUP_TEST_ID = 'bezier-react-form-group'\n\nfunction FormGroup({\n  testId = FORM_GROUP_TEST_ID,\n  spacing = 6,\n  direction = 'vertical',\n  role = 'group',\n  children,\n  ...rest\n}: FormGroupProps,\nforwardedRef: React.Ref<HTMLDivElement>,\n) {\n  const contextValue = useFormControlContext()\n\n  const {\n    ref,\n    ...ownProps\n  } = contextValue?.getGroupProps(rest) ?? {\n    ref: noop,\n    ...rest,\n  }\n\n  const mergedRef = useMergeRefs(ref, forwardedRef)\n\n  return (\n    <Styled.Stack\n      {...ownProps}\n      data-testid={testId}\n      ref={mergedRef}\n      justify=\"start\"\n      align=\"stretch\"\n      spacing={spacing}\n      direction={direction}\n      role={role}\n    >\n      { children }\n    </Styled.Stack>\n  )\n}\n\nexport default forwardRef(FormGroup)\n"],"names":["FORM_GROUP_TEST_ID","FormGroup","testId","spacing","direction","role","children","rest","forwardedRef","contextValue","useFormControlContext","ref","ownProps","getGroupProps","noop","mergedRef","useMergeRefs","React","createElement","Styled","Object","assign","justify","align","forwardRef"],"mappings":";;;;;;AAWA,MAAMA,kBAAkB,GAAG,yBAAyB,CAAA;AAEpD,SAASC,SAASA,CAAC;AACjBC,EAAAA,MAAM,GAAGF,kBAAkB;AAC3BG,EAAAA,OAAO,GAAG,CAAC;AACXC,EAAAA,SAAS,GAAG,UAAU;AACtBC,EAAAA,IAAI,GAAG,OAAO;EACdC,QAAQ;EACR,GAAGC,IAAAA;AACW,CAAC,EACjBC,YAAuC,EACrC;AACA,EAAA,MAAMC,YAAY,GAAGC,qBAAqB,EAAE,CAAA;EAE5C,MAAM;IACJC,GAAG;IACH,GAAGC,QAAAA;AACL,GAAC,GAAGH,YAAY,EAAEI,aAAa,CAACN,IAAI,CAAC,IAAI;AACvCI,IAAAA,GAAG,EAAEG,IAAI;IACT,GAAGP,IAAAA;GACJ,CAAA;AAED,EAAA,MAAMQ,SAAS,GAAGC,YAAY,CAACL,GAAG,EAAEH,YAAY,CAAC,CAAA;AAEjD,EAAA,oBACES,cAAA,CAAAC,aAAA,CAACC,KAAY,EAAAC,MAAA,CAAAC,MAAA,CAAA,EAAA,EACPT,QAAQ,EAAA;AACZ,IAAA,aAAA,EAAaV,MAAO;AACpBS,IAAAA,GAAG,EAAEI,SAAU;AACfO,IAAAA,OAAO,EAAC,OAAO;AACfC,IAAAA,KAAK,EAAC,SAAS;AACfpB,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,SAAS,EAAEA,SAAU;AACrBC,IAAAA,IAAI,EAAEA,IAAAA;AAAK,GAAA,CAAA,EAETC,QACU,CAAC,CAAA;AAEnB,CAAA;AAEA,kBAAekB,aAAAA,UAAU,CAACvB,SAAS,CAAC;;;;"}

package/dist/esm/components/Forms/FormGroup/FormGroup.styled.mjs

@@ -0,0 +1,10 @@
+import { AlphaStack } from '../../AlphaStack/AlphaStack.mjs';
+import { styled as FoundationStyled } from '../../../foundation/FoundationStyledComponent.mjs';
+
+const Stack = /*#__PURE__*/FoundationStyled(AlphaStack).withConfig({
+  displayName: "FormGroupstyled__Stack",
+  componentId: "sc-19heson-0"
+})(["flex-wrap:wrap;"]);
+
+export { Stack };
+//# sourceMappingURL=FormGroup.styled.mjs.map

package/dist/esm/components/Forms/FormGroup/FormGroup.styled.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormGroup.styled.mjs","sources":["../../../../../src/components/Forms/FormGroup/FormGroup.styled.ts"],"sourcesContent":["import { styled } from '~/src/foundation'\n\nimport { AlphaStack } from '~/src/components/AlphaStack'\n\nexport const Stack = styled(AlphaStack)`\n  flex-wrap: wrap;\n`\n"],"names":["Stack","styled","AlphaStack","withConfig","displayName","componentId"],"mappings":";;;AAIO,MAAMA,KAAK,gBAAGC,gBAAM,CAACC,UAAU,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,wBAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAEtC,CAAA,CAAA,CAAA,iBAAA,CAAA;;;;"}

package/dist/esm/components/Forms/FormHelperText/FormHelperText.mjs

@@ -0,0 +1,67 @@
+import React__default, { forwardRef, useMemo } from 'react';
+import useMergeRefs from '../../../hooks/useMergeRefs.mjs';
+import { noop } from '../../../utils/functionUtils.mjs';
+import { isEmpty } from '../../../utils/typeUtils.mjs';
+import useFormControlContext from '../useFormControlContext.mjs';
+import { HelperText } from './FormHelperText.styled.mjs';
+import { Typography } from '../../../foundation/Typography.mjs';
+
+const FORM_HELPER_TEXT_TEST_ID = 'bezier-react-form-helper-text';
+const FORM_ERROR_MESSAGE_TEST_ID = 'bezier-react-form-error-message';
+const BaseHelperText = /*#__PURE__*/forwardRef(({
+  as = 'p',
+  type,
+  typo = Typography.Size13,
+  children,
+  ...rest
+}, forwardedRef) => {
+  const contextValue = useFormControlContext();
+  const getProps = type === 'info' ? contextValue?.getHelperTextProps : contextValue?.getErrorMessageProps;
+  const {
+    visible,
+    ref,
+    Wrapper,
+    ...ownProps
+  } = getProps?.(rest) ?? {
+    visible: true,
+    ref: noop,
+    Wrapper: React__default.Fragment,
+    ...rest
+  };
+  const mergedRef = useMergeRefs(ref, forwardedRef);
+  const shouldRendered = useMemo(() => !isEmpty(children) && visible, [visible, children]);
+  if (!shouldRendered) {
+    return null;
+  }
+  return /*#__PURE__*/React__default.createElement(Wrapper, null, /*#__PURE__*/React__default.createElement(HelperText, Object.assign({}, ownProps, {
+    ref: mergedRef,
+    forwardedAs: as,
+    typo: typo
+  }), children));
+});
+const FormHelperText = /*#__PURE__*/forwardRef(({
+  testId = FORM_HELPER_TEXT_TEST_ID,
+  color = 'txt-black-dark',
+  children,
+  ...rest
+}, forwardedRef) => /*#__PURE__*/React__default.createElement(BaseHelperText, Object.assign({}, rest, {
+  type: "info",
+  ref: forwardedRef,
+  testId: testId,
+  color: color
+}), children));
+const FormErrorMessage = /*#__PURE__*/forwardRef(({
+  testId = FORM_ERROR_MESSAGE_TEST_ID,
+  color = 'bgtxt-orange-normal',
+  children,
+  ...rest
+}, forwardedRef) => /*#__PURE__*/React__default.createElement(BaseHelperText, Object.assign({}, rest, {
+  "aria-live": "polite",
+  type: "error",
+  ref: forwardedRef,
+  testId: testId,
+  color: color
+}), children));
+
+export { FORM_ERROR_MESSAGE_TEST_ID, FORM_HELPER_TEXT_TEST_ID, FormErrorMessage, FormHelperText };
+//# sourceMappingURL=FormHelperText.mjs.map

package/dist/esm/components/Forms/FormHelperText/FormHelperText.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormHelperText.mjs","sources":["../../../../../src/components/Forms/FormHelperText/FormHelperText.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useMemo,\n} from 'react'\n\nimport { Typography } from '~/src/foundation'\n\nimport useMergeRefs from '~/src/hooks/useMergeRefs'\nimport { noop } from '~/src/utils/functionUtils'\nimport { isEmpty } from '~/src/utils/typeUtils'\n\nimport useFormControlContext from '~/src/components/Forms/useFormControlContext'\n\nimport type {\n  BaseHelperTextProps,\n  FormErrorMessageProps,\n  FormHelperTextProps,\n} from './FormHelperText.types'\n\nimport * as Styled from './FormHelperText.styled'\n\ntype ForwardedRef = React.Ref<HTMLParamElement>\n\nexport const FORM_HELPER_TEXT_TEST_ID = 'bezier-react-form-helper-text'\nexport const FORM_ERROR_MESSAGE_TEST_ID = 'bezier-react-form-error-message'\n\nconst BaseHelperText = forwardRef(({\n  as = 'p',\n  type,\n  typo = Typography.Size13,\n  children,\n  ...rest\n}: BaseHelperTextProps,\nforwardedRef: ForwardedRef,\n) => {\n  const contextValue = useFormControlContext()\n  const getProps = type === 'info'\n    ? contextValue?.getHelperTextProps\n    : contextValue?.getErrorMessageProps\n\n  const {\n    visible,\n    ref,\n    Wrapper,\n    ...ownProps\n  } = getProps?.(rest) ?? {\n    visible: true,\n    ref: noop,\n    Wrapper: React.Fragment,\n    ...rest,\n  }\n\n  const mergedRef = useMergeRefs(ref, forwardedRef)\n\n  const shouldRendered = useMemo(() => (\n    !isEmpty(children) && visible\n  ), [\n    visible,\n    children,\n  ])\n\n  if (!shouldRendered) { return null }\n\n  return (\n    <Wrapper>\n      <Styled.HelperText\n        {...ownProps}\n        ref={mergedRef}\n        forwardedAs={as}\n        typo={typo}\n      >\n        { children }\n      </Styled.HelperText>\n    </Wrapper>\n  )\n})\n\nexport const FormHelperText = forwardRef(({\n  testId = FORM_HELPER_TEXT_TEST_ID,\n  color = 'txt-black-dark',\n  children,\n  ...rest\n}: FormHelperTextProps,\nforwardedRef: ForwardedRef,\n) => (\n  <BaseHelperText\n    {...rest}\n    type=\"info\"\n    ref={forwardedRef}\n    testId={testId}\n    color={color}\n  >\n    { children }\n  </BaseHelperText>\n))\n\nexport const FormErrorMessage = forwardRef(({\n  testId = FORM_ERROR_MESSAGE_TEST_ID,\n  color = 'bgtxt-orange-normal',\n  children,\n  ...rest\n}: FormErrorMessageProps,\nforwardedRef: ForwardedRef,\n) => (\n  <BaseHelperText\n    {...rest}\n    aria-live=\"polite\"\n    type=\"error\"\n    ref={forwardedRef}\n    testId={testId}\n    color={color}\n  >\n    { children }\n  </BaseHelperText>\n))\n"],"names":["FORM_HELPER_TEXT_TEST_ID","FORM_ERROR_MESSAGE_TEST_ID","BaseHelperText","forwardRef","as","type","typo","Typography","Size13","children","rest","forwardedRef","contextValue","useFormControlContext","getProps","getHelperTextProps","getErrorMessageProps","visible","ref","Wrapper","ownProps","noop","React","Fragment","mergedRef","useMergeRefs","shouldRendered","useMemo","isEmpty","createElement","Styled","Object","assign","forwardedAs","FormHelperText","testId","color","FormErrorMessage"],"mappings":";;;;;;;;AAuBO,MAAMA,wBAAwB,GAAG,gCAA+B;AAChE,MAAMC,0BAA0B,GAAG,kCAAiC;AAE3E,MAAMC,cAAc,gBAAGC,UAAU,CAAC,CAAC;AACjCC,EAAAA,EAAE,GAAG,GAAG;EACRC,IAAI;EACJC,IAAI,GAAGC,UAAU,CAACC,MAAM;EACxBC,QAAQ;EACR,GAAGC,IAAAA;AACgB,CAAC,EACtBC,YAA0B,KACrB;AACH,EAAA,MAAMC,YAAY,GAAGC,qBAAqB,EAAE,CAAA;AAC5C,EAAA,MAAMC,QAAQ,GAAGT,IAAI,KAAK,MAAM,GAC5BO,YAAY,EAAEG,kBAAkB,GAChCH,YAAY,EAAEI,oBAAoB,CAAA;EAEtC,MAAM;IACJC,OAAO;IACPC,GAAG;IACHC,OAAO;IACP,GAAGC,QAAAA;AACL,GAAC,GAAGN,QAAQ,GAAGJ,IAAI,CAAC,IAAI;AACtBO,IAAAA,OAAO,EAAE,IAAI;AACbC,IAAAA,GAAG,EAAEG,IAAI;IACTF,OAAO,EAAEG,cAAK,CAACC,QAAQ;IACvB,GAAGb,IAAAA;GACJ,CAAA;AAED,EAAA,MAAMc,SAAS,GAAGC,YAAY,CAACP,GAAG,EAAEP,YAAY,CAAC,CAAA;AAEjD,EAAA,MAAMe,cAAc,GAAGC,OAAO,CAAC,MAC7B,CAACC,OAAO,CAACnB,QAAQ,CAAC,IAAIQ,OACvB,EAAE,CACDA,OAAO,EACPR,QAAQ,CACT,CAAC,CAAA;EAEF,IAAI,CAACiB,cAAc,EAAE;AAAE,IAAA,OAAO,IAAI,CAAA;AAAC,GAAA;AAEnC,EAAA,oBACEJ,cAAA,CAAAO,aAAA,CAACV,OAAO,EAAA,IAAA,eACNG,cAAA,CAAAO,aAAA,CAACC,UAAiB,EAAAC,MAAA,CAAAC,MAAA,KACZZ,QAAQ,EAAA;AACZF,IAAAA,GAAG,EAAEM,SAAU;AACfS,IAAAA,WAAW,EAAE7B,EAAG;AAChBE,IAAAA,IAAI,EAAEA,IAAAA;GAEJG,CAAAA,EAAAA,QACe,CACZ,CAAC,CAAA;AAEd,CAAC,CAAC,CAAA;AAEWyB,MAAAA,cAAc,gBAAG/B,UAAU,CAAC,CAAC;AACxCgC,EAAAA,MAAM,GAAGnC,wBAAwB;AACjCoC,EAAAA,KAAK,GAAG,gBAAgB;EACxB3B,QAAQ;EACR,GAAGC,IAAAA;AACgB,CAAC,EACtBC,YAA0B,kBAExBW,cAAA,CAAAO,aAAA,CAAC3B,cAAc,EAAA6B,MAAA,CAAAC,MAAA,KACTtB,IAAI,EAAA;AACRL,EAAAA,IAAI,EAAC,MAAM;AACXa,EAAAA,GAAG,EAAEP,YAAa;AAClBwB,EAAAA,MAAM,EAAEA,MAAO;AACfC,EAAAA,KAAK,EAAEA,KAAAA;AAAM,CAEX3B,CAAAA,EAAAA,QACY,CACjB,EAAC;AAEW4B,MAAAA,gBAAgB,gBAAGlC,UAAU,CAAC,CAAC;AAC1CgC,EAAAA,MAAM,GAAGlC,0BAA0B;AACnCmC,EAAAA,KAAK,GAAG,qBAAqB;EAC7B3B,QAAQ;EACR,GAAGC,IAAAA;AACkB,CAAC,EACxBC,YAA0B,kBAExBW,cAAA,CAAAO,aAAA,CAAC3B,cAAc,EAAA6B,MAAA,CAAAC,MAAA,KACTtB,IAAI,EAAA;AACR,EAAA,WAAA,EAAU,QAAQ;AAClBL,EAAAA,IAAI,EAAC,OAAO;AACZa,EAAAA,GAAG,EAAEP,YAAa;AAClBwB,EAAAA,MAAM,EAAEA,MAAO;AACfC,EAAAA,KAAK,EAAEA,KAAAA;AAAM,CAEX3B,CAAAA,EAAAA,QACY,CACjB;;;;"}

package/dist/esm/components/Forms/FormHelperText/FormHelperText.styled.mjs

@@ -0,0 +1,10 @@
+import Text from '../../Text/Text.mjs';
+import { styled as FoundationStyled } from '../../../foundation/FoundationStyledComponent.mjs';
+
+const HelperText = /*#__PURE__*/FoundationStyled(Text).withConfig({
+  displayName: "FormHelperTextstyled__HelperText",
+  componentId: "sc-d3er7d-0"
+})(["display:block;text-align:left;"]);
+
+export { HelperText };
+//# sourceMappingURL=FormHelperText.styled.mjs.map

package/dist/esm/components/Forms/FormHelperText/FormHelperText.styled.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormHelperText.styled.mjs","sources":["../../../../../src/components/Forms/FormHelperText/FormHelperText.styled.ts"],"sourcesContent":["import { styled } from '~/src/foundation'\n\nimport { Text } from '~/src/components/Text'\n\nexport const HelperText = styled(Text)`\n  display: block;\n  text-align: left;\n`\n"],"names":["HelperText","styled","Text","withConfig","displayName","componentId"],"mappings":";;;AAIO,MAAMA,UAAU,gBAAGC,gBAAM,CAACC,IAAI,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,kCAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAGrC,CAAA,CAAA,CAAA,gCAAA,CAAA;;;;"}

package/dist/esm/components/Forms/FormLabel/FormLabel.mjs

@@ -0,0 +1,67 @@
+import React__default, { forwardRef, useMemo } from 'react';
+import { isEmpty } from '../../../utils/typeUtils.mjs';
+import useFormControlContext from '../useFormControlContext.mjs';
+import Help, { HELP_DISPLAY_NAME } from '../../Help/Help.mjs';
+import { Label } from './FormLabel.styled.mjs';
+import { Typography } from '../../../foundation/Typography.mjs';
+import { HStack } from '../../Stack/HStack/HStack.mjs';
+import { StackItem } from '../../Stack/StackItem/StackItem.mjs';
+
+const FORM_LABEL_TEST_ID = 'bezier-react-form-label';
+function FormLabel({
+  testId = FORM_LABEL_TEST_ID,
+  help,
+  as = 'label',
+  bold = true,
+  color = 'txt-black-darkest',
+  children,
+  ...rest
+}, forwardedRef) {
+  const contextValue = useFormControlContext();
+  const {
+    Wrapper,
+    typo,
+    ...ownProps
+  } = contextValue?.getLabelProps(rest) ?? {
+    Wrapper: React__default.Fragment,
+    typo: Typography.Size13,
+    ...rest
+  };
+  const LabelComponent = useMemo(() => /*#__PURE__*/React__default.createElement(Label, Object.assign({}, ownProps, {
+    ref: forwardedRef,
+    testId: testId,
+    forwardedAs: as,
+    bold: bold,
+    typo: typo,
+    color: color
+  }), children), [as, typo, bold, color, testId, children, forwardedRef, ownProps]);
+  const HelpComponent = useMemo(() => {
+    if (isEmpty(help)) {
+      return null;
+    }
+    if ( /*#__PURE__*/React__default.isValidElement(help)) {
+      // FIXME(@bora): string, JSXElementCostructor 타입에 displayName 속성이 존재하지 않음, 임시로 any 타입으로 설정
+      const {
+        displayName
+      } = help?.type;
+      if (displayName === HELP_DISPLAY_NAME) {
+        return help;
+      }
+    }
+    return /*#__PURE__*/React__default.createElement(Help, null, help);
+  }, [help]);
+  if (isEmpty(children)) {
+    return null;
+  }
+  return /*#__PURE__*/React__default.createElement(Wrapper, null, !HelpComponent ? LabelComponent : /*#__PURE__*/React__default.createElement(HStack, {
+    align: "center",
+    spacing: 6
+  }, /*#__PURE__*/React__default.createElement(StackItem, {
+    shrink: true,
+    weight: 1
+  }, LabelComponent), /*#__PURE__*/React__default.createElement(StackItem, null, HelpComponent)));
+}
+var FormLabel$1 = /*#__PURE__*/forwardRef(FormLabel);
+
+export { FORM_LABEL_TEST_ID, FormLabel$1 as default };
+//# sourceMappingURL=FormLabel.mjs.map

package/dist/esm/components/Forms/FormLabel/FormLabel.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormLabel.mjs","sources":["../../../../../src/components/Forms/FormLabel/FormLabel.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useMemo,\n} from 'react'\n\nimport { Typography } from '~/src/foundation'\n\nimport { isEmpty } from '~/src/utils/typeUtils'\n\nimport useFormControlContext from '~/src/components/Forms/useFormControlContext'\nimport { Help } from '~/src/components/Help'\nimport { HELP_DISPLAY_NAME } from '~/src/components/Help/Help'\nimport {\n  HStack,\n  StackItem,\n} from '~/src/components/Stack'\n\nimport type FormLabelProps from './FormLabel.types'\n\nimport * as Styled from './FormLabel.styled'\n\nexport const FORM_LABEL_TEST_ID = 'bezier-react-form-label'\n\nfunction FormLabel({\n  testId = FORM_LABEL_TEST_ID,\n  help,\n  as = 'label',\n  bold = true,\n  color = 'txt-black-darkest',\n  children,\n  ...rest\n}: FormLabelProps,\nforwardedRef: React.Ref<HTMLLabelElement>,\n) {\n  const contextValue = useFormControlContext()\n\n  const { Wrapper, typo, ...ownProps } = contextValue?.getLabelProps(rest) ?? {\n    Wrapper: React.Fragment,\n    typo: Typography.Size13,\n    ...rest,\n  }\n\n  const LabelComponent = useMemo(() => (\n    <Styled.Label\n      {...ownProps}\n      ref={forwardedRef}\n      testId={testId}\n      forwardedAs={as}\n      bold={bold}\n      typo={typo}\n      color={color}\n    >\n      { children }\n    </Styled.Label>\n  ), [\n    as,\n    typo,\n    bold,\n    color,\n    testId,\n    children,\n    forwardedRef,\n    ownProps,\n  ])\n\n  const HelpComponent = useMemo(() => {\n    if (isEmpty(help)) { return null }\n\n    if (React.isValidElement(help)) {\n      // FIXME(@bora): string, JSXElementCostructor 타입에 displayName 속성이 존재하지 않음, 임시로 any 타입으로 설정\n      const { displayName } = help?.type as any\n      if (displayName === HELP_DISPLAY_NAME) {\n        return help\n      }\n    }\n\n    return (\n      <Help>\n        { help }\n      </Help>\n    )\n  }, [help])\n\n  if (isEmpty(children)) { return null }\n\n  return (\n    <Wrapper>\n      { !HelpComponent\n        ? LabelComponent\n        : (\n          <HStack align=\"center\" spacing={6}>\n            <StackItem shrink weight={1}>\n              { LabelComponent }\n            </StackItem>\n            <StackItem>\n              { HelpComponent }\n            </StackItem>\n          </HStack>\n        ) }\n    </Wrapper>\n  )\n}\n\nexport default forwardRef(FormLabel)\n"],"names":["FORM_LABEL_TEST_ID","FormLabel","testId","help","as","bold","color","children","rest","forwardedRef","contextValue","useFormControlContext","Wrapper","typo","ownProps","getLabelProps","React","Fragment","Typography","Size13","LabelComponent","useMemo","createElement","Styled","Object","assign","ref","forwardedAs","HelpComponent","isEmpty","isValidElement","displayName","type","HELP_DISPLAY_NAME","Help","HStack","align","spacing","StackItem","shrink","weight","forwardRef"],"mappings":";;;;;;;;;AAqBO,MAAMA,kBAAkB,GAAG,0BAAyB;AAE3D,SAASC,SAASA,CAAC;AACjBC,EAAAA,MAAM,GAAGF,kBAAkB;EAC3BG,IAAI;AACJC,EAAAA,EAAE,GAAG,OAAO;AACZC,EAAAA,IAAI,GAAG,IAAI;AACXC,EAAAA,KAAK,GAAG,mBAAmB;EAC3BC,QAAQ;EACR,GAAGC,IAAAA;AACW,CAAC,EACjBC,YAAyC,EACvC;AACA,EAAA,MAAMC,YAAY,GAAGC,qBAAqB,EAAE,CAAA;EAE5C,MAAM;IAAEC,OAAO;IAAEC,IAAI;IAAE,GAAGC,QAAAA;AAAS,GAAC,GAAGJ,YAAY,EAAEK,aAAa,CAACP,IAAI,CAAC,IAAI;IAC1EI,OAAO,EAAEI,cAAK,CAACC,QAAQ;IACvBJ,IAAI,EAAEK,UAAU,CAACC,MAAM;IACvB,GAAGX,IAAAA;GACJ,CAAA;AAED,EAAA,MAAMY,cAAc,GAAGC,OAAO,CAAC,mBAC7BL,cAAA,CAAAM,aAAA,CAACC,KAAY,EAAAC,MAAA,CAAAC,MAAA,KACPX,QAAQ,EAAA;AACZY,IAAAA,GAAG,EAAEjB,YAAa;AAClBP,IAAAA,MAAM,EAAEA,MAAO;AACfyB,IAAAA,WAAW,EAAEvB,EAAG;AAChBC,IAAAA,IAAI,EAAEA,IAAK;AACXQ,IAAAA,IAAI,EAAEA,IAAK;AACXP,IAAAA,KAAK,EAAEA,KAAAA;GAELC,CAAAA,EAAAA,QACU,CACf,EAAE,CACDH,EAAE,EACFS,IAAI,EACJR,IAAI,EACJC,KAAK,EACLJ,MAAM,EACNK,QAAQ,EACRE,YAAY,EACZK,QAAQ,CACT,CAAC,CAAA;AAEF,EAAA,MAAMc,aAAa,GAAGP,OAAO,CAAC,MAAM;AAClC,IAAA,IAAIQ,OAAO,CAAC1B,IAAI,CAAC,EAAE;AAAE,MAAA,OAAO,IAAI,CAAA;AAAC,KAAA;AAEjC,IAAA,kBAAIa,cAAK,CAACc,cAAc,CAAC3B,IAAI,CAAC,EAAE;AAC9B;MACA,MAAM;AAAE4B,QAAAA,WAAAA;OAAa,GAAG5B,IAAI,EAAE6B,IAAW,CAAA;MACzC,IAAID,WAAW,KAAKE,iBAAiB,EAAE;AACrC,QAAA,OAAO9B,IAAI,CAAA;AACb,OAAA;AACF,KAAA;AAEA,IAAA,oBACEa,cAAA,CAAAM,aAAA,CAACY,IAAI,EAAA,IAAA,EACD/B,IACE,CAAC,CAAA;AAEX,GAAC,EAAE,CAACA,IAAI,CAAC,CAAC,CAAA;AAEV,EAAA,IAAI0B,OAAO,CAACtB,QAAQ,CAAC,EAAE;AAAE,IAAA,OAAO,IAAI,CAAA;AAAC,GAAA;AAErC,EAAA,oBACES,cAAA,CAAAM,aAAA,CAACV,OAAO,EACJ,IAAA,EAAA,CAACgB,aAAa,GACZR,cAAc,gBAEdJ,cAAA,CAAAM,aAAA,CAACa,MAAM,EAAA;AAACC,IAAAA,KAAK,EAAC,QAAQ;AAACC,IAAAA,OAAO,EAAE,CAAA;AAAE,GAAA,eAChCrB,cAAA,CAAAM,aAAA,CAACgB,SAAS,EAAA;IAACC,MAAM,EAAA,IAAA;AAACC,IAAAA,MAAM,EAAE,CAAA;AAAE,GAAA,EACxBpB,cACO,CAAC,eACZJ,cAAA,CAAAM,aAAA,CAACgB,SAAS,EACNV,IAAAA,EAAAA,aACO,CACL,CAEL,CAAC,CAAA;AAEd,CAAA;AAEA,kBAAea,aAAAA,UAAU,CAACxC,SAAS,CAAC;;;;"}

package/dist/esm/components/Forms/FormLabel/FormLabel.styled.mjs

@@ -0,0 +1,10 @@
+import Text from '../../Text/Text.mjs';
+import { styled as FoundationStyled } from '../../../foundation/FoundationStyledComponent.mjs';
+
+const Label = /*#__PURE__*/FoundationStyled(Text).withConfig({
+  displayName: "FormLabelstyled__Label",
+  componentId: "sc-qcog42-0"
+})(["display:block;text-align:left;word-break:break-word;"]);
+
+export { Label };
+//# sourceMappingURL=FormLabel.styled.mjs.map

package/dist/esm/components/Forms/FormLabel/FormLabel.styled.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormLabel.styled.mjs","sources":["../../../../../src/components/Forms/FormLabel/FormLabel.styled.ts"],"sourcesContent":["import { styled } from '~/src/foundation'\n\nimport { Text } from '~/src/components/Text'\n\nexport const Label = styled(Text)`\n  display: block;\n  text-align: left;\n  word-break: break-word;\n`\n"],"names":["Label","styled","Text","withConfig","displayName","componentId"],"mappings":";;;AAIO,MAAMA,KAAK,gBAAGC,gBAAM,CAACC,IAAI,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,wBAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAIhC,CAAA,CAAA,CAAA,sDAAA,CAAA;;;;"}

package/dist/esm/components/Forms/Inputs/Select/Select.mjs

@@ -0,0 +1,152 @@
+import React__default, { forwardRef, useRef, useState, useMemo, useCallback, useEffect, useImperativeHandle } from 'react';
+import { isBezierIcon, ChevronUpIcon, ChevronDownIcon } from '@channel.io/bezier-icons';
+import { ZIndex } from '../../../../constants/ZIndex.mjs';
+import { noop } from '../../../../utils/functionUtils.mjs';
+import { isEmpty } from '../../../../utils/typeUtils.mjs';
+import useFormFieldProps from '../../useFormFieldProps.mjs';
+import { OverlayPosition } from '../../../Overlay/Overlay.types.mjs';
+import Text from '../../../Text/Text.mjs';
+import { SelectSize } from './Select.types.mjs';
+import { Container, Trigger, MainContentWrapper, Dropdown } from './Select.styled.mjs';
+import { Icon } from '../../../Icon/Icon.mjs';
+import { IconSize } from '../../../Icon/Icon.types.mjs';
+import { Typography } from '../../../../foundation/Typography.mjs';
+
+const SELECT_CONTAINER_TEST_ID = 'bezier-react-select-container';
+const SELECT_TRIGGER_TEST_ID = 'bezier-react-select-trigger';
+const SELECT_TRIGGER_TEXT_TEST_ID = 'bezier-react-select-trigger-text';
+const SELECT_DROPDOWN_TEST_ID = 'bezier-react-select-dropdown';
+const DEFAULT_DROPDOWN_MARGIN_Y = 6;
+const DEFAULT_DROPDOWN_Z_INDEX = ZIndex.Overlay;
+function Select({
+  testId = SELECT_CONTAINER_TEST_ID,
+  triggerTestId = SELECT_TRIGGER_TEST_ID,
+  triggerTextTestId = SELECT_TRIGGER_TEXT_TEST_ID,
+  dropdownTestId = SELECT_DROPDOWN_TEST_ID,
+  as,
+  style,
+  className,
+  interpolation,
+  dropdownInterpolation,
+  size = SelectSize.M,
+  defaultFocus = false,
+  placeholder = '',
+  leftContent,
+  rightContent,
+  iconColor = 'txt-black-dark',
+  text,
+  textColor = 'txt-black-darkest',
+  withoutChevron = false,
+  dropdownStyle,
+  dropdownClassName,
+  dropdownContainer,
+  dropdownMarginX,
+  dropdownMarginY = DEFAULT_DROPDOWN_MARGIN_Y,
+  dropdownZIndex = DEFAULT_DROPDOWN_Z_INDEX,
+  dropdownPosition = OverlayPosition.BottomLeft,
+  onClickTrigger = noop,
+  onHideDropdown = noop,
+  children,
+  ...rest
+}, forwardedRef) {
+  const {
+    disabled,
+    readOnly,
+    hasError,
+    ...ownProps
+  } = useFormFieldProps(rest);
+  const containerRef = useRef(null);
+  const triggerRef = useRef(null);
+  const [isDropdownOpened, setIsDropdownOpened] = useState(false);
+  const LeftComponent = useMemo(() => {
+    if (isBezierIcon(leftContent)) {
+      return /*#__PURE__*/React__default.createElement(Icon, {
+        source: leftContent,
+        size: IconSize.XS,
+        marginRight: 6,
+        color: iconColor
+      });
+    }
+    return leftContent;
+  }, [leftContent, iconColor]);
+  const RightComponent = useMemo(() => {
+    if (isBezierIcon(rightContent)) {
+      return /*#__PURE__*/React__default.createElement(Icon, {
+        source: rightContent,
+        size: IconSize.XS,
+        marginRight: 6,
+        color: iconColor
+      });
+    }
+    return rightContent;
+  }, [rightContent, iconColor]);
+  const handleClickTrigger = useCallback(event => {
+    if (!disabled && !readOnly) {
+      setIsDropdownOpened(prevState => !prevState);
+      onClickTrigger(event);
+    }
+  }, [disabled, readOnly, onClickTrigger]);
+  const handleHideDropdown = useCallback(() => {
+    setIsDropdownOpened(false);
+    onHideDropdown();
+  }, [onHideDropdown]);
+  const getDOMNode = useCallback(() => triggerRef.current, []);
+  const handle = useMemo(() => ({
+    handleClickTrigger,
+    handleHideDropdown,
+    getDOMNode
+  }), [handleClickTrigger, handleHideDropdown, getDOMNode]);
+  useEffect(() => {
+    if (defaultFocus && !disabled && !readOnly) {
+      setIsDropdownOpened(true);
+    }
+  }, [defaultFocus, disabled, readOnly]);
+  useImperativeHandle(forwardedRef, () => handle);
+  const hasContent = !isEmpty(text);
+  return /*#__PURE__*/React__default.createElement(Container, {
+    "data-testid": testId,
+    ref: containerRef,
+    style: style,
+    className: className,
+    interpolation: interpolation
+  }, /*#__PURE__*/React__default.createElement(Trigger, Object.assign({
+    type: "button",
+    "data-testid": triggerTestId,
+    as: as,
+    ref: triggerRef,
+    size: size,
+    hasError: hasError,
+    disabled: disabled,
+    readOnly: readOnly,
+    active: isDropdownOpened,
+    onClick: handleClickTrigger
+  }, ownProps), /*#__PURE__*/React__default.createElement(MainContentWrapper, null, LeftComponent, /*#__PURE__*/React__default.createElement(Text, {
+    testId: triggerTextTestId,
+    typo: Typography.Size14,
+    truncated: true,
+    color: hasContent ? textColor : 'txt-black-dark'
+  }, hasContent ? text : placeholder), RightComponent), !withoutChevron && /*#__PURE__*/React__default.createElement(Icon, {
+    source: isDropdownOpened ? ChevronUpIcon : ChevronDownIcon,
+    size: IconSize.XS,
+    color: readOnly ? 'txt-black-dark' : 'txt-black-darker',
+    marginLeft: 6
+  })), /*#__PURE__*/React__default.createElement(Dropdown, {
+    style: dropdownStyle,
+    className: dropdownClassName,
+    testId: dropdownTestId,
+    withTransition: true,
+    show: isDropdownOpened && !disabled,
+    zIndex: dropdownZIndex,
+    marginX: dropdownMarginX,
+    marginY: dropdownMarginY,
+    target: triggerRef.current,
+    container: dropdownContainer || containerRef.current,
+    position: dropdownPosition,
+    interpolation: dropdownInterpolation,
+    onHide: handleHideDropdown
+  }, children));
+}
+var Select$1 = /*#__PURE__*/forwardRef(Select);
+
+export { SELECT_CONTAINER_TEST_ID, SELECT_DROPDOWN_TEST_ID, SELECT_TRIGGER_TEST_ID, SELECT_TRIGGER_TEXT_TEST_ID, Select$1 as default };
+//# sourceMappingURL=Select.mjs.map

package/dist/esm/components/Forms/Inputs/Select/Select.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.mjs","sources":["../../../../../../src/components/Forms/Inputs/Select/Select.tsx"],"sourcesContent":["import React, {\n  type Ref,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\n\nimport {\n  ChevronDownIcon,\n  ChevronUpIcon,\n  isBezierIcon,\n} from '@channel.io/bezier-icons'\n\nimport { Typography } from '~/src/foundation'\n\nimport { ZIndex } from '~/src/constants/ZIndex'\nimport { noop } from '~/src/utils/functionUtils'\nimport { isEmpty } from '~/src/utils/typeUtils'\n\nimport useFormFieldProps from '~/src/components/Forms/useFormFieldProps'\nimport {\n  Icon,\n  IconSize,\n} from '~/src/components/Icon'\nimport { OverlayPosition } from '~/src/components/Overlay'\nimport { Text } from '~/src/components/Text'\n\nimport type SelectProps from './Select.types'\nimport { type SelectRef } from './Select.types'\nimport { SelectSize } from './Select.types'\n\nimport * as Styled from './Select.styled'\n\nexport const SELECT_CONTAINER_TEST_ID = 'bezier-react-select-container'\nexport const SELECT_TRIGGER_TEST_ID = 'bezier-react-select-trigger'\nexport const SELECT_TRIGGER_TEXT_TEST_ID = 'bezier-react-select-trigger-text'\nexport const SELECT_DROPDOWN_TEST_ID = 'bezier-react-select-dropdown'\n\nconst DEFAULT_DROPDOWN_MARGIN_Y = 6\nconst DEFAULT_DROPDOWN_Z_INDEX = ZIndex.Overlay\n\nfunction Select({\n  testId = SELECT_CONTAINER_TEST_ID,\n  triggerTestId = SELECT_TRIGGER_TEST_ID,\n  triggerTextTestId = SELECT_TRIGGER_TEXT_TEST_ID,\n  dropdownTestId = SELECT_DROPDOWN_TEST_ID,\n  as,\n  style,\n  className,\n  interpolation,\n  dropdownInterpolation,\n  size = SelectSize.M,\n  defaultFocus = false,\n  placeholder = '',\n  leftContent,\n  rightContent,\n  iconColor = 'txt-black-dark',\n  text,\n  textColor = 'txt-black-darkest',\n  withoutChevron = false,\n  dropdownStyle,\n  dropdownClassName,\n  dropdownContainer,\n  dropdownMarginX,\n  dropdownMarginY = DEFAULT_DROPDOWN_MARGIN_Y,\n  dropdownZIndex = DEFAULT_DROPDOWN_Z_INDEX,\n  dropdownPosition = OverlayPosition.BottomLeft,\n  onClickTrigger = noop,\n  onHideDropdown = noop,\n  children,\n  ...rest\n}: SelectProps,\nforwardedRef: Ref<SelectRef>,\n) {\n  const {\n    disabled,\n    readOnly,\n    hasError,\n    ...ownProps\n  } = useFormFieldProps(rest)\n\n  const containerRef = useRef<HTMLDivElement>(null)\n  const triggerRef = useRef<HTMLDivElement>(null)\n\n  const [isDropdownOpened, setIsDropdownOpened] = useState(false)\n\n  const LeftComponent = useMemo(() => {\n    if (isBezierIcon(leftContent)) {\n      return (\n        <Icon\n          source={leftContent}\n          size={IconSize.XS}\n          marginRight={6}\n          color={iconColor}\n        />\n      )\n    }\n\n    return leftContent\n  }, [\n    leftContent,\n    iconColor,\n  ])\n\n  const RightComponent = useMemo(() => {\n    if (isBezierIcon(rightContent)) {\n      return (\n        <Icon\n          source={rightContent}\n          size={IconSize.XS}\n          marginRight={6}\n          color={iconColor}\n        />\n      )\n    }\n\n    return rightContent\n  }, [\n    rightContent,\n    iconColor,\n  ])\n\n  const handleClickTrigger = useCallback((event: React.MouseEvent) => {\n    if (!disabled && !readOnly) {\n      setIsDropdownOpened(prevState => !prevState)\n      onClickTrigger(event)\n    }\n  }, [\n    disabled,\n    readOnly,\n    onClickTrigger,\n  ])\n\n  const handleHideDropdown = useCallback(() => {\n    setIsDropdownOpened(false)\n    onHideDropdown()\n  }, [onHideDropdown])\n\n  const getDOMNode = useCallback(() => triggerRef.current, [])\n\n  const handle = useMemo((): SelectRef => ({ handleClickTrigger, handleHideDropdown, getDOMNode }), [\n    handleClickTrigger,\n    handleHideDropdown,\n    getDOMNode,\n  ])\n\n  useEffect(() => {\n    if (defaultFocus && !disabled && !readOnly) {\n      setIsDropdownOpened(true)\n    }\n  }, [\n    defaultFocus,\n    disabled,\n    readOnly,\n  ])\n\n  useImperativeHandle(forwardedRef, () => handle)\n\n  const hasContent = !isEmpty(text)\n\n  return (\n    <Styled.Container\n      data-testid={testId}\n      ref={containerRef}\n      style={style}\n      className={className}\n      interpolation={interpolation}\n    >\n      <Styled.Trigger\n        type=\"button\"\n        data-testid={triggerTestId}\n        as={as}\n        ref={triggerRef}\n        size={size}\n        hasError={hasError}\n        disabled={disabled}\n        readOnly={readOnly}\n        active={isDropdownOpened}\n        onClick={handleClickTrigger}\n        {...ownProps}\n      >\n        <Styled.MainContentWrapper>\n          { LeftComponent }\n          <Text\n            testId={triggerTextTestId}\n            typo={Typography.Size14}\n            truncated\n            color={hasContent ? textColor : 'txt-black-dark'}\n          >\n            { hasContent ? text : placeholder }\n          </Text>\n          { RightComponent }\n        </Styled.MainContentWrapper>\n        { !withoutChevron && (\n          <Icon\n            source={isDropdownOpened ? ChevronUpIcon : ChevronDownIcon}\n            size={IconSize.XS}\n            color={readOnly ? 'txt-black-dark' : 'txt-black-darker'}\n            marginLeft={6}\n          />\n        ) }\n      </Styled.Trigger>\n\n      <Styled.Dropdown\n        style={dropdownStyle}\n        className={dropdownClassName}\n        testId={dropdownTestId}\n        withTransition\n        show={isDropdownOpened && !disabled}\n        zIndex={dropdownZIndex}\n        marginX={dropdownMarginX}\n        marginY={dropdownMarginY}\n        target={triggerRef.current}\n        container={dropdownContainer || containerRef.current}\n        position={dropdownPosition}\n        interpolation={dropdownInterpolation}\n        onHide={handleHideDropdown}\n      >\n        { children }\n      </Styled.Dropdown>\n    </Styled.Container>\n  )\n}\n\nexport default forwardRef(Select)\n"],"names":["SELECT_CONTAINER_TEST_ID","SELECT_TRIGGER_TEST_ID","SELECT_TRIGGER_TEXT_TEST_ID","SELECT_DROPDOWN_TEST_ID","DEFAULT_DROPDOWN_MARGIN_Y","DEFAULT_DROPDOWN_Z_INDEX","ZIndex","Overlay","Select","testId","triggerTestId","triggerTextTestId","dropdownTestId","as","style","className","interpolation","dropdownInterpolation","size","SelectSize","M","defaultFocus","placeholder","leftContent","rightContent","iconColor","text","textColor","withoutChevron","dropdownStyle","dropdownClassName","dropdownContainer","dropdownMarginX","dropdownMarginY","dropdownZIndex","dropdownPosition","OverlayPosition","BottomLeft","onClickTrigger","noop","onHideDropdown","children","rest","forwardedRef","disabled","readOnly","hasError","ownProps","useFormFieldProps","containerRef","useRef","triggerRef","isDropdownOpened","setIsDropdownOpened","useState","LeftComponent","useMemo","isBezierIcon","React","createElement","Icon","source","IconSize","XS","marginRight","color","RightComponent","handleClickTrigger","useCallback","event","prevState","handleHideDropdown","getDOMNode","current","handle","useEffect","useImperativeHandle","hasContent","isEmpty","Styled","ref","Object","assign","type","active","onClick","Text","typo","Typography","Size14","truncated","ChevronUpIcon","ChevronDownIcon","marginLeft","withTransition","show","zIndex","marginX","marginY","target","container","position","onHide","forwardRef"],"mappings":"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"}

package/dist/esm/components/Forms/Inputs/Select/Select.styled.mjs

@@ -0,0 +1,67 @@
+import disabledOpacity from '../../../../constants/DisabledOpacity.mjs';
+import { focusedInputWrapperStyle, inputTextStyle, inputWrapperStyle, erroredInputWrapperStyle } from '../mixins.mjs';
+import Overlay from '../../../Overlay/Overlay.mjs';
+import { styled as FoundationStyled, css as FoundationCSS } from '../../../../foundation/FoundationStyledComponent.mjs';
+
+const Container = /*#__PURE__*/FoundationStyled.div.withConfig({
+  displayName: "Selectstyled__Container",
+  componentId: "sc-r4extr-0"
+})(["position:relative;", ";"], ({
+  interpolation
+}) => interpolation);
+const focusedStyle = FoundationCSS`
+  ${focusedInputWrapperStyle};
+  background-color: ${({
+  foundation
+}) => foundation?.theme?.['bg-grey-lighter']};
+`;
+const Trigger = /*#__PURE__*/FoundationStyled.button.withConfig({
+  displayName: "Selectstyled__Trigger",
+  componentId: "sc-r4extr-1"
+})(["all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;width:100%;height:", "px;padding:8px 12px;cursor:pointer;user-select:none;background-color:", ";", " ", " ", " ", " ", " ", " ", " &:disabled{cursor:not-allowed;opacity:", ";}&:not(:disabled):focus{", "}", ""], ({
+  size
+}) => size, ({
+  foundation
+}) => foundation?.theme?.['bg-grey-lightest'], inputTextStyle, inputWrapperStyle, ({
+  foundation
+}) => foundation?.rounding?.round8, ({
+  foundation
+}) => foundation?.transition?.getTransitionsCSS(['background-color', 'box-shadow']), ({
+  active
+}) => active && focusedStyle, ({
+  hasError
+}) => hasError && erroredInputWrapperStyle, ({
+  readOnly
+}) => readOnly && FoundationCSS`
+    cursor: initial;
+    background-color: ${({
+  foundation
+}) => foundation?.theme?.['bg-grey-lighter']};
+  `, disabledOpacity, focusedStyle, ({
+  readOnly
+}) => !readOnly && FoundationCSS`
+    &:not(:disabled):hover {
+      background-color: ${({
+  foundation
+}) => foundation?.theme?.['bg-grey-lighter']};
+    }
+  `);
+const MainContentWrapper = /*#__PURE__*/FoundationStyled.div.withConfig({
+  displayName: "Selectstyled__MainContentWrapper",
+  componentId: "sc-r4extr-2"
+})(["display:flex;align-items:center;overflow:hidden;"]);
+const Dropdown = /*#__PURE__*/FoundationStyled(Overlay).withConfig({
+  displayName: "Selectstyled__Dropdown",
+  componentId: "sc-r4extr-3"
+})(["z-index:", ";min-width:200px;min-height:42px;max-height:640px;", ";", ";", ""], ({
+  zIndex
+}) => zIndex, ({
+  foundation
+}) => foundation?.rounding?.round8, ({
+  foundation
+}) => foundation?.elevation?.ev3(), ({
+  interpolation
+}) => interpolation);
+
+export { Container, Dropdown, MainContentWrapper, Trigger };
+//# sourceMappingURL=Select.styled.mjs.map

package/dist/esm/components/Forms/Inputs/Select/Select.styled.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.styled.mjs","sources":["../../../../../../src/components/Forms/Inputs/Select/Select.styled.ts"],"sourcesContent":["import {\n  css,\n  styled,\n} from '~/src/foundation'\n\nimport DisabledOpacity from '~/src/constants/DisabledOpacity'\nimport type { InterpolationProps } from '~/src/types/Foundation'\n\nimport {\n  erroredInputWrapperStyle,\n  focusedInputWrapperStyle,\n  inputTextStyle,\n  inputWrapperStyle,\n} from '~/src/components/Forms/Inputs/mixins'\nimport { Overlay } from '~/src/components/Overlay'\n\nimport { type SelectSize } from './Select.types'\n\nexport const Container = styled.div<InterpolationProps>`\n  position: relative;\n\n  ${({ interpolation }) => interpolation};\n`\n\ninterface TriggerProps {\n  hasError: boolean\n  disabled: boolean\n  readOnly: boolean\n  active: boolean\n  size: SelectSize\n}\n\nconst focusedStyle = css`\n  ${focusedInputWrapperStyle};\n  background-color: ${({ foundation }) => foundation?.theme?.['bg-grey-lighter']};\n`\n\nexport const Trigger = styled.button<TriggerProps>`\n  all: unset;\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: ${({ size }) => size}px;\n  padding: 8px 12px;\n  cursor: pointer;\n  user-select: none;\n  background-color: ${({ foundation }) => foundation?.theme?.['bg-grey-lightest']};\n\n  ${inputTextStyle}\n\n  ${inputWrapperStyle}\n\n  ${({ foundation }) => foundation?.rounding?.round8}\n\n  ${({ foundation }) => foundation?.transition?.getTransitionsCSS(['background-color', 'box-shadow'])}\n\n  ${({ active }) => active && focusedStyle}\n\n  ${({ hasError }) => hasError && erroredInputWrapperStyle}\n\n  ${({ readOnly }) => readOnly && css`\n    cursor: initial;\n    background-color: ${({ foundation }) => foundation?.theme?.['bg-grey-lighter']};\n  `}\n\n  &:disabled {\n    cursor: not-allowed;\n    opacity: ${DisabledOpacity};\n  }\n\n  &:not(:disabled):focus {\n    ${focusedStyle}\n  }\n\n  ${({ readOnly }) => !readOnly && css`\n    &:not(:disabled):hover {\n      background-color: ${({ foundation }) => foundation?.theme?.['bg-grey-lighter']};\n    }\n  `}\n`\n\nexport const MainContentWrapper = styled.div`\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n`\n\ninterface DropdownProps extends InterpolationProps {\n  zIndex: number\n}\n\nexport const Dropdown = styled(Overlay)<DropdownProps>`\n  z-index: ${({ zIndex }) => zIndex};\n  min-width: 200px;\n  min-height: 42px;\n  max-height: 640px;\n\n  ${({ foundation }) => foundation?.rounding?.round8};\n  ${({ foundation }) => foundation?.elevation?.ev3()};\n\n  ${({ interpolation }) => interpolation}\n`\n"],"names":["Container","styled","div","withConfig","displayName","componentId","interpolation","focusedStyle","css","focusedInputWrapperStyle","foundation","theme","Trigger","button","size","inputTextStyle","inputWrapperStyle","rounding","round8","transition","getTransitionsCSS","active","hasError","erroredInputWrapperStyle","readOnly","DisabledOpacity","MainContentWrapper","Dropdown","Overlay","zIndex","elevation","ev3"],"mappings":"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"}

package/dist/esm/components/Forms/Inputs/Select/Select.types.mjs

@@ -0,0 +1,12 @@
+import FormFieldSize from '../../FormFieldSize.mjs';
+
+let SelectSize = function (SelectSize) {
+  SelectSize[SelectSize["XL"] = FormFieldSize.XL] = "XL";
+  SelectSize[SelectSize["L"] = FormFieldSize.L] = "L";
+  SelectSize[SelectSize["M"] = FormFieldSize.M] = "M";
+  SelectSize[SelectSize["S"] = FormFieldSize.XS] = "S";
+  return SelectSize;
+}({});
+
+export { SelectSize };
+//# sourceMappingURL=Select.types.mjs.map

package/dist/esm/components/Forms/Inputs/Select/Select.types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.types.mjs","sources":["../../../../../../src/components/Forms/Inputs/Select/Select.types.ts"],"sourcesContent":["import { type BezierIcon } from '@channel.io/bezier-icons'\n\nimport type {\n  AdditionalColorProps,\n  AdditionalStylableProps,\n  AdditionalTestIdProps,\n  BezierComponentProps,\n  ChildrenProps,\n  SideContentProps,\n  SizeProps,\n} from '~/src/types/ComponentProps'\n\nimport type { FormComponentProps } from '~/src/components/Forms'\nimport { FormFieldSize } from '~/src/components/Forms'\nimport type { OverlayProps } from '~/src/components/Overlay'\n\nexport enum SelectSize {\n  XL = FormFieldSize.XL,\n  L = FormFieldSize.L,\n  M = FormFieldSize.M,\n  S = FormFieldSize.XS,\n}\n\nexport interface SelectRef {\n  handleClickTrigger(event: React.MouseEvent): void\n  handleHideDropdown(): void\n  getDOMNode(): Element | Text | null\n}\n\ninterface SelectOptions {\n  defaultFocus?: boolean\n  placeholder?: string\n  text?: string\n  withoutChevron?: boolean\n  dropdownContainer?: HTMLElement | null\n  dropdownMarginX?: OverlayProps['marginX']\n  dropdownMarginY?: OverlayProps['marginY']\n  dropdownZIndex?: number\n  dropdownPosition?: OverlayProps['position']\n  onClickTrigger?: React.MouseEventHandler\n  onHideDropdown?: () => void\n}\n\ninterface SelectProps extends\n  BezierComponentProps,\n  ChildrenProps,\n  SizeProps<SelectSize>,\n  SideContentProps<BezierIcon | React.ReactNode, BezierIcon | React.ReactNode>,\n  AdditionalTestIdProps<['trigger', 'triggerText', 'dropdown']>,\n  AdditionalStylableProps<'dropdown'>,\n  AdditionalColorProps<['icon', 'text']>,\n  FormComponentProps,\n  SelectOptions {}\n\nexport default SelectProps\n"],"names":["SelectSize","FormFieldSize","XL","L","M","XS"],"mappings":";;AAgBYA,IAAAA,UAAU,aAAVA,UAAU,EAAA;AAAVA,EAAAA,UAAU,CAAVA,UAAU,CACfC,IAAAA,CAAAA,GAAAA,aAAa,CAACC,EAAE,CAAA,GAAA,IAAA,CAAA;AADXF,EAAAA,UAAU,CAAVA,UAAU,CAEhBC,GAAAA,CAAAA,GAAAA,aAAa,CAACE,CAAC,CAAA,GAAA,GAAA,CAAA;AAFTH,EAAAA,UAAU,CAAVA,UAAU,CAGhBC,GAAAA,CAAAA,GAAAA,aAAa,CAACG,CAAC,CAAA,GAAA,GAAA,CAAA;AAHTJ,EAAAA,UAAU,CAAVA,UAAU,CAIhBC,GAAAA,CAAAA,GAAAA,aAAa,CAACI,EAAE,CAAA,GAAA,GAAA,CAAA;AAAA,EAAA,OAJVL,UAAU,CAAA;AAAA,CAAA,CAAA,EAAA;;;;"}