@consumidor-positivo/aurora 0.0.70 → 0.0.71

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,9 +1,9 @@
1
1
  import "react/jsx-runtime";
2
2
  import "../../index-CweZ_OcN.js";
3
- import "../../index-C8RdzVRj.js";
3
+ import "../../index-D1oGcejt.js";
4
4
  import "../Button/index.es.js";
5
5
  import "../PortalHolder/index.es.js";
6
- import { a } from "../../index-CK85YRoz.js";
6
+ import { a } from "../../index-B2qlxNd4.js";
7
7
  export {
8
8
  a as DatepickerCalendar
9
9
  };
@@ -3,8 +3,8 @@ import "../../index-CweZ_OcN.js";
3
3
  import "../Icon/index.es.js";
4
4
  import "../icons/IconChevronLeft/index.es.js";
5
5
  import "../icons/IconChevronRight/index.es.js";
6
- import "../../index-CP-KKFUb.js";
7
- import { C } from "../../index-C8RdzVRj.js";
6
+ import "../../index-CclsoEnK.js";
7
+ import { C } from "../../index-D1oGcejt.js";
8
8
  export {
9
9
  C as CalendarHeader
10
10
  };
@@ -2,8 +2,8 @@ import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { c as classNames } from "../../index-CweZ_OcN.js";
3
3
  import "../Icon/index.es.js";
4
4
  import { IconCheck } from "../icons/IconCheck/index.es.js";
5
- import { F as Field } from "../../index-DfksciAR.js";
6
5
  import { m as COLOR_NEUTRAL_00 } from "../../tokens-DGTtjw-_.js";
