@yr3/ui 1.0.23 → 1.1.1

package/dist/index.js

@@ -1,3 +1,9 @@
+var __defProp = Object.defineProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+
 // src/utils/bem.ts
 var bem = (block) => {
   return (element, modifiers) => {
@@ -11,67 +17,1968 @@ var bem = (block) => {
         } else {
           classes.push(`${base}--${value}`);
         }
-      });
+      });
+    }
+    return classes.join(" ");
+  };
+};
+var bemMerge = (...args) => {
+  return args.flatMap((arg) => {
+    if (!arg) return [];
+    if (typeof arg === "string") return [arg];
+    if (typeof arg === "object") {
+      return Object.entries(arg).filter(([_, v]) => v).map(([k]) => k);
+    }
+    return [];
+  }).join(" ");
+};
+
+// src/utils/common.ts
+var common_exports = {};
+__export(common_exports, {
+  assign: () => assign,
+  blendColors: () => blendColors,
+  camelCase: () => camelCase,
+  capitalize: () => capitalize,
+  capitalizeWords: () => capitalizeWords,
+  ceil: () => ceil,
+  chunk: () => chunk,
+  clamp: () => clamp,
+  clampNumber: () => clampNumber,
+  compact: () => compact,
+  concat: () => concat,
+  countBy: () => countBy,
+  darkenColor: () => darkenColor,
+  debounce: () => debounce,
+  decapitalize: () => decapitalize,
+  decapitalizeWords: () => decapitalizeWords,
+  defaults: () => defaults,
+  defaultsDeep: () => defaultsDeep,
+  desaturateColor: () => desaturateColor,
+  difference: () => difference,
+  differenceBy: () => differenceBy,
+  emToPx: () => emToPx,
+  endsWith: () => endsWith,
+  entries: () => entries,
+  escape: () => escape,
+  first: () => first,
+  flatten: () => flatten,
+  floor: () => floor,
+  fromEntries: () => fromEntries,
+  generateAnalogousPalette: () => generateAnalogousPalette,
+  generateComplementaryPalette: () => generateComplementaryPalette,
+  generateGradientColors: () => generateGradientColors,
+  generateMonochromaticPalette: () => generateMonochromaticPalette,
+  generateNanoId: () => generateNanoId,
+  generateRandomAlphaId: () => generateRandomAlphaId,
+  generateRandomAlphanumericId: () => generateRandomAlphanumericId,
+  generateRandomApiKey: () => generateRandomApiKey,
+  generateRandomBase64Id: () => generateRandomBase64Id,
+  generateRandomColor: () => generateRandomColor,
+  generateRandomColorPalette: () => generateRandomColorPalette,
+  generateRandomColorScheme: () => generateRandomColorScheme,
+  generateRandomCoolColor: () => generateRandomCoolColor,
+  generateRandomCoolPalette: () => generateRandomCoolPalette,
+  generateRandomDarkColor: () => generateRandomDarkColor,
+  generateRandomDarkPalette: () => generateRandomDarkPalette,
+  generateRandomDomain: () => generateRandomDomain,
+  generateRandomEarthToneColor: () => generateRandomEarthToneColor,
+  generateRandomEarthTonePalette: () => generateRandomEarthTonePalette,
+  generateRandomEmail: () => generateRandomEmail,
+  generateRandomGradient: () => generateRandomGradient,
+  generateRandomHSLColor: () => generateRandomHSLColor,
+  generateRandomHexColor: () => generateRandomHexColor,
+  generateRandomHexId: () => generateRandomHexId,
+  generateRandomLightColor: () => generateRandomLightColor,
+  generateRandomLightPalette: () => generateRandomLightPalette,
+  generateRandomMetallicColor: () => generateRandomMetallicColor,
+  generateRandomMetallicPalette: () => generateRandomMetallicPalette,
+  generateRandomMutedColor: () => generateRandomMutedColor,
+  generateRandomMutedPalette: () => generateRandomMutedPalette,
+  generateRandomNeonColor: () => generateRandomNeonColor,
+  generateRandomNeonPalette: () => generateRandomNeonPalette,
+  generateRandomNeutralColor: () => generateRandomNeutralColor,
+  generateRandomNeutralPalette: () => generateRandomNeutralPalette,
+  generateRandomNumericId: () => generateRandomNumericId,
+  generateRandomPassword: () => generateRandomPassword,
+  generateRandomPastelColor: () => generateRandomPastelColor,
+  generateRandomPastelPalette: () => generateRandomPastelPalette,
+  generateRandomRGBColor: () => generateRandomRGBColor,
+  generateRandomSessionId: () => generateRandomSessionId,
+  generateRandomSlug: () => generateRandomSlug,
+  generateRandomString: () => generateRandomString,
+  generateRandomToken: () => generateRandomToken,
+  generateRandomUrlSafeId: () => generateRandomUrlSafeId,
+  generateRandomUsername: () => generateRandomUsername,
+  generateRandomVibrantColor: () => generateRandomVibrantColor,
+  generateRandomVibrantPalette: () => generateRandomVibrantPalette,
+  generateRandomWarmColor: () => generateRandomWarmColor,
+  generateRandomWarmPalette: () => generateRandomWarmPalette,
+  generateShortId: () => generateShortId,
+  generateTetradicPalette: () => generateTetradicPalette,
+  generateTriadicPalette: () => generateTriadicPalette,
+  generateUUID: () => generateUUID,
+  generateUniqueId: () => generateUniqueId,
+  get: () => get,
+  getContrastColor: () => getContrastColor,
+  getDeepValue: () => getDeepValue,
+  getNestedValue: () => getNestedValue,
+  getValue: () => getValue,
+  getValueByPath: () => getValueByPath,
+  groupBy: () => groupBy,
+  hasDeepKey: () => hasDeepKey,
+  hasDeepValue: () => hasDeepValue,
+  hasKey: () => hasKey,
+  hasKeyByPath: () => hasKeyByPath,
+  hasNestedKey: () => hasNestedKey,
+  hasNestedValue: () => hasNestedValue,
+  hasValue: () => hasValue,
+  hasValueByPath: () => hasValueByPath,
+  hexToHSL: () => hexToHSL,
+  hexToRGB: () => hexToRGB,
+  hslToHex: () => hslToHex,
+  hslToRGB: () => hslToRGB,
+  includes: () => includes,
+  intersection: () => intersection,
+  intersectionBy: () => intersectionBy,
+  invert: () => invert,
+  invertColor: () => invertColor,
+  isArrayValue: () => isArrayValue,
+  isBase64: () => isBase64,
+  isBigIntValue: () => isBigIntValue,
+  isBooleanValue: () => isBooleanValue,
+  isCreditCard: () => isCreditCard,
+  isDarkColor: () => isDarkColor,
+  isEmail: () => isEmail,
+  isEmpty: () => isEmpty,
+  isEmptyArray: () => isEmptyArray,
+  isEmptyObject: () => isEmptyObject,
+  isEmptyString: () => isEmptyString,
+  isEmptyValue: () => isEmptyValue,
+  isFiniteNumber: () => isFiniteNumber,
+  isFunctionValue: () => isFunctionValue,
+  isHexColor: () => isHexColor,
+  isHexadecimal: () => isHexadecimal,
+  isIPv4: () => isIPv4,
+  isIPv6: () => isIPv6,
+  isISBN: () => isISBN,
+  isInteger: () => isInteger,
+  isJSON: () => isJSON,
+  isLightColor: () => isLightColor,
+  isMACAddress: () => isMACAddress,
+  isNaNValue: () => isNaNValue,
+  isNullValue: () => isNullValue,
+  isNumberValue: () => isNumberValue,
+  isObjectValue: () => isObjectValue,
+  isPhoneNumber: () => isPhoneNumber,
+  isPostalCode: () => isPostalCode,
+  isRGBColor: () => isRGBColor,
+  isSafeInteger: () => isSafeInteger,
+  isSlug: () => isSlug,
+  isStringValue: () => isStringValue,
+  isSymbolValue: () => isSymbolValue,
+  isURL: () => isURL,
+  isUUID: () => isUUID,
+  isUndefinedValue: () => isUndefinedValue,
+  isXML: () => isXML,
+  kebabCase: () => kebabCase,
+  keys: () => keys,
+  last: () => last,
+  lightenColor: () => lightenColor,
+  map: () => map,
+  mapKeys: () => mapKeys,
+  mapValues: () => mapValues,
+  memoize: () => memoize,
+  merge: () => merge,
+  mergeDeep: () => mergeDeep,
+  mixColors: () => mixColors,
+  nth: () => nth,
+  omit: () => omit,
+  omitBy: () => omitBy,
+  omitByDeep: () => omitByDeep,
+  once: () => once,
+  padEnd: () => padEnd,
+  padStart: () => padStart,
+  parseFloatValue: () => parseFloatValue,
+  parseIntValue: () => parseIntValue,
+  partition: () => partition,
+  percentToPx: () => percentToPx,
+  pick: () => pick,
+  pickBy: () => pickBy,
+  pickByDeep: () => pickByDeep,
+  pxToEm: () => pxToEm,
+  pxToPercent: () => pxToPercent,
+  pxToRem: () => pxToRem,
+  random: () => random,
+  randomNumber: () => randomNumber,
+  range: () => range,
+  remToEm: () => remToEm,
+  remToPx: () => remToPx,
+  repeat: () => repeat,
+  rgbToHSL: () => rgbToHSL,
+  rgbToHex: () => rgbToHex,
+  rotateHue: () => rotateHue,
+  round: () => round,
+  saturateColor: () => saturateColor,
+  setDeepValue: () => setDeepValue,
+  setNestedValue: () => setNestedValue,
+  setValue: () => setValue,
+  setValueByPath: () => setValueByPath,
+  shadeColor: () => shadeColor,
+  snakeCase: () => snakeCase,
+  startsWith: () => startsWith,
+  swapCase: () => swapCase,
+  throttle: () => throttle,
+  times: () => times,
+  tintColor: () => tintColor,
+  toExponential: () => toExponential,
+  toFinite: () => toFinite,
+  toFiniteNumber: () => toFiniteNumber,
+  toFixed: () => toFixed,
+  toInteger: () => toInteger,
+  toNumber: () => toNumber,
+  toPrecision: () => toPrecision,
+  toSafeInteger: () => toSafeInteger,
+  trim: () => trim,
+  trimEnd: () => trimEnd,
+  trimStart: () => trimStart,
+  truncate: () => truncate,
+  unescape: () => unescape,
+  union: () => union,
+  unionBy: () => unionBy,
+  uniqBy: () => uniqBy,
+  unique: () => unique,
+  unzip: () => unzip,
+  unzipWith: () => unzipWith,
+  upperCase: () => upperCase,
+  values: () => values,
+  without: () => without,
+  xor: () => xor,
+  zip: () => zip,
+  zipObject: () => zipObject,
+  zipObjectDeep: () => zipObjectDeep,
+  zipWith: () => zipWith,
+  zipWithDeep: () => zipWithDeep
+});
+function isEmpty(value) {
+  if (value == null) return true;
+  if (typeof value === "string") return value.trim().length === 0;
+  if (Array.isArray(value)) return value.length === 0;
+  if (value instanceof Map || value instanceof Set) {
+    return value.size === 0;
+  }
+  if (typeof value === "object") {
+    return Object.keys(value).length === 0;
+  }
+  return false;
+}
+function times(n, iteratee) {
+  const result = [];
+  for (let i = 0; i < n; i++) {
+    result.push(iteratee(i));
+  }
+  return result;
+}
+function map(array, key, valueKey) {
+  const result = {};
+  for (const item of array) {
+    result[item[key]] = item[valueKey];
+  }
+  return result;
+}
+function get(obj, key) {
+  return obj[key];
+}
+function mergeDeep(target, source) {
+  if (typeof target !== "object" || target === null) {
+    return source;
+  }
+  const result = { ...target };
+  for (const key in source) {
+    if (source.hasOwnProperty(key)) {
+      const sourceValue = source[key];
+      const targetValue = target[key];
+      if (typeof sourceValue === "object" && sourceValue !== null) {
+        result[key] = mergeDeep(targetValue, sourceValue);
+      } else {
+        result[key] = sourceValue;
+      }
+    }
+  }
+  return result;
+}
+function omit(obj, keys2) {
+  const result = { ...obj };
+  for (const key of keys2) {
+    delete result[key];
+  }
+  return result;
+}
+function pick(obj, keys2) {
+  const result = {};
+  for (const key of keys2) {
+    if (key in obj) {
+      result[key] = obj[key];
+    }
+  }
+  return result;
+}
+function flatten(array) {
+  const result = [];
+  for (const subArray of array) {
+    result.push(...subArray);
+  }
+  return result;
+}
+function unique(array) {
+  const seen = /* @__PURE__ */ new Set();
+  const result = [];
+  for (const item of array) {
+    if (!seen.has(item)) {
+      seen.add(item);
+      result.push(item);
+    }
+  }
+  return result;
+}
+function debounce(func, wait) {
+  let timeout = null;
+  return function(...args) {
+    if (timeout) {
+      clearTimeout(timeout);
+    }
+    timeout = setTimeout(() => {
+      func.apply(this, args);
+    }, wait);
+  };
+}
+function throttle(func, limit) {
+  let inThrottle = false;
+  return function(...args) {
+    if (!inThrottle) {
+      func.apply(this, args);
+      inThrottle = true;
+      setTimeout(() => {
+        inThrottle = false;
+      }, limit);
+    }
+  };
+}
+function once(func) {
+  let called = false;
+  return function(...args) {
+    if (!called) {
+      called = true;
+      func.apply(this, args);
+    }
+  };
+}
+function memoize(func) {
+  const cache = /* @__PURE__ */ new Map();
+  return function(...args) {
+    const key = JSON.stringify(args);
+    if (cache.has(key)) {
+      return cache.get(key);
+    }
+    const result = func.apply(this, args);
+    cache.set(key, result);
+    return result;
+  };
+}
+function range(start, end, step = 1) {
+  const result = [];
+  for (let i = start; i < end; i += step) {
+    result.push(i);
+  }
+  return result;
+}
+function random(min, max) {
+  return Math.floor(Math.random() * (max - min + 1)) + min;
+}
+function clamp(value, min, max) {
+  return Math.max(min, Math.min(max, value));
+}
+function capitalize(str) {
+  if (str.length === 0) return str;
+  return str.charAt(0).toUpperCase() + str.slice(1);
+}
+function camelCase(str) {
+  return str.replace(/[-_]+/g, " ").replace(/[^\w\s]/g, "").replace(/\s+(.)(\w*)/g, (_, p1, p2) => p1.toUpperCase() + p2.toLowerCase()).replace(/\s/g, "");
+}
+function kebabCase(str) {
+  return str.replace(/([a-z])([A-Z])/g, "$1-$2").replace(/[\s_]+/g, "-").toLowerCase();
+}
+function snakeCase(str) {
+  return str.replace(/([a-z])([A-Z])/g, "$1_$2").replace(/[\s-]+/g, "_").toLowerCase();
+}
+function upperCase(str) {
+  return str.toUpperCase();
+}
+function difference(array1, array2) {
+  const set2 = new Set(array2);
+  return array1.filter((item) => !set2.has(item));
+}
+function intersection(array1, array2) {
+  const set2 = new Set(array2);
+  return array1.filter((item) => set2.has(item));
+}
+function union(array1, array2) {
+  const set = /* @__PURE__ */ new Set([...array1, ...array2]);
+  return Array.from(set);
+}
+function zip(array1, array2) {
+  const length = Math.min(array1.length, array2.length);
+  const result = [];
+  for (let i = 0; i < length; i++) {
+    result.push([array1[i], array2[i]]);
+  }
+  return result;
+}
+function unzip(array) {
+  const array1 = [];
+  const array2 = [];
+  for (const [item1, item2] of array) {
+    array1.push(item1);
+    array2.push(item2);
+  }
+  return [array1, array2];
+}
+function groupBy(array, key) {
+  const result = {};
+  for (const item of array) {
+    const groupKey = String(item[key]);
+    if (!result[groupKey]) {
+      result[groupKey] = [];
+    }
+    result[groupKey].push(item);
+  }
+  return result;
+}
+function partition(array, predicate) {
+  const truthy = [];
+  const falsy = [];
+  for (const item of array) {
+    if (predicate(item)) {
+      truthy.push(item);
+    } else {
+      falsy.push(item);
+    }
+  }
+  return [truthy, falsy];
+}
+function countBy(array, key) {
+  const result = {};
+  for (const item of array) {
+    const countKey = String(item[key]);
+    result[countKey] = (result[countKey] || 0) + 1;
+  }
+  return result;
+}
+function chunk(array, size) {
+  const result = [];
+  for (let i = 0; i < array.length; i += size) {
+    result.push(array.slice(i, i + size));
+  }
+  return result;
+}
+function compact(array) {
+  return array.filter(Boolean);
+}
+function concat(...arrays) {
+  const result = [];
+  for (const array of arrays) {
+    result.push(...array);
+  }
+  return result;
+}
+function differenceBy(array1, array2, iteratee) {
+  const set2 = new Set(array2.map(iteratee));
+  return array1.filter((item) => !set2.has(iteratee(item)));
+}
+function intersectionBy(array1, array2, iteratee) {
+  const set2 = new Set(array2.map(iteratee));
+  return array1.filter((item) => set2.has(iteratee(item)));
+}
+function unionBy(array1, array2, iteratee) {
+  const seen = /* @__PURE__ */ new Set();
+  const result = [];
+  for (const item of [...array1, ...array2]) {
+    const key = iteratee(item);
+    if (!seen.has(key)) {
+      seen.add(key);
+      result.push(item);
+    }
+  }
+  return result;
+}
+function uniqBy(array, iteratee) {
+  const seen = /* @__PURE__ */ new Set();
+  const result = [];
+  for (const item of array) {
+    const key = iteratee(item);
+    if (!seen.has(key)) {
+      seen.add(key);
+      result.push(item);
+    }
+  }
+  return result;
+}
+function zipWith(array1, array2, iteratee) {
+  const length = Math.min(array1.length, array2.length);
+  const result = [];
+  for (let i = 0; i < length; i++) {
+    result.push(iteratee(array1[i], array2[i]));
+  }
+  return result;
+}
+function unzipWith(array, iteratee) {
+  const result = [];
+  for (const [item1, item2] of array) {
+    result.push(iteratee(item1, item2));
+  }
+  return result;
+}
+function without(array, ...values2) {
+  const valueSet = new Set(values2);
+  return array.filter((item) => !valueSet.has(item));
+}
+function xor(array1, array2) {
+  const set1 = new Set(array1);
+  const set2 = new Set(array2);
+  const result = [];
+  for (const item of array1) {
+    if (!set2.has(item)) {
+      result.push(item);
+    }
+  }
+  for (const item of array2) {
+    if (!set1.has(item)) {
+      result.push(item);
+    }
+  }
+  return result;
+}
+function zipObject(keys2, values2) {
+  const result = {};
+  for (let i = 0; i < keys2.length; i++) {
+    result[keys2[i]] = values2[i];
+  }
+  return result;
+}
+function zipObjectDeep(keys2, values2) {
+  const result = {};
+  for (let i = 0; i < keys2.length; i++) {
+    const keyParts = String(keys2[i]).split(".");
+    let current = result;
+    for (let j = 0; j < keyParts.length; j++) {
+      const part = keyParts[j];
+      if (j === keyParts.length - 1) {
+        current[part] = values2[i];
+      } else {
+        current[part] = current[part] || {};
+        current = current[part];
+      }
+    }
+  }
+  return result;
+}
+function zipWithDeep(keys2, values2, iteratee) {
+  const result = {};
+  for (let i = 0; i < keys2.length; i++) {
+    const keyParts = String(keys2[i]).split(".");
+    let current = result;
+    for (let j = 0; j < keyParts.length; j++) {
+      const part = keyParts[j];
+      if (j === keyParts.length - 1) {
+        current[part] = iteratee(values2[i]);
+      } else {
+        current[part] = current[part] || {};
+        current = current[part];
+      }
+    }
+  }
+  return result;
+}
+function first(array) {
+  return array[0];
+}
+function last(array) {
+  return array[array.length - 1];
+}
+function nth(array, n) {
+  if (n < 0) {
+    return array[array.length + n];
+  }
+  return array[n];
+}
+function keys(obj) {
+  return Object.keys(obj);
+}
+function values(obj) {
+  return Object.values(obj);
+}
+function entries(obj) {
+  return Object.entries(obj);
+}
+function fromEntries(entries2) {
+  const result = {};
+  for (const [key, value] of entries2) {
+    result[key] = value;
+  }
+  return result;
+}
+function invert(obj) {
+  const result = {};
+  for (const key in obj) {
+    if (obj.hasOwnProperty(key)) {
+      const value = obj[key];
+      result[value] = key;
+    }
+  }
+  return result;
+}
+function mapValues(obj, iteratee) {
+  const result = {};
+  for (const key in obj) {
+    if (obj.hasOwnProperty(key)) {
+      result[key] = iteratee(obj[key], key);
+    }
+  }
+  return result;
+}
+function mapKeys(obj, iteratee) {
+  const result = {};
+  for (const key in obj) {
+    if (obj.hasOwnProperty(key)) {
+      const newKey = iteratee(obj[key], key);
+      result[newKey] = obj[key];
+    }
+  }
+  return result;
+}
+function merge(target, ...sources) {
+  const result = { ...target };
+  for (const source of sources) {
+    for (const key in source) {
+      if (source.hasOwnProperty(key)) {
+        const sourceValue = source[key];
+        const targetValue = result[key];
+        if (typeof sourceValue === "object" && sourceValue !== null) {
+          result[key] = merge(targetValue, sourceValue);
+        } else {
+          result[key] = sourceValue;
+        }
+      }
+    }
+  }
+  return result;
+}
+function assign(target, ...sources) {
+  return Object.assign(target, ...sources);
+}
+function defaults(target, ...sources) {
+  const result = { ...target };
+  for (const source of sources) {
+    for (const key in source) {
+      if (source.hasOwnProperty(key) && result[key] === void 0) {
+        result[key] = source[key];
+      }
+    }
+  }
+  return result;
+}
+function defaultsDeep(target, ...sources) {
+  const result = { ...target };
+  for (const source of sources) {
+    for (const key in source) {
+      if (source.hasOwnProperty(key)) {
+        const sourceValue = source[key];
+        const targetValue = result[key];
+        if (typeof sourceValue === "object" && sourceValue !== null) {
+          result[key] = defaultsDeep(targetValue, sourceValue);
+        } else if (result[key] === void 0) {
+          result[key] = sourceValue;
+        }
+      }
+    }
+  }
+  return result;
+}
+function pickBy(obj, predicate) {
+  const result = {};
+  for (const key in obj) {
+    if (obj.hasOwnProperty(key)) {
+      const value = obj[key];
+      if (predicate(value, key)) {
+        result[key] = value;
+      }
+    }
+  }
+  return result;
+}
+function omitBy(obj, predicate) {
+  const result = {};
+  for (const key in obj) {
+    if (obj.hasOwnProperty(key)) {
+      const value = obj[key];
+      if (!predicate(value, key)) {
+        result[key] = value;
+      }
+    }
+  }
+  return result;
+}
+function pickByDeep(obj, predicate) {
+  const result = {};
+  for (const key in obj) {
+    if (obj.hasOwnProperty(key)) {
+      const value = obj[key];
+      if (typeof value === "object" && value !== null) {
+        const nestedResult = pickByDeep(value, predicate);
+        if (Object.keys(nestedResult).length > 0) {
+          result[key] = nestedResult;
+        }
+      } else if (predicate(value, key)) {
+        result[key] = value;
+      }
+    }
+  }
+  return result;
+}
+function omitByDeep(obj, predicate) {
+  const result = {};
+  for (const key in obj) {
+    if (obj.hasOwnProperty(key)) {
+      const value = obj[key];
+      if (typeof value === "object" && value !== null) {
+        const nestedResult = omitByDeep(value, predicate);
+        result[key] = nestedResult;
+      } else if (!predicate(value, key)) {
+        result[key] = value;
+      }
+    }
+  }
+  return result;
+}
+function isEmptyObject(obj) {
+  return Object.keys(obj).length === 0;
+}
+function isEmptyArray(arr) {
+  return arr.length === 0;
+}
+function isEmptyString(str) {
+  return str.trim().length === 0;
+}
+function isEmptyValue(value) {
+  return value == null || typeof value === "string" && value.trim().length === 0 || Array.isArray(value) && value.length === 0 || typeof value === "object" && Object.keys(value).length === 0;
+}
+function startsWith(str, prefix) {
+  return str.startsWith(prefix);
+}
+function endsWith(str, suffix) {
+  return str.endsWith(suffix);
+}
+function includes(str, search) {
+  return str.includes(search);
+}
+function repeat(str, times2) {
+  return str.repeat(times2);
+}
+function padStart(str, targetLength, padString = " ") {
+  return str.padStart(targetLength, padString);
+}
+function padEnd(str, targetLength, padString = " ") {
+  return str.padEnd(targetLength, padString);
+}
+function trim(str) {
+  return str.trim();
+}
+function trimStart(str) {
+  return str.trimStart();
+}
+function trimEnd(str) {
+  return str.trimEnd();
+}
+function truncate(str, length, omission = "...") {
+  if (str.length <= length) return str;
+  return str.slice(0, length - omission.length) + omission;
+}
+function escape(str) {
+  return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}
+function unescape(str) {
+  return str.replace(/&amp;/g, "&").replace(/&lt;/g, "<").replace(/&gt;/g, ">").replace(/&quot;/g, '"').replace(/&#39;/g, "'");
+}
+function capitalizeWords(str) {
+  return str.replace(/\b\w/g, (char) => char.toUpperCase());
+}
+function decapitalize(str) {
+  if (str.length === 0) return str;
+  return str.charAt(0).toLowerCase() + str.slice(1);
+}
+function decapitalizeWords(str) {
+  return str.replace(/\b\w/g, (char) => char.toLowerCase());
+}
+function swapCase(str) {
+  return str.split("").map((char) => {
+    if (char === char.toUpperCase()) {
+      return char.toLowerCase();
+    } else {
+      return char.toUpperCase();
+    }
+  }).join("");
+}
+function clampNumber(num, min, max) {
+  return Math.max(min, Math.min(max, num));
+}
+function randomNumber(min, max) {
+  return Math.random() * (max - min) + min;
+}
+function round(num, precision = 0) {
+  const factor = Math.pow(10, precision);
+  return Math.round(num * factor) / factor;
+}
+function floor(num, precision = 0) {
+  const factor = Math.pow(10, precision);
+  return Math.floor(num * factor) / factor;
+}
+function ceil(num, precision = 0) {
+  const factor = Math.pow(10, precision);
+  return Math.ceil(num * factor) / factor;
+}
+function toFixed(num, precision = 0) {
+  return num.toFixed(precision);
+}
+function toExponential(num, precision = 0) {
+  return num.toExponential(precision);
+}
+function toPrecision(num, precision = 0) {
+  return num.toPrecision(precision);
+}
+function isInteger(num) {
+  return Number.isInteger(num);
+}
+function isFiniteNumber(num) {
+  return Number.isFinite(num);
+}
+function isNaNValue(num) {
+  return Number.isNaN(num);
+}
+function isSafeInteger(num) {
+  return Number.isSafeInteger(num);
+}
+function parseIntValue(str, radix = 10) {
+  return parseInt(str, radix);
+}
+function parseFloatValue(str) {
+  return parseFloat(str);
+}
+function toNumber(value) {
+  return Number(value);
+}
+function toInteger(value) {
+  return parseInt(String(value), 10);
+}
+function toFinite(value) {
+  const num = toNumber(value);
+  if (num === Infinity) return Number.MAX_VALUE;
+  if (num === -Infinity) return -Number.MAX_VALUE;
+  return isNaN(num) ? 0 : num;
+}
+function toSafeInteger(value) {
+  const num = toInteger(value);
+  if (num > Number.MAX_SAFE_INTEGER) return Number.MAX_SAFE_INTEGER;
+  if (num < Number.MIN_SAFE_INTEGER) return Number.MIN_SAFE_INTEGER;
+  return num;
+}
+function toFiniteNumber(value) {
+  const num = toNumber(value);
+  if (num === Infinity) return Number.MAX_VALUE;
+  if (num === -Infinity) return -Number.MAX_VALUE;
+  return isNaN(num) ? 0 : num;
+}
+function getValue(obj, key) {
+  return obj[key];
+}
+function setValue(obj, key, value) {
+  obj[key] = value;
+}
+function hasKey(obj, key) {
+  return key in obj;
+}
+function hasValue(obj, value) {
+  return Object.values(obj).includes(value);
+}
+function getNestedValue(obj, key1, key2) {
+  return obj[key1][key2];
+}
+function setNestedValue(obj, key1, key2, value) {
+  obj[key1][key2] = value;
+}
+function hasNestedKey(obj, key1, key2) {
+  return key1 in obj && key2 in obj[key1];
+}
+function hasNestedValue(obj, key1, key2, value) {
+  return obj[key1][key2] === value;
+}
+function getDeepValue(obj, key1, key2, key3) {
+  return obj[key1][key2][key3];
+}
+function setDeepValue(obj, key1, key2, key3, value) {
+  obj[key1][key2][key3] = value;
+}
+function hasDeepKey(obj, key1, key2, key3) {
+  return key1 in obj && key2 in obj[key1] && key3 in obj[key1][key2];
+}
+function hasDeepValue(obj, key1, key2, key3, value) {
+  return obj[key1][key2][key3] === value;
+}
+function getValueByPath(obj, path) {
+  const keys2 = path.split(".");
+  let current = obj;
+  for (const key of keys2) {
+    if (current == null) return void 0;
+    current = current[key];
+  }
+  return current;
+}
+function setValueByPath(obj, path, value) {
+  const keys2 = path.split(".");
+  let current = obj;
+  for (let i = 0; i < keys2.length; i++) {
+    const key = keys2[i];
+    if (i === keys2.length - 1) {
+      current[key] = value;
+    } else {
+      current[key] = current[key] || {};
+      current = current[key];
+    }
+  }
+}
+function hasKeyByPath(obj, path) {
+  const keys2 = path.split(".");
+  let current = obj;
+  for (const key of keys2) {
+    if (current == null || !(key in current)) return false;
+    current = current[key];
+  }
+  return true;
+}
+function hasValueByPath(obj, path, value) {
+  const keys2 = path.split(".");
+  let current = obj;
+  for (const key of keys2) {
+    if (current == null || !(key in current)) return false;
+    current = current[key];
+  }
+  return current === value;
+}
+function isNumberValue(value) {
+  return typeof value === "number" && !isNaN(value);
+}
+function isStringValue(value) {
+  return typeof value === "string";
+}
+function isBooleanValue(value) {
+  return typeof value === "boolean";
+}
+function isObjectValue(value) {
+  return typeof value === "object" && value !== null;
+}
+function isArrayValue(value) {
+  return Array.isArray(value);
+}
+function isFunctionValue(value) {
+  return typeof value === "function";
+}
+function isNullValue(value) {
+  return value === null;
+}
+function isUndefinedValue(value) {
+  return value === void 0;
+}
+function isSymbolValue(value) {
+  return typeof value === "symbol";
+}
+function isBigIntValue(value) {
+  return typeof value === "bigint";
+}
+function isEmail(str) {
+  const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+  return emailRegex.test(str);
+}
+function isURL(str) {
+  const urlRegex = /^(https?|ftp):\/\/[^\s/$.?#].[^\s]*$/i;
+  return urlRegex.test(str);
+}
+function isPhoneNumber(str) {
+  const phoneRegex = /^\+?[1-9]\d{1,14}$/;
+  return phoneRegex.test(str);
+}
+function isPostalCode(str) {
+  const postalCodeRegex = /^\d{5}(-\d{4})?$/;
+  return postalCodeRegex.test(str);
+}
+function isCreditCard(str) {
+  const creditCardRegex = /^(?:4[0-9]{12}(?:[0-9]{3})?|5[1-5][0-9]{14}|3[47][0-9]{13}|6(?:011|5[0-9]{2})[0-9]{12}|(?:2131|1800|35\d{3})\d{11})$/;
+  return creditCardRegex.test(str);
+}
+function isISBN(str) {
+  const isbn10Regex = /^(?:\d{9}X|\d{10})$/;
+  const isbn13Regex = /^(?:\d{13})$/;
+  return isbn10Regex.test(str) || isbn13Regex.test(str);
+}
+function isJSON(str) {
+  try {
+    JSON.parse(str);
+    return true;
+  } catch {
+    return false;
+  }
+}
+function isXML(str) {
+  const parser = new DOMParser();
+  const doc = parser.parseFromString(str, "application/xml");
+  return !doc.querySelector("parsererror");
+}
+function isBase64(str) {
+  const base64Regex = /^(?:[A-Za-z0-9+\/]{4})*(?:[A-Za-z0-9+\/]{2}==|[A-Za-z0-9+\/]{3}=)?$/;
+  return base64Regex.test(str);
+}
+function isHexadecimal(str) {
+  const hexRegex = /^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/;
+  return hexRegex.test(str);
+}
+function isUUID(str) {
+  const uuidRegex = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
+  return uuidRegex.test(str);
+}
+function isIPv4(str) {
+  const ipv4Regex = /^(25[0-5]|2[0-4]\d|1\d{2}|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d{2}|[1-9]?\d)){3}$/;
+  return ipv4Regex.test(str);
+}
+function isIPv6(str) {
+  const ipv6Regex = /^(?:[0-9a-fA-F]{1,4}:){7}[0-9a-fA-F]{1,4}$/;
+  return ipv6Regex.test(str);
+}
+function isMACAddress(str) {
+  const macRegex = /^([0-9A-Fa-f]{2}[:\-]){5}([0-9A-Fa-f]{2})$/;
+  return macRegex.test(str);
+}
+function isSlug(str) {
+  const slugRegex = /^[a-z0-9]+(?:-[a-z0-9]+)*$/;
+  return slugRegex.test(str);
+}
+function isHexColor(str) {
+  const hexColorRegex = /^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/;
+  return hexColorRegex.test(str);
+}
+function isRGBColor(str) {
+  const rgbColorRegex = /^rgb\(\s*(\d{1,3}\s*,\s*){2}\d{1,3}\s*\)$/;
+  return rgbColorRegex.test(str);
+}
+function hexToRGB(hex) {
+  const hexRegex = /^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/;
+  if (!hexRegex.test(hex)) return null;
+  let r, g, b;
+  if (hex.length === 4) {
+    r = parseInt(hex[1] + hex[1], 16);
+    g = parseInt(hex[2] + hex[2], 16);
+    b = parseInt(hex[3] + hex[3], 16);
+  } else {
+    r = parseInt(hex.slice(1, 3), 16);
+    g = parseInt(hex.slice(3, 5), 16);
+    b = parseInt(hex.slice(5, 7), 16);
+  }
+  return { r, g, b };
+}
+function rgbToHex(r, g, b) {
+  const toHex = (num) => num.toString(16).padStart(2, "0");
+  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
+}
+function rgbToHSL(r, g, b) {
+  r /= 255;
+  g /= 255;
+  b /= 255;
+  const max = Math.max(r, g, b);
+  const min = Math.min(r, g, b);
+  let h = 0, s = 0, l = (max + min) / 2;
+  if (max !== min) {
+    const d = max - min;
+    s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
+    switch (max) {
+      case r:
+        h = (g - b) / d + (g < b ? 6 : 0);
+        break;
+      case g:
+        h = (b - r) / d + 2;
+        break;
+      case b:
+        h = (r - g) / d + 4;
+        break;
+    }
+    h /= 6;
+  }
+  return { h: Math.round(h * 360), s: Math.round(s * 100), l: Math.round(l * 100) };
+}
+function hslToRGB(h, s, l) {
+  h /= 360;
+  s /= 100;
+  l /= 100;
+  let r, g, b;
+  if (s === 0) {
+    r = g = b = l;
+  } else {
+    const hueToRGB = (p2, q2, t) => {
+      if (t < 0) t += 1;
+      if (t > 1) t -= 1;
+      if (t < 1 / 6) return p2 + (q2 - p2) * 6 * t;
+      if (t < 1 / 2) return q2;
+      if (t < 2 / 3) return p2 + (q2 - p2) * (2 / 3 - t) * 6;
+      return p2;
+    };
+    const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
+    const p = 2 * l - q;
+    r = hueToRGB(p, q, h + 1 / 3);
+    g = hueToRGB(p, q, h);
+    b = hueToRGB(p, q, h - 1 / 3);
+  }
+  return { r: Math.round(r * 255), g: Math.round(g * 255), b: Math.round(b * 255) };
+}
+function hexToHSL(hex) {
+  const rgb = hexToRGB(hex);
+  if (!rgb) return null;
+  return rgbToHSL(rgb.r, rgb.g, rgb.b);
+}
+function hslToHex(h, s, l) {
+  const rgb = hslToRGB(h, s, l);
+  return rgbToHex(rgb.r, rgb.g, rgb.b);
+}
+function lightenColor(hex, amount) {
+  const hsl = hexToHSL(hex);
+  if (!hsl) return null;
+  hsl.l = Math.min(100, hsl.l + amount);
+  return hslToHex(hsl.h, hsl.s, hsl.l);
+}
+function darkenColor(hex, amount) {
+  const hsl = hexToHSL(hex);
+  if (!hsl) return null;
+  hsl.l = Math.max(0, hsl.l - amount);
+  return hslToHex(hsl.h, hsl.s, hsl.l);
+}
+function saturateColor(hex, amount) {
+  const hsl = hexToHSL(hex);
+  if (!hsl) return null;
+  hsl.s = Math.min(100, hsl.s + amount);
+  return hslToHex(hsl.h, hsl.s, hsl.l);
+}
+function desaturateColor(hex, amount) {
+  const hsl = hexToHSL(hex);
+  if (!hsl) return null;
+  hsl.s = Math.max(0, hsl.s - amount);
+  return hslToHex(hsl.h, hsl.s, hsl.l);
+}
+function rotateHue(hex, degrees) {
+  const hsl = hexToHSL(hex);
+  if (!hsl) return null;
+  hsl.h = (hsl.h + degrees) % 360;
+  if (hsl.h < 0) hsl.h += 360;
+  return hslToHex(hsl.h, hsl.s, hsl.l);
+}
+function invertColor(hex) {
+  const rgb = hexToRGB(hex);
+  if (!rgb) return null;
+  const invertedR = 255 - rgb.r;
+  const invertedG = 255 - rgb.g;
+  const invertedB = 255 - rgb.b;
+  return rgbToHex(invertedR, invertedG, invertedB);
+}
+function isLightColor(hex) {
+  const rgb = hexToRGB(hex);
+  if (!rgb) return null;
+  const brightness = (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1e3;
+  return brightness > 128;
+}
+function isDarkColor(hex) {
+  const rgb = hexToRGB(hex);
+  if (!rgb) return null;
+  const brightness = (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1e3;
+  return brightness <= 128;
+}
+function getContrastColor(hex) {
+  const rgb = hexToRGB(hex);
+  if (!rgb) return null;
+  const brightness = (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1e3;
+  return brightness > 128 ? "#000000" : "#FFFFFF";
+}
+function blendColors(hex1, hex2, ratio) {
+  const rgb1 = hexToRGB(hex1);
+  const rgb2 = hexToRGB(hex2);
+  if (!rgb1 || !rgb2) return null;
+  const r = Math.round(rgb1.r * (1 - ratio) + rgb2.r * ratio);
+  const g = Math.round(rgb1.g * (1 - ratio) + rgb2.g * ratio);
+  const b = Math.round(rgb1.b * (1 - ratio) + rgb2.b * ratio);
+  return rgbToHex(r, g, b);
+}
+function mixColors(hex1, hex2) {
+  return blendColors(hex1, hex2, 0.5);
+}
+function shadeColor(hex, percent) {
+  const rgb = hexToRGB(hex);
+  if (!rgb) return null;
+  const r = Math.round(rgb.r * (1 + percent / 100));
+  const g = Math.round(rgb.g * (1 + percent / 100));
+  const b = Math.round(rgb.b * (1 + percent / 100));
+  return rgbToHex(clampNumber(r, 0, 255), clampNumber(g, 0, 255), clampNumber(b, 0, 255));
+}
+function tintColor(hex, percent) {
+  const rgb = hexToRGB(hex);
+  if (!rgb) return null;
+  const r = Math.round(rgb.r + (255 - rgb.r) * (percent / 100));
+  const g = Math.round(rgb.g + (255 - rgb.g) * (percent / 100));
+  const b = Math.round(rgb.b + (255 - rgb.b) * (percent / 100));
+  return rgbToHex(clampNumber(r, 0, 255), clampNumber(g, 0, 255), clampNumber(b, 0, 255));
+}
+function generateRandomColor() {
+  const r = Math.floor(Math.random() * 256);
+  const g = Math.floor(Math.random() * 256);
+  const b = Math.floor(Math.random() * 256);
+  return rgbToHex(r, g, b);
+}
+function generateRandomHexColor() {
+  const hex = Math.floor(Math.random() * 16777215).toString(16).padStart(6, "0");
+  return `#${hex}`;
+}
+function generateRandomRGBColor() {
+  const r = Math.floor(Math.random() * 256);
+  const g = Math.floor(Math.random() * 256);
+  const b = Math.floor(Math.random() * 256);
+  return `rgb(${r}, ${g}, ${b})`;
+}
+function generateRandomHSLColor() {
+  const h = Math.floor(Math.random() * 360);
+  const s = Math.floor(Math.random() * 100);
+  const l = Math.floor(Math.random() * 100);
+  return `hsl(${h}, ${s}%, ${l}%)`;
+}
+function generateRandomColorScheme(baseHex, schemeType) {
+  const baseHSL = hexToHSL(baseHex);
+  if (!baseHSL) return null;
+  const { h, s, l } = baseHSL;
+  let scheme = [];
+  switch (schemeType) {
+    case "complementary":
+      scheme.push(hslToHex((h + 180) % 360, s, l));
+      break;
+    case "analogous":
+      scheme.push(hslToHex((h + 30) % 360, s, l));
+      scheme.push(hslToHex((h - 30 + 360) % 360, s, l));
+      break;
+    case "triadic":
+      scheme.push(hslToHex((h + 120) % 360, s, l));
+      scheme.push(hslToHex((h + 240) % 360, s, l));
+      break;
+    case "tetradic":
+      scheme.push(hslToHex((h + 90) % 360, s, l));
+      scheme.push(hslToHex((h + 180) % 360, s, l));
+      scheme.push(hslToHex((h + 270) % 360, s, l));
+      break;
+  }
+  return scheme;
+}
+function generateGradientColors(startHex, endHex, steps) {
+  const startRGB = hexToRGB(startHex);
+  const endRGB = hexToRGB(endHex);
+  if (!startRGB || !endRGB) return null;
+  const gradientColors = [];
+  for (let i = 0; i < steps; i++) {
+    const ratio = i / (steps - 1);
+    const r = Math.round(startRGB.r * (1 - ratio) + endRGB.r * ratio);
+    const g = Math.round(startRGB.g * (1 - ratio) + endRGB.g * ratio);
+    const b = Math.round(startRGB.b * (1 - ratio) + endRGB.b * ratio);
+    gradientColors.push(rgbToHex(r, g, b));
+  }
+  return gradientColors;
+}
+function generateRandomGradient(steps) {
+  const startHex = generateRandomHexColor();
+  const endHex = generateRandomHexColor();
+  return generateGradientColors(startHex, endHex, steps) || [];
+}
+function generateRandomColorPalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomHexColor());
+  }
+  return palette;
+}
+function generateMonochromaticPalette(baseHex, count) {
+  const baseHSL = hexToHSL(baseHex);
+  if (!baseHSL) return null;
+  const { h, s, l } = baseHSL;
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    const lightness = clampNumber(l + (i - Math.floor(count / 2)) * 10, 0, 100);
+    palette.push(hslToHex(h, s, lightness));
+  }
+  return palette;
+}
+function generateAnalogousPalette(baseHex, count) {
+  const baseHSL = hexToHSL(baseHex);
+  if (!baseHSL) return null;
+  const { h, s, l } = baseHSL;
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    const hue = (h + (i - Math.floor(count / 2)) * 30 + 360) % 360;
+    palette.push(hslToHex(hue, s, l));
+  }
+  return palette;
+}
+function generateComplementaryPalette(baseHex) {
+  const baseHSL = hexToHSL(baseHex);
+  if (!baseHSL) return null;
+  const { h, s, l } = baseHSL;
+  const complementaryHue = (h + 180) % 360;
+  return [baseHex, hslToHex(complementaryHue, s, l)];
+}
+function generateTriadicPalette(baseHex) {
+  const baseHSL = hexToHSL(baseHex);
+  if (!baseHSL) return null;
+  const { h, s, l } = baseHSL;
+  const hue1 = (h + 120) % 360;
+  const hue2 = (h + 240) % 360;
+  return [baseHex, hslToHex(hue1, s, l), hslToHex(hue2, s, l)];
+}
+function generateTetradicPalette(baseHex) {
+  const baseHSL = hexToHSL(baseHex);
+  if (!baseHSL) return null;
+  const { h, s, l } = baseHSL;
+  const hue1 = (h + 90) % 360;
+  const hue2 = (h + 180) % 360;
+  const hue3 = (h + 270) % 360;
+  return [baseHex, hslToHex(hue1, s, l), hslToHex(hue2, s, l), hslToHex(hue3, s, l)];
+}
+function generateRandomPastelColor() {
+  const r = Math.floor(Math.random() * 127 + 128);
+  const g = Math.floor(Math.random() * 127 + 128);
+  const b = Math.floor(Math.random() * 127 + 128);
+  return rgbToHex(r, g, b);
+}
+function generateRandomVibrantColor() {
+  const r = Math.floor(Math.random() * 256);
+  const g = Math.floor(Math.random() * 256);
+  const b = Math.floor(Math.random() * 256);
+  return rgbToHex(r, g, b);
+}
+function generateRandomMutedColor() {
+  const r = Math.floor(Math.random() * 128 + 64);
+  const g = Math.floor(Math.random() * 128 + 64);
+  const b = Math.floor(Math.random() * 128 + 64);
+  return rgbToHex(r, g, b);
+}
+function generateRandomDarkColor() {
+  const r = Math.floor(Math.random() * 128);
+  const g = Math.floor(Math.random() * 128);
+  const b = Math.floor(Math.random() * 128);
+  return rgbToHex(r, g, b);
+}
+function generateRandomLightColor() {
+  const r = Math.floor(Math.random() * 128 + 128);
+  const g = Math.floor(Math.random() * 128 + 128);
+  const b = Math.floor(Math.random() * 128 + 128);
+  return rgbToHex(r, g, b);
+}
+function generateRandomNeutralColor() {
+  const gray = Math.floor(Math.random() * 256);
+  return rgbToHex(gray, gray, gray);
+}
+function generateRandomWarmColor() {
+  const r = Math.floor(Math.random() * 128 + 128);
+  const g = Math.floor(Math.random() * 128);
+  const b = Math.floor(Math.random() * 128);
+  return rgbToHex(r, g, b);
+}
+function generateRandomCoolColor() {
+  const r = Math.floor(Math.random() * 128);
+  const g = Math.floor(Math.random() * 128 + 128);
+  const b = Math.floor(Math.random() * 128 + 128);
+  return rgbToHex(r, g, b);
+}
+function generateRandomEarthToneColor() {
+  const r = Math.floor(Math.random() * 64 + 64);
+  const g = Math.floor(Math.random() * 64 + 64);
+  const b = Math.floor(Math.random() * 64 + 32);
+  return rgbToHex(r, g, b);
+}
+function generateRandomMetallicColor() {
+  const r = Math.floor(Math.random() * 128 + 128);
+  const g = Math.floor(Math.random() * 128 + 128);
+  const b = Math.floor(Math.random() * 128 + 128);
+  return rgbToHex(r, g, b);
+}
+function generateRandomNeonColor() {
+  const r = Math.floor(Math.random() * 128 + 128);
+  const g = Math.floor(Math.random() * 128 + 128);
+  const b = Math.floor(Math.random() * 128 + 128);
+  return rgbToHex(r, g, b);
+}
+function generateRandomPastelPalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomPastelColor());
+  }
+  return palette;
+}
+function generateRandomVibrantPalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomVibrantColor());
+  }
+  return palette;
+}
+function generateRandomMutedPalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomMutedColor());
+  }
+  return palette;
+}
+function generateRandomDarkPalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomDarkColor());
+  }
+  return palette;
+}
+function generateRandomLightPalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomLightColor());
+  }
+  return palette;
+}
+function generateRandomNeutralPalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomNeutralColor());
+  }
+  return palette;
+}
+function generateRandomWarmPalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomWarmColor());
+  }
+  return palette;
+}
+function generateRandomCoolPalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomCoolColor());
+  }
+  return palette;
+}
+function generateRandomEarthTonePalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomEarthToneColor());
+  }
+  return palette;
+}
+function generateRandomMetallicPalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomMetallicColor());
+  }
+  return palette;
+}
+function generateRandomNeonPalette(count) {
+  const palette = [];
+  for (let i = 0; i < count; i++) {
+    palette.push(generateRandomNeonColor());
+  }
+  return palette;
+}
+function pxToRem(px, base = 16) {
+  return `${px / base}rem`;
+}
+function remToPx(rem, base = 16) {
+  const remValue = parseFloat(rem);
+  return remValue * base;
+}
+function pxToEm(px, base = 16) {
+  return `${px / base}em`;
+}
+function emToPx(em, base = 16) {
+  const emValue = parseFloat(em);
+  return emValue * base;
+}
+function pxToPercent(px, total) {
+  return `${px / total * 100}%`;
+}
+function percentToPx(percent, total) {
+  const percentValue = parseFloat(percent);
+  return percentValue / 100 * total;
+}
+function remToEm(rem, base = 16) {
+  const remValue = parseFloat(rem);
+  return `${remValue}em`;
+}
+function generateUniqueId(length = 8) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let id = "";
+  for (let i = 0; i < length; i++) {
+    id += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return id;
+}
+function generateUUID() {
+  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
+    const r = Math.random() * 16 | 0;
+    const v = c === "x" ? r : r & 3 | 8;
+    return v.toString(16);
+  });
+}
+function generateShortId(length = 6) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let id = "";
+  for (let i = 0; i < length; i++) {
+    id += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return id;
+}
+function generateNanoId(length = 21) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789_-";
+  let id = "";
+  for (let i = 0; i < length; i++) {
+    id += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return id;
+}
+function generateRandomString(length = 10) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let str = "";
+  for (let i = 0; i < length; i++) {
+    str += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return str;
+}
+function generateRandomHexId(length = 16) {
+  const chars = "abcdef0123456789";
+  let id = "";
+  for (let i = 0; i < length; i++) {
+    id += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return id;
+}
+function generateRandomNumericId(length = 8) {
+  const chars = "0123456789";
+  let id = "";
+  for (let i = 0; i < length; i++) {
+    id += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return id;
+}
+function generateRandomAlphaId(length = 8) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
+  let id = "";
+  for (let i = 0; i < length; i++) {
+    id += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return id;
+}
+function generateRandomAlphanumericId(length = 8) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let id = "";
+  for (let i = 0; i < length; i++) {
+    id += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return id;
+}
+function generateRandomBase64Id(length = 12) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
+  let id = "";
+  for (let i = 0; i < length; i++) {
+    id += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return id;
+}
+function generateRandomUrlSafeId(length = 12) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_";
+  let id = "";
+  for (let i = 0; i < length; i++) {
+    id += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return id;
+}
+function generateRandomSlug(length = 8) {
+  const chars = "abcdefghijklmnopqrstuvwxyz0123456789";
+  let slug = "";
+  for (let i = 0; i < length; i++) {
+    slug += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return slug;
+}
+function generateRandomToken(length = 32) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let token = "";
+  for (let i = 0; i < length; i++) {
+    token += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return token;
+}
+function generateRandomApiKey(length = 32) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let apiKey = "";
+  for (let i = 0; i < length; i++) {
+    apiKey += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return apiKey;
+}
+function generateRandomSessionId(length = 24) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let sessionId = "";
+  for (let i = 0; i < length; i++) {
+    sessionId += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return sessionId;
+}
+function generateRandomPassword(length = 12) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+-=";
+  let password = "";
+  for (let i = 0; i < length; i++) {
+    password += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return password;
+}
+function generateRandomUsername(length = 8) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let username = "";
+  for (let i = 0; i < length; i++) {
+    username += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return username;
+}
+function generateRandomEmail(length = 8) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let email = "";
+  for (let i = 0; i < length; i++) {
+    email += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return `${email.toLowerCase()}@example.com`;
+}
+function generateRandomDomain(length = 8) {
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let domain = "";
+  for (let i = 0; i < length; i++) {
+    domain += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return `${domain.toLowerCase()}.com`;
+}
+
+// src/utils/date.ts
+var dtxParse = (value) => {
+  if (!value) return /* @__PURE__ */ new Date();
+  if (value instanceof Date) {
+    return new Date(value);
+  }
+  return new Date(value);
+};
+var date = (value, dateFormat) => {
+  const _dtx = dtxParse(value);
+  const { locale, options } = dateFormat || {};
+  const parts = new Intl.DateTimeFormat(locale || "EN", options).formatToParts(_dtx);
+  const month = _dtx.getMonth();
+  return {
+    date: _dtx,
+    month,
+    parts,
+    getDateSplit: (value2) => {
+      if (!value2) return null;
+      const [month2, year] = value2?.split("-").map(Number);
+      return { year, month: month2 };
+    },
+    // MONTH
+    getMonth: () => _dtx.getMonth(),
+    getMonthFormat: (month2) => new Intl.DateTimeFormat(locale || "EN", { month: options?.month || "2-digit" }).format(_dtx.setMonth(month2)),
+    getMonthsFormat: () => times(12, (i) => new Intl.DateTimeFormat(locale, { month: "short" }).format(_dtx.setMonth(i))),
+    setMonth: (month2) => new Date(_dtx.setMonth(month2)),
+    addMonth: (month2) => new Date(_dtx.setMonth(_dtx.getMonth() + month2)),
+    subtractMonth: (month2) => new Date(_dtx.setMonth(_dtx.getMonth() - month2)),
+    diferenceMonths: (date2) => Math.ceil((dtxParse(date2).getTime() - _dtx.getTime()) / (1e3 * 60 * 60 * 24 * 30)),
+    isSameMonth: (date2) => _dtx.getFullYear() === date2.getFullYear() && _dtx.getMonth() === date2.getMonth(),
+    // YEAR
+    setYear: (year) => new Date(_dtx.setFullYear(year)),
+    getUTCYear: () => _dtx.getUTCFullYear(),
+    addYears: (year) => new Date(_dtx.setFullYear(_dtx.getFullYear() + year)),
+    subtractYears: (year) => new Date(_dtx.setFullYear(_dtx.getFullYear() - year)),
+    diferenceYears: (date2) => Math.ceil((dtxParse(date2).getTime() - _dtx.getTime()) / (1e3 * 60 * 60 * 24 * 365)),
+    isSameYear: (date2) => _dtx.getFullYear() === date2.getFullYear(),
+    // DAYS 
+    setDay: (day) => new Date(_dtx.setDate(day)),
+    addDays: (days) => new Date(_dtx.setDate(_dtx.getDate() + days)),
+    getDay: () => _dtx.getDate(),
+    subtractDays: (days) => new Date(_dtx.setDate(_dtx.getDate() - days)),
+    diferenceDays: (date2) => Math.ceil((dtxParse(date2).getTime() - _dtx.getTime()) / (1e3 * 60 * 60 * 24)),
+    isSameDay: (date2) => _dtx.getFullYear() === date2.getFullYear(),
+    // HOURS
+    addHours: (hours) => new Date(_dtx.setHours(_dtx.getHours() + hours)),
+    setHours: (hours) => new Date(_dtx.setHours(hours)),
+    getHours: () => _dtx.getHours(),
+    subtractHours: (hours) => new Date(_dtx.setHours(_dtx.getHours() - hours)),
+    diferenceHours: (date2) => Math.ceil((dtxParse(date2).getTime() - _dtx.getTime()) / (1e3 * 60 * 60)),
+    // MINUTES
+    addMinutes: (minutes) => new Date(_dtx.setMinutes(_dtx.getMinutes() + minutes)),
+    setMinutes: (minutes) => new Date(_dtx.setMinutes(minutes)),
+    getMinutes: () => _dtx.getMinutes(),
+    subtractMinutes: (minutes) => new Date(_dtx.setMinutes(_dtx.getMinutes() - minutes)),
+    diferenceMinutes: (date2) => Math.ceil((dtxParse(date2).getTime() - _dtx.getTime()) / (1e3 * 60)),
+    // SECONDS 
+    addSeconds: (seconds) => new Date(_dtx.setSeconds(_dtx.getSeconds() + seconds)),
+    setSeconds: (seconds) => new Date(_dtx.setSeconds(seconds)),
+    getSeconds: () => _dtx.getSeconds(),
+    subtractSeconds: (seconds) => new Date(_dtx.setSeconds(_dtx.getSeconds() - seconds)),
+    diferenceSeconds: (date2) => Math.ceil((dtxParse(date2).getTime() - _dtx.getTime()) / 1e3),
+    // Utils
+    isToday: () => _dtx.getDate() === (/* @__PURE__ */ new Date()).getDate(),
+    isAfter: (date2) => _dtx.getTime() > new Date(date2).getTime(),
+    isBefore: (date2) => _dtx.getTime() < new Date(date2).getTime(),
+    formatLastMonth: () => {
+      const data = _dtx.setMonth(month - 1);
+      const response = Intl.DateTimeFormat(locale || "EN", { month: options?.month || "2-digit", year: options?.year || "numeric" }).formatToParts(data);
+      return response.map((part) => {
+        if (part.type === "literal") {
+          return "-";
+        }
+        return part.value;
+      }).join("");
+    },
+    formatPrevMonth: () => {
+      const data = _dtx.setMonth(month + 1);
+      const response = Intl.DateTimeFormat(locale || "EN", { month: options?.month || "2-digit", year: options?.year || "numeric" }).formatToParts(data);
+      return response.map((part) => {
+        if (part.type === "literal") {
+          return "-";
+        }
+        return part.value;
+      }).join("");
+    },
+    getDaysInYear: () => new Date(_dtx.getFullYear(), 11, 31).getDate(),
+    getDaysInMonth: () => new Date(_dtx.getFullYear(), _dtx.getMonth() + 1, 0).getDate(),
+    getDayOfWeek: () => _dtx.getDay(),
+    getDayOfYear: () => Math.ceil((_dtx.getTime() - new Date(_dtx.getFullYear(), 0, 1).getTime()) / (1e3 * 60 * 60 * 24) + 1),
+    getWeekOfYear: () => Math.ceil(((_dtx.getTime() - new Date(_dtx.getFullYear(), 0, 1).getTime()) / (1e3 * 60 * 60 * 24) + 1) / 7),
+    getStartOfDay: () => new Date(_dtx.getFullYear(), _dtx.getMonth(), _dtx.getDate()),
+    getEndOfDay: () => new Date(_dtx.getFullYear(), _dtx.getMonth(), _dtx.getDate(), 23, 59, 59, 999),
+    getStartOfMonth: () => new Date(_dtx.getFullYear(), _dtx.getMonth(), 1),
+    getEndOfMonth: () => new Date(_dtx.getFullYear(), _dtx.getMonth() + 1, 0, 23, 59, 59, 999),
+    getStartOfYear: () => new Date(_dtx.getFullYear(), 0, 1),
+    getEndOfYear: () => new Date(_dtx.getFullYear(), 11, 31, 23, 59, 59, 999),
+    isLeapYear: () => _dtx.getFullYear() % 4 === 0 && _dtx.getFullYear() % 100 !== 0 || _dtx.getFullYear() % 400 === 0,
+    isWeekend: () => {
+      const day = _dtx.getDay();
+      return day === 0 || day === 6;
+    },
+    isTomorrow: () => {
+      const tomorrow = /* @__PURE__ */ new Date();
+      tomorrow.setDate((/* @__PURE__ */ new Date()).getDate() + 1);
+      return _dtx.getDate() === tomorrow.getDate() && _dtx.getMonth() === tomorrow.getMonth() && _dtx.getFullYear() === tomorrow.getFullYear();
+    },
+    // FORMATS
+    formatDateWithLocale: (locale2, options2) => _dtx.toLocaleDateString(locale2, options2),
+    formatTimeWithLocale: (locale2, options2) => _dtx.toLocaleTimeString(locale2, options2),
+    formatDateTimeWithLocale: (locale2, options2) => _dtx.toLocaleString(locale2, options2),
+    getDayOfWeekWithLocale: (locale2) => _dtx.toLocaleDateString(locale2, { weekday: options?.weekday || "long" }),
+    getMonthNameWithLocale: (locale2) => _dtx.toLocaleDateString(locale2, { month: options?.month || "long" }),
+    getYearWithLocale: (locale2) => _dtx.toLocaleDateString(locale2, { year: options?.year || "numeric" }),
+    getHourWithLocale: (locale2) => _dtx.toLocaleTimeString(locale2, { hour: options?.hour || "2-digit" }),
+    getMinuteWithLocale: (locale2) => _dtx.toLocaleTimeString(locale2, { minute: options?.minute || "2-digit" }),
+    getSecondWithLocale: (locale2) => _dtx.toLocaleTimeString(locale2, { second: options?.second || "2-digit" }),
+    getDayOfYearWithLocale: (locale2) => _dtx.toLocaleDateString(locale2, { day: options?.day || "numeric" }),
+    getTimezoneOffset: () => _dtx.getTimezoneOffset(),
+    convertToTimezone: (timezone) => {
+      const utcDate = new Date(_dtx.getTime() + _dtx.getTimezoneOffset() * 6e4);
+      const tzDate = new Date(utcDate.toLocaleString(locale, { timeZone: timezone }));
+      return tzDate;
+    },
+    toDate() {
+      return dtxParse(_dtx);
+    },
+    Timestamp() {
+      return _dtx.getTime();
+    },
+    ISO: () => {
+      return _dtx.toISOString();
+    },
+    UNIX() {
+      return Math.floor(_dtx.getTime() / 1e3);
+    },
+    UTC() {
+      return new Date(Date.UTC(_dtx.getFullYear(), _dtx.getMonth(), _dtx.getDate(), _dtx.getHours(), _dtx.getMinutes(), _dtx.getSeconds()));
+    },
+    UTCHours() {
+      return _dtx.getUTCHours();
+    },
+    UTCMinutes() {
+      return _dtx.getUTCMinutes();
+    },
+    UTCSeconds() {
+      return _dtx.getUTCSeconds();
+    },
+    UTCMilliseconds() {
+      return _dtx.getUTCMilliseconds();
+    },
+    UTCWeekendDay() {
+      return _dtx.getUTCDay();
+    },
+    UTCDay() {
+      return _dtx.getUTCDate();
+    },
+    UTCMonth() {
+      return _dtx.getUTCMonth();
+    },
+    UTCFullYear() {
+      return _dtx.getUTCFullYear();
     }
-    return classes.join(" ");
   };
 };
-var bemMerge = (...args) => {
-  return args.flatMap((arg) => {
-    if (!arg) return [];
-    if (typeof arg === "string") return [arg];
-    if (typeof arg === "object") {
-      return Object.entries(arg).filter(([_, v]) => v).map(([k]) => k);
+var dtx = (value, dateFormat) => {
+  const date2 = dtxParse(value);
+  const { locale, options } = dateFormat || {};
+  return {
+    date: date2,
+    isToday() {
+      const today = /* @__PURE__ */ new Date();
+      return date2.getDate() === today.getDate() && date2.getMonth() === today.getMonth() && date2.getFullYear() === today.getFullYear();
+    },
+    isAfter(other) {
+      return date2.getTime() > dtxParse(other).getTime();
+    },
+    isBefore(other) {
+      return date2.getTime() < dtxParse(other).getTime();
+    },
+    format(locale2 = "it-IT", options2) {
+      return new Intl.DateTimeFormat(
+        locale2,
+        options2
+      ).format(date2);
+    },
+    setDate(month, day) {
+      const copy = new Date(date2);
+      copy.setMonth(month);
+      copy.setDate(day);
+      return dtx(copy);
+    },
+    addDate(days) {
+      const copy = new Date(date2);
+      copy.setDate(copy.getDate() + days);
+      return dtx(copy);
+    },
+    addDays(days) {
+      const copy = new Date(date2);
+      copy.setDate(copy.getDate() + days);
+      return dtx(copy);
+    },
+    setDay(days) {
+      const copy = new Date(date2);
+      copy.setDate(days);
+      return dtx(copy);
+    },
+    dayStart: () => {
+      const firstDayOfMonth = new Date(date2.getFullYear(), date2.getMonth(), 1);
+      return firstDayOfMonth.getDay();
+    },
+    days: new Date(date2.getFullYear(), date2.getMonth() + 1, 0).getDate(),
+    getCurrentUTCDay: () => {
+      const utcDate = new Date((/* @__PURE__ */ new Date()).toUTCString());
+      return utcDate.getDay();
+    },
+    CalendarDaysInMonth(year, month) {
+      return new Date(year, month + 1, 0).getDate();
+    },
+    isWeekend: (day) => {
+      const date3 = /* @__PURE__ */ new Date();
+      date3.setDate(day);
+      const dayOfWeek = date3.getDay();
+      return dayOfWeek === 0 || dayOfWeek === 6;
+    },
+    addMonth(months) {
+      const copy = new Date(date2);
+      copy.setMonth(copy.getMonth() + months);
+      return dtx(copy);
+    },
+    setMonth(month) {
+      const copy = new Date(date2);
+      copy.setMonth(month);
+      return dtx(copy);
+    },
+    isMonth: (month) => month === (/* @__PURE__ */ new Date()).getMonth(),
+    startOfMonth() {
+      return dtx(
+        new Date(
+          date2.getFullYear(),
+          date2.getMonth(),
+          1
+        )
+      );
+    },
+    endOfMonth() {
+      return dtx(
+        new Date(
+          date2.getFullYear(),
+          date2.getMonth() + 1,
+          0
+        )
+      );
+    },
+    getMonthsLocale(locale2 = "EN") {
+      return times(12, (i) => new Intl.DateTimeFormat(locale2, { month: options?.month || "short" }).format(new Date(2e3, i, 1)));
+    },
+    toDate() {
+      return new Date(date2);
+    },
+    toISOString() {
+      return date2.toISOString();
+    },
+    CalendarYearFormat(year, format = "YYYY") {
+      return Intl.DateTimeFormat(dateFormat?.locale, { year: format === "YYYY" ? "numeric" : "2-digit" }).format(new Date(year, 0, 1));
+    },
+    calendar: (props) => {
+      const { dtx: dtx2, month, day, data, selected } = props || {};
+      return {
+        day,
+        date: dtx2.toDate(),
+        iso: dtx2.toISOString(),
+        month,
+        key: dtx2.format(locale || "EN", { month: "2-digit", day: "2-digit", year: "numeric" }).replace(/\//g, "-"),
+        monthName: dtx2.format(locale || "EN", { month: options?.month || "short" }),
+        isToday: dtx2.isToday(),
+        isPast: dtx2.isBefore(/* @__PURE__ */ new Date()),
+        isFuture: dtx2.isAfter(/* @__PURE__ */ new Date()),
+        isCurrentMonth: dtx2.isMonth(month),
+        selected: selected?.day === day || false,
+        data: data || null
+      };
     }
-    return [];
-  }).join(" ");
+  };
 };
 
 // src/utils/calendar.ts
-import dayjs from "dayjs";
-import updatelocale from "dayjs/plugin/updateLocale";
-dayjs.extend(updatelocale);
-function getMonthCalendar(year, month, startIndex, selected, props) {
-  const today = dayjs().startOf("day");
-  const startOfMonth = dayjs().year(year).month(month).startOf("month");
-  const endOfMonth = dayjs().year(year).month(month).endOf("month");
+function getMonthCalendar(dataFormat, year, month, startIndex, selected, props) {
+  const { locale, days, options } = dataFormat || {};
+  const _date = dtx(new Date(year, month, 1), dataFormat);
   let dayCurrent = {};
-  let startDay = startOfMonth.day();
+  let startDay = _date.dayStart();
   startDay = startDay === 0 ? 6 : startDay - 1;
-  const daysInMonth = endOfMonth.date();
+  const daysInMonth = _date.days;
   const calendar = [];
   let week = [];
   for (let i = 0; i < startDay; i++) {
     week.push(null);
   }
   for (let day = 1; day <= daysInMonth; day++) {
-    const date = startOfMonth.date(day);
-    const key = date.format("YYYY-MM-DD");
-    const isToday = date.isSame(today, "day");
-    const isPast = date.isBefore(today, "day");
-    const isFuture = date.isAfter(today, "day");
-    if (date.isSame(today, "day")) {
-      dayCurrent = {
-        day,
-        date,
-        isToday,
-        isPast,
-        isFuture,
-        isCurrentMonth: true,
-        selected: true,
-        data: props ? props[key] || null : null
-      };
-    }
-    week.push({
-      day,
-      date,
-      isToday,
-      isPast,
-      isFuture,
-      isCurrentMonth: true,
-      selected: selected ? date.isSame(selected?.date, "day") : false,
-      data: props ? props[key] || null : null
-    });
+    const key = _date.format(dataFormat.locale || "EN", { day: "2-digit", month: "2-digit", year: "numeric" });
+    week.push(_date.calendar({ dtx: _date.setDate(month, day), month, day, data: [], selected, key }));
     if (week.length === 7) {
       calendar.push(week);
       week = [];
@@ -93,40 +2000,46 @@ function getMonthCalendar(year, month, startIndex, selected, props) {
   return {
     calendar,
     month,
-    date: startOfMonth,
-    daysContainer: getDaysContainer(),
-    monthLabel: startOfMonth.format("MMMM"),
-    yearLabel: startOfMonth.format("YYYY"),
-    days: startOfMonth.daysInMonth(),
+    date: _date.toDate(),
+    daysContainer: getDaysContainer().map((i) => ({ label: isEmpty(days) ? i : days?.[i], value: i })),
+    monthLabel: _date.getMonthsLocale(locale)[month],
+    yearLabel: _date.CalendarYearFormat(year),
+    days: _date.CalendarDaysInMonth(year, month),
     weeks: calendar.length,
-    isWeekend: startOfMonth.day() === 0 || startOfMonth.day() === 6,
+    isWeekend: _date.isWeekend(_date.getCurrentUTCDay()),
     selected: selected ? Object.assign({}, selected) : null,
-    currentDay: dayCurrent
+    currentDay: dayCurrent,
+    props
   };
 }
-function getMonthCalendarProps({ year, data, value, daysFormat }) {
-  const startIndex = dayjs().year(year).month().valueOf();
-  dayjs.updateLocale("en", {
-    months: daysFormat?.months || ["jan", "feb", "mar", "apr", "may", "jun", "jul", "aug", "sep", "oct", "nov", "dec"]
-  });
-  return {
+function getMonthCalendarProps({ year, data, value, format }) {
+  const dtx2 = date(new Date(year, 0, 1), format);
+  const months = dtx2.getMonthsFormat();
+  const r = dtx2.getDateSplit(value);
+  const smonths = times(
+    months.length,
+    (i) => ({
+      year,
+      label: upperCase(months[i]),
+      value: dtx2.getMonthFormat(i),
+      disabled: dtx2.isAfter(new Date(year, i)) || !!data.exclude.find((e) => e.year === year)?.months.includes(i),
+      selected: !data.selected ? false : r?.month === i + 1 && r?.year === year
+    })
+  );
+  const resolve = {
     year,
-    startIndex,
+    startIndex: dtx2.getMonth(),
     years: data.years,
     value,
-    last: !value ? "" : dayjs().year(Number(value?.split("-")[1])).month(Number(value?.split("-")[0]) - 2).format("MM-YYYY"),
-    prev: !value ? "" : dayjs().year(Number(value?.split("-")[1])).month(Number(value?.split("-")[0])).format("MM-YYYY"),
-    months: Array.from({ length: 12 }, (_, i) => ({
-      label: dayjs().month(i).format(daysFormat?.month || "MMM"),
-      value: dayjs().month(i).format(daysFormat?.value || "MM"),
-      disabled: dayjs().year(year).month(i).isAfter(dayjs(), "month") || data.exclude.find((e) => e.year === year)?.months.includes(i),
-      selected: !data.selected ? false : dayjs().year(year).month(Number(value?.split("-")[0]) - 1).format("MM") === dayjs().month(i).format(daysFormat?.value || "MM")
-    }))
+    last: dtx2.formatLastMonth(),
+    prev: dtx2.formatPrevMonth(),
+    months: smonths
   };
+  return resolve;
 }
 
 // src/utils/color.ts
-var rgbToHex = (r, g, b) => {
+var rgbToHex2 = (r, g, b) => {
   return "#" + [r, g, b].map(
     (v) => Math.round(Math.max(0, Math.min(255, v))).toString(16).padStart(2, "0")
   ).join("");
@@ -169,7 +2082,7 @@ var createPaletteColor = (main) => {
 };
 var lighten = (hex, amount) => {
   const { r, g, b } = hexToRgb(hex);
-  return rgbToHex(
+  return rgbToHex2(
     r + (255 - r) * amount,
     g + (255 - g) * amount,
     b + (255 - b) * amount
@@ -177,7 +2090,7 @@ var lighten = (hex, amount) => {
 };
 var darken = (hex, amount) => {
   const { r, g, b } = hexToRgb(hex);
-  return rgbToHex(
+  return rgbToHex2(
     r * (1 - amount),
     g * (1 - amount),
     b * (1 - amount)
@@ -188,27 +2101,6 @@ var alpha = (hex, opacity) => {
   return `rgba(${r}, ${g}, ${b}, ${opacity})`;
 };
 
-// src/utils/common.ts
-function isEmpty(value) {
-  if (value == null) return true;
-  if (typeof value === "string") return value.trim().length === 0;
-  if (Array.isArray(value)) return value.length === 0;
-  if (value instanceof Map || value instanceof Set) {
-    return value.size === 0;
-  }
-  if (typeof value === "object") {
-    return Object.keys(value).length === 0;
-  }
-  return false;
-}
-function times(n, iteratee) {
-  const result = [];
-  for (let i = 0; i < n; i++) {
-    result.push(iteratee(i));
-  }
-  return result;
-}
-
 // src/utils/cx.ts
 var cx = (...args) => {
   return args.flatMap((arg) => {
@@ -295,10 +2187,10 @@ var createVariants = (config) => {
   return (props = {}) => {
     const classes = [config.base];
     if (config.variants) {
-      Object.entries(config.variants).forEach(([key, map]) => {
+      Object.entries(config.variants).forEach(([key, map2]) => {
         const value = props[key];
-        if (value && map[value]) {
-          classes.push(map[value]);
+        if (value && map2[value]) {
+          classes.push(map2[value]);
         }
       });
     }
@@ -349,13 +2241,13 @@ var getNumberPhone = (phone, dial) => {
 };
 
 // src/utils/merge.ts
-function mergeDeep(target, source) {
+function mergeDeep2(target, source) {
   if (!source) return target;
   const output = { ...target };
-  Object.keys(source).forEach((key) => {
+  Object.keys(source)?.forEach((key) => {
     const k = key;
     if (typeof source[k] === "object" && source[k] !== null && !Array.isArray(source[k])) {
-      output[k] = mergeDeep(
+      output[k] = mergeDeep2(
         target[k] || {},
         source[k]
       );
@@ -365,6 +2257,10 @@ function mergeDeep(target, source) {
   });
   return output;
 }
+function mergeInitialProps(initial, props) {
+  if (!props) return initial;
+  return mergeDeep2(initial, props);
+}
 
 // src/utils/input.ts
 var inputCurrency = (e, value, alloweds) => {
@@ -375,6 +2271,11 @@ var inputCurrency = (e, value, alloweds) => {
   e.preventDefault();
 };
 
+// src/utils/utils.ts
+var utils = {
+  ...common_exports
+};
+
 // src/theme/breakpoint.ts
 var breakpoints = {
   xs: 0,
@@ -717,6 +2618,127 @@ var Box = ({
   );
 };
 
+// src/components/Flex/flex.variants.ts
+var flexVariants = createVariants({
+  base: "yr3Flex",
+  variants: {
+    variant: {
+      row: "yr3Flex--row",
+      column: "yr3Flex--column",
+      wrap: "yr3Flex--wrap"
+    },
+    container: {
+      true: "yr3Flex--container"
+    },
+    center: {
+      true: "yr3Flex--center"
+    },
+    between: {
+      true: "yr3Flex--between"
+    },
+    bordered: {
+      true: "yr3Flex--bordered"
+    }
+  }
+});
+var flex_variants_default = flexVariants;
+
+// src/components/Flex/Flex.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var Flex = ({
+  container = false,
+  spacing: spacing2 = 1,
+  children,
+  ui,
+  gap,
+  variant = "column",
+  center = false,
+  between = false,
+  style,
+  bordered = false,
+  ...props
+}) => {
+  const classes = flex_variants_default({ variant, container, center, between, bordered, spacing: spacing2 });
+  return /* @__PURE__ */ jsx5(
+    "div",
+    {
+      className: classes,
+      style: composeStyles(ui, style),
+      ...props,
+      "data-testid": "yr3Flex",
+      children
+    }
+  );
+};
+
+// src/components/Loader/loader.variants.ts
+var loaderSpinnerVariants = createVariants({
+  base: "yr3Loader--spinner",
+  variants: {
+    color: {
+      primary: "yr3Loader--spinner-color-primary",
+      secondary: "yr3Loader--spinner-color-secondary",
+      success: "yr3Loader--spinner-color-success",
+      error: "yr3Loader--spinner-color-error",
+      warning: "yr3Loader--spinner-color-warning",
+      info: "yr3Loader--spinner-color-info",
+      disabled: "yr3Loader--spinner-color-disabled",
+      text: "yr3Loader--spinner-color-text",
+      background: "yr3Loader--spinner-color-background",
+      common: "yr3Loader--spinner-color-common"
+    },
+    size: {
+      sm: "yr3Loader--spinner-size-sm",
+      md: "yr3Loader--spinner-size-md",
+      lg: "yr3Loader--spinner-size-lg",
+      xs: "yr3Loader--spinner-size-xs"
+    },
+    type: {
+      default: "yr3Loader--spinner-default",
+      dots: "yr3Loader--spinner-dots",
+      fancy: "yr3Loader--spinner-fancy"
+    }
+  }
+});
+
+// src/components/Loader/Loader.tsx
+import * as React3 from "react";
+import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
+var initialComponents = {
+  loader: {
+    ui: {},
+    style: {}
+  },
+  spinner: {
+    size: "sm",
+    color: "primary",
+    type: "default"
+  },
+  container: {
+    center: true,
+    container: true,
+    ui: {
+      width: "100%",
+      height: "100%"
+    }
+  }
+};
+var Loader = ({ component, loading = false, propsComponent }) => {
+  const properties = mergeDeep2(initialComponents, propsComponent || {});
+  const classSpinner = loaderSpinnerVariants({
+    color: properties?.spinner?.color,
+    type: properties?.spinner?.type,
+    size: properties?.spinner?.size
+  });
+  if (!loading) return null;
+  return /* @__PURE__ */ jsx6("div", { className: "yr3Loader", style: composeStyles(properties?.loader?.ui, properties?.loader?.style), children: /* @__PURE__ */ jsx6(Flex, { ...properties?.container, children: component || /* @__PURE__ */ jsx6("div", { className: classSpinner, children: properties?.spinner?.type === "dots" && /* @__PURE__ */ jsxs2(React3.Fragment, { children: [
+    /* @__PURE__ */ jsx6("span", {}),
+    /* @__PURE__ */ jsx6("span", {}),
+    /* @__PURE__ */ jsx6("span", {})
+  ] }) }) }) });
+};
+var Loader_default = Loader;
+
 // src/components/Text/text.variants.ts
 var textVariants = createVariants({
   base: "yr3Text",
@@ -764,7 +2786,7 @@ var textVariants = createVariants({
 var text_variants_default = textVariants;
 
 // src/components/Text/Text.tsx
-import { jsx as jsx5 } from "react/jsx-runtime";
+import { jsx as jsx7 } from "react/jsx-runtime";
 var Text = ({
   children,
   variant = "inherit",
@@ -778,7 +2800,7 @@ var Text = ({
 }) => {
   const styleUI = uiStyle({ ...ui, marginTop: gutters[0] || 0, marginBottom: gutters[1] || 0 });
   const classes = text_variants_default({ variant, color, weight });
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx7(
     Component,
     {
       className: classes,
@@ -823,15 +2845,18 @@ var buttonVariant = createVariants({
     },
     animated: {
       true: "yr3Button--animated"
+    },
+    loading: {
+      true: "yr3Button--spinner-size-md "
     }
   }
 });
 
 // src/components/Button/Button.tsx
-import { jsx as jsx6 } from "react/jsx-runtime";
-var Button = ({ children, color = "text", variant = "text", animated, disabled, gradientBorder = false, size = "auto", ui, style, propsComponent, ...props }) => {
+import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
+var Button = ({ icon, children, color = "text", variant = "text", animated, disabled, gradientBorder = false, size = "auto", ui, style, propsComponent, ...props }) => {
   const buttonClassname = buttonVariant({ variant, color, animated, disabled, gradientBorder, size });
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsxs3(
     "button",
     {
       className: buttonClassname,
@@ -839,15 +2864,17 @@ var Button = ({ children, color = "text", variant = "text", animated, disabled,
       "data-testid": "yr3Button",
       ...props,
       style: composeStyles(ui, style),
-      children: /* @__PURE__ */ jsx6(Text, { variant: propsComponent?.text?.variant || "button", ...propsComponent?.text, children })
+      children: [
+        /* @__PURE__ */ jsx8(Loader_default, { ...propsComponent?.loader }),
+        icon && /* @__PURE__ */ jsx8("span", { className: "yr3Button--icon", children: icon }),
+        /* @__PURE__ */ jsx8(Text, { variant: propsComponent?.text?.variant || "button", ...propsComponent?.text, children })
+      ]
     }
   );
 };
 
 // src/components/Calendar/Calendar.tsx
-import * as React3 from "react";
-import dayjs2 from "dayjs";
-import weekday from "dayjs/plugin/weekday";
+import * as React4 from "react";
 
 // src/components/Calendar/calendar.variants.ts
 var calendarVariants = createVariants({
@@ -896,14 +2923,22 @@ var calendarDayVariants = createVariants({
 });
 
 // src/components/Calendar/Calendar.tsx
-import { jsx as jsx7, jsxs as jsxs2 } from "react/jsx-runtime";
-dayjs2.extend(weekday);
+import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
 var initalPropsComponent = {
   displayButtons: true,
   displayCalendar: true,
+  container: {
+    ui: {
+      width: "100%",
+      maxWidth: 400
+    },
+    style: {}
+  },
   header: {
     color: "primary",
-    ui: {},
+    ui: {
+      px: 0.5
+    },
     style: {}
   },
   month: {
@@ -913,6 +2948,7 @@ var initalPropsComponent = {
   },
   day: {
     color: "primary",
+    selected: "secondary",
     bordered: true,
     ui: {},
     style: {},
@@ -920,49 +2956,89 @@ var initalPropsComponent = {
   },
   buttonNext: {
     disabled: false,
-    label: "next"
+    label: "next",
+    color: "primary",
+    ui: {
+      justifyContent: "flex-end",
+      p: 0
+    }
   },
   buttonBack: {
     disabled: false,
-    label: "back"
+    label: "back",
+    color: "primary",
+    ui: {
+      justifyContent: "flex-start",
+      p: 0
+    }
   }
 };
-var Calendar = ({ onSelect, propsComponent = initalPropsComponent, mapCalendar, onMonthChange }) => {
-  const month = dayjs2().month();
-  const [currentMonth, setCurrentMonth] = React3.useState(month);
-  const [selected, setSelected] = React3.useState(null);
-  const program = React3.useMemo(() => {
-    return getMonthCalendar(dayjs2().year(), currentMonth, 0, selected, mapCalendar);
+var Calendar = ({ onSelect, propsComponent, mapCalendar, onMonthChange, dataFormat, buttonsComponent }) => {
+  const properties = mergeInitialProps(initalPropsComponent, propsComponent);
+  const _date = /* @__PURE__ */ new Date();
+  const month = date(_date).getMonth();
+  const [currentMonth, setCurrentMonth] = React4.useState(month);
+  const [selected, setSelected] = React4.useState(null);
+  const program = React4.useMemo(() => {
+    return getMonthCalendar(dataFormat, (/* @__PURE__ */ new Date()).getFullYear(), currentMonth, 0, selected, mapCalendar);
   }, [selected, currentMonth, mapCalendar]);
-  React3.useEffect(() => {
+  React4.useEffect(() => {
     if (selected) {
       onSelect && onSelect(selected);
     } else {
-      onSelect && onSelect(program.currentDay);
+      onSelect && onSelect(program?.currentDay);
     }
   }, [selected, program, onSelect]);
-  React3.useEffect(() => {
+  React4.useEffect(() => {
     if (currentMonth) {
       onMonthChange && onMonthChange(currentMonth);
     }
   }, [currentMonth]);
-  return /* @__PURE__ */ jsxs2("div", { className: "yr3Calendar", "data-testid": "yr3Calendar", children: [
-    propsComponent?.displayButtons && /* @__PURE__ */ jsxs2("div", { className: "yr3Calendar--header", "data-testid": "yr3CalendarHeader", style: composeStyles(propsComponent?.header?.ui, propsComponent?.header?.style), children: [
-      /* @__PURE__ */ jsx7(Button, { disabled: propsComponent?.buttonBack?.disabled || false, color: propsComponent.header?.color || "primary", onClick: () => setCurrentMonth(currentMonth - 1), ui: { justifyContent: "flex-start" }, children: propsComponent?.buttonBack?.label }),
-      /* @__PURE__ */ jsx7(Text, { variant: "h6", color: propsComponent.header?.color || "primary", ui: { textTransform: "uppercase", textAlign: "center" }, children: program?.monthLabel }),
-      /* @__PURE__ */ jsx7(Button, { disabled: propsComponent?.buttonNext?.disabled, color: propsComponent?.header?.color || "primary", onClick: () => setCurrentMonth(currentMonth + 1), ui: { justifyContent: "flex-end" }, children: propsComponent?.buttonNext?.label })
+  return /* @__PURE__ */ jsxs4("div", { className: "yr3Calendar", "data-testid": "yr3Calendar", style: composeStyles(properties?.container?.ui, properties?.container?.style), children: [
+    propsComponent?.displayButtons && /* @__PURE__ */ jsxs4("div", { className: "yr3Calendar--header", "data-testid": "yr3CalendarHeader", style: composeStyles(properties?.header?.ui, properties?.header?.style), children: [
+      /* @__PURE__ */ jsx9(
+        Button,
+        {
+          disabled: properties?.buttonBack?.disabled || false,
+          color: properties.buttonBack?.color || "primary",
+          onClick: () => setCurrentMonth(currentMonth - 1),
+          ui: { ...properties.buttonBack.ui },
+          propsComponent: {
+            text: {
+              color: properties?.buttonBack?.color || "primary"
+            }
+          },
+          children: buttonsComponent?.buttonBack ? buttonsComponent?.buttonBack : properties?.buttonBack?.label
+        }
+      ),
+      /* @__PURE__ */ jsx9(Text, { variant: "h6", color: properties.header?.color || "primary", ui: { textTransform: "uppercase", textAlign: "center" }, children: program?.monthLabel }),
+      /* @__PURE__ */ jsx9(
+        Button,
+        {
+          disabled: properties?.buttonNext?.disabled,
+          color: properties?.buttonNext?.color || "primary",
+          onClick: () => setCurrentMonth(currentMonth + 1),
+          propsComponent: {
+            text: {
+              color: properties?.buttonNext?.color || "primary"
+            }
+          },
+          ui: { ...properties.buttonNext.ui },
+          children: buttonsComponent?.buttonNext ? buttonsComponent?.buttonNext : properties?.buttonNext?.label
+        }
+      )
     ] }),
-    propsComponent?.displayCalendar && /* @__PURE__ */ jsxs2("div", { className: "yr3Calendar--container", children: [
-      program?.daysContainer.map((i) => /* @__PURE__ */ jsx7("div", { className: "yr3Calendar--month", style: composeStyles(propsComponent?.month?.ui, propsComponent?.month?.style), children: /* @__PURE__ */ jsx7(
+    properties?.displayCalendar && /* @__PURE__ */ jsxs4("div", { className: "yr3Calendar--container", children: [
+      program?.daysContainer?.map((i) => /* @__PURE__ */ jsx9("div", { className: "yr3Calendar--month", style: composeStyles(properties?.month?.ui, properties?.month?.style), children: /* @__PURE__ */ jsx9(
         Text,
         {
           variant: "caption",
-          color: propsComponent?.month?.color || "primary",
-          ui: { ...propsComponent?.month?.ui, opacity: 0.7, textTransform: "uppercase" },
-          children: dayjs2().day(i + 1).format("dd")
+          color: properties?.month?.color || "primary",
+          ui: { ...properties?.month?.ui, opacity: 0.7, textTransform: "uppercase" },
+          children: i.label
         }
-      ) }, `month_day_${i}`)),
-      times(program.calendar.length, (i) => /* @__PURE__ */ jsx7(React3.Fragment, { children: times(program.calendar[i].length, (j) => /* @__PURE__ */ jsxs2(
+      ) }, `month_day_${i.label}`)),
+      times(program?.calendar.length, (i) => /* @__PURE__ */ jsx9(React4.Fragment, { children: times(program?.calendar[i].length, (j) => /* @__PURE__ */ jsxs4(
         "div",
         {
           className: calendarDayVariants({
@@ -971,11 +3047,11 @@ var Calendar = ({ onSelect, propsComponent = initalPropsComponent, mapCalendar,
             isPast: program.calendar[i][j]?.isPast,
             isFuture: program.calendar[i][j]?.isFuture,
             isCurrentMonth: program.calendar[i][j]?.isCurrentMonth,
-            ui: propsComponent?.day?.ui,
-            bordered: !!program.calendar[i][j] && propsComponent?.day?.bordered,
-            color: propsComponent?.day?.color || "primary"
+            ui: properties?.day?.ui,
+            bordered: !!program.calendar[i][j] && properties?.day?.bordered,
+            color: properties?.day?.color || "primary"
           }),
-          style: composeStyles(propsComponent?.day?.ui, propsComponent?.day?.style),
+          style: composeStyles(properties?.day?.ui, properties?.day?.style),
           "data-testid": "yr3CalendarDay",
           onClick: () => {
             if (selected === program.calendar[i][j]) {
@@ -985,13 +3061,13 @@ var Calendar = ({ onSelect, propsComponent = initalPropsComponent, mapCalendar,
             }
           },
           children: [
-            program.calendar[i][j]?.data && propsComponent?.day?.component ? propsComponent.day.component : null,
-            /* @__PURE__ */ jsx7(
+            program?.calendar[i][j]?.data && properties?.day?.component ? properties?.day?.component : null,
+            /* @__PURE__ */ jsx9(
               Text,
               {
                 variant: "body2",
-                color: program.calendar[i][j]?.isFuture ? "text" : "text",
-                children: program.calendar[i][j]?.day || ""
+                color: program?.calendar[i][j]?.selected ? properties?.day?.selected : "primary",
+                children: program?.calendar[i][j]?.day || ""
               }
             )
           ]
@@ -1003,8 +3079,8 @@ var Calendar = ({ onSelect, propsComponent = initalPropsComponent, mapCalendar,
 };
 
 // src/components/Checkbox/Checkbox.tsx
-import * as React4 from "react";
-import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
+import * as React5 from "react";
+import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
 var initialPropsComponent = {
   checkbox: {
     ui: {
@@ -1029,20 +3105,20 @@ var Checkbox = ({
   type = "default",
   variant = "text"
 }) => {
-  const [internal, setInternal] = React4.useState(defaultChecked || false);
+  const [internal, setInternal] = React5.useState(defaultChecked || false);
   const isControlled = checked !== void 0;
   const value = isControlled ? checked : internal;
   const handleChange = (e) => {
     if (!isControlled) setInternal(e.target.checked);
     onChange?.(e, e.target.checked);
   };
-  const properties = mergeDeep(initialPropsComponent, propsComponent || {});
+  const properties = mergeDeep2(initialPropsComponent, propsComponent || {});
   const bemClasse = bem("yr3Checkbox");
   const classes = bemClasse(void 0, { color: `color-${color}`, disabled, variant: `variant-${variant}`, type: `type-${type}` });
   const boxClasses = bem("yr3Checkbox-box");
   const classesBox = boxClasses(void 0, { checked: !!value });
-  return /* @__PURE__ */ jsxs3("label", { className: classes, style: uiStyle(properties?.checkbox?.ui), "data-testid": "yr3Checkbox", children: [
-    /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsxs5("label", { className: classes, style: uiStyle(properties?.checkbox?.ui), "data-testid": "yr3Checkbox", children: [
+    /* @__PURE__ */ jsx10(
       "input",
       {
         type: "checkbox",
@@ -1052,8 +3128,8 @@ var Checkbox = ({
         "data-testid": "yr3Checkbox-input"
       }
     ),
-    /* @__PURE__ */ jsx8("span", { className: classesBox, "data-testid": "yr3Checkbox-box" }),
-    label && /* @__PURE__ */ jsx8(Text, { variant: "caption", color: !value ? properties?.content?.color : color, ...properties?.content, children: label })
+    /* @__PURE__ */ jsx10("span", { className: classesBox, "data-testid": "yr3Checkbox-box" }),
+    label && /* @__PURE__ */ jsx10(Text, { variant: "caption", color: !value ? properties?.content?.color : color, ...properties?.content, children: label })
   ] });
 };
 
@@ -1090,9 +3166,9 @@ var chipVariants = createVariants({
 var chip_variants_default = chipVariants;
 
 // src/Icons/IconClose.tsx
-import { jsx as jsx9 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 var IconClose = (props) => {
-  return /* @__PURE__ */ jsx9("svg", { width: props.width || "64px", height: props.height || "64px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx11("svg", { width: props.width || "64px", height: props.height || "64px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx11(
     "path",
     {
       d: "M16 16L12 12M12 12L8 8M12 12L16 8M12 12L8 16",
@@ -1105,7 +3181,7 @@ var IconClose = (props) => {
 };
 
 // src/components/Chip/Chip.tsx
-import { jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
 var initialChipProps = {
   label: {
     ui: {},
@@ -1121,9 +3197,9 @@ var initialChipProps = {
   }
 };
 var Chip = ({ label, variant, color, icon, deleted, onDelete, rounded, size = "medium", propsComponent, ...props }) => {
-  const properties = mergeDeep(initialChipProps, propsComponent);
+  const properties = mergeDeep2(initialChipProps, propsComponent);
   const className = chip_variants_default({ variant, colors: color, rounded, size });
-  return /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs6(
     "div",
     {
       className,
@@ -1132,8 +3208,8 @@ var Chip = ({ label, variant, color, icon, deleted, onDelete, rounded, size = "m
       style: composeStyles(properties.chip?.ui, properties.chip?.style),
       children: [
         icon,
-        /* @__PURE__ */ jsx10("span", { className: "yr3Chip__label", style: composeStyles(properties?.label?.ui, properties?.label?.style), children: label }),
-        deleted && /* @__PURE__ */ jsx10(
+        /* @__PURE__ */ jsx12("span", { className: "yr3Chip__label", style: composeStyles(properties?.label?.ui, properties?.label?.style), children: label }),
+        deleted && /* @__PURE__ */ jsx12(
           "span",
           {
             className: "yr3Chip__delete",
@@ -1141,7 +3217,7 @@ var Chip = ({ label, variant, color, icon, deleted, onDelete, rounded, size = "m
             role: "button",
             "aria-label": "delete",
             style: composeStyles(properties?.delete?.ui, properties?.delete?.style),
-            children: /* @__PURE__ */ jsx10(IconClose, { ...properties?.icon, stroke: color })
+            children: /* @__PURE__ */ jsx12(IconClose, { ...properties?.icon, stroke: color })
           }
         )
       ]
@@ -1150,12 +3226,12 @@ var Chip = ({ label, variant, color, icon, deleted, onDelete, rounded, size = "m
 };
 
 // src/components/Collapse/Collapse.tsx
-import * as React5 from "react";
-import { jsx as jsx11 } from "react/jsx-runtime";
+import * as React6 from "react";
+import { jsx as jsx13 } from "react/jsx-runtime";
 var Collapse = ({ children, open, anchor }) => {
-  const ref = React5.useRef(null);
-  const [height, setHeight] = React5.useState(0);
-  React5.useEffect(() => {
+  const ref = React6.useRef(null);
+  const [height, setHeight] = React6.useState(0);
+  React6.useEffect(() => {
     if (ref.current) {
       if (open) {
         setHeight(ref.current.scrollHeight);
@@ -1164,11 +3240,11 @@ var Collapse = ({ children, open, anchor }) => {
       }
     }
   }, [open, children]);
-  return /* @__PURE__ */ jsx11("div", { className: `yr3Collapse yr3Collapse--${anchor}`, style: { height }, "data-testid": "yr3Collapse", children: /* @__PURE__ */ jsx11("div", { ref, className: "yr3Collapse__inner", children }) });
+  return /* @__PURE__ */ jsx13("div", { className: `yr3Collapse yr3Collapse--${anchor}`, style: { height }, "data-testid": "yr3Collapse", children: /* @__PURE__ */ jsx13("div", { ref, className: "yr3Collapse__inner", children }) });
 };
 
 // src/components/Container/Container.tsx
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 var Container = ({
   children,
   maxWidth = "sm",
@@ -1178,7 +3254,7 @@ var Container = ({
 }) => {
   const containerClassName = bem("yr3Container");
   const classes = containerClassName(void 0, { maxWidth, static: fixed });
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx14(
     "div",
     {
       className: classes,
@@ -1190,12 +3266,12 @@ var Container = ({
 };
 
 // src/theme/controlContext.tsx
-import * as React6 from "react";
-var ControlContext = React6.createContext(null);
-var useControl = () => React6.useContext(ControlContext);
+import * as React7 from "react";
+var ControlContext = React7.createContext(null);
+var useControl = () => React7.useContext(ControlContext);
 
 // src/components/Control/Control.tsx
-import * as React7 from "react";
+import * as React8 from "react";
 
 // src/components/Control/control.variants.ts
 var controlVariants = createVariants({
@@ -1238,7 +3314,7 @@ var controlVariants = createVariants({
 });
 
 // src/components/Control/Control.tsx
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx15 } from "react/jsx-runtime";
 var Control = ({
   children,
   error = false,
@@ -1250,15 +3326,15 @@ var Control = ({
   size = "auto",
   label = true
 }) => {
-  const [focused, setFocused] = React7.useState(false);
+  const [focused, setFocused] = React8.useState(false);
   const value = {
     focused,
     setFocused,
     error,
     disabled
   };
-  const classes = controlVariants({ variant, color, label, size });
-  return /* @__PURE__ */ jsx13(ControlContext.Provider, { value, children: /* @__PURE__ */ jsx13(
+  const classes = controlVariants({ variant, color, label, size, disabled });
+  return /* @__PURE__ */ jsx15(ControlContext.Provider, { value, children: /* @__PURE__ */ jsx15(
     "div",
     {
       className: classes,
@@ -1301,7 +3377,7 @@ var dividerVariants = createVariants({
 var dividerVariants_default = dividerVariants;
 
 // src/components/Divider/Divider.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 var Divider = ({
   orientation = "horizontal",
   text: text2,
@@ -1311,14 +3387,14 @@ var Divider = ({
   color = "primary"
 }) => {
   const classname = dividerVariants_default({ orientation, align, withText: !!text2, color });
-  return /* @__PURE__ */ jsx14("div", { className: classname, style: composeStyles(ui, style), "data-testid": "yr3Divider", children: text2 && /* @__PURE__ */ jsx14("span", { className: "yr3Divider--text", "data-testid": "yr3Divider-text", children: text2 }) });
+  return /* @__PURE__ */ jsx16("div", { className: classname, style: composeStyles(ui, style), "data-testid": "yr3Divider", children: text2 && /* @__PURE__ */ jsx16("span", { className: "yr3Divider--text", "data-testid": "yr3Divider-text", children: text2 }) });
 };
 
 // src/components/Drawer/Drawer.tsx
-import * as React8 from "react";
+import * as React9 from "react";
 
 // src/components/Drawer/DrawerContainer.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 var DrawerContainer = ({ children, ui, style, props, onClose }) => {
   const { hide } = useBackdrop();
   const handleClose = () => {
@@ -1328,7 +3404,7 @@ var DrawerContainer = ({ children, ui, style, props, onClose }) => {
     }
     return;
   };
-  return /* @__PURE__ */ jsx15("div", { className: "yr3Drawer--container", style: composeStyles(ui, style), onClick: handleClose, "data-testid": "yr3Drawer-container", children });
+  return /* @__PURE__ */ jsx17("div", { className: "yr3Drawer--container", style: composeStyles(ui, style), onClick: handleClose, "data-testid": "yr3Drawer-container", children });
 };
 var DrawerContainer_default = DrawerContainer;
 
@@ -1348,7 +3424,7 @@ var useClickAway = (ref, callback) => {
 };
 
 // src/components/Drawer/Drawer.tsx
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 var initialPropsComponent2 = {
   drawer: {},
   closing: null,
@@ -1357,9 +3433,9 @@ var initialPropsComponent2 = {
 };
 var Drawer = ({ open, anchor = null, onClose, children, propsComponent }) => {
   const { show, hide } = useBackdrop();
-  const ref = React8.useRef(null);
-  const properties = mergeDeep(initialPropsComponent2, propsComponent);
-  React8.useEffect(() => {
+  const ref = React9.useRef(null);
+  const properties = mergeDeep2(initialPropsComponent2, propsComponent);
+  React9.useEffect(() => {
     if (open) {
       show("drawer");
     } else {
@@ -1374,7 +3450,7 @@ var Drawer = ({ open, anchor = null, onClose, children, propsComponent }) => {
     }
     ;
   });
-  React8.useEffect(() => {
+  React9.useEffect(() => {
     if (properties?.onClose) {
       hide("drawer");
       onClose();
@@ -1382,7 +3458,7 @@ var Drawer = ({ open, anchor = null, onClose, children, propsComponent }) => {
   }, [properties?.onClose]);
   const classesBem = bem("yr3Drawer");
   const drawerClasses = classesBem(void 0, { [anchor]: anchor, open });
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx18(
     "div",
     {
       className: drawerClasses,
@@ -1390,7 +3466,7 @@ var Drawer = ({ open, anchor = null, onClose, children, propsComponent }) => {
       onClick: (e) => e.stopPropagation(),
       ref,
       "data-testid": "yr3Drawer",
-      children: /* @__PURE__ */ jsx16(
+      children: /* @__PURE__ */ jsx18(
         DrawerContainer_default,
         {
           children,
@@ -1405,15 +3481,15 @@ var Drawer = ({ open, anchor = null, onClose, children, propsComponent }) => {
 };
 
 // src/components/Input/Input.tsx
-import * as React9 from "react";
+import * as React10 from "react";
 
 // src/components/Label/Label.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 var Label = ({ text: text2, children, className, color = "primary", ui, style }) => {
   const classes = bem("yr3Label");
   const classComponent = classes(void 0, { color: `color-${color}` });
   const classnames = bemMerge(classComponent, className);
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx19(
     "span",
     {
       className: classnames,
@@ -1466,7 +3542,7 @@ var inputVariants = createVariants({
 });
 
 // src/components/Input/Input.tsx
-import { jsx as jsx18, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs7 } from "react/jsx-runtime";
 var initiaPropsComponent = {
   label: {
     display: true,
@@ -1475,7 +3551,7 @@ var initiaPropsComponent = {
   },
   control: {}
 };
-var Input = React9.forwardRef(
+var Input = React10.forwardRef(
   ({
     label,
     value,
@@ -1484,20 +3560,27 @@ var Input = React9.forwardRef(
     variant = "outlined",
     error = "ce un errore",
     separatorCurrency = ",",
+    separatorDecimal = ".",
     ui,
     style,
     propsComponent = initiaPropsComponent,
-    pattern = "text",
     color = "primary",
     size = "auto",
+    disabled = false,
+    model,
+    pattern,
     ...props
   }, ref) => {
-    const [focused, setFocused] = React9.useState(false);
-    const [internalValue, setInternalValue] = React9.useState(defaultValue);
+    const [focused, setFocused] = React10.useState(false);
+    const [internalValue, setInternalValue] = React10.useState(defaultValue);
     const isControlled = value !== void 0;
     const currentValue = isControlled ? value : internalValue;
     const isActive = focused || !!currentValue;
-    const checkPattern = (type, value2) => {
+    const checkMode = (type, value2) => {
+      if (pattern) {
+        const regex = new RegExp(pattern);
+        return regex.test(value2);
+      }
       switch (type) {
         case "email":
           return /^[\w.-]+@[\w.-]+\.\w{2,}$/.test(value2);
@@ -1508,21 +3591,38 @@ var Input = React9.forwardRef(
         case "currency":
           if (separatorCurrency === ",") return /^\d+(\,\d{0,2})?$/.test(value2);
           if (separatorCurrency === ".") return /^\d+(\.\d{0,2})?$/.test(value2);
+        case "decimal":
+          if (separatorDecimal === ",") return /^\d+(\,\d*)?$/.test(value2);
+          if (separatorDecimal === ".") return /^\d+(\.\d*)?$/.test(value2);
         default:
           return true;
       }
     };
+    const mode = (m) => {
+      switch (m) {
+        case "email":
+          return "email";
+        case "phone":
+          return "tel";
+        case "number":
+          return "numeric";
+        case "currency":
+          return "numeric";
+        default:
+          return "text";
+      }
+    };
     const handleChange = (e) => {
       const newValue = e.target.value;
-      if (newValue && !checkPattern(pattern, newValue)) return;
+      if (newValue && !checkMode(model, newValue)) return;
       if (!isControlled) {
         setInternalValue(newValue);
       }
       onChange?.(e, newValue);
     };
     const classes = inputVariants({ color, label: propsComponent?.label?.display });
-    return /* @__PURE__ */ jsxs5(Control, { variant, color, label: propsComponent?.label?.display, ...propsComponent.control, children: [
-      propsComponent?.label?.display && /* @__PURE__ */ jsx18(
+    return /* @__PURE__ */ jsxs7(Control, { variant, color, label: propsComponent?.label?.display, disabled, ...propsComponent.control, children: [
+      propsComponent?.label?.display && /* @__PURE__ */ jsx20(
         Label,
         {
           text: label || "",
@@ -1531,14 +3631,16 @@ var Input = React9.forwardRef(
           ...propsComponent.label
         }
       ),
-      /* @__PURE__ */ jsx18(
+      /* @__PURE__ */ jsx20(
         "input",
         {
           ref,
           value: currentValue,
-          inputMode: pattern === "currency" ? "numeric" : pattern === "phone" ? "tel" : void 0,
+          inputMode: mode(model),
           autoComplete: "off",
-          type: "text",
+          type: props.type,
+          pattern,
+          disabled,
           onChange: handleChange,
           onFocus: () => setFocused(true),
           onBlur: () => setFocused(false),
@@ -1553,12 +3655,12 @@ var Input = React9.forwardRef(
 );
 
 // src/components/Date/MonthSelector.tsx
-import * as React10 from "react";
+import * as React11 from "react";
 
 // src/Icons/IconSearch.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx21 } from "react/jsx-runtime";
 var IconSearch = (props) => {
-  return /* @__PURE__ */ jsx19("svg", { width: props.width || "64px", height: props.height || "64px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx21("svg", { width: props.width || "64px", height: props.height || "64px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx21(
     "path",
     {
       d: "M15.7955 15.8111L21 21M18 10.5C18 14.6421 14.6421 18 10.5 18C6.35786 18 3 14.6421 3 10.5C3 6.35786 6.35786 3 10.5 3C14.6421 3 18 6.35786 18 10.5Z",
@@ -1571,24 +3673,35 @@ var IconSearch = (props) => {
 };
 
 // src/Icons/IconDown.tsx
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 var IconDown = (props) => {
-  return /* @__PURE__ */ jsx20("svg", { width: props.width || "64px", height: props.height || "64px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", "data-testid": "yr3Icons", children: /* @__PURE__ */ jsx20("path", { d: "M7 10L12 15L17 10", stroke: props.stroke || "#fff", strokeWidth: props.strokeWidth || "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
+  return /* @__PURE__ */ jsx22("svg", { width: props.width || "64px", height: props.height || "64px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", "data-testid": "yr3Icons", children: /* @__PURE__ */ jsx22("path", { d: "M7 10L12 15L17 10", stroke: props.stroke || "#fff", strokeWidth: props.strokeWidth || "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
 };
 
 // src/Icons/IconCalendar.tsx
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 var IconCalendar = (props) => {
-  return /* @__PURE__ */ jsx21("svg", { width: props.width || "24px", height: props.height || "24px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx21("path", { stroke: props.stroke, strokeLinecap: "round", strokeLinejoin: "round", d: "M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 0 1 2.25-2.25h13.5A2.25 2.25 0 0 1 21 7.5v11.25m-18 0A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75m-18 0v-7.5A2.25 2.25 0 0 1 5.25 9h13.5A2.25 2.25 0 0 1 21 11.25v7.5" }) });
+  return /* @__PURE__ */ jsx23("svg", { width: props.width || "24px", height: props.height || "24px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx23("path", { stroke: props.stroke, strokeLinecap: "round", strokeLinejoin: "round", d: "M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 0 1 2.25-2.25h13.5A2.25 2.25 0 0 1 21 7.5v11.25m-18 0A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75m-18 0v-7.5A2.25 2.25 0 0 1 5.25 9h13.5A2.25 2.25 0 0 1 21 11.25v7.5" }) });
 };
 
 // src/Icons/IconLeft.tsx
-import { jsx as jsx22 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 var IconLeft = (props) => {
-  return /* @__PURE__ */ jsx22("svg", { width: props.width || "24px", height: props.height || "24px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx22("path", { d: "M15 7L10 12L15 17", stroke: props.stroke || "currentColor", strokeWidth: props.strokeWidth || "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
+  return /* @__PURE__ */ jsx24("svg", { width: props.width || "24px", height: props.height || "24px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx24("path", { d: "M15 7L10 12L15 17", stroke: props.stroke || "currentColor", strokeWidth: props.strokeWidth || "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
 };
 
 // src/components/Date/month.variants.ts
+var monthSelectorVariants = createVariants({
+  base: "yr3MonthSelector",
+  variants: {
+    wrapper: {
+      true: "yr3MonthSelector--wrapper"
+    },
+    disabled: {
+      true: "yr3MonthSelector--disabled"
+    }
+  }
+});
 var monthSelectorIconVariants = createVariants({
   base: "yr3MonthSelector--icon",
   variants: {
@@ -1631,9 +3744,9 @@ var monthSelectorContainerVariants = createVariants({
 });
 
 // src/Icons/IconRight.tsx
-import { jsx as jsx23 } from "react/jsx-runtime";
+import { jsx as jsx25 } from "react/jsx-runtime";
 var IconRight = (props) => {
-  return /* @__PURE__ */ jsx23("svg", { width: props.width || "24px", height: props.height || "24px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsx25("svg", { width: props.width || "24px", height: props.height || "24px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx25(
     "path",
     {
       d: "M9 7L14 12L9 17",
@@ -1646,12 +3759,14 @@ var IconRight = (props) => {
 };
 
 // src/components/Date/MonthSelector.tsx
-import { jsx as jsx24, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs8 } from "react/jsx-runtime";
 var initialPropsComponent3 = {
   control: {
     variant: "outlined",
     color: "primary",
-    ui: {},
+    ui: {
+      pointerEvents: "none"
+    },
     style: {}
   },
   label: {
@@ -1686,18 +3801,18 @@ var initialPropsComponent3 = {
     style: {}
   }
 };
-var MonthSelector = ({ label, value, disabled, propsComponent, data, daysFormat, onNext, onLast, onChange }) => {
-  const [open, setOpen] = React10.useState(false);
-  const [valueState, setValueState] = React10.useState(value || null);
-  const [yearSelected, setYearSelected] = React10.useState(data?.years.findIndex((y) => y === data.year) || 0);
-  const ref = React10.useRef(null);
+var MonthSelector = ({ label, value, disabled, propsComponent, data, format, onNext, onLast, onChange }) => {
+  const [open, setOpen] = React11.useState(false);
+  const [valueState, setValueState] = React11.useState(value || null);
+  const [yearSelected, setYearSelected] = React11.useState(data?.years.findIndex((y) => y === data.year) || 0);
+  const ref = React11.useRef(null);
   useClickAway(ref, () => setOpen(false));
-  const properties = mergeDeep(initialPropsComponent3, propsComponent || {});
+  const properties = mergeDeep2(initialPropsComponent3, propsComponent || {});
   const iconClasses = monthSelectorIconVariants({ color: properties?.icon?.color });
   const containerClasses = monthSelectorContainerVariants({ color: properties?.container?.color });
-  const getData = React10.useMemo(() => {
-    return getMonthCalendarProps({ year: data.years[yearSelected], data, daysFormat, value: valueState });
-  }, [yearSelected, data, daysFormat, valueState]);
+  const getData = React11.useMemo(() => {
+    return getMonthCalendarProps({ year: data.years[yearSelected], data, format, value: valueState });
+  }, [yearSelected, data, format, valueState]);
   const handleYearChange = (newIndex) => {
     setYearSelected(newIndex);
   };
@@ -1708,19 +3823,19 @@ var MonthSelector = ({ label, value, disabled, propsComponent, data, daysFormat,
     const nextData = getMonthCalendarProps({
       year: data.years[yearSelected],
       data,
-      daysFormat,
+      format,
       value: newValue
     });
     onNext?.(nextData.prev);
     onLast?.(nextData.last);
   };
-  return /* @__PURE__ */ jsxs6("div", { className: "yr3MonthSelector", ref, children: [
-    /* @__PURE__ */ jsx24(
+  const classes = monthSelectorVariants({ wrapper: true, disabled });
+  return /* @__PURE__ */ jsxs8("div", { className: classes, ref, children: [
+    /* @__PURE__ */ jsx26(
       Input,
       {
         label,
         variant: "base",
-        disabled: true,
         value: valueState || "",
         propsComponent: {
           control: properties?.control,
@@ -1728,14 +3843,14 @@ var MonthSelector = ({ label, value, disabled, propsComponent, data, daysFormat,
         }
       }
     ),
-    /* @__PURE__ */ jsx24(
+    /* @__PURE__ */ jsx26(
       "div",
       {
         className: iconClasses,
         style: properties?.icon?.style,
         onClick: () => !disabled && setOpen(true),
         "data-testid": "yr3MonthSelector--icon",
-        children: properties?.icon?.component ? properties?.icon.component : /* @__PURE__ */ jsx24(
+        children: properties?.icon?.component ? properties?.icon.component : /* @__PURE__ */ jsx26(
           IconCalendar,
           {
             width: properties?.icon?.svg?.width,
@@ -1746,47 +3861,47 @@ var MonthSelector = ({ label, value, disabled, propsComponent, data, daysFormat,
         )
       }
     ),
-    open && /* @__PURE__ */ jsx24(
+    open && /* @__PURE__ */ jsx26(
       "div",
       {
         className: "yr3MonthSelector--wrapper",
         style: composeStyles(properties?.wrapper?.ui, properties?.wrapper?.style),
         "data-testid": "yr3MonthSelector--wrapper",
-        children: /* @__PURE__ */ jsxs6("div", { className: "yr3MonthSelector--component", children: [
-          /* @__PURE__ */ jsxs6(
+        children: /* @__PURE__ */ jsxs8("div", { className: "yr3MonthSelector--component", children: [
+          /* @__PURE__ */ jsxs8(
             "div",
             {
               className: containerClasses,
               style: composeStyles(properties?.container?.ui, properties?.container?.style),
               children: [
-                /* @__PURE__ */ jsx24(
+                /* @__PURE__ */ jsx26(
                   "button",
                   {
                     disabled: disabled || yearSelected === 0,
                     type: "button",
                     className: `yr3MonthSelector--year-button-back ${yearSelected === 0 ? "yr3MonthSelector--year-button-back--disabled" : ""} `,
                     onClick: () => handleYearChange(yearSelected - 1),
-                    children: /* @__PURE__ */ jsx24(IconLeft, { width: 20, height: 20, stroke: "currentColor" })
+                    children: /* @__PURE__ */ jsx26(IconLeft, { width: 20, height: 20, stroke: "currentColor" })
                   }
                 ),
-                /* @__PURE__ */ jsx24("div", { className: `yr3MonthSelector--year-option`, children: /* @__PURE__ */ jsxs6(Text, { variant: "body1", color: "primary", children: [
+                /* @__PURE__ */ jsx26("div", { className: `yr3MonthSelector--year-option`, children: /* @__PURE__ */ jsxs8(Text, { variant: "body1", color: "primary", children: [
                   data.years[yearSelected],
                   " "
                 ] }) }),
-                /* @__PURE__ */ jsx24(
+                /* @__PURE__ */ jsx26(
                   "button",
                   {
                     disabled: disabled || yearSelected === data.years.length - 1,
                     type: "button",
                     className: `yr3MonthSelector--year-button-next ${yearSelected === data.years.length - 1 ? "yr3MonthSelector--year-button-next--disabled" : ""}`,
                     onClick: () => handleYearChange(yearSelected + 1),
-                    children: /* @__PURE__ */ jsx24(IconRight, { width: 20, height: 30, stroke: "currentColor" })
+                    children: /* @__PURE__ */ jsx26(IconRight, { width: 20, height: 30, stroke: "currentColor" })
                   }
                 )
               ]
             }
           ),
-          /* @__PURE__ */ jsx24("div", { className: "yr3MonthSelector--months", children: getData.months.map((m) => /* @__PURE__ */ jsx24(
+          /* @__PURE__ */ jsx26("div", { className: "yr3MonthSelector--months", children: getData.months.map((m) => /* @__PURE__ */ jsx26(
             "button",
             {
               type: "button",
@@ -1795,8 +3910,9 @@ var MonthSelector = ({ label, value, disabled, propsComponent, data, daysFormat,
               className: `yr3MonthSelector--month ${m.disabled ? "yr3MonthSelector--month--disabled" : ""} ${m.selected ? "yr3MonthSelector--month--selected" : ""}`,
               onClick: () => {
                 handleMonthChange(m.value);
+                setOpen(false);
               },
-              children: /* @__PURE__ */ jsx24(Text, { ...properties?.text, weight: m.disabled ? "thin" : "medium", children: m.label })
+              children: /* @__PURE__ */ jsx26(Text, { ...properties?.text, weight: m.disabled ? "thin" : "medium", children: m.label })
             },
             "month-" + m.value
           )) })
@@ -1807,8 +3923,8 @@ var MonthSelector = ({ label, value, disabled, propsComponent, data, daysFormat,
 };
 
 // src/components/Fade/Fade.tsx
-import * as React11 from "react";
-import { jsx as jsx25 } from "react/jsx-runtime";
+import * as React12 from "react";
+import { jsx as jsx27 } from "react/jsx-runtime";
 var Fade = ({
   in: inProp,
   children,
@@ -1816,7 +3932,7 @@ var Fade = ({
   onTransitionEnd,
   style
 }) => {
-  React11.useEffect(() => {
+  React12.useEffect(() => {
     let timeoutId;
     if (inProp) {
       timeoutId = setTimeout(() => {
@@ -1825,7 +3941,7 @@ var Fade = ({
     }
     return () => clearTimeout(timeoutId);
   }, [inProp, duration, onTransitionEnd]);
-  return /* @__PURE__ */ jsx25(
+  return /* @__PURE__ */ jsx27(
     "div",
     {
       className: `yr3Fade ${inProp ? "yr3Fade--in" : ""}`,
@@ -1836,61 +3952,8 @@ var Fade = ({
   );
 };
 
-// src/components/Flex/flex.variants.ts
-var flexVariants = createVariants({
-  base: "yr3Flex",
-  variants: {
-    variant: {
-      row: "yr3Flex--row",
-      column: "yr3Flex--column",
-      wrap: "yr3Flex--wrap"
-    },
-    container: {
-      true: "yr3Flex--container"
-    },
-    center: {
-      true: "yr3Flex--center"
-    },
-    between: {
-      true: "yr3Flex--between"
-    },
-    bordered: {
-      true: "yr3Flex--bordered"
-    }
-  }
-});
-var flex_variants_default = flexVariants;
-
-// src/components/Flex/Flex.tsx
-import { jsx as jsx26 } from "react/jsx-runtime";
-var Flex = ({
-  container = false,
-  spacing: spacing2 = 1,
-  children,
-  ui,
-  gap,
-  variant = "column",
-  center = false,
-  between = false,
-  style,
-  bordered = false,
-  ...props
-}) => {
-  const classes = flex_variants_default({ variant, container, center, between, bordered, spacing: spacing2 });
-  return /* @__PURE__ */ jsx26(
-    "div",
-    {
-      className: classes,
-      style: composeStyles(ui, style),
-      ...props,
-      "data-testid": "yr3Flex",
-      children
-    }
-  );
-};
-
 // src/components/Grid/Grid.tsx
-import { jsx as jsx27 } from "react/jsx-runtime";
+import { jsx as jsx28 } from "react/jsx-runtime";
 var Grid = ({
   container = false,
   spacing: spacing2 = 0,
@@ -1923,7 +3986,7 @@ var Grid = ({
   }
   const classes = bem("yr3Grid");
   const className = classes(void 0, { container, [`spacing-${spacing2}`]: center, span: item && `Col-${size}` });
-  return /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsx28(
     "div",
     {
       className,
@@ -1936,7 +3999,7 @@ var Grid = ({
 };
 
 // src/components/Group/Group.tsx
-import * as React12 from "react";
+import * as React13 from "react";
 
 // src/components/Group/group.variants.ts
 var groupVariants = createVariants({
@@ -1967,8 +4030,8 @@ var groupVariants = createVariants({
 });
 
 // src/components/Group/Group.tsx
-import { jsx as jsx28 } from "react/jsx-runtime";
-var initialComponents = (color) => ({
+import { jsx as jsx29 } from "react/jsx-runtime";
+var initialComponents2 = (color) => ({
   group: {
     ui: {},
     style: {}
@@ -1996,13 +4059,13 @@ var Group = ({
   exclude = false,
   propsComponent
 }) => {
-  const properties = mergeDeep(
-    initialComponents(type === "rounded" ? "text" : color),
+  const properties = mergeDeep2(
+    initialComponents2(type === "rounded" ? "text" : color),
     propsComponent || {}
   );
-  const [internalValue, setInternalValue] = React12.useState(null);
+  const [internalValue, setInternalValue] = React13.useState(null);
   const isControlled = value !== void 0;
-  React12.useEffect(() => {
+  React13.useEffect(() => {
     if (isControlled) {
       setInternalValue(value);
     }
@@ -2013,7 +4076,7 @@ var Group = ({
     active: !exclude ? Array.isArray(value) ? value.includes(item?.value) : internalValue === item.value : false,
     exclude: exclude && Array.isArray(value) ? !value.includes(item?.value) : ""
   });
-  const mappingStyle = React12.useMemo(() => {
+  const mappingStyle = React13.useMemo(() => {
     if (variant !== "filled") return options.map((opt, index) => ({
       ...opt,
       index,
@@ -2044,13 +4107,13 @@ var Group = ({
       }
     }));
   }, [exclude, value, options, type]);
-  return /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsx29(
     "div",
     {
       className: groupVariants({ variant, color, type }),
       "data-testid": "yr3Group",
       style: composeStyles(properties.group?.ui, properties.group?.style),
-      children: options.map((opt, index) => /* @__PURE__ */ jsx28(
+      children: options.map((opt, index) => /* @__PURE__ */ jsx29(
         "div",
         {
           "data-testid": "yr3Group-item",
@@ -2068,7 +4131,7 @@ var Group = ({
               ...mappingStyle?.find((o) => o.value === opt.value)?.style
             }
           ),
-          children: /* @__PURE__ */ jsx28(
+          children: /* @__PURE__ */ jsx29(
             Text,
             {
               ...properties.item?.text,
@@ -2084,14 +4147,14 @@ var Group = ({
 };
 
 // src/components/Image/Image.tsx
-import { jsx as jsx29 } from "react/jsx-runtime";
+import { jsx as jsx30 } from "react/jsx-runtime";
 var Image = ({
   src,
   alt = "",
   ui,
   style
 }) => {
-  return /* @__PURE__ */ jsx29(
+  return /* @__PURE__ */ jsx30(
     "img",
     {
       src,
@@ -2104,8 +4167,8 @@ var Image = ({
 };
 
 // src/components/ImageDropzone/ImageDropzone.tsx
-import * as React13 from "react";
-import { jsx as jsx30, jsxs as jsxs7 } from "react/jsx-runtime";
+import * as React14 from "react";
+import { jsx as jsx31, jsxs as jsxs9 } from "react/jsx-runtime";
 var initialPropsComponent4 = {
   box: {},
   text: {},
@@ -2114,10 +4177,10 @@ var initialPropsComponent4 = {
   content: {}
 };
 var ImageDropzone = ({ onChange, multiple, propsComponent, bordered, component, defaultImage, variant = "outlined" }) => {
-  const properties = mergeDeep(initialPropsComponent4, propsComponent || {});
-  const [dragging, setDragging] = React13.useState(false);
-  const [files, setFiles] = React13.useState([]);
-  const inputRef = React13.useRef(null);
+  const properties = mergeDeep2(initialPropsComponent4, propsComponent || {});
+  const [dragging, setDragging] = React14.useState(false);
+  const [files, setFiles] = React14.useState([]);
+  const inputRef = React14.useRef(null);
   const handleFiles = (fileList) => {
     if (!fileList) return;
     const newFiles = Array.from(fileList);
@@ -2129,7 +4192,7 @@ var ImageDropzone = ({ onChange, multiple, propsComponent, bordered, component,
   };
   const classes = bem("yr3Dropzone");
   const classComponent = classes(void 0, { "dragging": !!dragging, "bordered": !!bordered, variant });
-  return /* @__PURE__ */ jsx30(Box, { as: "div", position: "relative", content: "center", ...properties?.box, children: /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsx31(Box, { as: "div", position: "relative", content: "center", ...properties?.box, children: /* @__PURE__ */ jsxs9(
     "div",
     {
       className: classComponent,
@@ -2146,7 +4209,7 @@ var ImageDropzone = ({ onChange, multiple, propsComponent, bordered, component,
       onClick: () => inputRef.current?.click(),
       style: composeStyles(properties?.container?.ui, properties?.container?.style),
       children: [
-        /* @__PURE__ */ jsx30(
+        /* @__PURE__ */ jsx31(
           "input",
           {
             ref: inputRef,
@@ -2157,10 +4220,10 @@ var ImageDropzone = ({ onChange, multiple, propsComponent, bordered, component,
             onChange: (e) => handleFiles(e.target.files)
           }
         ),
-        isEmpty(files) && /* @__PURE__ */ jsx30("div", { className: "yr3Dropzone--content", style: composeStyles(properties?.content?.ui, properties?.content?.style), children: /* @__PURE__ */ jsx30(Text, { variant: "helper", color: "disabled", ...propsComponent?.text, children: propsComponent?.text?.primary || "Drag and drop an image here, or click to select one" }) }),
-        multiple && /* @__PURE__ */ jsx30("div", { className: "yr3Dropzone--previews", style: composeStyles(properties?.preview?.ui, properties?.preview?.style), children: files.map((file, i) => /* @__PURE__ */ jsx30("img", { src: URL.createObjectURL(file) }, i)) }),
-        !multiple && /* @__PURE__ */ jsx30("div", { className: "yr3Dropzone--preview", style: composeStyles(properties?.preview?.ui, properties?.preview?.style), children: files.map((file, i) => /* @__PURE__ */ jsx30("img", { src: URL.createObjectURL(file) }, i)) }),
-        !!defaultImage && /* @__PURE__ */ jsx30("div", { className: "yr3Dropzone--preview", style: composeStyles(properties?.preview?.ui, properties?.preview?.style), children: /* @__PURE__ */ jsx30("img", { src: defaultImage }) }),
+        isEmpty(files) && /* @__PURE__ */ jsx31("div", { className: "yr3Dropzone--content", style: composeStyles(properties?.content?.ui, properties?.content?.style), children: /* @__PURE__ */ jsx31(Text, { variant: "helper", color: "disabled", ...propsComponent?.text, children: propsComponent?.text?.primary || "Drag and drop an image here, or click to select one" }) }),
+        multiple && /* @__PURE__ */ jsx31("div", { className: "yr3Dropzone--previews", style: composeStyles(properties?.preview?.ui, properties?.preview?.style), children: files.map((file, i) => /* @__PURE__ */ jsx31("img", { src: URL.createObjectURL(file) }, i)) }),
+        !multiple && /* @__PURE__ */ jsx31("div", { className: "yr3Dropzone--preview", style: composeStyles(properties?.preview?.ui, properties?.preview?.style), children: files.map((file, i) => /* @__PURE__ */ jsx31("img", { src: URL.createObjectURL(file) }, i)) }),
+        !!defaultImage && /* @__PURE__ */ jsx31("div", { className: "yr3Dropzone--preview", style: composeStyles(properties?.preview?.ui, properties?.preview?.style), children: /* @__PURE__ */ jsx31("img", { src: defaultImage }) }),
         component
       ]
     }
@@ -2168,7 +4231,7 @@ var ImageDropzone = ({ onChange, multiple, propsComponent, bordered, component,
 };
 
 // src/components/InputArea/InputArea.tsx
-import * as React14 from "react";
+import * as React15 from "react";
 
 // src/components/InputArea/inputAreaVariants.ts
 var inputAreaVariants = createVariants({
@@ -2209,7 +4272,7 @@ var inputAreaVariants = createVariants({
 });
 
 // src/components/InputArea/InputArea.tsx
-import { jsx as jsx31, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx32, jsxs as jsxs10 } from "react/jsx-runtime";
 var initiaPropsComponent2 = {
   label: {
     display: true,
@@ -2234,8 +4297,8 @@ var InputArea = ({
   rounded = false,
   propsComponent = initiaPropsComponent2
 }) => {
-  const ref = React14.useRef(null);
-  const [internalValue, setInternalValue] = React14.useState(defaultValue);
+  const ref = React15.useRef(null);
+  const [internalValue, setInternalValue] = React15.useState(defaultValue);
   const isControlled = value !== void 0;
   const currentValue = isControlled ? value : internalValue;
   const handleChange = (e) => {
@@ -2252,8 +4315,8 @@ var InputArea = ({
     el.style.resize = resize;
   }
   const classes = inputAreaVariants({ variant, color, rounded });
-  return /* @__PURE__ */ jsxs8("div", { style: { position: "relative" }, children: [
-    propsComponent?.label?.display && /* @__PURE__ */ jsx31(
+  return /* @__PURE__ */ jsxs10("div", { style: { position: "relative" }, children: [
+    propsComponent?.label?.display && /* @__PURE__ */ jsx32(
       Label,
       {
         text: label || "",
@@ -2261,7 +4324,7 @@ var InputArea = ({
         ...propsComponent.label
       }
     ),
-    /* @__PURE__ */ jsx31(
+    /* @__PURE__ */ jsx32(
       "textarea",
       {
         className: classes,
@@ -2273,76 +4336,10 @@ var InputArea = ({
         "data-testid": "yr3InputArea"
       }
     ),
-    /* @__PURE__ */ jsx31(Text, { variant: "helper", color: currentValue.length > maxLength ? "error" : "disabled", ui: { textAlign: "right" }, "data-testid": "yr3InputAreaError", children: validate && maxLength ? `${currentValue.length}/${maxLength}` || propsComponent.helperText : "" })
+    /* @__PURE__ */ jsx32(Text, { variant: "helper", color: currentValue.length > maxLength ? "error" : "disabled", ui: { textAlign: "right" }, "data-testid": "yr3InputAreaError", children: validate && maxLength ? `${currentValue.length}/${maxLength}` || propsComponent.helperText : "" })
   ] });
 };
 
-// src/components/Loader/loader.variants.ts
-var loaderSpinnerVariants = createVariants({
-  base: "yr3Loader--spinner",
-  variants: {
-    color: {
-      primary: "yr3Loader--spinner-color-primary",
-      secondary: "yr3Loader--spinner-color-secondary",
-      success: "yr3Loader--spinner-color-success",
-      error: "yr3Loader--spinner-color-error",
-      warning: "yr3Loader--spinner-color-warning",
-      info: "yr3Loader--spinner-color-info",
-      disabled: "yr3Loader--spinner-color-disabled",
-      text: "yr3Loader--spinner-color-text",
-      background: "yr3Loader--spinner-color-background",
-      common: "yr3Loader--spinner-color-common"
-    },
-    size: {
-      sm: "yr3Loader--spinner-size-sm",
-      md: "yr3Loader--spinner-size-md",
-      lg: "yr3Loader--spinner-size-lg"
-    },
-    type: {
-      default: "yr3Loader--spinner-default",
-      dots: "yr3Loader--spinner-dots",
-      fancy: "yr3Loader--spinner-fancy"
-    }
-  }
-});
-
-// src/components/Loader/Loader.tsx
-import * as React15 from "react";
-import { jsx as jsx32, jsxs as jsxs9 } from "react/jsx-runtime";
-var initialComponents2 = {
-  loader: {
-    ui: {},
-    style: {}
-  },
-  spinner: {
-    size: "sm",
-    color: "primary",
-    type: "default"
-  },
-  container: {
-    center: true,
-    container: true,
-    ui: {
-      width: "100%",
-      height: "100%"
-    }
-  }
-};
-var Loader = ({ component, loading = false, propsComponent }) => {
-  const properties = mergeDeep(initialComponents2, propsComponent || {});
-  const classSpinner = loaderSpinnerVariants({
-    color: properties?.spinner?.color,
-    type: properties?.spinner?.type,
-    size: properties?.spinner?.size
-  });
-  if (!loading) return null;
-  return /* @__PURE__ */ jsx32("div", { className: "yr3Loader", style: composeStyles(properties?.loader?.ui, properties?.loader?.style), children: /* @__PURE__ */ jsx32(Flex, { ...properties?.container, children: component || /* @__PURE__ */ jsx32("div", { className: classSpinner, children: properties?.spinner?.type === "dots" && /* @__PURE__ */ jsxs9(React15.Fragment, { children: [
-    /* @__PURE__ */ jsx32("span", {}),
-    /* @__PURE__ */ jsx32("span", {}),
-    /* @__PURE__ */ jsx32("span", {})
-  ] }) }) }) });
-};
-
 // src/components/Modal/Modal.tsx
 import * as React16 from "react";
 
@@ -2355,7 +4352,7 @@ var ModalContainer = ({ children, size = "sm", ui, style }) => {
 };
 
 // src/components/Modal/Modal.tsx
-import { jsx as jsx34, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs11 } from "react/jsx-runtime";
 var Modal = ({ open, onClose, children, propsComponent }) => {
   const { show, hide } = useBackdrop();
   React16.useEffect(() => {
@@ -2367,7 +4364,7 @@ var Modal = ({ open, onClose, children, propsComponent }) => {
   }, [open]);
   const classes = bem("yr3Modal");
   const classComponent = classes(void 0, { "open": !!open });
-  return /* @__PURE__ */ jsx34("div", { className: classComponent, onClick: (e) => e.stopPropagation(), "data-testid": "yr3Modal", children: /* @__PURE__ */ jsx34(ModalContainer, { ...propsComponent?.container, children: /* @__PURE__ */ jsxs10(Flex, { variant: "column", container: true, center: true, gap: 1, children: [
+  return /* @__PURE__ */ jsx34("div", { className: classComponent, onClick: (e) => e.stopPropagation(), "data-testid": "yr3Modal", children: /* @__PURE__ */ jsx34(ModalContainer, { ...propsComponent?.container, children: /* @__PURE__ */ jsxs11(Flex, { variant: "column", container: true, center: true, gap: 1, children: [
     children,
     propsComponent?.close ? propsComponent.close : /* @__PURE__ */ jsx34(Button, { variant: "filled", color: "secondary", onClick: onClose, "data-testid": "yr3Modal-close", children: "Close" })
   ] }) }) });
@@ -2409,13 +4406,13 @@ var notistackVariants = createVariants({
 });
 
 // src/components/Notistack/Notistack.tsx
-import { jsx as jsx35, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs12 } from "react/jsx-runtime";
 var Notistack = ({ message, duration = 3e3, variant = "info", color, propsComponent, anchor, exiting = false }) => {
   const classes = notistackVariants({ type: variant, color, exiting, direction: `${anchor?.vertical || "bottom"}-${anchor?.horizontal || "right"}` });
   const containerStyle = composeStyles(propsComponent?.container?.ui, propsComponent?.container?.style);
   const notistackStyle = composeStyles(propsComponent?.notistack?.ui, propsComponent?.notistack?.style);
   const progressStyle = composeStyles(propsComponent?.progress?.ui, propsComponent?.progress?.style);
-  return /* @__PURE__ */ jsxs11("div", { className: classes, "data-testid": "yr3Notistack", style: notistackStyle, children: [
+  return /* @__PURE__ */ jsxs12("div", { className: classes, "data-testid": "yr3Notistack", style: notistackStyle, children: [
     /* @__PURE__ */ jsx35("span", { style: containerStyle, children: message }),
     /* @__PURE__ */ jsx35(
       "div",
@@ -2536,7 +4533,7 @@ var PickerIconVariants = createVariants({
 });
 
 // src/components/Picker/Picker.tsx
-import { jsx as jsx37, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs13 } from "react/jsx-runtime";
 var initiaPropsComponent3 = {
   control: {
     variant: "outlined",
@@ -2568,7 +4565,7 @@ var Picker = ({ label, variant, color, children, name, value, onChange, propsCom
   const [valueState, setValueState] = React17.useState(value || null);
   const ref = React17.useRef(null);
   useClickAway(ref, () => setOpen(false));
-  const properties = mergeDeep(initiaPropsComponent3, propsComponent || {});
+  const properties = mergeDeep2(initiaPropsComponent3, propsComponent || {});
   const classesIcon = PickerIconVariants({ color: properties?.icon?.color, animated: open, open });
   const classes = PickerVariants({ wrapper: true, variant, color });
   React17.useEffect(() => {
@@ -2586,7 +4583,7 @@ var Picker = ({ label, variant, color, children, name, value, onChange, propsCom
       onChange({ event: {}, target: { name, value: valueState }, currentTarget: { name, value: valueState } }, valueState);
     }
   }, [valueState, onChange, name]);
-  return /* @__PURE__ */ jsxs12("div", { className: classes, ref, children: [
+  return /* @__PURE__ */ jsxs13("div", { className: classes, ref, children: [
     /* @__PURE__ */ jsx37(
       Input,
       {
@@ -2639,7 +4636,7 @@ import * as React19 from "react";
 
 // src/components/Selector/Selector.tsx
 import * as React18 from "react";
-import { jsx as jsx38, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx38, jsxs as jsxs14 } from "react/jsx-runtime";
 var initalPropsComponent2 = {
   text: {
     variant: "caption",
@@ -2656,8 +4653,8 @@ var Selector = ({ ui, style, options, name, value, defaultValue, onChange, iconC
   const [valueState, setValueState] = React18.useState(value || defaultValue || null);
   const ref = React18.useRef(null);
   useClickAway(ref, () => setOpen(false));
-  return /* @__PURE__ */ jsxs13("div", { className: "yr3Selector-wrapper", ref, children: [
-    /* @__PURE__ */ jsx38("div", { className: `yr3Selector ${open ? "yr3Selector--open" : ""}`, style: composeStyles(ui, style), children: /* @__PURE__ */ jsxs13("div", { className: "yr3Selector--control", children: [
+  return /* @__PURE__ */ jsxs14("div", { className: "yr3Selector-wrapper", ref, children: [
+    /* @__PURE__ */ jsx38("div", { className: `yr3Selector ${open ? "yr3Selector--open" : ""}`, style: composeStyles(ui, style), children: /* @__PURE__ */ jsxs14("div", { className: "yr3Selector--control", children: [
       /* @__PURE__ */ jsx38("div", { className: "yr3Selector--icon", onClick: () => setOpen((prev) => !prev), children: icon ? icon : /* @__PURE__ */ jsx38(IconDown, { stroke: `var(--color-${iconColor || "disabled"})`, width: 24, height: 24 }) }),
       valueState
     ] }) }),
@@ -2690,7 +4687,7 @@ var Selector = ({ ui, style, options, name, value, defaultValue, onChange, iconC
 };
 
 // src/components/Phone/Phone.tsx
-import { jsx as jsx39, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs15 } from "react/jsx-runtime";
 var Phone = ({
   name,
   value,
@@ -2727,9 +4724,9 @@ var Phone = ({
     setPrefix(val);
     onChange?.(null, `${val}${number}`);
   };
-  return /* @__PURE__ */ jsxs14(Control, { variant: "outlined", ui: { height: 50, position: "relative" }, children: [
+  return /* @__PURE__ */ jsxs15(Control, { variant: "outlined", ui: { height: 50, position: "relative" }, children: [
     /* @__PURE__ */ jsx39(Label, { text: label, className: "yr3Input--active" }),
-    /* @__PURE__ */ jsxs14(Flex, { variant: "row", container: true, center: true, children: [
+    /* @__PURE__ */ jsxs15(Flex, { variant: "row", container: true, center: true, children: [
       /* @__PURE__ */ jsx39(
         Selector,
         {
@@ -2769,7 +4766,7 @@ var Phone = ({
 // src/components/Places/PlacesAutocomplete.tsx
 import * as React20 from "react";
 import { useAutocompletePlaces } from "@yr3/autocomplete-places";
-import { jsx as jsx40, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs16 } from "react/jsx-runtime";
 var initPropsComponent = {
   label: {
     display: true,
@@ -2809,7 +4806,7 @@ var PlacesAutocomplete = ({
   keyApi,
   propsComponent = initPropsComponent
 }) => {
-  const [value, setValue] = React20.useState(null);
+  const [value, setValue2] = React20.useState(null);
   const inputRef = React20.useRef(null);
   const [anchorEl, setAnchorEl] = React20.useState(null);
   const { suggestions, selectPlace } = useAutocompletePlaces({ input: value, apiKey: keyApi, language, provider });
@@ -2828,12 +4825,12 @@ var PlacesAutocomplete = ({
       placeId: id
     };
     onSelect(locationData);
-    setValue(place.address);
+    setValue2(place.address);
     setAnchorEl(null);
   };
   React20.useEffect(() => {
     if (defaultLocation) {
-      setValue(defaultLocation);
+      setValue2(defaultLocation);
     }
   }, [defaultLocation]);
   React20.useEffect(() => {
@@ -2842,7 +4839,7 @@ var PlacesAutocomplete = ({
     }
   }, [value]);
   const handleChange = (e) => {
-    setValue(e.target.value);
+    setValue2(e.target.value);
     setAnchorEl(e.target.value ? inputRef.current : null);
   };
   const open = suggestions.length > 0 && Boolean(anchorEl);
@@ -2851,7 +4848,7 @@ var PlacesAutocomplete = ({
       onChangeForm({ target: { value } });
     }
   }, [onChangeForm]);
-  return /* @__PURE__ */ jsxs15(Control, { ...propsComponent?.control, children: [
+  return /* @__PURE__ */ jsxs16(Control, { ...propsComponent?.control, children: [
     /* @__PURE__ */ jsx40(
       Input,
       {
@@ -2894,7 +4891,7 @@ var radioVariant = createVariants({
 });
 
 // src/components/Radio/Radio.tsx
-import { jsx as jsx41, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx41, jsxs as jsxs17 } from "react/jsx-runtime";
 var Radio = ({
   checked,
   value,
@@ -2910,7 +4907,7 @@ var Radio = ({
   const bemClass = bem("yr3Radio");
   const classes = bemClass(void 0, { [color]: `color-${color}` });
   const variantClass = radioVariant({ variant });
-  return /* @__PURE__ */ jsxs16("label", { className: classes, "data-testid": "yr3Radio", style: composeStyles(propsComponent?.radio?.ui, propsComponent?.radio?.style), children: [
+  return /* @__PURE__ */ jsxs17("label", { className: classes, "data-testid": "yr3Radio", style: composeStyles(propsComponent?.radio?.ui, propsComponent?.radio?.style), children: [
     /* @__PURE__ */ jsx41(
       "input",
       {
@@ -2952,6 +4949,9 @@ var selectVariants = createVariants({
       base: "yr3Select--base",
       lined: "yr3Select--lined"
     },
+    disabled: {
+      true: "yr3Select--disabled"
+    },
     color: {
       primary: "yr3Select--color-primary",
       secondary: "yr3Select--color-secondary",
@@ -2997,7 +4997,7 @@ var selectIconVariants = createVariants({
 });
 
 // src/components/Select/Select.tsx
-import { jsx as jsx42, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs18 } from "react/jsx-runtime";
 var initiaPropsComponent4 = {
   control: {
     variant: "outlined",
@@ -3036,24 +5036,29 @@ var initiaPropsComponent4 = {
     component: void 0
   }
 };
-var Select = ({ label, options, name, value, defaultValue, onChange, propsComponent }) => {
+var Select = ({ label, options, name, value, defaultValue, onChange, propsComponent, disabled = false }) => {
   const [open, setOpen] = React21.useState(false);
   const [valueState, setValueState] = React21.useState(value || defaultValue || null);
   const ref = React21.useRef(null);
   useClickAway(ref, () => setOpen(false));
-  const properties = mergeDeep(initiaPropsComponent4, propsComponent || {});
+  const properties = mergeDeep2(initiaPropsComponent4, propsComponent || {});
   const classesIcon = selectIconVariants({ color: properties?.icon?.color, animated: open, open });
-  const classes = selectVariants({ wrapper: true });
-  return /* @__PURE__ */ jsxs17("div", { className: classes, ref, children: [
+  const classes = selectVariants({ wrapper: true, disabled });
+  return /* @__PURE__ */ jsxs18("div", { className: classes, ref, children: [
     /* @__PURE__ */ jsx42(
       Input,
       {
         label,
         variant: "base",
-        disabled: true,
         value: options.find((opt) => opt.value === valueState)?.label || "",
         propsComponent: {
-          control: properties?.control,
+          control: {
+            ...properties?.control,
+            ui: {
+              ...properties?.control?.ui,
+              pointerEvents: "none"
+            }
+          },
           label: properties?.label
         }
       }
@@ -3063,7 +5068,7 @@ var Select = ({ label, options, name, value, defaultValue, onChange, propsCompon
       {
         className: classesIcon,
         style: properties?.icon?.style,
-        onClick: () => setOpen((prev) => !prev),
+        onClick: () => !disabled && setOpen((prev) => !prev),
         "data-testid": "yr3Select-icon",
         children: properties?.icon?.component ? properties?.icon.component : /* @__PURE__ */ jsx42(
           IconDown,
@@ -3115,13 +5120,40 @@ var Select = ({ label, options, name, value, defaultValue, onChange, propsCompon
 
 // src/components/Slide/Slide.tsx
 import * as React22 from "react";
+
+// src/components/Slide/variants.slide.ts
+var variantsSlide = createVariants({
+  base: "yr3Slide--content",
+  variants: {
+    direction: {
+      left: "yr3Slide--content--left",
+      right: "yr3Slide--content--right",
+      top: "yr3Slide--content--top",
+      bottom: "yr3Slide--content--bottom"
+    },
+    open: {
+      true: "yr3Slide--in",
+      false: "yr3Slide--out"
+    }
+  }
+});
+
+// src/components/Slide/Slide.tsx
 import { jsx as jsx43 } from "react/jsx-runtime";
 var initialPropsComponent5 = {
   slide: {
     ui: {},
     style: {}
   },
-  box: {}
+  content: {
+    ui: {},
+    style: {}
+  },
+  box: {
+    as: "div",
+    ui: {},
+    style: {}
+  }
 };
 var Slide = ({
   in: inProp,
@@ -3131,34 +5163,30 @@ var Slide = ({
   onTransitionEnd,
   propsComponent
 }) => {
-  const properties = mergeDeep(initialPropsComponent5, propsComponent || {});
-  const bemContent = bem("yr3Slide--content");
-  const classNameContent = bemContent(void 0, {
-    [direction]: true,
-    "in": !!inProp,
-    "out": !inProp
-  });
+  const properties = mergeDeep2(initialPropsComponent5, propsComponent || {});
+  const stateRef = React22.useRef(inProp ? "in" : "out");
   React22.useEffect(() => {
-    let timeoutId;
-    if (inProp) {
-      timeoutId = setTimeout(() => {
-        onTransitionEnd && onTransitionEnd();
-      }, duration);
-    }
-    return () => clearTimeout(timeoutId);
-  }, [inProp, duration, onTransitionEnd]);
-  const uiStyleContent = uiStyle({ ...properties?.slide?.ui, transitionDuration: `${duration}ms` });
+    stateRef.current = inProp ? "in" : "out";
+  }, [inProp]);
+  const classesContent = variantsSlide({ direction, open: !!inProp ? "true" : "false" });
+  const uiStyleSlider = uiStyle({ ...properties?.slide?.ui, transitionDuration: `${duration}ms` });
+  const uiStyleContent = uiStyle({ ...properties?.content?.ui, transitionDuration: `${duration}ms` });
   return /* @__PURE__ */ jsx43(
     "div",
     {
       className: "yr3Slide",
-      style: composeStyles(),
+      style: composeStyles(uiStyleSlider, properties?.slide?.style || {}),
       "data-testid": "yr3Slide",
       children: /* @__PURE__ */ jsx43(
         "div",
         {
-          className: classNameContent,
-          style: composeStyles(uiStyleContent, properties?.slide?.style || {}),
+          className: classesContent,
+          onTransitionEnd: (e) => {
+            if (e.target === e.currentTarget && e.propertyName === "transform") {
+              onTransitionEnd?.(stateRef?.current);
+            }
+          },
+          style: composeStyles(uiStyleContent, properties?.content?.style || {}),
           "data-testid": "yr3Slide-content",
           children: /* @__PURE__ */ jsx43(Box, { ...properties?.box, "data-testid": "yr3Slide-box", children })
         }
@@ -3205,7 +5233,7 @@ var switchVariants = createVariants({
 });
 
 // src/components/Switch/Switch.tsx
-import { jsx as jsx44, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs19 } from "react/jsx-runtime";
 var Switch = ({
   checked,
   defaultChecked,
@@ -3225,7 +5253,7 @@ var Switch = ({
     if (!isControlled) setInternal(e.target.checked);
     onChange?.(e, e.target.checked);
   };
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs19(
     "label",
     {
       className: classname,
@@ -3260,7 +5288,7 @@ import * as React25 from "react";
 
 // src/theme/notistackContext.tsx
 import * as React24 from "react";
-import { jsx as jsx45, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx45, jsxs as jsxs20 } from "react/jsx-runtime";
 var NotistackContext = React24.createContext(null);
 var NotistackProvider = ({ children }) => {
   const [snacks, setSnacks] = React24.useState([]);
@@ -3278,7 +5306,7 @@ var NotistackProvider = ({ children }) => {
       setSnacks((prev) => prev.filter((s) => s.id !== id));
     }, duration + exitDuration);
   };
-  return /* @__PURE__ */ jsxs19(NotistackContext.Provider, { value: { notistack }, children: [
+  return /* @__PURE__ */ jsxs20(NotistackContext.Provider, { value: { notistack }, children: [
     children,
     /* @__PURE__ */ jsx45("div", { className: "yr3NotistackContainer", children: snacks.map((snack) => /* @__PURE__ */ jsx45(Notistack, { ...snack }, snack.id)) })
   ] });
@@ -3338,17 +5366,17 @@ function useMediaQuery(query) {
   }, [computedQuery]);
   return matches;
 }
-function useBreakpointValue(values) {
+function useBreakpointValue(values2) {
   const xs = useMediaQuery(`(min-width: ${breakpoints.xs}px)`);
   const sm = useMediaQuery(`(min-width: ${breakpoints.sm}px)`);
   const md = useMediaQuery(`(min-width: ${breakpoints.md}px)`);
   const lg = useMediaQuery(`(min-width: ${breakpoints.lg}px)`);
   const xl = useMediaQuery(`(min-width: ${breakpoints.xl}px)`);
-  if (xl && values.xl !== void 0) return values.xl;
-  if (lg && values.lg !== void 0) return values.lg;
-  if (md && values.md !== void 0) return values.md;
-  if (sm && values.sm !== void 0) return values.sm;
-  if (xs && values.xs !== void 0) return values.xs;
+  if (xl && values2.xl !== void 0) return values2.xl;
+  if (lg && values2.lg !== void 0) return values2.lg;
+  if (md && values2.md !== void 0) return values2.md;
+  if (sm && values2.sm !== void 0) return values2.sm;
+  if (xs && values2.xs !== void 0) return values2.xs;
   return void 0;
 }
 
@@ -3463,6 +5491,8 @@ export {
   createVariants,
   cx,
   darken,
+  date,
+  dtx,
   getContrast,
   getCountryCodePhone,
   getDialPhone,
@@ -3472,13 +5502,12 @@ export {
   hexToRgb,
   initTheme,
   inputCurrency,
-  isEmpty,
   lighten,
-  mergeDeep,
+  mergeDeep2 as mergeDeep,
+  mergeInitialProps,
   normalizePhone,
-  rgbToHex,
+  rgbToHex2 as rgbToHex,
   text,
-  times,
   uiStyle,
   useBackdrop,
   useBreakpoint,
@@ -3488,5 +5517,6 @@ export {
   useMediaQuery,
   useNotistack,
   usePlaces,
-  useTheme
+  useTheme,
+  utils
 };