@tecsinapse/react-core 1.21.1-beta.1 → 1.21.1-beta.3

package/dist/components/molecules/Calendar/components/Weekdays.mjs

@@ -0,0 +1,23 @@
+import React__default from 'react';
+import { Week, Cell } from '../styled.mjs';
+import { format } from 'date-fns';
+
+const Weekdays = ({ calendar, locale, Capitalized }) => {
+  return /* @__PURE__ */ React__default.createElement(Week, null, calendar[0].map((date) => /* @__PURE__ */ React__default.createElement(Cell, {
+    key: date.getDate(),
+    selected: false,
+    highlighted: false,
+    isLineEnd: false,
+    isLineStart: false,
+    isRangeStart: false,
+    isRangeEnd: false,
+    pointerEvents: "none"
+  }, /* @__PURE__ */ React__default.createElement(Capitalized, {
+    colorVariant: "secondary",
+    colorTone: "medium"
+  }, format(date, "EEE", { locale }).slice(0, 3)))));
+};
+var Weekdays$1 = React__default.memo(Weekdays);
+
+export { Weekdays$1 as default };
+//# sourceMappingURL=Weekdays.mjs.map

package/dist/components/molecules/Calendar/components/Weekdays.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Weekdays.mjs","sources":["../../../../../src/components/molecules/Calendar/components/Weekdays.tsx"],"sourcesContent":["import React from 'react';\nimport { Cell, Week } from '../styled';\nimport { format } from 'date-fns';\n\ninterface IWeekdays {\n  calendar: Date[][];\n  locale?: Locale;\n  Capitalized: React.ElementType;\n}\n\nconst Weekdays = ({ calendar, locale, Capitalized }: IWeekdays) => {\n  return (\n    <Week>\n      {calendar[0].map(date => (\n        <Cell\n          key={date.getDate()}\n          selected={false}\n          highlighted={false}\n          isLineEnd={false}\n          isLineStart={false}\n          isRangeStart={false}\n          isRangeEnd={false}\n          pointerEvents={'none'}\n        >\n          <Capitalized colorVariant={'secondary'} colorTone={'medium'}>\n            {format(date, 'EEE', { locale }).slice(0, 3)}\n          </Capitalized>\n        </Cell>\n      ))}\n    </Week>\n  );\n};\n\nexport default React.memo(Weekdays);\n"],"names":["React"],"mappings":";;;;AAUA,MAAM,WAAW,CAAC,EAAE,QAAU,EAAA,MAAA,EAAQ,aAA6B,KAAA;AACjE,EAAA,oDACG,IACE,EAAA,IAAA,EAAA,QAAA,CAAS,CAAG,CAAA,CAAA,GAAA,CAAI,0BACdA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IACC,GAAA,EAAK,KAAK,OAAQ,EAAA;AAAA,IAClB,QAAU,EAAA,KAAA;AAAA,IACV,WAAa,EAAA,KAAA;AAAA,IACb,SAAW,EAAA,KAAA;AAAA,IACX,WAAa,EAAA,KAAA;AAAA,IACb,YAAc,EAAA,KAAA;AAAA,IACd,UAAY,EAAA,KAAA;AAAA,IACZ,aAAe,EAAA,MAAA;AAAA,GAAA,kBAEdA,cAAA,CAAA,aAAA,CAAA,WAAA,EAAA;AAAA,IAAY,YAAc,EAAA,WAAA;AAAA,IAAa,SAAW,EAAA,QAAA;AAAA,GAAA,EAChD,MAAO,CAAA,IAAA,EAAM,KAAO,EAAA,EAAE,MAAO,EAAC,CAAE,CAAA,KAAA,CAAM,CAAG,EAAA,CAAC,CAC7C,CACF,CACD,CACH,CAAA,CAAA;AAEJ,CAAA,CAAA;AAEA,iBAAeA,cAAA,CAAM,KAAK,QAAQ,CAAA;;;;"}

package/dist/components/molecules/Calendar/styled.cjs