6
+ import { F as Field } from "../../index-DfksciAR.js";
7
7
  import './styles.css';const CheckboxField = ({
8
8
  label,
9
9
  error,
@@ -1,13 +1,13 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
+ import { B as BREAKPOINT_MD, b as COLOR_NEUTRAL_40 } from "../../tokens-DGTtjw-_.js";
2
3
  import "../../index-CweZ_OcN.js";
3
4
  import "../Icon/index.es.js";
4
5
  import { IconCalendar } from "../icons/IconCalendar/index.es.js";
5
6
  import { InputField } from "../InputField/index.es.js";
6
- import { g as getDefaultDate, D as DDMMYYYY, a as DatepickerCalendar, A as AUCalendarDate } from "../../index-CK85YRoz.js";
7
+ import { g as getDefaultDate, D as DDMMYYYY, a as DatepickerCalendar, A as AUCalendarDate } from "../../index-B2qlxNd4.js";
7
8
  import { useRef, useState, useMemo, useEffect } from "react";
8
9
  import { a as above } from "../../screen-DfYo7XQ_.js";
9
- import { u as useOutsideClick } from "../../index-CP-KKFUb.js";
10
- import { B as BREAKPOINT_MD, b as COLOR_NEUTRAL_40 } from "../../tokens-DGTtjw-_.js";
10
+ import { u as useOutsideClick } from "../../index-CclsoEnK.js";
11
11
  import './styles.css';function useDatepicker({
12
12
  value,
13
13
  defaultValue = "empty",
@@ -1,7 +1,7 @@
1
1
  import { jsx, Fragment } from "react/jsx-runtime";
2
2
  import { a as above } from "../../screen-DfYo7XQ_.js";
3
- import { Portal } from "../Portal/index.es.js";
4
3
  import { B as BREAKPOINT_MD } from "../../tokens-DGTtjw-_.js";
4
+ import { Portal } from "../Portal/index.es.js";
5
5
  const PortalHolder = ({ withPortal, children }) => {
6
6
  const shouldUsePortal = !above(BREAKPOINT_MD) && withPortal;
7
7
  if (shouldUsePortal) return /* @__PURE__ */ jsx(Portal, { children });
@@ -4,7 +4,7 @@ import "../Icon/index.es.js";
4
4
  import "../icons/IconChevronDown/index.es.js";
5
5
  import "../icons/IconChevronLeft/index.es.js";
6
6
  import "../icons/IconX/index.es.js";
7
- import { S } from "../../index-CP-KKFUb.js";
7
+ import { S } from "../../index-CclsoEnK.js";
8
8
  export {
9
9
  S as Segment
10
10
  };
@@ -1,137 +1,56 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { c as classNames } from "../../index-CweZ_OcN.js";
3
3
  import { Text } from "../Text/index.es.js";
4
- import { useState, useRef, useEffect } from "react";
5
- const useFieldTextArea = ({
6
- rows = 3,
7
- cols,
8
- horizontalResize = false,
9
- onChange
10
- }) => {
11
- const [dimensions, setDimensions] = useState({
12
- width: cols ? cols * 10 : "100%",
13
- height: rows * 26
14
- });
4
+ import { useState } from "react";
5
+ const useFieldTextArea = ({ onChange }) => {
15
6
  const [charCount, setCharCount] = useState(0);
16
- const isResizing = useRef(false);
17
- const lastMousePosition = useRef({ x: 0, y: 0 });
18
- useEffect(() => {
19
- setDimensions({
20
- width: cols ? cols * 10 : "100%",
21
- height: rows * 26
22
- });
23
- }, [rows, cols]);
24
- const handleMouseDown = (e) => {
25
- isResizing.current = true;
26
- lastMousePosition.current = { x: e.clientX, y: e.clientY };
27
- if (dimensions.width === "100%") {
28
- const container = e.currentTarget.closest(
29
- ".au-field__textarea-container"
30
- );
31
- setDimensions((prev) => ({
32
- ...prev,
33
- width: container ? container.offsetWidth : 300
34
- }));
35
- }
36
- window.addEventListener("mousemove", handleMouseMove);
37
- window.addEventListener("mouseup", handleMouseUp);
38
- };
39
- const handleMouseMove = (e) => {
40
- if (!isResizing.current) return;
41
- const deltaX = e.clientX - lastMousePosition.current.x;
42
- const deltaY = e.clientY - lastMousePosition.current.y;
43
- setDimensions((prev) => {
44
- let currentWidth = typeof prev.width === "number" ? prev.width : 100;
45
- const target = e.currentTarget;
46
- if (target) {
47
- const container = target.closest(
48
- ".textarea-container"
49
- );
50
- currentWidth = container ? container.offsetWidth : currentWidth;
51
- }
52
- return {
53
- width: horizontalResize ? Math.max(100, currentWidth + deltaX) : prev.width,
54
- height: Math.max(50, prev.height + deltaY)
55
- };
56
- });
57
- lastMousePosition.current = { x: e.clientX, y: e.clientY };
58
- };
59
- const handleMouseUp = () => {
60
- isResizing.current = false;
61
- window.removeEventListener("mousemove", handleMouseMove);
62
- window.removeEventListener("mouseup", handleMouseUp);
63
- };
64
7
  const handleInputChange = (e) => {
65
8
  setCharCount(e.target.value.length);
66
- if (onChange) {
67
- onChange(e);
68
- }
9
+ if (onChange) onChange(e);
69
10
  };
70
11
  return {
71
- dimensions,
72
12
  charCount,
73
- handleMouseDown,
74
13
  handleInputChange
75
14
  };
76
15
  };
77
16
  const FieldTextArea = ({
78
17
  textareaRef,
79
18
  customClass,
80
- rows = 3,
81
- cols,
82
- horizontalResize = false,
19
+ horizontalResize,
83
20
  maxLength,
84
21
  ...props
85
22
  }) => {
86
- const { dimensions, charCount, handleMouseDown, handleInputChange } = useFieldTextArea({ rows, cols, horizontalResize, onChange: props.onChange });
87
- const textareaClasses = classNames("au-field__textarea", customClass);
88
- return /* @__PURE__ */ jsxs(
89
- "div",
90
- {
91
- className: "au-field__textarea-container",
92
- style: {
93
- width: typeof dimensions.width === "number" ? `${dimensions.width}px` : dimensions.width,
94
- height: `${dimensions.height}px`
95
- },
96
- children: [
97
- /* @__PURE__ */ jsx(
98
- "textarea",
99
- {
100
- ref: textareaRef,
101
- className: textareaClasses,
102
- style: { width: "100%", height: "100%", resize: "none" },
103
- onChange: handleInputChange,
104
- maxLength,
105
- ...props
106
- }
107
- ),
108
- maxLength && /* @__PURE__ */ jsxs(Text, { variant: "caption", className: "au-field__char-counter", children: [
23
+ const { charCount, handleInputChange } = useFieldTextArea({
24
+ onChange: props.onChange
25
+ });
26
+ const textareaClasses = classNames("au-field__textarea", customClass, {
27
+ "au-field__textarea--horizontal-resize": horizontalResize
28
+ });
29
+ return /* @__PURE__ */ jsxs("div", { className: "au-field__textarea-container", children: [
30
+ /* @__PURE__ */ jsx(
31
+ "textarea",
32
+ {
33
+ ref: textareaRef,
34
+ className: textareaClasses,
35
+ maxLength,
36
+ onChange: handleInputChange,
37
+ ...props
38
+ }
39
+ ),
40
+ maxLength && /* @__PURE__ */ jsxs(
41
+ Text,
42
+ {
43
+ variant: "caption",
44
+ className: "au-field__char-counter",
45
+ "aria-live": "polite",
46
+ children: [
109
47
  charCount,
110
48
  "/",
111
49
  maxLength
112
- ] }),
113
- /* @__PURE__ */ jsx("div", { className: "custom-resize", onMouseDown: handleMouseDown, children: /* @__PURE__ */ jsx(
114
- "svg",
115
- {
116
- xmlns: "http://www.w3.org/2000/svg",
117
- width: "9",
118
- height: "9",
119
- viewBox: "0 0 9 9",
120
- fill: "none",
121
- children: /* @__PURE__ */ jsx(
122
- "path",
123
- {
124
- fillRule: "evenodd",
125
- clipRule: "evenodd",
126
- d: "M0.146447 8.14645C-0.0488155 8.34171 -0.0488155 8.65829 0.146447 8.85355C0.341709 9.04882 0.658291 9.04882 0.853553 8.85355L8.85355 0.853553C9.04882 0.658291 9.04882 0.341708 8.85355 0.146446C8.65829 -0.0488159 8.34171 -0.0488157 8.14645 0.146446L0.146447 8.14645ZM4.14645 8.14645C3.95118 8.34171 3.95118 8.65829 4.14645 8.85355C4.34171 9.04882 4.65829 9.04882 4.85355 8.85355L8.85355 4.85355C9.04882 4.65829 9.04882 4.34171 8.85355 4.14645C8.65829 3.95118 8.34171 3.95118 8.14645 4.14645L4.14645 8.14645Z",
127
- fill: "#454A54"
128
- }
129
- )
130
- }
131
- ) })
132
- ]
133
- }
134
- );
50
+ ]
51
+ }
52
+ )
53
+ ] });
135
54
  };
136
55
  export {
137
56
  FieldTextArea
@@ -1 +1 @@
1
- {"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Field/TextArea/hook.ts","../../../lib/components/form/Field/TextArea/index.tsx"],"sourcesContent":["import { useState, useEffect, useRef } from 'react'\n\ntype UseFieldTextAreaProps = {\n rows?: number\n cols?: number\n horizontalResize?: boolean\n onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void\n}\n\nexport const useFieldTextArea = ({\n rows = 3,\n cols,\n horizontalResize = false,\n onChange,\n}: UseFieldTextAreaProps) => {\n const [dimensions, setDimensions] = useState({\n width: cols ? cols * 10 : '100%',\n height: rows * 26,\n })\n const [charCount, setCharCount] = useState(0)\n const isResizing = useRef(false)\n const lastMousePosition = useRef({ x: 0, y: 0 })\n\n useEffect(() => {\n setDimensions({\n width: cols ? cols * 10 : '100%',\n height: rows * 26,\n })\n }, [rows, cols])\n\n const handleMouseDown = (e: React.MouseEvent) => {\n isResizing.current = true\n lastMousePosition.current = { x: e.clientX, y: e.clientY }\n\n if (dimensions.width === '100%') {\n const container = e.currentTarget.closest(\n '.au-field__textarea-container',\n ) as HTMLElement\n setDimensions((prev) => ({\n ...prev,\n width: container ? container.offsetWidth : 300,\n }))\n }\n\n window.addEventListener('mousemove', handleMouseMove)\n window.addEventListener('mouseup', handleMouseUp)\n }\n\n const handleMouseMove = (e: MouseEvent) => {\n if (!isResizing.current) return\n const deltaX = e.clientX - lastMousePosition.current.x\n const deltaY = e.clientY - lastMousePosition.current.y\n\n setDimensions((prev) => {\n let currentWidth = typeof prev.width === 'number' ? prev.width : 100\n const target = e.currentTarget as HTMLElement | null\n if (target) {\n const container = target.closest(\n '.textarea-container',\n ) as HTMLElement | null\n currentWidth = container ? container.offsetWidth : currentWidth\n }\n\n return {\n width: horizontalResize\n ? Math.max(100, currentWidth + deltaX)\n : prev.width,\n height: Math.max(50, prev.height + deltaY),\n }\n })\n\n lastMousePosition.current = { x: e.clientX, y: e.clientY }\n }\n\n const handleMouseUp = () => {\n isResizing.current = false\n window.removeEventListener('mousemove', handleMouseMove)\n window.removeEventListener('mouseup', handleMouseUp)\n }\n\n const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n setCharCount(e.target.value.length)\n if (onChange) {\n onChange(e)\n }\n }\n\n return {\n dimensions,\n charCount,\n handleMouseDown,\n handleInputChange,\n }\n}\n","import React from 'react'\nimport classNames from 'classnames'\nimport { Text } from '@components/Text'\nimport { useFieldTextArea } from './hook'\n\ntype FieldTextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\n textareaRef?: React.RefObject<HTMLTextAreaElement>\n customClass?: string\n horizontalResize?: boolean\n maxLength?: number\n}\n\nexport const FieldTextArea = ({\n textareaRef,\n customClass,\n rows = 3,\n cols,\n horizontalResize = false,\n maxLength,\n ...props\n}: FieldTextAreaProps) => {\n const { dimensions, charCount, handleMouseDown, handleInputChange } =\n useFieldTextArea({ rows, cols, horizontalResize, onChange: props.onChange })\n\n const textareaClasses = classNames('au-field__textarea', customClass)\n\n return (\n <div\n className=\"au-field__textarea-container\"\n style={{\n width:\n typeof dimensions.width === 'number'\n ? `${dimensions.width}px`\n : dimensions.width,\n height: `${dimensions.height}px`,\n }}>\n <textarea\n ref={textareaRef}\n className={textareaClasses}\n style={{ width: '100%', height: '100%', resize: 'none' }}\n onChange={handleInputChange}\n maxLength={maxLength}\n {...props}\n />\n {maxLength && (\n <Text variant=\"caption\" className=\"au-field__char-counter\">\n {charCount}/{maxLength}\n </Text>\n )}\n <div className=\"custom-resize\" onMouseDown={handleMouseDown}>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"9\"\n height=\"9\"\n viewBox=\"0 0 9 9\"\n fill=\"none\">\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M0.146447 8.14645C-0.0488155 8.34171 -0.0488155 8.65829 0.146447 8.85355C0.341709 9.04882 0.658291 9.04882 0.853553 8.85355L8.85355 0.853553C9.04882 0.658291 9.04882 0.341708 8.85355 0.146446C8.65829 -0.0488159 8.34171 -0.0488157 8.14645 0.146446L0.146447 8.14645ZM4.14645 8.14645C3.95118 8.34171 3.95118 8.65829 4.14645 8.85355C4.34171 9.04882 4.65829 9.04882 4.85355 8.85355L8.85355 4.85355C9.04882 4.65829 9.04882 4.34171 8.85355 4.14645C8.65829 3.95118 8.34171 3.95118 8.14645 4.14645L4.14645 8.14645Z\"\n fill=\"#454A54\"\n />\n </svg>\n </div>\n </div>\n )\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Field/TextArea/hook.ts","../../../lib/components/form/Field/TextArea/index.tsx"],"sourcesContent":["import { useState } from 'react'\n\ntype UseFieldTextAreaProps = {\n onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void\n}\n\nexport const useFieldTextArea = ({ onChange }: UseFieldTextAreaProps) => {\n const [charCount, setCharCount] = useState(0)\n\n const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n setCharCount(e.target.value.length)\n if (onChange) onChange(e)\n }\n\n return {\n charCount,\n handleInputChange,\n }\n}\n","import React from 'react'\nimport classNames from 'classnames'\nimport { Text } from '@components/Text'\nimport { useFieldTextArea } from './hook'\n\ntype FieldTextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\n textareaRef?: React.RefObject<HTMLTextAreaElement>\n customClass?: string\n horizontalResize?: boolean\n maxLength?: number\n}\n\nexport const FieldTextArea = ({\n textareaRef,\n customClass,\n horizontalResize,\n maxLength,\n ...props\n}: FieldTextAreaProps) => {\n const { charCount, handleInputChange } = useFieldTextArea({\n onChange: props.onChange,\n })\n const textareaClasses = classNames('au-field__textarea', customClass, {\n 'au-field__textarea--horizontal-resize': horizontalResize,\n })\n\n return (\n <div className=\"au-field__textarea-container\">\n <textarea\n ref={textareaRef}\n className={textareaClasses}\n maxLength={maxLength}\n onChange={handleInputChange}\n {...props}\n />\n {maxLength && (\n <Text\n variant=\"caption\"\n className=\"au-field__char-counter\"\n aria-live=\"polite\">\n {charCount}/{maxLength}\n </Text>\n )}\n </div>\n )\n}\n"],"names":[],"mappings":";;;;AAMO,MAAM,mBAAmB,CAAC,EAAE,eAAsC;AACvE,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,CAAC;AAEtC,QAAA,oBAAoB,CAAC,MAA8C;AAC1D,iBAAA,EAAE,OAAO,MAAM,MAAM;AAC9B,QAAA,mBAAmB,CAAC;AAAA,EAAA;AAGnB,SAAA;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEJ;ACNO,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA0B;AACxB,QAAM,EAAE,WAAW,kBAAkB,IAAI,iBAAiB;AAAA,IACxD,UAAU,MAAM;AAAA,EAAA,CACjB;AACK,QAAA,kBAAkB,WAAW,sBAAsB,aAAa;AAAA,IACpE,yCAAyC;AAAA,EAAA,CAC1C;AAGC,SAAA,qBAAC,OAAI,EAAA,WAAU,gCACb,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK;AAAA,QACL,WAAW;AAAA,QACX;AAAA,QACA,UAAU;AAAA,QACT,GAAG;AAAA,MAAA;AAAA,IACN;AAAA,IACC,aACC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAU;AAAA,QACV,aAAU;AAAA,QACT,UAAA;AAAA,UAAA;AAAA,UAAU;AAAA,UAAE;AAAA,QAAA;AAAA,MAAA;AAAA,IACf;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}
@@ -1,17 +1,9 @@
1
1
  /// <reference types="react" />
2
2
  type UseFieldTextAreaProps = {
3
- rows?: number;
4
- cols?: number;
5
- horizontalResize?: boolean;
6
3
  onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
7
4
  };
8
- export declare const useFieldTextArea: ({ rows, cols, horizontalResize, onChange, }: UseFieldTextAreaProps) => {
9
- dimensions: {
10
- width: string | number;
11
- height: number;
12
- };
5
+ export declare const useFieldTextArea: ({ onChange }: UseFieldTextAreaProps) => {
13
6
  charCount: number;
14
- handleMouseDown: (e: React.MouseEvent) => void;
15
7
  handleInputChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
16
8
  };
17
9
  export {};
@@ -6,5 +6,5 @@ type FieldTextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
6
6
  horizontalResize?: boolean;
7
7
  maxLength?: number;
8
8
  };
9
- export declare const FieldTextArea: ({ textareaRef, customClass, rows, cols, horizontalResize, maxLength, ...props }: FieldTextAreaProps) => import("react/jsx-runtime").JSX.Element;
9
+ export declare const FieldTextArea: ({ textareaRef, customClass, horizontalResize, maxLength, ...props }: FieldTextAreaProps) => import("react/jsx-runtime").JSX.Element;
10
10
  export {};
@@ -29,7 +29,7 @@ declare const _default: {
29
29
  hasError?: boolean | undefined;
30
30
  message?: string | undefined;
31
31
  }) => import("react/jsx-runtime").JSX.Element | null;
32
- TextArea: ({ textareaRef, customClass, rows, cols, horizontalResize, maxLength, ...props }: import('react').TextareaHTMLAttributes<HTMLTextAreaElement> & {
32
+ TextArea: ({ textareaRef, customClass, horizontalResize, maxLength, ...props }: import('react').TextareaHTMLAttributes<HTMLTextAreaElement> & {
33
33
  textareaRef?: import('react').RefObject<HTMLTextAreaElement> | undefined;
34
34
  customClass?: string | undefined;
35
35
  horizontalResize?: boolean | undefined;
@@ -1 +1 @@
1
- .au-field{cursor:pointer;border-radius:8px}.au-field__input-holder{position:relative;height:56px}.au-field__input{height:56px}.au-field__textarea{padding:10px;box-sizing:border-box;resize:none;border:none;outline:none;width:100%;height:100%}.au-field__textarea-container{position:relative;display:inline-block;box-sizing:border-box;resize:none}.au-field__textarea-container .custom-resize{width:9px;height:9px;position:absolute;cursor:nwse-resize;display:block;display:flex;bottom:5px;right:5px}.au-field__input,.au-field__textarea{background-color:#fff;border:1px solid #454a54;border-radius:8px;box-sizing:border-box;font-family:inherit;font-size:16px;line-height:22px;padding:16px;width:100%}.au-field__input:hover,.au-field__textarea:hover{border:1px solid #16181d}.au-field__input:focus,.au-field__textarea:focus{border-color:#0048db;outline:1px solid #0048db}.au-field__char-counter{text-align:right;color:#454a54}.au-field:focus-within:not(.au-field--error) .au-field__header-label{color:#0048db}.au-field__header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px}.au-field__header-label{color:#454a54;cursor:pointer;font-size:14px;font-weight:600}.au-field__header-label--required{color:#991717}.au-field__header-icon span{font-size:14px;color:#454a54}.au-field__right-slot{position:absolute;right:16px;top:50%;transform:translateY(-50%)}.au-field__error-message{color:#991717;font-size:16px;font-weight:400;line-height:24px;padding-top:8px}.au-field--disabled{cursor:not-allowed}.au-field--disabled .au-field__input,.au-field--disabled .au-field__textarea{background-color:#e2e4e9;border-color:#5e6573;color:#5e6573;cursor:not-allowed}.au-field--disabled .au-field__header-label{color:#5e6573;cursor:not-allowed}.au-field--error .au-field__input,.au-field--error .au-field__textarea{background-color:#f5eff0;border-color:#991717}.au-field--error .au-field__input:focus,.au-field--error .au-field__textarea:focus{border-color:#0048db}.au-field--error .au-field__header-label{color:#991717}.au-field--success .au-field__input,.au-field--success .au-field__textarea{animation:inputSuccess 2s forwards}.au-field--success .au-field__header-label{animation:labelSuccess 2s forwards}.au-field--success .au-field__header-icon .au-icon{animation:iconSucess 2s forwards}@keyframes inputSuccess{0%,70%{background-color:#f0fcf5;border-color:#10593b}}@keyframes labelSuccess{0%,70%{color:#10593b}}@keyframes iconSucess{0%,70%{opacity:1}to{opacity:0}}
1
+ .au-field{cursor:pointer;border-radius:8px}.au-field__input-holder{position:relative;height:56px}.au-field__input{height:56px}.au-field__textarea{padding:10px;box-sizing:border-box;resize:vertical;border:none;outline:none;width:100%;height:100%;min-width:100%}.au-field__textarea--horizontal-resize{resize:both}.au-field__textarea-container{position:relative;display:inline-block;min-width:100%}.au-field__input,.au-field__textarea{background-color:#fff;border:1px solid #454a54;border-radius:8px;box-sizing:border-box;font-family:inherit;font-size:16px;line-height:22px;padding:16px;width:100%}.au-field__input:hover,.au-field__textarea:hover{border:1px solid #16181d}.au-field__input:focus,.au-field__textarea:focus{border-color:#0048db;outline:1px solid #0048db}.au-field__char-counter{text-align:right;color:#454a54}.au-field:focus-within:not(.au-field--error) .au-field__header-label{color:#0048db}.au-field__header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px}.au-field__header-label{color:#454a54;cursor:pointer;font-size:14px;font-weight:600}.au-field__header-label--required{color:#991717}.au-field__header-icon span{font-size:14px;color:#454a54}.au-field__right-slot{position:absolute;right:16px;top:50%;transform:translateY(-50%)}.au-field__error-message{color:#991717;font-size:16px;font-weight:400;line-height:24px;padding-top:8px}.au-field--disabled{cursor:not-allowed}.au-field--disabled .au-field__input,.au-field--disabled .au-field__textarea{background-color:#e2e4e9;border-color:#5e6573;color:#5e6573;cursor:not-allowed}.au-field--disabled .au-field__header-label{color:#5e6573;cursor:not-allowed}.au-field--error .au-field__input,.au-field--error .au-field__textarea{background-color:#f5eff0;border-color:#991717}.au-field--error .au-field__input:focus,.au-field--error .au-field__textarea:focus{border-color:#0048db}.au-field--error .au-field__header-label{color:#991717}.au-field--success .au-field__input,.au-field--success .au-field__textarea{animation:inputSuccess 2s forwards}.au-field--success .au-field__header-label{animation:labelSuccess 2s forwards}.au-field--success .au-field__header-icon .au-icon{animation:iconSucess 2s forwards}@keyframes inputSuccess{0%,70%{background-color:#f0fcf5;border-color:#10593b}}@keyframes labelSuccess{0%,70%{color:#10593b}}@keyframes iconSucess{0%,70%{opacity:1}to{opacity:0}}
@@ -1,11 +1,11 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { c as classNames } from "./index-CweZ_OcN.js";
3
- import { $ as $35ea8db9cb2ccb90$export$99faa760c7908e4f, a as $dfd62f934fc76fed$export$e1aef45b828286de, C as CalendarHeader, b as $dfd62f934fc76fed$export$5bd780d491cfc46c, c as $dfd62f934fc76fed$export$22e2d15eaa4d2377, d as $dfd62f934fc76fed$export$ad2135cac3a11b3d, e as $dfd62f934fc76fed$export$e11f8ba65d857bff, f as $dfd62f934fc76fed$export$5d847498420df57b } from "./index-C8RdzVRj.js";
3
+ import { $ as $35ea8db9cb2ccb90$export$99faa760c7908e4f, a as $dfd62f934fc76fed$export$e1aef45b828286de, C as CalendarHeader, b as $dfd62f934fc76fed$export$5bd780d491cfc46c, c as $dfd62f934fc76fed$export$22e2d15eaa4d2377, d as $dfd62f934fc76fed$export$ad2135cac3a11b3d, e as $dfd62f934fc76fed$export$e11f8ba65d857bff, f as $dfd62f934fc76fed$export$5d847498420df57b } from "./index-D1oGcejt.js";
4
4
  import { Button } from "./components/Button/index.es.js";
5
5
  import { PortalHolder } from "./components/PortalHolder/index.es.js";
6
6
  import { useRef, useState, useEffect } from "react";
7
- import { a as above } from "./screen-DfYo7XQ_.js";
8
7
  import { B as BREAKPOINT_MD } from "./tokens-DGTtjw-_.js";
8
+ import { a as above } from "./screen-DfYo7XQ_.js";
9
9
  import './components/index/styles2.css';const DDMMYYYY = {
10
10
  placeholder: "DD/MM/YYYY",
11
11
  /** Apply DD/MM/YYYY to a field text while typing */
@@ -238,4 +238,4 @@ export {
238
238
  DatepickerCalendar as a,
239
239
  getDefaultDate as g
240
240
  };
241
- //# sourceMappingURL=index-CK85YRoz.js.map
241
+ //# sourceMappingURL=index-B2qlxNd4.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index-CK85YRoz.js","sources":["../lib/components/form/Datepicker/helpers.ts","../lib/components/form/Datepicker/Calendar/hook.ts","../lib/components/form/Datepicker/Calendar/index.tsx"],"sourcesContent":["import { AUCalendarDateShape, DefaultValue, FormatAdapter } from './types'\n\n/**\n * This adapter Handle the input format and convert to a more\n * universal structure, that can be used accross all subcomponents in the datepicker.\n * if we need to support another format like dd-mm-yyyy, we only need to create another adapter\n * following this model\n */\nexport const DDMMYYYY: FormatAdapter = {\n placeholder: 'DD/MM/YYYY',\n /** Apply DD/MM/YYYY to a field text while typing */\n maskDate(dateStr) {\n let fmtInputDate = dateStr\n fmtInputDate = fmtInputDate.replace(/\\D/g, '') // Remove non-numeric characters\n\n if (fmtInputDate.length > 2) {\n fmtInputDate = `${fmtInputDate.slice(0, 2)}/${fmtInputDate.slice(2)}`\n }\n if (fmtInputDate.length > 5) {\n fmtInputDate = `${fmtInputDate.slice(0, 5)}/${fmtInputDate.slice(5)}`\n }\n return fmtInputDate\n },\n /** Check if a string is on DD/MM/YYYY Format */\n validateFormat(dateStr) {\n const pattern = /^\\d{2}\\/\\d{2}\\/\\d{4}$/\n return pattern.test(dateStr)\n },\n /** Covert a DD/MM/YYYY to the datepicker date structure */\n toCalendarDate(dateStr): AUCalendarDateShape {\n const [day, month, year] = dateStr.split('/').map(Number)\n return AUCalendarDate(day, month, year)\n },\n /** Covert a Date in the datepicker structure into a DD/MM/YYYY string */\n toString(dateObj: AUCalendarDateShape): string {\n const fmtNumber = (digit: number) =>\n String(digit).length === 1 ? `0${digit}` : String(digit)\n const { day, month, year } = dateObj\n\n return `${fmtNumber(day)}/${fmtNumber(month)}/${year}`\n },\n /** Check if a DD/MM/YYYY is a valid date */\n validate(dateStr, minValue, maxValue): boolean {\n const [day, month, year] = dateStr.split('/').map(Number)\n const date = new Date(year, month - 1, day)\n const isOlderThanMinDate =\n !!minValue &&\n date < new Date(minValue.year, minValue.month - 1, minValue.day)\n\n const exceedsMaxDate =\n !!maxValue &&\n date > new Date(maxValue.year, maxValue.month - 1, maxValue.day)\n\n return (\n date.getDate() === day &&\n date.getMonth() + 1 === month &&\n date.getFullYear() === year &&\n !isOlderThanMinDate &&\n !exceedsMaxDate\n )\n },\n}\n\nexport function AUCalendarDate(\n day: number,\n month: number,\n year: number,\n): AUCalendarDateShape {\n return {\n day,\n month,\n year,\n }\n}\n\nexport function getDefaultDate(\n defaultDateProp: DefaultValue,\n): AUCalendarDateShape | null {\n if (defaultDateProp == 'empty') return null\n if (defaultDateProp === 'now') {\n const now = new Date()\n return AUCalendarDate(now.getDate(), now.getMonth() + 1, now.getFullYear())\n }\n\n return defaultDateProp\n}\n","import { useEffect, useRef, useState } from 'react'\nimport { CalendarDate } from '@internationalized/date'\nimport { BREAKPOINT_MD } from '@core/tokens'\nimport { above } from '@core/utils/screen'\nimport { AUCalendarDate } from '../helpers'\nimport { AUCalendarDateShape } from '../types'\n\ntype UseCalendarProps = {\n minValue: AUCalendarDateShape\n maxValue: AUCalendarDateShape\n value?: AUCalendarDateShape | null\n isVisible: boolean\n onClose: () => void\n onChange: (date: AUCalendarDateShape) => void\n}\n\nexport function useCalendar({\n onChange,\n onClose,\n minValue,\n maxValue,\n value,\n isVisible,\n}: UseCalendarProps) {\n const rootEl = useRef<HTMLDivElement>(null)\n const [enteredAnimation, setEnteredAnimation] = useState(false)\n const [calendarInternalState, setCalendarInternalState] =\n useState<CalendarDate>()\n\n const [delayedIsVisible, setDelayedIsVisible] = useState(false)\n\n const usedMinValue = new CalendarDate(\n minValue.year,\n minValue.month,\n minValue.day,\n )\n const usedMaxValue = new CalendarDate(\n maxValue.year,\n maxValue.month,\n maxValue.day,\n )\n\n useEffect(() => {\n if (!value) return\n const { day, month, year } = value\n setCalendarInternalState(new CalendarDate(year, month, day))\n }, [value])\n\n useEffect(() => {\n if (isVisible) {\n setDelayedIsVisible(true)\n return delayComponentMount()\n } else {\n return delayComponentUnmount()\n }\n }, [isVisible])\n\n function delayComponentMount(delayTime = 100) {\n const t = setTimeout(() => {\n setEnteredAnimation(true)\n }, delayTime)\n\n return () => {\n clearTimeout(t)\n }\n }\n\n function delayComponentUnmount(delayTime = 200) {\n setEnteredAnimation(false)\n const timoutToUnmount = setTimeout(() => {\n setDelayedIsVisible(false)\n }, delayTime)\n\n return () => {\n clearTimeout(timoutToUnmount)\n }\n }\n\n function fmtWeekday(day: string) {\n const capitalized = `${day.charAt(0).toUpperCase()}${day.slice(1)}`\n return capitalized.replace('.', '')\n }\n\n function triggerChange(date: CalendarDate) {\n const { day, month, year } = date\n onChange(AUCalendarDate(day, month, year))\n onClose()\n }\n\n function calendarChange(date: CalendarDate) {\n setCalendarInternalState(date)\n if (!above(BREAKPOINT_MD)) return\n triggerChange(date)\n }\n\n function actionChange() {\n if (calendarInternalState) {\n triggerChange(calendarInternalState)\n }\n }\n\n return {\n actionChange,\n calendarChange,\n fmtWeekday,\n usedMaxValue,\n usedMinValue,\n rootEl,\n calendarInternalState,\n enteredAnimation,\n delayedIsVisible,\n }\n}\n","import classNames from 'classnames'\nimport {\n Calendar,\n CalendarCell,\n CalendarGrid,\n CalendarGridBody,\n CalendarGridHeader,\n CalendarHeaderCell,\n} from 'react-aria-components'\nimport { Button } from '@components/Button'\nimport { CalendarHeader } from '../CalendarHeader'\nimport { PortalHolder } from '../PortalHolder'\n\n\nimport { AUCalendarDateShape } from '../types'\nimport { useCalendar } from './hook'\nimport './styles.scss'\n\ntype DatepickerCalendarProps = {\n withPortal?: boolean\n minValue: AUCalendarDateShape\n maxValue: AUCalendarDateShape\n value?: AUCalendarDateShape | null\n onClose: () => void\n onChange: (date: AUCalendarDateShape) => void\n isVisible: boolean\n}\n\nexport const DatepickerCalendar = ({\n onClose,\n withPortal,\n minValue,\n maxValue,\n value,\n onChange,\n isVisible,\n}: DatepickerCalendarProps) => {\n const {\n rootEl,\n usedMaxValue,\n usedMinValue,\n calendarInternalState,\n calendarChange,\n fmtWeekday,\n actionChange,\n enteredAnimation,\n delayedIsVisible,\n } = useCalendar({\n onChange,\n onClose,\n minValue,\n maxValue,\n value,\n isVisible,\n })\n\n const componentClass = classNames('au-datepicker__calendar', {\n 'au-datepicker__calendar--visible': enteredAnimation,\n })\n\n if (!delayedIsVisible) return\n\n return (\n <PortalHolder withPortal={withPortal}>\n <div className={componentClass} ref={rootEl}>\n <div className=\"au-datepicker__calendar-backdrop\" onClick={onClose} />\n <div className=\"au-datepicker__calendar-card\">\n <Calendar\n autoFocus\n className=\"au-datepicker__calendar-base\"\n minValue={usedMinValue}\n maxValue={usedMaxValue}\n value={calendarInternalState}\n onChange={calendarChange}>\n <CalendarHeader defaultFocusDate={calendarInternalState} />\n <CalendarGrid\n className=\"au-datepicker__calendar-grid\"\n weekdayStyle=\"short\">\n <CalendarGridHeader>\n {(day) => (\n <CalendarHeaderCell className=\"au-datepicker__calendar-weekday\">\n {fmtWeekday(day)}\n </CalendarHeaderCell>\n )}\n </CalendarGridHeader>\n <CalendarGridBody>\n {(date) => (\n <CalendarCell\n className=\"au-datepicker__calendar-day\"\n date={date}\n />\n )}\n </CalendarGridBody>\n </CalendarGrid>\n </Calendar>\n <div className=\"au-datepicker__calendar-actions-dock\">\n <Button\n type=\"outlined\"\n className=\"au-datepicker__calendar-cancel\"\n expand=\"x\"\n onClick={onClose}>\n Cancelar\n </Button>\n <Button\n disabled={!calendarInternalState}\n onClick={actionChange}\n expand=\"x\">\n Confirmar\n </Button>\n </div>\n </div>\n </div>\n </PortalHolder>\n )\n}\n"],"names":["CalendarDate","Calendar","CalendarGrid","CalendarGridHeader","CalendarHeaderCell","CalendarGridBody","CalendarCell"],"mappings":"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"}
1
+ {"version":3,"file":"index-B2qlxNd4.js","sources":["../lib/components/form/Datepicker/helpers.ts","../lib/components/form/Datepicker/Calendar/hook.ts","../lib/components/form/Datepicker/Calendar/index.tsx"],"sourcesContent":["import { AUCalendarDateShape, DefaultValue, FormatAdapter } from './types'\n\n/**\n * This adapter Handle the input format and convert to a more\n * universal structure, that can be used accross all subcomponents in the datepicker.\n * if we need to support another format like dd-mm-yyyy, we only need to create another adapter\n * following this model\n */\nexport const DDMMYYYY: FormatAdapter = {\n placeholder: 'DD/MM/YYYY',\n /** Apply DD/MM/YYYY to a field text while typing */\n maskDate(dateStr) {\n let fmtInputDate = dateStr\n fmtInputDate = fmtInputDate.replace(/\\D/g, '') // Remove non-numeric characters\n\n if (fmtInputDate.length > 2) {\n fmtInputDate = `${fmtInputDate.slice(0, 2)}/${fmtInputDate.slice(2)}`\n }\n if (fmtInputDate.length > 5) {\n fmtInputDate = `${fmtInputDate.slice(0, 5)}/${fmtInputDate.slice(5)}`\n }\n return fmtInputDate\n },\n /** Check if a string is on DD/MM/YYYY Format */\n validateFormat(dateStr) {\n const pattern = /^\\d{2}\\/\\d{2}\\/\\d{4}$/\n return pattern.test(dateStr)\n },\n /** Covert a DD/MM/YYYY to the datepicker date structure */\n toCalendarDate(dateStr): AUCalendarDateShape {\n const [day, month, year] = dateStr.split('/').map(Number)\n return AUCalendarDate(day, month, year)\n },\n /** Covert a Date in the datepicker structure into a DD/MM/YYYY string */\n toString(dateObj: AUCalendarDateShape): string {\n const fmtNumber = (digit: number) =>\n String(digit).length === 1 ? `0${digit}` : String(digit)\n const { day, month, year } = dateObj\n\n return `${fmtNumber(day)}/${fmtNumber(month)}/${year}`\n },\n /** Check if a DD/MM/YYYY is a valid date */\n validate(dateStr, minValue, maxValue): boolean {\n const [day, month, year] = dateStr.split('/').map(Number)\n const date = new Date(year, month - 1, day)\n const isOlderThanMinDate =\n !!minValue &&\n date < new Date(minValue.year, minValue.month - 1, minValue.day)\n\n const exceedsMaxDate =\n !!maxValue &&\n date > new Date(maxValue.year, maxValue.month - 1, maxValue.day)\n\n return (\n date.getDate() === day &&\n date.getMonth() + 1 === month &&\n date.getFullYear() === year &&\n !isOlderThanMinDate &&\n !exceedsMaxDate\n )\n },\n}\n\nexport function AUCalendarDate(\n day: number,\n month: number,\n year: number,\n): AUCalendarDateShape {\n return {\n day,\n month,\n year,\n }\n}\n\nexport function getDefaultDate(\n defaultDateProp: DefaultValue,\n): AUCalendarDateShape | null {\n if (defaultDateProp == 'empty') return null\n if (defaultDateProp === 'now') {\n const now = new Date()\n return AUCalendarDate(now.getDate(), now.getMonth() + 1, now.getFullYear())\n }\n\n return defaultDateProp\n}\n","import { useEffect, useRef, useState } from 'react'\nimport { CalendarDate } from '@internationalized/date'\nimport { BREAKPOINT_MD } from '@core/tokens'\nimport { above } from '@core/utils/screen'\nimport { AUCalendarDate } from '../helpers'\nimport { AUCalendarDateShape } from '../types'\n\ntype UseCalendarProps = {\n minValue: AUCalendarDateShape\n maxValue: AUCalendarDateShape\n value?: AUCalendarDateShape | null\n isVisible: boolean\n onClose: () => void\n onChange: (date: AUCalendarDateShape) => void\n}\n\nexport function useCalendar({\n onChange,\n onClose,\n minValue,\n maxValue,\n value,\n isVisible,\n}: UseCalendarProps) {\n const rootEl = useRef<HTMLDivElement>(null)\n const [enteredAnimation, setEnteredAnimation] = useState(false)\n const [calendarInternalState, setCalendarInternalState] =\n useState<CalendarDate>()\n\n const [delayedIsVisible, setDelayedIsVisible] = useState(false)\n\n const usedMinValue = new CalendarDate(\n minValue.year,\n minValue.month,\n minValue.day,\n )\n const usedMaxValue = new CalendarDate(\n maxValue.year,\n maxValue.month,\n maxValue.day,\n )\n\n useEffect(() => {\n if (!value) return\n const { day, month, year } = value\n setCalendarInternalState(new CalendarDate(year, month, day))\n }, [value])\n\n useEffect(() => {\n if (isVisible) {\n setDelayedIsVisible(true)\n return delayComponentMount()\n } else {\n return delayComponentUnmount()\n }\n }, [isVisible])\n\n function delayComponentMount(delayTime = 100) {\n const t = setTimeout(() => {\n setEnteredAnimation(true)\n }, delayTime)\n\n return () => {\n clearTimeout(t)\n }\n }\n\n function delayComponentUnmount(delayTime = 200) {\n setEnteredAnimation(false)\n const timoutToUnmount = setTimeout(() => {\n setDelayedIsVisible(false)\n }, delayTime)\n\n return () => {\n clearTimeout(timoutToUnmount)\n }\n }\n\n function fmtWeekday(day: string) {\n const capitalized = `${day.charAt(0).toUpperCase()}${day.slice(1)}`\n return capitalized.replace('.', '')\n }\n\n function triggerChange(date: CalendarDate) {\n const { day, month, year } = date\n onChange(AUCalendarDate(day, month, year))\n onClose()\n }\n\n function calendarChange(date: CalendarDate) {\n setCalendarInternalState(date)\n if (!above(BREAKPOINT_MD)) return\n triggerChange(date)\n }\n\n function actionChange() {\n if (calendarInternalState) {\n triggerChange(calendarInternalState)\n }\n }\n\n return {\n actionChange,\n calendarChange,\n fmtWeekday,\n usedMaxValue,\n usedMinValue,\n rootEl,\n calendarInternalState,\n enteredAnimation,\n delayedIsVisible,\n }\n}\n","import classNames from 'classnames'\nimport {\n Calendar,\n CalendarCell,\n CalendarGrid,\n CalendarGridBody,\n CalendarGridHeader,\n CalendarHeaderCell,\n} from 'react-aria-components'\nimport { Button } from '@components/Button'\nimport { CalendarHeader } from '../CalendarHeader'\nimport { PortalHolder } from '../PortalHolder'\n\n\nimport { AUCalendarDateShape } from '../types'\nimport { useCalendar } from './hook'\nimport './styles.scss'\n\ntype DatepickerCalendarProps = {\n withPortal?: boolean\n minValue: AUCalendarDateShape\n maxValue: AUCalendarDateShape\n value?: AUCalendarDateShape | null\n onClose: () => void\n onChange: (date: AUCalendarDateShape) => void\n isVisible: boolean\n}\n\nexport const DatepickerCalendar = ({\n onClose,\n withPortal,\n minValue,\n maxValue,\n value,\n onChange,\n isVisible,\n}: DatepickerCalendarProps) => {\n const {\n rootEl,\n usedMaxValue,\n usedMinValue,\n calendarInternalState,\n calendarChange,\n fmtWeekday,\n actionChange,\n enteredAnimation,\n delayedIsVisible,\n } = useCalendar({\n onChange,\n onClose,\n minValue,\n maxValue,\n value,\n isVisible,\n })\n\n const componentClass = classNames('au-datepicker__calendar', {\n 'au-datepicker__calendar--visible': enteredAnimation,\n })\n\n if (!delayedIsVisible) return\n\n return (\n <PortalHolder withPortal={withPortal}>\n <div className={componentClass} ref={rootEl}>\n <div className=\"au-datepicker__calendar-backdrop\" onClick={onClose} />\n <div className=\"au-datepicker__calendar-card\">\n <Calendar\n autoFocus\n className=\"au-datepicker__calendar-base\"\n minValue={usedMinValue}\n maxValue={usedMaxValue}\n value={calendarInternalState}\n onChange={calendarChange}>\n <CalendarHeader defaultFocusDate={calendarInternalState} />\n <CalendarGrid\n className=\"au-datepicker__calendar-grid\"\n weekdayStyle=\"short\">\n <CalendarGridHeader>\n {(day) => (\n <CalendarHeaderCell className=\"au-datepicker__calendar-weekday\">\n {fmtWeekday(day)}\n </CalendarHeaderCell>\n )}\n </CalendarGridHeader>\n <CalendarGridBody>\n {(date) => (\n <CalendarCell\n className=\"au-datepicker__calendar-day\"\n date={date}\n />\n )}\n </CalendarGridBody>\n </CalendarGrid>\n </Calendar>\n <div className=\"au-datepicker__calendar-actions-dock\">\n <Button\n type=\"outlined\"\n className=\"au-datepicker__calendar-cancel\"\n expand=\"x\"\n onClick={onClose}>\n Cancelar\n </Button>\n <Button\n disabled={!calendarInternalState}\n onClick={actionChange}\n expand=\"x\">\n Confirmar\n </Button>\n </div>\n </div>\n </div>\n </PortalHolder>\n )\n}\n"],"names":["CalendarDate","Calendar","CalendarGrid","CalendarGridHeader","CalendarHeaderCell","CalendarGridBody","CalendarCell"],"mappings":"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"}
@@ -5,8 +5,8 @@ import { IconChevronDown } from "./components/icons/IconChevronDown/index.es.js"
5
5
  import { IconChevronLeft } from "./components/icons/IconChevronLeft/index.es.js";
6
6
  import { IconX } from "./components/icons/IconX/index.es.js";
7
7
  import { useState, useRef, useEffect } from "react";
8
- import { a as above } from "./screen-DfYo7XQ_.js";
9
8
  import { B as BREAKPOINT_MD } from "./tokens-DGTtjw-_.js";
9
+ import { a as above } from "./screen-DfYo7XQ_.js";
10
10
  import './components/index/styles3.css';function useOutsideClick({
11
11
  rootEl,
12
12
  breakpoint,
@@ -138,4 +138,4 @@ export {
138
138
  Segment as S,
139
139
  useOutsideClick as u
140
140
  };
141
- //# sourceMappingURL=index-CP-KKFUb.js.map
141
+ //# sourceMappingURL=index-CclsoEnK.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index-CP-KKFUb.js","sources":["../lib/core/hooks/useOutsideClick.ts","../lib/components/form/Datepicker/Segment/hook.ts","../lib/components/form/Datepicker/Segment/index.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { above } from '../utils/screen'\n\ntype UseOutsideClickProps = {\n rootEl: React.RefObject<HTMLDivElement>\n breakpoint?: string\n onLoseFocusCB: () => void\n}\n\nexport function useOutsideClick({\n rootEl,\n breakpoint,\n onLoseFocusCB,\n}: UseOutsideClickProps) {\n const [setupListener, setSetupListener] = useState(false)\n\n function listenOutsideClick() {\n if (breakpoint && !above(breakpoint)) return\n document.addEventListener('mousedown', handleLoseFocus)\n setSetupListener(true)\n }\n\n function clearOutsideClickListenner() {\n if (setupListener) {\n document.removeEventListener('mousedown', handleLoseFocus)\n setSetupListener(false)\n }\n }\n\n function handleLoseFocus(ev: MouseEvent | FocusEvent) {\n if (!rootEl.current) return\n\n const clickedOutside = !rootEl.current.contains(ev.target as Node)\n\n if (clickedOutside) {\n onLoseFocusCB()\n clearOutsideClickListenner()\n }\n }\n\n return {\n listenOutsideClick,\n }\n}\n","import { useEffect, useRef, useState } from 'react'\nimport { BREAKPOINT_MD } from '@core/tokens'\nimport { useOutsideClick } from '@core/hooks/useOutsideClick'\n\nimport { SegmentItem } from '../types'\n\ntype UseSegmentProps = {\n options: SegmentItem[]\n currentValue: string | number\n onSelect: (option: SegmentItem) => void\n}\n\nexport function useSegment({\n options,\n currentValue,\n onSelect,\n}: UseSegmentProps) {\n const [isListOpen, setIsListOpen] = useState(false)\n const rootEl = useRef<HTMLDivElement>(null)\n const selectedItem = useRef<HTMLLIElement>(null)\n const currentItem = options.find((item) => item.value === currentValue)\n const { listenOutsideClick } = useOutsideClick({\n rootEl,\n breakpoint: BREAKPOINT_MD,\n onLoseFocusCB: closeList,\n })\n\n useEffect(() => {\n if (selectedItem.current && isListOpen) {\n selectedItem.current.scrollIntoView({ block: 'center', inline: 'center' })\n }\n }, [isListOpen])\n\n function openList() {\n setIsListOpen(true)\n listenOutsideClick()\n }\n\n function closeList() {\n setIsListOpen(false)\n }\n\n function handleSelectItem(option: SegmentItem) {\n onSelect(option)\n setIsListOpen(false)\n }\n\n return {\n openList,\n closeList,\n isListOpen,\n rootEl,\n currentItem,\n handleSelectItem,\n selectedItem,\n }\n}\n","import classNames from 'classnames'\nimport { IconChevronDown, IconChevronLeft, IconX } from '@components/icons'\n\nimport { useSegment } from './hook'\nimport { SegmentItem } from '../types'\nimport './styles.scss'\n\ntype SegmentProps = {\n mobileTitle: string\n options: SegmentItem[]\n onSelect: (option: SegmentItem) => void\n currentValue: string | number\n minValue?: Date\n maxValue?: Date\n}\n\nexport const Segment = ({\n currentValue,\n options,\n mobileTitle,\n onSelect,\n}: SegmentProps) => {\n const {\n rootEl,\n isListOpen,\n openList,\n closeList,\n currentItem,\n handleSelectItem,\n selectedItem,\n } = useSegment({\n options,\n currentValue,\n onSelect,\n })\n\n return (\n <div\n ref={rootEl}\n tabIndex={0}\n className={classNames('au-datepicker__segment', {\n 'au-datepicker__segment--open': isListOpen,\n })}>\n <div className=\"au-datepicker__segment-input\" onClick={openList}>\n {currentItem?.label}\n <IconChevronDown />\n </div>\n <div className=\"au-datepicker__segment-list-holder\">\n <div className=\"au-datepicker__segment-list-header\">\n <div onClick={closeList}>\n <IconChevronLeft />\n </div>\n <h4 className=\"au-datepicker__segment-title\">{mobileTitle}</h4>\n <div onClick={closeList}>\n <IconX />\n </div>\n </div>\n <ul className=\"au-datepicker__segment-list\">\n {options.map((option, idx) => {\n const isSelectedItem = option.value === currentValue\n return (\n <li\n key={`au-datepicker-segment-li-${option.value}-${idx}`}\n onClick={() => handleSelectItem(option)}\n ref={isSelectedItem ? selectedItem : null}\n className={classNames('au-datepicker__segment-list-item', {\n 'au-datepicker__segment-list-item--active': isSelectedItem,\n })}>\n {option.label}\n </li>\n )\n })}\n </ul>\n </div>\n </div>\n )\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index-CclsoEnK.js","sources":["../lib/core/hooks/useOutsideClick.ts","../lib/components/form/Datepicker/Segment/hook.ts","../lib/components/form/Datepicker/Segment/index.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { above } from '../utils/screen'\n\ntype UseOutsideClickProps = {\n rootEl: React.RefObject<HTMLDivElement>\n breakpoint?: string\n onLoseFocusCB: () => void\n}\n\nexport function useOutsideClick({\n rootEl,\n breakpoint,\n onLoseFocusCB,\n}: UseOutsideClickProps) {\n const [setupListener, setSetupListener] = useState(false)\n\n function listenOutsideClick() {\n if (breakpoint && !above(breakpoint)) return\n document.addEventListener('mousedown', handleLoseFocus)\n setSetupListener(true)\n }\n\n function clearOutsideClickListenner() {\n if (setupListener) {\n document.removeEventListener('mousedown', handleLoseFocus)\n setSetupListener(false)\n }\n }\n\n function handleLoseFocus(ev: MouseEvent | FocusEvent) {\n if (!rootEl.current) return\n\n const clickedOutside = !rootEl.current.contains(ev.target as Node)\n\n if (clickedOutside) {\n onLoseFocusCB()\n clearOutsideClickListenner()\n }\n }\n\n return {\n listenOutsideClick,\n }\n}\n","import { useEffect, useRef, useState } from 'react'\nimport { BREAKPOINT_MD } from '@core/tokens'\nimport { useOutsideClick } from '@core/hooks/useOutsideClick'\n\nimport { SegmentItem } from '../types'\n\ntype UseSegmentProps = {\n options: SegmentItem[]\n currentValue: string | number\n onSelect: (option: SegmentItem) => void\n}\n\nexport function useSegment({\n options,\n currentValue,\n onSelect,\n}: UseSegmentProps) {\n const [isListOpen, setIsListOpen] = useState(false)\n const rootEl = useRef<HTMLDivElement>(null)\n const selectedItem = useRef<HTMLLIElement>(null)\n const currentItem = options.find((item) => item.value === currentValue)\n const { listenOutsideClick } = useOutsideClick({\n rootEl,\n breakpoint: BREAKPOINT_MD,\n onLoseFocusCB: closeList,\n })\n\n useEffect(() => {\n if (selectedItem.current && isListOpen) {\n selectedItem.current.scrollIntoView({ block: 'center', inline: 'center' })\n }\n }, [isListOpen])\n\n function openList() {\n setIsListOpen(true)\n listenOutsideClick()\n }\n\n function closeList() {\n setIsListOpen(false)\n }\n\n function handleSelectItem(option: SegmentItem) {\n onSelect(option)\n setIsListOpen(false)\n }\n\n return {\n openList,\n closeList,\n isListOpen,\n rootEl,\n currentItem,\n handleSelectItem,\n selectedItem,\n }\n}\n","import classNames from 'classnames'\nimport { IconChevronDown, IconChevronLeft, IconX } from '@components/icons'\n\nimport { useSegment } from './hook'\nimport { SegmentItem } from '../types'\nimport './styles.scss'\n\ntype SegmentProps = {\n mobileTitle: string\n options: SegmentItem[]\n onSelect: (option: SegmentItem) => void\n currentValue: string | number\n minValue?: Date\n maxValue?: Date\n}\n\nexport const Segment = ({\n currentValue,\n options,\n mobileTitle,\n onSelect,\n}: SegmentProps) => {\n const {\n rootEl,\n isListOpen,\n openList,\n closeList,\n currentItem,\n handleSelectItem,\n selectedItem,\n } = useSegment({\n options,\n currentValue,\n onSelect,\n })\n\n return (\n <div\n ref={rootEl}\n tabIndex={0}\n className={classNames('au-datepicker__segment', {\n 'au-datepicker__segment--open': isListOpen,\n })}>\n <div className=\"au-datepicker__segment-input\" onClick={openList}>\n {currentItem?.label}\n <IconChevronDown />\n </div>\n <div className=\"au-datepicker__segment-list-holder\">\n <div className=\"au-datepicker__segment-list-header\">\n <div onClick={closeList}>\n <IconChevronLeft />\n </div>\n <h4 className=\"au-datepicker__segment-title\">{mobileTitle}</h4>\n <div onClick={closeList}>\n <IconX />\n </div>\n </div>\n <ul className=\"au-datepicker__segment-list\">\n {options.map((option, idx) => {\n const isSelectedItem = option.value === currentValue\n return (\n <li\n key={`au-datepicker-segment-li-${option.value}-${idx}`}\n onClick={() => handleSelectItem(option)}\n ref={isSelectedItem ? selectedItem : null}\n className={classNames('au-datepicker__segment-list-item', {\n 'au-datepicker__segment-list-item--active': isSelectedItem,\n })}>\n {option.label}\n </li>\n )\n })}\n </ul>\n </div>\n </div>\n )\n}\n"],"names":[],"mappings":"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"}
@@ -3,7 +3,7 @@ import "./index-CweZ_OcN.js";
3
3
  import "./components/Icon/index.es.js";
4
4
  import { IconChevronLeft } from "./components/icons/IconChevronLeft/index.es.js";
5
5
  import { IconChevronRight } from "./components/icons/IconChevronRight/index.es.js";
6
- import { S as Segment } from "./index-CP-KKFUb.js";
6
+ import { S as Segment } from "./index-CclsoEnK.js";
7
7
  import $dbSRa$react__default, { createContext, useContext, useState, useRef, useCallback, useEffect, useMemo, forwardRef } from "react";
8
8
  import "react-dom";
9
9
  createContext(null);
@@ -5686,4 +5686,4 @@ export {
5686
5686
  $dfd62f934fc76fed$export$e11f8ba65d857bff as e,
5687
5687
  $dfd62f934fc76fed$export$5d847498420df57b as f
5688
5688
  };
5689
- //# sourceMappingURL=index-C8RdzVRj.js.map
5689
+ //# sourceMappingURL=index-D1oGcejt.js.map