@telefonica/mistica 12.9.1 → 12.10.0

package/dist-es/date-time-picker.js

@@ -123,293 +123,114 @@ function _unsupportedIterableToArray(o, minLen) {
     if (n === "Map" || n === "Set") return Array.from(n);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
 }
-import * as f from "react";
-import { TextFieldBaseAutosuggest as T } from "./text-field-base.js";
-import M from "./generated/mistica-icons/icon-calendar-regular.js";
+import * as d from "react";
+import { TextFieldBaseAutosuggest as M } from "./text-field-base.js";
+import R from "./generated/mistica-icons/icon-calendar-regular.js";
 import H from "react-datetime";
-import B from "./overlay.js";
-import { DEFAULT_WIDTH as A } from "./text-field-components.js";
-import k from "./icon-button.js";
-import { cancelEvent as R, createChangeEvent as I } from "./utils/dom.js";
-import { createUseStyles as L } from "./jss.js";
-import { useTheme as z, useElementDimensions as Y } from "./hooks.js";
-import E from "./generated/mistica-icons/icon-close-regular.js";
-import { jsxs as F, Fragment as O, jsx as o } from "./_virtual/jsx-runtime.js";
-var b = navigator.language.toLocaleLowerCase().split("-")[0];
-import(/* webpackChunkName: "moment-locale" */ "moment/locale/".concat(b)).finally(function() {});
-var N = L(function() {
-    return {
-        reactDatePicker: {
-            "& td, & th": {
-                verticalAlign: "middle"
-            },
-            "& .rdt": {
-                position: "relative",
-                userSelect: "none"
-            },
-            "& .rdtPicker": {
-                display: "none",
-                position: "absolute",
-                minWidth: 250,
-                padding: 4,
-                marginTop: 1,
-                zIndex: "99999 !important",
-                background: "#fff",
-                boxShadow: "0 1px 3px rgba(0,0,0,.1)",
-                border: "1px solid #f9f9f9"
-            },
-            "& .rdtOpen .rdtPicker": {
-                display: "block"
-            },
-            "& .rdtStatic .rdtPicker": {
-                boxShadow: "none",
-                position: "static"
-            },
-            "& .rdtPicker .rdtTimeToggle": {
-                textAlign: "center"
-            },
-            "& .rdtPicker table": {
-                width: "100%",
-                margin: 0
-            },
-            "& .rdtPicker td, & .rdtPicker th": {
-                textAlign: "center",
-                height: 28
-            },
-            "& .rdtPicker td": {
-                cursor: "pointer"
-            },
-            "& .rdtPicker td.rdtDay:hover, & .rdtPicker td.rdtHour:hover, & .rdtPicker td.rdtMinute:hover, & .rdtPicker td.rdtSecond:hover, & .rdtPicker .rdtTimeToggle:hover": {
-                background: "#eeeeee",
-                cursor: "pointer"
-            },
-            "& .rdtPicker td.rdtOld, & .rdtPicker td.rdtNew": {
-                color: "#999999"
-            },
-            "& .rdtPicker td.rdtToday": {
-                position: "relative"
-            },
-            "& .rdtPicker td.rdtToday:before": {
-                content: '""',
-                display: "inline-block",
-                borderLeft: "7px solid transparent",
-                borderBottom: "7px solid #428bca",
-                borderTopColor: "rgba(0, 0, 0, 0.2)",
-                position: "absolute",
-                bottom: 4,
-                right: 4
-            },
-            "& .rdtPicker td.rdtActive, & .rdtPicker td.rdtActive:hover": {
-                backgroundColor: "#428bca",
-                color: "#fff",
-                textShadow: "0 -1px 0 rgba(0, 0, 0, 0.25)"
-            },
-            "& .rdtPicker td.rdtActive.rdtToday:before": {
-                borderBottomColor: "#fff"
-            },
-            "& .rdtPicker td.rdtDisabled, & .rdtPicker td.rdtDisabled:hover": {
-                background: "none",
-                color: "#999999",
-                cursor: "default"
-            },
-            "& .rdtPicker td span.rdtOld": {
-                color: "#999999"
-            },
-            "& .rdtPicker td span.rdtDisabled, & .rdtPicker td span.rdtDisabled:hover": {
-                background: "none",
-                color: "#999999",
-                cursor: "default"
-            },
-            "& .rdtPicker th": {
-                borderBottom: "1px solid #f9f9f9",
-                fontWeight: "bold"
-            },
-            "& .rdtPicker .dow": {
-                width: "14.2857%",
-                borderBottom: "none",
-                cursor: "default"
-            },
-            "& .rdtPicker th.rdtSwitch": {
-                width: 100
-            },
-            "& .rdtPicker th.rdtNext, & .rdtPicker th.rdtPrev": {
-                fontSize: 21,
-                verticalAlign: "top"
-            },
-            "& .rdtPrev span, & .rdtNext span": {
-                display: "block",
-                userSelect: "none"
-            },
-            "& .rdtPicker th.rdtDisabled, & .rdtPicker th.rdtDisabled:hover": {
-                background: "none",
-                color: "#999999",
-                cursor: "default"
-            },
-            "& .rdtPicker thead tr:first-of-type th": {
-                cursor: "pointer"
-            },
-            "& .rdtPicker thead tr:first-of-type th:hover": {
-                background: "#eeeeee"
-            },
-            "& .rdtPicker tfoot": {
-                borderTop: "1px solid #f9f9f9"
-            },
-            "& .rdtPicker button": {
-                border: "none",
-                background: "none",
-                cursor: "pointer"
-            },
-            "& .rdtPicker button:hover": {
-                backgroundColor: "#eee"
-            },
-            "& .rdtPicker thead button": {
-                width: "100%",
-                height: "100%"
-            },
-            "& td.rdtMonth, & td.rdtYear": {
-                height: 50,
-                width: "25%",
-                cursor: "pointer"
-            },
-            "& td.rdtMonth:hover, & td.rdtYear:hover": {
-                background: "#eee"
-            },
-            "& .rdtCounters": {
-                display: "inline-block"
-            },
-            "& .rdtCounters > div": {
-                float: "left"
-            },
-            "& .rdtCounter": {
-                height: 100,
-                width: 40
-            },
-            "& .rdtCounterSeparator": {
-                lineHeight: "100px"
-            },
-            "& .rdtCounter .rdtBtn": {
-                height: "40%",
-                lineHeight: "40px",
-                cursor: "pointer",
-                display: "block",
-                userSelect: "none"
-            },
-            "& .rdtCounter .rdtBtn:hover": {
-                background: "#eee"
-            },
-            "& .rdtCounter .rdtCount": {
-                height: "20%",
-                fontsize: "1.2em"
-            },
-            "& .rdtMilli": {
-                verticalAlign: "middle",
-                paddingLeft: 8,
-                width: 48
-            },
-            "& .rdtMilli input": {
-                width: "100%",
-                fontSize: "1.2em",
-                marginTop: 37
-            },
-            "& .rdtTime td": {
-                cursor: "default"
-            }
-        }
-    };
-}), Z = function(_param) {
-    var l = _param.withTime, a = _param.mode, g = _param.isValidDate, s = _param.optional, r = _objectWithoutProperties(_param, [
+import S from "./overlay.js";
+import { DEFAULT_WIDTH as I } from "./text-field-components.js";
+import g from "./icon-button.js";
+import { cancelEvent as B, createChangeEvent as E } from "./utils/dom.js";
+import { useTheme as F, useElementDimensions as L } from "./hooks.js";
+import T from "./generated/mistica-icons/icon-close-regular.js";
+import { reactDatePicker as V } from "./date-time-picker.css-mistica.js";
+import { jsxs as Y, Fragment as j, jsx as r } from "./_virtual/jsx-runtime.js";
+var h = navigator.language.toLocaleLowerCase().split("-")[0];
+import(/* webpackChunkName: "moment-locale" */ "moment/locale/".concat(h)).finally(function() {});
+var Q = function(_param) {
+    var s = _param.withTime, l = _param.mode, y = _param.isValidDate, u = _param.optional, t = _objectWithoutProperties(_param, [
         "withTime",
         "mode",
         "isValidDate",
         "optional"
     ]);
-    var ref = _slicedToArray(f.useState(!1), 2), u = ref[0], m = ref[1], P = N(), ref1 = z(), x = ref1.texts, i = f.useRef(null), ref2 = Y(), y = ref2.height, v = ref2.ref, d = function(t) {
-        r.disabled || m(t);
+    var ref = _slicedToArray(d.useState(!1), 2), m = ref[0], x = ref[1], ref1 = F(), b = ref1.texts, n = d.useRef(null), ref2 = L(), k = ref2.height, v = ref2.ref, a = function(e) {
+        t.disabled || x(e);
     }, w = function() {
-        var h;
-        var ref = ((h = i.current) == null ? void 0 : h.getBoundingClientRect()) || {}, tmp = ref.top, t = tmp === void 0 ? 0 : tmp, tmp1 = ref.bottom, e = tmp1 === void 0 ? 0 : tmp1, tmp2 = ref.left, n = tmp2 === void 0 ? 0 : tmp2, D = 260 + e < window.innerHeight;
+        var p;
+        var ref = ((p = n.current) == null ? void 0 : p.getBoundingClientRect()) || {}, tmp = ref.top, e = tmp === void 0 ? 0 : tmp, tmp1 = ref.bottom, o = tmp1 === void 0 ? 0 : tmp1, tmp2 = ref.left, i = tmp2 === void 0 ? 0 : tmp2, P = 260 + o < window.innerHeight;
         return {
-            width: A,
-            top: D ? e : t - y,
-            left: n,
+            width: I,
+            top: P ? o : e - k,
+            left: i,
             position: "absolute",
             borderRadius: 8,
             overflow: "hidden",
             boxShadow: "0px 5px 5px -3px rgba(0,0,0,0.2), 0px 8px 10px 1px rgba(0,0,0,0.14), 0px 3px 14px 2px rgba(0,0,0,0.12)"
         };
     }, c = function() {
-        var e;
-        var t = (e = i.current) == null ? void 0 : e.value;
-        return t ? new Date(t) : void 0;
-    }, C = function(t) {
-        return l ? t.format("yyyy-MM-DD HH:mm") : a === "year-month" ? t.format("yyyy-MM") : t.format("yyyy-MM-DD");
-    }, p = function(t) {
-        var n;
-        var e = typeof t == "string" ? t : C(t);
-        i.current && (i.current.focus(), (n = r.onChange) == null || n.call(r, I(i.current, e)));
-    }, S = function() {
-        return c() && s ? /* @__PURE__ */ o(k, {
-            "aria-label": x.clearButton,
+        var o;
+        var e = (o = n.current) == null ? void 0 : o.value;
+        return e ? new Date(e) : void 0;
+    }, C = function(e) {
+        return s ? e.format("yyyy-MM-DD HH:mm") : l === "year-month" ? e.format("yyyy-MM") : e.format("yyyy-MM-DD");
+    }, f = function(e) {
+        var i;
+        var o = typeof e == "string" ? e : C(e);
+        n.current && (n.current.focus(), (i = t.onChange) == null || i.call(t, E(n.current, o)));
+    }, D = function() {
+        return c() && u ? /* @__PURE__ */ r(g, {
+            "aria-label": b.clearButton,
             size: 32,
-            onPress: function(t) {
-                t.stopPropagation(), p("");
+            onPress: function(e) {
+                e.stopPropagation(), f("");
             },
-            children: /* @__PURE__ */ o(E, {})
-        }) : /* @__PURE__ */ o(k, {
-            disabled: r.disabled,
+            children: /* @__PURE__ */ r(T, {})
+        }) : /* @__PURE__ */ r(g, {
+            disabled: t.disabled,
             "aria-label": "",
             size: 32,
             onPress: function() {
-                return d(!u);
+                return a(!m);
             },
-            children: /* @__PURE__ */ o(M, {})
+            children: /* @__PURE__ */ r(R, {})
         });
     };
-    return /* @__PURE__ */ F(O, {
+    return /* @__PURE__ */ Y(j, {
         children: [
-            /* @__PURE__ */ o(T, _objectSpreadProps(_objectSpread({}, r), {
+            /* @__PURE__ */ r(M, _objectSpreadProps(_objectSpread({}, t), {
                 style: {
                     cursor: "default"
                 },
-                required: !s,
+                required: !u,
                 type: "text",
                 autoComplete: "off",
                 shrinkLabel: !!c(),
-                endIcon: S(),
-                inputRef: function(t) {
-                    var e;
-                    (e = r == null ? void 0 : r.inputRef) == null || e.call(r, t), i.current = t;
+                endIcon: D(),
+                inputRef: function(e) {
+                    var o;
+                    (o = t == null ? void 0 : t.inputRef) == null || o.call(t, e), n.current = e;
                 },
                 readOnly: !0,
                 onKeyDown: function() {
-                    return d(!0);
+                    return a(!0);
                 },
                 onClick: function() {
-                    d(!0);
+                    a(!0);
                 }
             })),
-            u && /* @__PURE__ */ o(B, {
-                onPress: function(t) {
-                    R(t), d(!1);
+            m && /* @__PURE__ */ r(S, {
+                onPress: function(e) {
+                    B(e), a(!1);
                 },
                 disableScroll: !0,
-                children: /* @__PURE__ */ o("div", {
+                children: /* @__PURE__ */ r("div", {
                     ref: v,
                     style: w(),
-                    className: P.reactDatePicker,
-                    children: /* @__PURE__ */ o(H, {
-                        initialViewMode: a === "year-month" ? "months" : void 0,
-                        dateFormat: a === "year-month" ? "YYYY-MM" : void 0,
-                        timeFormat: l ? "HH:mm" : !1,
+                    className: V,
+                    children: /* @__PURE__ */ r(H, {
+                        initialViewMode: l === "year-month" ? "months" : void 0,
+                        dateFormat: l === "year-month" ? "YYYY-MM" : void 0,
+                        timeFormat: s ? "HH:mm" : !1,
                         initialValue: c(),
-                        locale: b,
+                        locale: h,
                         input: !1,
-                        onChange: p,
-                        isValidDate: g
+                        onChange: f,
+                        isValidDate: y
                     })
                 })
             })
         ]
     });
 };
-export { Z as default };
+export { Q as default };

package/dist-es/dialog.css-mistica.js

@@ -0,0 +1,7 @@
+import "./sprinkles.css.ts.vanilla.js";
+import "./dialog.css.ts.vanilla.js";
+var _ = "_3dl29lb", y = "_3dl29l6", f = "_3dl29ll _1y2v1nf83", l = "_3dl29lj _1y2v1nf7w _1y2v1nfaq", a = "_3dl29lm", d = "_3dl29l8 _1y2v1nf82 _1y2v1nf8g _1y2v1nf8u _1y2v1nf98 _1y2v1nf77 _1y2v1nfbg _1y2v1nfc8", o = "_3dl29la _1y2v1nf2f _1y2v1nfbb", r = "_3dl29l5 _1y2v1nf78 _1y2v1nf7b _1y2v1nf7k _1y2v1nf7q _1y2v1nf7h _1y2v1nfbg _1y2v1nfc8 _1y2v1nfcm _1y2v1nfbu _1y2v1nf2i", t = {
+    dialog: "_3dl29ld _1y2v1nf7b _1y2v1nf7h _1y2v1nf7n _1y2v1nf8v _1y2v1nf99 _1y2v1nf85 _1y2v1nf8h",
+    default: "_3dl29ld _1y2v1nf7b _1y2v1nf7h _1y2v1nf7n _1y2v1nf83 _1y2v1nf8h _1y2v1nf8v _1y2v1nf99"
+}, e = "_3dl29l3 _1y2v1nf76";
+export { _ as closedModalContent, y as closedOpactityLayer, f as dialogActions, l as dialogContent, a as iconContainer, d as modalCloseButtonContainer, o as modalContent, r as modalOpacityLayer, t as variants, e as wrapper };

package/dist-es/dialog.css.ts.vanilla.js

@@ -0,0 +1,2 @@
+var a = "";
+export { a as default };