@@ -0,0 +1,97 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styled = require('@emotion/native');
+var reactNative = require('react-native');
+var PressableSurface = require('../../atoms/PressableSurface/PressableSurface.cjs');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+const isWeb = reactNative.Platform.OS === "web";
+const TitleContainer = styled__default["default"].View`
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  background-color: ${({ theme }) => theme.color.secondary.xlight};
+`;
+const Control = styled__default["default"](PressableSurface)(
+  (props) => {
+    var _a, _b, _c;
+    return styled.css`
+    align-items: flex-${props.align};
+    padding: ${(_a = props.theme) == null ? void 0 : _a.spacing.centi};
+    border-radius: ${(_b = props.theme) == null ? void 0 : _b.borderRadius.mili};
+    margin: ${(_c = props.theme) == null ? void 0 : _c.spacing.mili};
+  `;
+  }
+);
+const getCapitalizedTextComponent = (component) => {
+  return styled__default["default"](component)`
+    text-transform: capitalize;
+  `;
+};
+const Content = styled__default["default"].View`
+  padding: ${({ theme }) => theme.spacing.deca};
+  background-color: ${({ theme }) => theme.miscellaneous.surfaceColor};
+`;
+const Week = styled__default["default"].View`
+  flex-direction: row;
+`;
+const Selected = styled__default["default"].View`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: ${({ theme, selected }) => selected ? theme.color.primary.medium : "transparent"};
+  border-radius: ${({ theme }) => theme.borderRadius.mili};
+  width: 100%;
+  height: 100%;
+`;
+const Cell = styled__default["default"](PressableSurface)(
+  ({
+    theme,
+    selected,
+    highlighted,
+    isLineEnd,
+    isLineStart,
+    isRangeStart,
+    isRangeEnd
+  }) => {
+    const borderRadiusSize = theme.borderRadius.mili;
+    const { rightBorderRadius, leftBorderRadius } = {
+      rightBorderRadius: selected && !isRangeStart || isLineEnd ? borderRadiusSize : 0,
+      leftBorderRadius: selected && !isRangeEnd || isLineStart ? borderRadiusSize : 0
+    };
+    const borderEffect = highlighted ? 0 : borderRadiusSize;
+    const backgroundColor = highlighted ? theme.color.primary.light : "transparent";
+    return styled.css`
+      ${isWeb ? styled.css`
+            width: 32px;
+            height: 32px;
+          ` : styled.css`
+            aspect-ratio: 1;
+            flex: 1;
+          `}
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      border-radius: ${borderEffect};
+      border-top-left-radius: ${leftBorderRadius};
+      border-bottom-left-radius: ${leftBorderRadius};
+      border-top-right-radius: ${rightBorderRadius};
+      border-bottom-right-radius: ${rightBorderRadius};
+      background-color: ${backgroundColor};
+    `;
+  }
+);
+
+exports.Cell = Cell;
+exports.Content = Content;
+exports.Control = Control;
+exports.Selected = Selected;
+exports.TitleContainer = TitleContainer;
+exports.Week = Week;
+exports.getCapitalizedTextComponent = getCapitalizedTextComponent;
+//# sourceMappingURL=styled.cjs.map

package/dist/components/molecules/Calendar/styled.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.cjs","sources":["../../../../src/components/molecules/Calendar/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { Platform, PressableProps, ViewProps } from 'react-native';\nimport { StyleProps } from '../../../types/defaults';\nimport { PressableSurface } from '../../atoms/PressableSurface';\nimport { TextProps } from '../../atoms/Text';\n\nconst isWeb = Platform.OS === 'web';\n\ninterface ButtonBorders {\n  isLeft?: boolean;\n  isRright?: boolean;\n}\n\nexport const TitleContainer = styled.View<Partial<StyleProps>>`\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  background-color: ${({ theme }) => theme.color.secondary.xlight};\n`;\n\nexport const Control = styled(PressableSurface)(\n  (\n    props: Partial<StyleProps> & ButtonBorders & { align: 'start' | 'end' }\n  ) => css`\n    align-items: flex-${props.align};\n    padding: ${props.theme?.spacing.centi};\n    border-radius: ${props.theme?.borderRadius.mili};\n    margin: ${props.theme?.spacing.mili};\n  `\n);\n\nexport const getCapitalizedTextComponent = (component: FC<TextProps>) => {\n  return styled(component)`\n    text-transform: capitalize;\n  `;\n};\n\nexport const Content = styled.View<ViewProps & Partial<StyleProps>>`\n  padding: ${({ theme }) => theme.spacing.deca};\n  background-color: ${({ theme }) => theme.miscellaneous.surfaceColor};\n`;\n\nexport const Week = styled.View<Partial<StyleProps>>`\n  flex-direction: row;\n`;\n\nexport const Selected = styled.View<\n  Partial<StyleProps> & { selected: boolean }\n>`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: ${({ theme, selected }) =>\n    selected ? theme.color.primary.medium : 'transparent'};\n  border-radius: ${({ theme }) => theme.borderRadius.mili};\n  width: 100%;\n  height: 100%;\n`;\n\nexport const Cell = styled(PressableSurface)<\n  PressableProps &\n    Partial<StyleProps> & {\n      selected: boolean;\n      highlighted: boolean;\n      isLineEnd: boolean;\n      isLineStart: boolean;\n      isRangeStart: boolean;\n      isRangeEnd: boolean;\n    }\n>(\n  ({\n    theme,\n    selected,\n    highlighted,\n    isLineEnd,\n    isLineStart,\n    isRangeStart,\n    isRangeEnd,\n  }) => {\n    const borderRadiusSize = theme.borderRadius.mili;\n\n    const { rightBorderRadius, leftBorderRadius } = {\n      rightBorderRadius:\n        (selected && !isRangeStart) || isLineEnd ? borderRadiusSize : 0,\n      leftBorderRadius:\n        (selected && !isRangeEnd) || isLineStart ? borderRadiusSize : 0,\n    };\n\n    const borderEffect = highlighted ? 0 : borderRadiusSize;\n\n    const backgroundColor = highlighted\n      ? theme.color.primary.light\n      : 'transparent';\n\n    return css`\n      ${isWeb\n        ? css`\n            width: 32px;\n            height: 32px;\n          `\n        : css`\n            aspect-ratio: 1;\n            flex: 1;\n          `}\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      border-radius: ${borderEffect};\n      border-top-left-radius: ${leftBorderRadius};\n      border-bottom-left-radius: ${leftBorderRadius};\n      border-top-right-radius: ${rightBorderRadius};\n      border-bottom-right-radius: ${rightBorderRadius};\n      background-color: ${backgroundColor};\n    `;\n  }\n);\n"],"names":["Platform","styled","css"],"mappings":"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"}

package/dist/components/molecules/Calendar/styled.mjs

@@ -0,0 +1,83 @@
+import styled, { css } from '@emotion/native';
+import { Platform } from 'react-native';
+import PressableSurface from '../../atoms/PressableSurface/PressableSurface.mjs';
+
+const isWeb = Platform.OS === "web";
+const TitleContainer = styled.View`
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  background-color: ${({ theme }) => theme.color.secondary.xlight};
+`;
+const Control = styled(PressableSurface)(
+  (props) => {
+    var _a, _b, _c;
+    return css`
+    align-items: flex-${props.align};
+    padding: ${(_a = props.theme) == null ? void 0 : _a.spacing.centi};
+    border-radius: ${(_b = props.theme) == null ? void 0 : _b.borderRadius.mili};
+    margin: ${(_c = props.theme) == null ? void 0 : _c.spacing.mili};
+  `;
+  }
+);
+const getCapitalizedTextComponent = (component) => {
+  return styled(component)`
+    text-transform: capitalize;
+  `;
+};
+const Content = styled.View`
+  padding: ${({ theme }) => theme.spacing.deca};
+  background-color: ${({ theme }) => theme.miscellaneous.surfaceColor};
+`;
+const Week = styled.View`
+  flex-direction: row;
+`;
+const Selected = styled.View`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: ${({ theme, selected }) => selected ? theme.color.primary.medium : "transparent"};
+  border-radius: ${({ theme }) => theme.borderRadius.mili};
+  width: 100%;
+  height: 100%;
+`;
+const Cell = styled(PressableSurface)(
+  ({
+    theme,
+    selected,
+    highlighted,
+    isLineEnd,
+    isLineStart,
+    isRangeStart,
+    isRangeEnd
+  }) => {
+    const borderRadiusSize = theme.borderRadius.mili;
+    const { rightBorderRadius, leftBorderRadius } = {
+      rightBorderRadius: selected && !isRangeStart || isLineEnd ? borderRadiusSize : 0,
+      leftBorderRadius: selected && !isRangeEnd || isLineStart ? borderRadiusSize : 0
+    };
+    const borderEffect = highlighted ? 0 : borderRadiusSize;
+    const backgroundColor = highlighted ? theme.color.primary.light : "transparent";
+    return css`
+      ${isWeb ? css`
+            width: 32px;
+            height: 32px;
+          ` : css`
+            aspect-ratio: 1;
+            flex: 1;
+          `}
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      border-radius: ${borderEffect};
+      border-top-left-radius: ${leftBorderRadius};
+      border-bottom-left-radius: ${leftBorderRadius};
+      border-top-right-radius: ${rightBorderRadius};
+      border-bottom-right-radius: ${rightBorderRadius};
+      background-color: ${backgroundColor};
+    `;
+  }
+);
+
+export { Cell, Content, Control, Selected, TitleContainer, Week, getCapitalizedTextComponent };
+//# sourceMappingURL=styled.mjs.map

package/dist/components/molecules/Calendar/styled.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.mjs","sources":["../../../../src/components/molecules/Calendar/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { Platform, PressableProps, ViewProps } from 'react-native';\nimport { StyleProps } from '../../../types/defaults';\nimport { PressableSurface } from '../../atoms/PressableSurface';\nimport { TextProps } from '../../atoms/Text';\n\nconst isWeb = Platform.OS === 'web';\n\ninterface ButtonBorders {\n  isLeft?: boolean;\n  isRright?: boolean;\n}\n\nexport const TitleContainer = styled.View<Partial<StyleProps>>`\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  background-color: ${({ theme }) => theme.color.secondary.xlight};\n`;\n\nexport const Control = styled(PressableSurface)(\n  (\n    props: Partial<StyleProps> & ButtonBorders & { align: 'start' | 'end' }\n  ) => css`\n    align-items: flex-${props.align};\n    padding: ${props.theme?.spacing.centi};\n    border-radius: ${props.theme?.borderRadius.mili};\n    margin: ${props.theme?.spacing.mili};\n  `\n);\n\nexport const getCapitalizedTextComponent = (component: FC<TextProps>) => {\n  return styled(component)`\n    text-transform: capitalize;\n  `;\n};\n\nexport const Content = styled.View<ViewProps & Partial<StyleProps>>`\n  padding: ${({ theme }) => theme.spacing.deca};\n  background-color: ${({ theme }) => theme.miscellaneous.surfaceColor};\n`;\n\nexport const Week = styled.View<Partial<StyleProps>>`\n  flex-direction: row;\n`;\n\nexport const Selected = styled.View<\n  Partial<StyleProps> & { selected: boolean }\n>`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: ${({ theme, selected }) =>\n    selected ? theme.color.primary.medium : 'transparent'};\n  border-radius: ${({ theme }) => theme.borderRadius.mili};\n  width: 100%;\n  height: 100%;\n`;\n\nexport const Cell = styled(PressableSurface)<\n  PressableProps &\n    Partial<StyleProps> & {\n      selected: boolean;\n      highlighted: boolean;\n      isLineEnd: boolean;\n      isLineStart: boolean;\n      isRangeStart: boolean;\n      isRangeEnd: boolean;\n    }\n>(\n  ({\n    theme,\n    selected,\n    highlighted,\n    isLineEnd,\n    isLineStart,\n    isRangeStart,\n    isRangeEnd,\n  }) => {\n    const borderRadiusSize = theme.borderRadius.mili;\n\n    const { rightBorderRadius, leftBorderRadius } = {\n      rightBorderRadius:\n        (selected && !isRangeStart) || isLineEnd ? borderRadiusSize : 0,\n      leftBorderRadius:\n        (selected && !isRangeEnd) || isLineStart ? borderRadiusSize : 0,\n    };\n\n    const borderEffect = highlighted ? 0 : borderRadiusSize;\n\n    const backgroundColor = highlighted\n      ? theme.color.primary.light\n      : 'transparent';\n\n    return css`\n      ${isWeb\n        ? css`\n            width: 32px;\n            height: 32px;\n          `\n        : css`\n            aspect-ratio: 1;\n            flex: 1;\n          `}\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      border-radius: ${borderEffect};\n      border-top-left-radius: ${leftBorderRadius};\n      border-bottom-left-radius: ${leftBorderRadius};\n      border-top-right-radius: ${rightBorderRadius};\n      border-bottom-right-radius: ${rightBorderRadius};\n      background-color: ${backgroundColor};\n    `;\n  }\n);\n"],"names":[],"mappings":"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"}

package/dist/components/molecules/DatePicker/DatePicker.cjs

@@ -0,0 +1,177 @@
+'use strict';
+
+var dateFns = require('date-fns');
+var React = require('react');
+var Text = require('../../atoms/Text/Text.cjs');
+require('../../atoms/Input/styled.cjs');
+var useInputFocus = require('../../atoms/Input/hooks/useInputFocus.cjs');
+require('currency.js');
+require('../../atoms/Input/InputElement/InputElement.cjs');
+require('../../atoms/Input/InputMaskElement/InputMaskElement.cjs');
+require('../../atoms/Input/PressableInputContainer/styled.cjs');
+var HintInputContainer = require('../HintInputContainer/HintInputContainer.cjs');
+var styled = require('./styled.cjs');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+function DatePicker(_a) {
+  var _b = _a, {
+    month,
+    year,
+    onChange,
+    value,
+    type,
+    format = "yyyy-MM-dd",
+    placeholder,
+    onFocus,
+    onBlur,
+    disabled,
+    controlComponent,
+    hintComponent,
+    hint,
+    variant,
+    TextComponent = Text,
+    CalendarComponent,
+    rightComponent,
+    style,
+    locale,
+    closeOnPick = false,
+    renderCalendar,
+    requestShowCalendar,
+    requestCloseCalendar
+  } = _b, rest = __objRest(_b, [
+    "month",
+    "year",
+    "onChange",
+    "value",
+    "type",
+    "format",
+    "placeholder",
+    "onFocus",
+    "onBlur",
+    "disabled",
+    "controlComponent",
+    "hintComponent",
+    "hint",
+    "variant",
+    "TextComponent",
+    "CalendarComponent",
+    "rightComponent",
+    "style",
+    "locale",
+    "closeOnPick",
+    "renderCalendar",
+    "requestShowCalendar",
+    "requestCloseCalendar"
+  ]);
+  const { focused, handleBlur, handleFocus } = useInputFocus.useInputFocus(
+    onFocus,
+    onBlur,
+    !disabled
+  );
+  const handleShowCalendar = React__namespace.useCallback(() => {
+    requestShowCalendar();
+    handleFocus();
+  }, [handleFocus, requestShowCalendar]);
+  const getDisplayValue = () => {
+    if (!value)
+      return placeholder;
+    if (type === "day") {
+      return dateFns.format(value, format, { locale });
+    } else {
+      const { lowest, highest } = value;
+      if (highest)
+        return `${dateFns.format(lowest, format, {
+          locale
+        })} - ${dateFns.format(highest, format, { locale })}`;
+      else
+        return dateFns.format(lowest, format, { locale });
+    }
+  };
+  const StyledText = styled.getStyledTextComponent(TextComponent);
+  React.useEffect(() => {
+    if (closeOnPick && value && type === "day") {
+      setTimeout(requestCloseCalendar, 200);
+    }
+    if (closeOnPick && value && type === "range") {
+      const { lowest, highest } = value;
+      lowest && highest && setTimeout(requestCloseCalendar, 200);
+    }
+  }, [value, closeOnPick, type, requestCloseCalendar]);
+  const calendar = /* @__PURE__ */ React__namespace.createElement(CalendarComponent, {
+    pointerEvents: "box-none",
+    type,
+    value,
+    month,
+    year,
+    onChange,
+    locale
+  });
+  return /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, controlComponent ? controlComponent(handleShowCalendar, getDisplayValue()) : /* @__PURE__ */ React__namespace.createElement(HintInputContainer, __spreadValues({
+    focused,
+    viewStyle: style,
+    onPress: handleShowCalendar,
+    disabled,
+    hintComponent,
+    LabelComponent: TextComponent,
+    variant,
+    hint,
+    rightComponent: /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, /* @__PURE__ */ React__namespace.createElement(styled.CalendarIcon, {
+      name: "calendar-sharp",
+      type: "ionicon",
+      size: "centi"
+    }), rightComponent)
+  }, rest), /* @__PURE__ */ React__namespace.createElement(StyledText, {
+    fontWeight: "bold",
+    disabled
+  }, getDisplayValue() || " ")), renderCalendar(calendar, handleBlur));
+}
+
+module.exports = DatePicker;
+//# sourceMappingURL=DatePicker.cjs.map

package/dist/components/molecules/DatePicker/DatePicker.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.cjs","sources":["../../../../src/components/molecules/DatePicker/DatePicker.tsx"],"sourcesContent":["import { format as formatDate } from 'date-fns';\nimport * as React from 'react';\nimport { useEffect } from 'react';\nimport { InputContainerProps, useInputFocus } from '../../atoms/Input';\nimport { Text, TextProps } from '../../atoms/Text';\nimport { CalendarProps, DateRange, SelectionType } from '../Calendar';\nimport { HintInputContainer } from '../HintInputContainer';\nimport { CalendarIcon, getStyledTextComponent } from './styled';\n\nexport interface DatePickerProps<T extends SelectionType>\n  extends InputContainerProps,\n    Omit<CalendarProps<T>, 'style'> {\n  controlComponent?: (\n    onPress: () => void,\n    displayValue?: string\n  ) => JSX.Element;\n  TextComponent?: React.FC<TextProps>;\n  CalendarComponent: React.FC<CalendarProps<T>>;\n  placeholder?: string;\n  onFocus?: () => void | never;\n  onBlur?: () => void | never;\n  format?: string;\n  closeOnPick?: boolean;\n  renderCalendar: (\n    calendar: React.ReactElement,\n    blur?: () => void\n  ) => JSX.Element | null;\n  requestShowCalendar: () => void;\n  requestCloseCalendar: () => void;\n}\n\nfunction DatePicker<T extends SelectionType>({\n  /** DatePicker props */\n  month,\n  year,\n  onChange,\n  value,\n  type,\n  format = 'yyyy-MM-dd',\n  placeholder,\n  onFocus,\n  onBlur,\n  disabled,\n  controlComponent,\n  hintComponent,\n  hint,\n  variant,\n  TextComponent = Text,\n  CalendarComponent,\n  rightComponent,\n  style,\n  locale,\n  closeOnPick = false,\n  renderCalendar,\n  requestShowCalendar,\n  requestCloseCalendar,\n  ...rest\n}: DatePickerProps<T>): JSX.Element {\n  const { focused, handleBlur, handleFocus } = useInputFocus(\n    onFocus,\n    onBlur,\n    !disabled\n  );\n\n  const handleShowCalendar = React.useCallback(() => {\n    requestShowCalendar();\n    handleFocus();\n  }, [handleFocus, requestShowCalendar]);\n\n  const getDisplayValue = () => {\n    if (!value) return placeholder;\n    if (type === 'day') {\n      return formatDate(value as Date, format, { locale: locale });\n    } else {\n      const { lowest, highest } = value as DateRange;\n      if (highest)\n        return `${formatDate(lowest, format, {\n          locale: locale,\n        })} - ${formatDate(highest, format, { locale: locale })}`;\n      else return formatDate(lowest, format, { locale: locale });\n    }\n  };\n\n  const StyledText = getStyledTextComponent(TextComponent);\n\n  useEffect(() => {\n    if (closeOnPick && value && type === 'day') {\n      setTimeout(requestCloseCalendar, 200);\n    }\n    if (closeOnPick && value && type === 'range') {\n      const { lowest, highest } = value as DateRange;\n      lowest && highest && setTimeout(requestCloseCalendar, 200);\n    }\n  }, [value, closeOnPick, type, requestCloseCalendar]);\n\n  const calendar = (\n    <CalendarComponent\n      pointerEvents={'box-none'}\n      type={type}\n      value={value}\n      month={month}\n      year={year}\n      onChange={onChange}\n      locale={locale}\n    />\n  );\n\n  return (\n    <>\n      {controlComponent ? (\n        controlComponent(handleShowCalendar, getDisplayValue())\n      ) : (\n        <HintInputContainer\n          focused={focused}\n          viewStyle={style}\n          onPress={handleShowCalendar}\n          disabled={disabled}\n          hintComponent={hintComponent}\n          LabelComponent={TextComponent}\n          variant={variant}\n          hint={hint}\n          rightComponent={\n            <>\n              <CalendarIcon name=\"calendar-sharp\" type=\"ionicon\" size=\"centi\" />\n              {rightComponent}\n            </>\n          }\n          {...rest}\n        >\n          <StyledText fontWeight=\"bold\" disabled={disabled}>\n            {getDisplayValue() || ' '}\n          </StyledText>\n        </HintInputContainer>\n      )}\n      {renderCalendar(calendar, handleBlur)}\n    </>\n  );\n}\n\nexport default DatePicker;\n"],"names":["useInputFocus","React","formatDate","getStyledTextComponent","useEffect","CalendarIcon"],"mappings":"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"}

package/dist/components/molecules/DatePicker/DatePicker.mjs

@@ -0,0 +1,156 @@
+import { format } from 'date-fns';
+import * as React from 'react';
+import { useEffect } from 'react';
+import Text from '../../atoms/Text/Text.mjs';
+import '../../atoms/Input/styled.mjs';
+import { useInputFocus } from '../../atoms/Input/hooks/useInputFocus.mjs';
+import 'currency.js';
+import '../../atoms/Input/InputElement/InputElement.mjs';
+import '../../atoms/Input/InputMaskElement/InputMaskElement.mjs';
+import '../../atoms/Input/PressableInputContainer/styled.mjs';
+import HintInputContainer from '../HintInputContainer/HintInputContainer.mjs';
+import { getStyledTextComponent, CalendarIcon } from './styled.mjs';
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+function DatePicker(_a) {
+  var _b = _a, {
+    month,
+    year,
+    onChange,
+    value,
+    type,
+    format: format$1 = "yyyy-MM-dd",
+    placeholder,
+    onFocus,
+    onBlur,
+    disabled,
+    controlComponent,
+    hintComponent,
+    hint,
+    variant,
+    TextComponent = Text,
+    CalendarComponent,
+    rightComponent,
+    style,
+    locale,
+    closeOnPick = false,
+    renderCalendar,
+    requestShowCalendar,
+    requestCloseCalendar
+  } = _b, rest = __objRest(_b, [
+    "month",
+    "year",
+    "onChange",
+    "value",
+    "type",
+    "format",
+    "placeholder",
+    "onFocus",
+    "onBlur",
+    "disabled",
+    "controlComponent",
+    "hintComponent",
+    "hint",
+    "variant",
+    "TextComponent",
+    "CalendarComponent",
+    "rightComponent",
+    "style",
+    "locale",
+    "closeOnPick",
+    "renderCalendar",
+    "requestShowCalendar",
+    "requestCloseCalendar"
+  ]);
+  const { focused, handleBlur, handleFocus } = useInputFocus(
+    onFocus,
+    onBlur,
+    !disabled
+  );
+  const handleShowCalendar = React.useCallback(() => {
+    requestShowCalendar();
+    handleFocus();
+  }, [handleFocus, requestShowCalendar]);
+  const getDisplayValue = () => {
+    if (!value)
+      return placeholder;
+    if (type === "day") {
+      return format(value, format$1, { locale });
+    } else {
+      const { lowest, highest } = value;
+      if (highest)
+        return `${format(lowest, format$1, {
+          locale
+        })} - ${format(highest, format$1, { locale })}`;
+      else
+        return format(lowest, format$1, { locale });
+    }
+  };
+  const StyledText = getStyledTextComponent(TextComponent);
+  useEffect(() => {
+    if (closeOnPick && value && type === "day") {
+      setTimeout(requestCloseCalendar, 200);
+    }
+    if (closeOnPick && value && type === "range") {
+      const { lowest, highest } = value;
+      lowest && highest && setTimeout(requestCloseCalendar, 200);
+    }
+  }, [value, closeOnPick, type, requestCloseCalendar]);
+  const calendar = /* @__PURE__ */ React.createElement(CalendarComponent, {
+    pointerEvents: "box-none",
+    type,
+    value,
+    month,
+    year,
+    onChange,
+    locale
+  });
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, controlComponent ? controlComponent(handleShowCalendar, getDisplayValue()) : /* @__PURE__ */ React.createElement(HintInputContainer, __spreadValues({
+    focused,
+    viewStyle: style,
+    onPress: handleShowCalendar,
+    disabled,
+    hintComponent,
+    LabelComponent: TextComponent,
+    variant,
+    hint,
+    rightComponent: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(CalendarIcon, {
+      name: "calendar-sharp",
+      type: "ionicon",
+      size: "centi"
+    }), rightComponent)
+  }, rest), /* @__PURE__ */ React.createElement(StyledText, {
+    fontWeight: "bold",
+    disabled
+  }, getDisplayValue() || " ")), renderCalendar(calendar, handleBlur));
+}
+
+export { DatePicker as default };
+//# sourceMappingURL=DatePicker.mjs.map

package/dist/components/molecules/DatePicker/DatePicker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.mjs","sources":["../../../../src/components/molecules/DatePicker/DatePicker.tsx"],"sourcesContent":["import { format as formatDate } from 'date-fns';\nimport * as React from 'react';\nimport { useEffect } from 'react';\nimport { InputContainerProps, useInputFocus } from '../../atoms/Input';\nimport { Text, TextProps } from '../../atoms/Text';\nimport { CalendarProps, DateRange, SelectionType } from '../Calendar';\nimport { HintInputContainer } from '../HintInputContainer';\nimport { CalendarIcon, getStyledTextComponent } from './styled';\n\nexport interface DatePickerProps<T extends SelectionType>\n  extends InputContainerProps,\n    Omit<CalendarProps<T>, 'style'> {\n  controlComponent?: (\n    onPress: () => void,\n    displayValue?: string\n  ) => JSX.Element;\n  TextComponent?: React.FC<TextProps>;\n  CalendarComponent: React.FC<CalendarProps<T>>;\n  placeholder?: string;\n  onFocus?: () => void | never;\n  onBlur?: () => void | never;\n  format?: string;\n  closeOnPick?: boolean;\n  renderCalendar: (\n    calendar: React.ReactElement,\n    blur?: () => void\n  ) => JSX.Element | null;\n  requestShowCalendar: () => void;\n  requestCloseCalendar: () => void;\n}\n\nfunction DatePicker<T extends SelectionType>({\n  /** DatePicker props */\n  month,\n  year,\n  onChange,\n  value,\n  type,\n  format = 'yyyy-MM-dd',\n  placeholder,\n  onFocus,\n  onBlur,\n  disabled,\n  controlComponent,\n  hintComponent,\n  hint,\n  variant,\n  TextComponent = Text,\n  CalendarComponent,\n  rightComponent,\n  style,\n  locale,\n  closeOnPick = false,\n  renderCalendar,\n  requestShowCalendar,\n  requestCloseCalendar,\n  ...rest\n}: DatePickerProps<T>): JSX.Element {\n  const { focused, handleBlur, handleFocus } = useInputFocus(\n    onFocus,\n    onBlur,\n    !disabled\n  );\n\n  const handleShowCalendar = React.useCallback(() => {\n    requestShowCalendar();\n    handleFocus();\n  }, [handleFocus, requestShowCalendar]);\n\n  const getDisplayValue = () => {\n    if (!value) return placeholder;\n    if (type === 'day') {\n      return formatDate(value as Date, format, { locale: locale });\n    } else {\n      const { lowest, highest } = value as DateRange;\n      if (highest)\n        return `${formatDate(lowest, format, {\n          locale: locale,\n        })} - ${formatDate(highest, format, { locale: locale })}`;\n      else return formatDate(lowest, format, { locale: locale });\n    }\n  };\n\n  const StyledText = getStyledTextComponent(TextComponent);\n\n  useEffect(() => {\n    if (closeOnPick && value && type === 'day') {\n      setTimeout(requestCloseCalendar, 200);\n    }\n    if (closeOnPick && value && type === 'range') {\n      const { lowest, highest } = value as DateRange;\n      lowest && highest && setTimeout(requestCloseCalendar, 200);\n    }\n  }, [value, closeOnPick, type, requestCloseCalendar]);\n\n  const calendar = (\n    <CalendarComponent\n      pointerEvents={'box-none'}\n      type={type}\n      value={value}\n      month={month}\n      year={year}\n      onChange={onChange}\n      locale={locale}\n    />\n  );\n\n  return (\n    <>\n      {controlComponent ? (\n        controlComponent(handleShowCalendar, getDisplayValue())\n      ) : (\n        <HintInputContainer\n          focused={focused}\n          viewStyle={style}\n          onPress={handleShowCalendar}\n          disabled={disabled}\n          hintComponent={hintComponent}\n          LabelComponent={TextComponent}\n          variant={variant}\n          hint={hint}\n          rightComponent={\n            <>\n              <CalendarIcon name=\"calendar-sharp\" type=\"ionicon\" size=\"centi\" />\n              {rightComponent}\n            </>\n          }\n          {...rest}\n        >\n          <StyledText fontWeight=\"bold\" disabled={disabled}>\n            {getDisplayValue() || ' '}\n          </StyledText>\n        </HintInputContainer>\n      )}\n      {renderCalendar(calendar, handleBlur)}\n    </>\n  );\n}\n\nexport default DatePicker;\n"],"names":["format","formatDate"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BA,SAAS,WAAoC,EA0BT,EAAA;AA1BS,EAE3C,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAA,KAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,YACAA,QAAS,GAAA,YAAA;AAAA,IACT,WAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,IACA,QAAA;AAAA,IACA,gBAAA;AAAA,IACA,aAAA;AAAA,IACA,IAAA;AAAA,IACA,OAAA;AAAA,IACA,aAAgB,GAAA,IAAA;AAAA,IAChB,iBAAA;AAAA,IACA,cAAA;AAAA,IACA,KAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAc,GAAA,KAAA;AAAA,IACd,cAAA;AAAA,IACA,mBAAA;AAAA,IACA,oBAAA;AAAA,GAvDF,GA+B6C,EAyBxC,EAAA,IAAA,GAAA,SAAA,CAzBwC,EAyBxC,EAAA;AAAA,IAvBH,OAAA;AAAA,IACA,MAAA;AAAA,IACA,UAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,IACA,QAAA;AAAA,IACA,aAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,kBAAA;AAAA,IACA,eAAA;AAAA,IACA,MAAA;AAAA,IACA,SAAA;AAAA,IACA,eAAA;AAAA,IACA,mBAAA;AAAA,IACA,gBAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAA;AAAA,IACA,aAAA;AAAA,IACA,gBAAA;AAAA,IACA,qBAAA;AAAA,IACA,sBAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,MAAM,EAAE,OAAA,EAAS,UAAY,EAAA,WAAA,EAAgB,GAAA,aAAA;AAAA,IAC3C,OAAA;AAAA,IACA,MAAA;AAAA,IACA,CAAC,QAAA;AAAA,GACH,CAAA;AAEA,EAAM,MAAA,kBAAA,GAAqB,KAAM,CAAA,WAAA,CAAY,MAAM;AACjD,IAAoB,mBAAA,EAAA,CAAA;AACpB,IAAY,WAAA,EAAA,CAAA;AAAA,GACX,EAAA,CAAC,WAAa,EAAA,mBAAmB,CAAC,CAAA,CAAA;AAErC,EAAA,MAAM,kBAAkB,MAAM;AAC5B,IAAA,IAAI,CAAC,KAAA;AAAO,MAAO,OAAA,WAAA,CAAA;AACnB,IAAA,IAAI,SAAS,KAAO,EAAA;AAClB,MAAA,OAAOC,MAAW,CAAA,KAAA,EAAeD,QAAQ,EAAA,EAAE,QAAgB,CAAA,CAAA;AAAA,KACtD,MAAA;AACL,MAAM,MAAA,EAAE,MAAQ,EAAA,OAAA,EAAY,GAAA,KAAA,CAAA;AAC5B,MAAI,IAAA,OAAA;AACF,QAAO,OAAA,CAAA,EAAGC,MAAW,CAAA,MAAA,EAAQD,QAAQ,EAAA;AAAA,UACnC,MAAA;AAAA,SACD,CAAO,CAAA,GAAA,EAAAC,MAAA,CAAW,SAASD,QAAQ,EAAA,EAAE,QAAgB,CAAA,CAAA,CAAA,CAAA;AAAA;AACnD,QAAA,OAAOC,MAAW,CAAA,MAAA,EAAQD,QAAQ,EAAA,EAAE,QAAgB,CAAA,CAAA;AAAA,KAC3D;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,UAAA,GAAa,uBAAuB,aAAa,CAAA,CAAA;AAEvD,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,WAAA,IAAe,KAAS,IAAA,IAAA,KAAS,KAAO,EAAA;AAC1C,MAAA,UAAA,CAAW,sBAAsB,GAAG,CAAA,CAAA;AAAA,KACtC;AACA,IAAI,IAAA,WAAA,IAAe,KAAS,IAAA,IAAA,KAAS,OAAS,EAAA;AAC5C,MAAM,MAAA,EAAE,MAAQ,EAAA,OAAA,EAAY,GAAA,KAAA,CAAA;AAC5B,MAAU,MAAA,IAAA,OAAA,IAAW,UAAW,CAAA,oBAAA,EAAsB,GAAG,CAAA,CAAA;AAAA,KAC3D;AAAA,KACC,CAAC,KAAA,EAAO,WAAa,EAAA,IAAA,EAAM,oBAAoB,CAAC,CAAA,CAAA;AAEnD,EAAA,MAAM,2BACH,KAAA,CAAA,aAAA,CAAA,iBAAA,EAAA;AAAA,IACC,aAAe,EAAA,UAAA;AAAA,IACf,IAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,GACF,CAAA,CAAA;AAGF,EAAA,iEAEK,gBACC,GAAA,gBAAA,CAAiB,oBAAoB,eAAgB,EAAC,oBAErD,KAAA,CAAA,aAAA,CAAA,kBAAA,EAAA,cAAA,CAAA;AAAA,IACC,OAAA;AAAA,IACA,SAAW,EAAA,KAAA;AAAA,IACX,OAAS,EAAA,kBAAA;AAAA,IACT,QAAA;AAAA,IACA,aAAA;AAAA,IACA,cAAgB,EAAA,aAAA;AAAA,IAChB,OAAA;AAAA,IACA,IAAA;AAAA,IACA,cAAA,4EAEK,KAAA,CAAA,aAAA,CAAA,YAAA,EAAA;AAAA,MAAa,IAAK,EAAA,gBAAA;AAAA,MAAiB,IAAK,EAAA,SAAA;AAAA,MAAU,IAAK,EAAA,OAAA;AAAA,KAAQ,GAC/D,cACH,CAAA;AAAA,GAAA,EAEE,uBAEH,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IAAW,UAAW,EAAA,MAAA;AAAA,IAAO,QAAA;AAAA,GAC3B,EAAA,eAAA,MAAqB,GACxB,CACF,GAED,cAAe,CAAA,QAAA,EAAU,UAAU,CACtC,CAAA,CAAA;AAEJ;;;;"}

package/dist/components/molecules/DatePicker/styled.cjs

@@ -0,0 +1,37 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styled = require('@emotion/native');
+var Icon = require('../../atoms/Icon/Icon.cjs');
+require('react');
+require('../../atoms/Text/styled.cjs');
+var styled$1 = require('../../atoms/Input/styled.cjs');
+require('currency.js');
+require('../../atoms/Input/InputElement/InputElement.cjs');
+require('../../atoms/Input/InputMaskElement/InputMaskElement.cjs');
+require('../../atoms/Input/PressableInputContainer/styled.cjs');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+const getStyledTextComponent = (component) => {
+  return styled__default["default"](component)(
+    (props) => {
+      var _a;
+      return styled.css`
+      line-height: ${(_a = props.theme) == null ? void 0 : _a.typography.h5.lineHeight};
+      ${styled$1.disabledInputStyles(props)}
+    `;
+    }
+  );
+};
+const CalendarIcon = styled__default["default"](Icon)`
+  padding: ${({ theme }) => theme.spacing.centi};
+  color: ${({ theme }) => theme.color.secondary.medium};
+`;
+
+exports.CalendarIcon = CalendarIcon;
+exports.getStyledTextComponent = getStyledTextComponent;
+//# sourceMappingURL=styled.cjs.map

package/dist/components/molecules/DatePicker/styled.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.cjs","sources":["../../../../src/components/molecules/DatePicker/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { StyleProps } from '../../../types/defaults';\nimport { Icon } from '../../atoms/Icon';\nimport { disabledInputStyles, InputContainerProps } from '../../atoms/Input';\nimport { TextProps } from '../../atoms/Text';\n\nexport const getStyledTextComponent = (component: FC<TextProps>) => {\n  return styled(component)(\n    (props: Partial<InputContainerProps> & Partial<StyleProps>) => css`\n      line-height: ${props.theme?.typography.h5.lineHeight};\n      ${disabledInputStyles(props)}\n    `\n  );\n};\n\nexport const CalendarIcon = styled(Icon)<Partial<StyleProps>>`\n  padding: ${({ theme }) => theme.spacing.centi};\n  color: ${({ theme }) => theme.color.secondary.medium};\n`;\n"],"names":["styled","css","disabledInputStyles"],"mappings":";;;;;;;;;;;;;;;;;;AAOa,MAAA,sBAAA,GAAyB,CAAC,SAA6B,KAAA;AAClE,EAAA,OAAOA,2BAAO,SAAS,CAAA;AAAA,IACrB,CAAC,KAA2D,KAAA;AAThE,MAAA,IAAA,EAAA,CAAA;AASmE,MAAA,OAAAC,UAAA,CAAA;AAAA,mBAAA,EAAA,CAC9C,EAAM,GAAA,KAAA,CAAA,KAAA,KAAN,IAAa,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,UAAA,CAAW,EAAG,CAAA,UAAA,CAAA;AAAA,MAAA,EACxCC,6BAAoB,KAAK,CAAA,CAAA;AAAA,IAAA,CAAA,CAAA;AAAA,KAAA;AAAA,GAE/B,CAAA;AACF,EAAA;AAEa,MAAA,YAAA,GAAeF,2BAAO,IAAI,CAAA,CAAA;AAAA,WAAA,EAC1B,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,KAAA,CAAA;AAAA,SAAA,EAC/B,CAAC,EAAE,KAAA,EAAY,KAAA,KAAA,CAAM,MAAM,SAAU,CAAA,MAAA,CAAA;AAAA;;;;;"}