@povio/ui 0.0.7 → 0.0.8

package/dist/helpers/dynamicInputs.js

@@ -1,214 +0,0 @@
-import i18next from "i18next";
-import { z } from "zod";
-import { StringUtils } from "../utils/string.utils.js";
-import { ZodUtils } from "../utils/zod.utils.js";
-const defaultComponentTypes = {
-  datetime: "datePicker",
-  dateRange: "dateRangePicker",
-  textEditor: "textEditor",
-  boolean: "toggle",
-  number: "numberInput",
-  enum: "select",
-  string: "textInput",
-  email: "textInput",
-  object: "unknown",
-  array: "select",
-  unknown: "unknown"
-};
-const ZOD_TYPE_COMPONENT_TYPE = [
-  [z.ZodBoolean, defaultComponentTypes.boolean],
-  [z.ZodNumber, defaultComponentTypes.number],
-  [z.ZodEnum, defaultComponentTypes.enum],
-  [z.ZodISODateTime, defaultComponentTypes.datetime],
-  [z.ZodString, defaultComponentTypes.string],
-  [z.ZodEmail, defaultComponentTypes.email],
-  [z.ZodObject, defaultComponentTypes.object],
-  [z.ZodArray, defaultComponentTypes.array]
-];
-const DEFAULT_NAMESPACE = "dynamicInputs";
-const sortInputDefs = (inputDefs, orderKeys) => {
-  if (!orderKeys) {
-    return inputDefs;
-  }
-  return inputDefs.sort((a, b) => {
-    const orderMap = new Map(orderKeys.map((key, index) => [key, index]));
-    const orderA = orderMap.get(a.name);
-    const orderB = orderMap.get(b.name);
-    if (orderA !== void 0 && orderB !== void 0) {
-      return orderA - orderB;
-    }
-    if (orderA !== void 0 && orderB === void 0) {
-      return -1;
-    }
-    if (orderA === void 0 && orderB !== void 0) {
-      return 1;
-    }
-    return 0;
-  });
-};
-const excludeEntries = (entries) => {
-  return entries.filter(([, value]) => value !== false && value !== void 0);
-};
-const inputConfigToObjectDefinition = (value) => {
-  if (typeof value === "object") {
-    return value;
-  }
-  if (typeof value === "function") {
-    return { render: value };
-  }
-  return {};
-};
-const convertInputsConfigToObjectDefinitions = (entries) => {
-  return entries.map(([key, value]) => {
-    const k = key;
-    return [k, inputConfigToObjectDefinition(value)];
-  });
-};
-const getDefaultInputComponentType = (schemaType) => {
-  if (ZodUtils.isDateRange(schemaType)) {
-    return defaultComponentTypes.dateRange;
-  }
-  if (ZodUtils.isTextEditor(schemaType)) {
-    return defaultComponentTypes.textEditor;
-  }
-  const unwrappedType = ZodUtils.unwrapZodType(schemaType);
-  const componentType = ZOD_TYPE_COMPONENT_TYPE.find(([zodType]) => unwrappedType instanceof zodType)?.[1];
-  if (componentType) {
-    return componentType;
-  }
-  return defaultComponentTypes.unknown;
-};
-const getDefaultSelectionItems = (keyType) => {
-  const unwrappedType = ZodUtils.unwrapZodType(keyType instanceof z.ZodArray ? keyType.element : keyType);
-  if (unwrappedType instanceof z.ZodEnum) {
-    return Object.values(unwrappedType.options).filter((value) => typeof value === "string").map((value) => ({ id: value, label: StringUtils.capitalize(value) }));
-  }
-  return [];
-};
-const getDefaultSelectionMode = (keyType) => {
-  return keyType instanceof z.ZodArray ? "multiple" : "single";
-};
-const getDefaultProps = (componentType, keyType) => {
-  const props = {};
-  const unwrappedType = ZodUtils.unwrapZodType(keyType);
-  if (["select", "autocomplete", "segment"].includes(componentType)) {
-    props.items = getDefaultSelectionItems(unwrappedType);
-  }
-  if (["select", "autocomplete", "queryAutocomplete", "segment"].includes(componentType)) {
-    props.selectionMode = getDefaultSelectionMode(unwrappedType);
-  }
-  return props;
-};
-const getLabelAndPlaceholder = (value, options, schemaKey) => {
-  const namespace = options.namespace ?? DEFAULT_NAMESPACE;
-  const stringKey = String(schemaKey);
-  let { label, placeholder } = value;
-  if (!label) {
-    const key = `${namespace}.${stringKey}.label`;
-    const translation = i18next.exists(key) ? i18next.t(key) : null;
-    label = typeof translation === "string" ? translation : StringUtils.capitalize(stringKey);
-  }
-  if (!placeholder) {
-    const key = `${namespace}.${stringKey}.placeholder`;
-    const translation = i18next.exists(key) ? i18next.t(key) : null;
-    placeholder = typeof translation === "string" ? translation : void 0;
-  }
-  return { label, placeholder };
-};
-const overridePresetLabelsAndPlaceholders = (presetInputDefs, options) => {
-  const namespace = options.namespace ?? DEFAULT_NAMESPACE;
-  return presetInputDefs.map((inputDef) => {
-    const labelName = String(inputDef.name);
-    const labelKey = `${namespace}.${labelName}.label`;
-    const placeholderKey = `${namespace}.${labelName}.placeholder`;
-    const labelTranslation = i18next.exists(labelKey) ? i18next.t(labelKey) : null;
-    const placeholderTranslation = i18next.exists(placeholderKey) ? i18next.t(placeholderKey) : null;
-    return {
-      ...inputDef,
-      label: typeof labelTranslation === "string" ? labelTranslation : inputDef.label,
-      placeholder: typeof placeholderTranslation === "string" ? placeholderTranslation : inputDef.placeholder
-    };
-  });
-};
-const removeOverriddenPresetInputs = (presetInputs, options) => {
-  if (presetInputs.length === 0) {
-    return presetInputs;
-  }
-  const usedKeys = Object.entries(options.inputs ?? {}).map(([key]) => String(key));
-  return presetInputs.filter((input) => !usedKeys.includes(String(input.name)));
-};
-const validateParams = (schema, presetInputs, options) => {
-  const { inputs, order, includeAll } = options;
-  if (!order) {
-    return;
-  }
-  const inputKeys = Object.keys(inputs ?? {});
-  const presetKeys = presetInputs.map((input) => input.name).filter((name) => name !== void 0);
-  const schemaKeys = includeAll ? Object.keys(schema.shape) : [];
-  const allInputKeys = /* @__PURE__ */ new Set([...inputKeys, ...presetKeys, ...schemaKeys]);
-  const unnecessaryOrderKeys = order.filter((key) => !allInputKeys.has(key));
-  if (unnecessaryOrderKeys.length > 0) {
-    throw new Error(
-      `Found unnecessary keys in "order": [${unnecessaryOrderKeys.join(", ")}]. These keys are not found in any of the input definitions.
-All defined input keys are: [${Array.from(allInputKeys).join(", ")}].
-In the case of a preset input definition, the key is the name attribute.`
-    );
-  }
-};
-const populateInputDef = (schema, schemaKey, value, options) => {
-  const name = String(schemaKey);
-  const { label, placeholder } = getLabelAndPlaceholder(value, options, schemaKey);
-  const inputWrapper = value.inputWrapper ?? options.globalInputWrapper;
-  if ("render" in value) {
-    return {
-      name,
-      render: value.render
-    };
-  }
-  const schemaKeyType = schema.shape[schemaKey];
-  const componentType = "type" in value ? value.type : getDefaultInputComponentType(schemaKeyType);
-  const defaultProps = componentType ? getDefaultProps(componentType, schemaKeyType) : {};
-  const props = { ...defaultProps, ...options.globalProps, ...value.props };
-  return {
-    type: componentType === "unknown" ? null : componentType,
-    name,
-    label,
-    placeholder,
-    inputWrapper,
-    props
-  };
-};
-const addMissingSchemaFields = (schema, existingInputDefs, options) => {
-  const schemaFields = Object.keys(schema.shape);
-  const definedFields = new Set(existingInputDefs.map((def) => def.name));
-  const missingFields = schemaFields.filter((field) => !definedFields.has(field));
-  const additionalInputDefs = missingFields.map((field) => {
-    return populateInputDef(schema, field, {}, options);
-  });
-  return [...existingInputDefs, ...additionalInputDefs];
-};
-const dynamicInputs = ({
-  schema,
-  preset = [],
-  options
-}) => {
-  validateParams(schema, preset, options);
-  let entries = Object.entries(options.inputs ?? {});
-  entries = excludeEntries(entries);
-  const dynamicInputDefs = convertInputsConfigToObjectDefinitions(entries);
-  const inputDefs = dynamicInputDefs.map(([key, value]) => {
-    return populateInputDef(schema, key, value, options);
-  });
-  let presetInputDefs = removeOverriddenPresetInputs(preset, options);
-  if (options.overridePresetLocales) {
-    presetInputDefs = overridePresetLabelsAndPlaceholders(presetInputDefs, options);
-  }
-  const mergedInputDefs = [...presetInputDefs, ...inputDefs];
-  const allInputDefs = options.includeAll ? addMissingSchemaFields(schema, mergedInputDefs, options) : mergedInputDefs;
-  return sortInputDefs(allInputDefs, options.order);
-};
-export {
-  dynamicInputs,
-  getDefaultInputComponentType,
-  getDefaultSelectionMode
-};

package/dist/hooks/useAutosave.js

@@ -1,80 +0,0 @@
-import { useRef, useEffect } from "react";
-import { useFormState, useWatch } from "react-hook-form";
-import { isEqual } from "../utils/isEqual.js";
-import { ObjectUtils } from "../utils/object.utils.js";
-function isNilOrEqual(left, right) {
-  if (ObjectUtils.isNil(left) && ObjectUtils.isNil(right)) {
-    return true;
-  }
-  return isEqual(left, right);
-}
-function diffLeftOnly(left, right, shallowKeys) {
-  if (!ObjectUtils.isObject(left) || ObjectUtils.isDate(left) || ObjectUtils.isRegExp(left)) {
-    return !isNilOrEqual(left, right) ? left : void 0;
-  }
-  if (Array.isArray(left)) {
-    return !isNilOrEqual(left, right) ? left : void 0;
-  }
-  const result = Object.entries(left).reduce((acc, [key, value]) => {
-    const shallowSubtree = shallowKeys?.[key];
-    if (shallowSubtree === true) {
-      if (!isNilOrEqual(value, right?.[key])) {
-        acc[key] = value;
-      }
-      return acc;
-    }
-    const diff = diffLeftOnly(value, right?.[key], shallowSubtree);
-    if (diff !== void 0 && (!ObjectUtils.isObject(diff) || !ObjectUtils.isEmpty(diff))) {
-      acc[key] = diff;
-    }
-    return acc;
-  }, {});
-  return ObjectUtils.isEmpty(result) ? void 0 : result;
-}
-function useAutosave({
-  form,
-  delay = 500,
-  enabled = true,
-  onSave,
-  onSaveSuccess
-}) {
-  const timeoutRef = useRef(void 0);
-  const { control, reset, handleSubmit } = form;
-  const { dirtyFields, defaultValues } = useFormState({ control });
-  const formData = useWatch({ control });
-  useEffect(() => {
-    if (!enabled || Object.keys(dirtyFields).length === 0) {
-      return void 0;
-    }
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-    }
-    timeoutRef.current = setTimeout(() => {
-      handleSubmit(async (data) => {
-        const dirtyData = Object.entries(dirtyFields).filter(([, value]) => value).reduce((acc, [key]) => ({ ...acc, [key]: data[key] }), {});
-        const changedData = diffLeftOnly(dirtyData, defaultValues, dirtyFields) ?? {};
-        if (Object.keys(changedData).length === 0) {
-          return void 0;
-        }
-        try {
-          reset(void 0, { keepValues: true });
-          await onSave(changedData);
-          onSaveSuccess?.();
-        } catch {
-          reset(defaultValues);
-          return void 0;
-        }
-        return void 0;
-      })();
-      return void 0;
-    }, delay);
-    return () => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
-    };
-  }, [defaultValues, dirtyFields, formData, delay, onSave, handleSubmit, enabled, reset]);
-}
-export {
-  useAutosave
-};

package/dist/hooks/useBreakpoint.js

@@ -1,20 +0,0 @@
-import { useMemo } from "react";
-import { useMediaQuery } from "react-responsive";
-function getBreakpoints() {
-  const cs = getComputedStyle(document.documentElement);
-  const entries = ["sm", "md", "lg", "xl", "2xl"].map((k) => [k, cs.getPropertyValue(`--breakpoint-${k}`).trim()]).filter(([, v]) => !!v);
-  return Object.fromEntries(entries);
-}
-function useBreakpoint(breakpointKey) {
-  const breakpoints = useMemo(() => getBreakpoints(), []);
-  if (!breakpoints) {
-    throw new Error("Tailwind config is missing theme.screens");
-  }
-  const bool = useMediaQuery({
-    query: `(min-width: ${breakpoints[breakpointKey]})`
-  });
-  return bool;
-}
-export {
-  useBreakpoint
-};

package/dist/hooks/useDebounceCallback.js

@@ -1,29 +0,0 @@
-import { useRef, useState, useCallback, useEffect } from "react";
-function useDebounceCallback(callback, { delay = 500 } = {}) {
-  const timeoutRef = useRef(null);
-  const [isDebouncing, setIsDebouncing] = useState(false);
-  const debouncedCallback = useCallback(
-    (...args) => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
-      setIsDebouncing(true);
-      timeoutRef.current = setTimeout(() => {
-        setIsDebouncing(false);
-        callback?.(...args);
-      }, delay);
-    },
-    [callback, delay]
-  );
-  useEffect(() => {
-    return () => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
-    };
-  }, []);
-  return { callback: debouncedCallback, isDebouncing };
-}
-export {
-  useDebounceCallback
-};

package/dist/hooks/useDeepCompare.js

@@ -1,25 +0,0 @@
-import { useEffect, useLayoutEffect, useMemo, useRef } from "react";
-import { isEqual } from "../utils/isEqual.js";
-const useDeepCompareEffect = (callback, dependencies) => {
-  return useEffect(callback, useDeepCompareDeps(dependencies));
-};
-const useDeepCompareLayoutEffect = (callback, dependencies) => {
-  return useLayoutEffect(callback, useDeepCompareDeps(dependencies));
-};
-const useDeepCompareMemo = (factory, dependencies) => {
-  return useMemo(factory, useDeepCompareDeps(dependencies));
-};
-const useDeepCompareDeps = (value) => {
-  const ref = useRef(void 0);
-  const signalRef = useRef(0);
-  if (!isEqual(value, ref.current)) {
-    ref.current = value;
-    signalRef.current += 1;
-  }
-  return [signalRef.current];
-};
-export {
-  useDeepCompareEffect,
-  useDeepCompareLayoutEffect,
-  useDeepCompareMemo
-};

package/dist/hooks/useFilters.js

@@ -1,120 +0,0 @@
-import { useState, useEffect } from "react";
-import { UIRouter } from "../config/router.context.js";
-const serializeFiltersToQuery = (filterData, prefix) => {
-  const query = {};
-  for (const [key, value] of Object.entries(filterData)) {
-    if (value === null || value === void 0) {
-      continue;
-    }
-    const filterKey = `filter[${prefix && `${prefix}-`}${key}]`;
-    if (Array.isArray(value) || typeof value === "object") {
-      query[filterKey] = JSON.stringify(value);
-    } else if (typeof value === "boolean") {
-      query[filterKey] = value ? "true" : "false";
-    } else {
-      query[filterKey] = value;
-    }
-  }
-  return query;
-};
-const parseFilterFromQuery = (query) => {
-  const filter = {};
-  for (const [key, value] of Object.entries(query)) {
-    const match = /^filter\[(.+?)\]$/.exec(key);
-    if (!match) {
-      continue;
-    }
-    const filterKey = match[1];
-    const isArray = value.startsWith("[") && value.endsWith("]");
-    const isObject = value.startsWith("{") && value.endsWith("}");
-    const isNumber = !Number.isNaN(Number(value)) && value !== "";
-    const isBoolean = ["true", "false"].includes(value);
-    if (isArray || isObject || isNumber) {
-      filter[filterKey] = JSON.parse(value);
-    } else if (isBoolean) {
-      filter[filterKey] = value === "true";
-    } else {
-      filter[filterKey] = value;
-    }
-  }
-  return filter;
-};
-const useFilters = (defaultFilterValues, prefix = "") => {
-  const { query, pathname, replace } = UIRouter.useUIRouter();
-  const queryFilters = parseFilterFromQuery(query);
-  const [filterData, setFilterData] = useState(queryFilters);
-  useEffect(() => {
-    const setUrlToDefaultFilters = () => {
-      const flatFilterQuery = serializeFiltersToQuery(defaultFilterValues, prefix);
-      replace({
-        pathname,
-        query: {
-          ...query,
-          ...flatFilterQuery
-        }
-      });
-    };
-    const currentFilters = parseFilterFromQuery(query);
-    const hasFiltersSet = Object.keys(currentFilters).length > 0;
-    if (defaultFilterValues && !hasFiltersSet) {
-      setUrlToDefaultFilters();
-    }
-  }, [defaultFilterValues, prefix]);
-  useEffect(() => {
-    const newQueryFilters = parseFilterFromQuery(query);
-    setFilterData(newQueryFilters);
-  }, [query]);
-  const setFilterValue = (data) => {
-    let newFilters = { ...filterData };
-    const isReset = Object.keys(data).length === 0;
-    const isResetToDefault = data === defaultFilterValues;
-    if (isResetToDefault) {
-      newFilters = {
-        ...defaultFilterValues
-      };
-    } else if (isReset) {
-      newFilters = {};
-    } else {
-      Object.entries(data).forEach(([key, value]) => {
-        if (value === void 0) {
-          delete newFilters[key];
-        } else {
-          newFilters[key] = value;
-        }
-      });
-    }
-    const prefixPart = prefix ? `${prefix}-` : "";
-    const cleanedQuery = Object.keys(query).reduce(
-      (acc, k) => {
-        if (!k.startsWith(`filter[${prefixPart}`)) {
-          acc[k] = query[k];
-        }
-        return acc;
-      },
-      {}
-    );
-    const flatFilterQuery = serializeFiltersToQuery(newFilters, prefix);
-    replace({
-      pathname,
-      query: {
-        ...cleanedQuery,
-        ...flatFilterQuery
-      }
-    });
-    setFilterData(newFilters);
-  };
-  const getFilterValue = (keys) => {
-    const result = {};
-    keys.forEach((key) => {
-      result[key] = filterData[key];
-    });
-    return result;
-  };
-  const clearAllFilters = () => {
-    setFilterValue(defaultFilterValues ?? {});
-  };
-  return { filterData, setFilterValue, getFilterValue, clearAllFilters };
-};
-export {
-  useFilters
-};

package/dist/hooks/useForm.js

@@ -1,22 +0,0 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useMemo } from "react";
-import { useForm as useForm$1 } from "react-hook-form";
-function useForm({
-  resolver,
-  zodSchema,
-  defaultValues,
-  ...props
-}) {
-  const formResolver = useMemo(
-    () => resolver ?? (zodSchema ? zodResolver(zodSchema) : void 0),
-    [resolver, zodSchema]
-  );
-  return useForm$1({
-    ...props,
-    resolver: formResolver,
-    defaultValues
-  });
-}
-export {
-  useForm
-};

package/dist/hooks/useFormAutosave.js

@@ -1,67 +0,0 @@
-import { useRef, useEffect } from "react";
-import { useAutosave } from "./useAutosave.js";
-import { useForm } from "./useForm.js";
-import { ObjectUtils } from "../utils/object.utils.js";
-const getResetTimeoutErrorMessage = (resetTimeout) => `Form Reset Timeout (${resetTimeout}ms) - Action Required
-Problem: Form values weren't reset after submission.
-
-Likely causes:
-• Missing variables in reset dependency array
-• Reset dependencies not updating after form save
-• Async operations blocking timely reset
-
-Solutions:
-1. Ensure reset dependencies include all relevant state variables
-2. Confirm your submission handler updates state properly (check query invalidation)
-3. For slower operations, consider increasing the timeout threshold`;
-function useFormAutosave({
-  autosaveDelay,
-  enableAutosave,
-  onAutosave,
-  getResetValues,
-  resetDeps,
-  resetTimeout = 5e3,
-  ...props
-}) {
-  const form = useForm({ ...props, defaultValues: getResetValues() });
-  const shouldResetFormValuesRef = useRef(false);
-  const resetFormValuesTimeoutRef = useRef(void 0);
-  useEffect(() => {
-    const resetValues = getResetValues();
-    if (resetValues === void 0) {
-      return;
-    }
-    const resetFormValues = async () => {
-      const keepStateOptions = shouldResetFormValuesRef.current ? { keepDirtyValues: true } : void 0;
-      shouldResetFormValuesRef.current = false;
-      let values = resetValues;
-      if (ObjectUtils.isFunction(resetValues)) {
-        values = await resetValues();
-      }
-      form.reset(values, keepStateOptions);
-    };
-    resetFormValues();
-  }, [...resetDeps]);
-  const onSaveSuccess = () => {
-    shouldResetFormValuesRef.current = true;
-    if (resetFormValuesTimeoutRef.current) {
-      clearTimeout(resetFormValuesTimeoutRef.current);
-    }
-    resetFormValuesTimeoutRef.current = setTimeout(() => {
-      if (shouldResetFormValuesRef.current) {
-        throw new Error(getResetTimeoutErrorMessage(resetTimeout));
-      }
-    }, resetTimeout);
-  };
-  useAutosave({
-    form,
-    delay: autosaveDelay,
-    enabled: enableAutosave,
-    onSave: onAutosave,
-    onSaveSuccess
-  });
-  return form;
-}
-export {
-  useFormAutosave
-};

package/dist/hooks/useIntersectionObserver.js

@@ -1,27 +0,0 @@
-import { useState, useEffect } from "react";
-const useIntersectionObserver = ({
-  onIntersection,
-  root,
-  rootMargin,
-  threshold
-}) => {
-  const [ref, setRef] = useState(null);
-  useEffect(() => {
-    const observer = new IntersectionObserver(
-      (entries) => {
-        if (entries.some((entry) => entry.isIntersecting)) {
-          onIntersection?.();
-        }
-      },
-      { root, rootMargin, threshold }
-    );
-    if (ref) {
-      observer.observe(ref);
-    }
-    return () => observer.disconnect();
-  }, [ref, root, rootMargin, threshold, onIntersection]);
-  return { setRef };
-};
-export {
-  useIntersectionObserver
-};

package/dist/hooks/useLocalStorage.js

@@ -1,63 +0,0 @@
-import { useState, useEffect, useCallback } from "react";
-const useLocalStorage = ({ key, schema }) => {
-  const [value, setValue] = useState(null);
-  const [isInitialLoading, setIsInitialLoading] = useState(true);
-  const [error, setError] = useState(null);
-  useEffect(() => {
-    if (!localStorage) {
-      setValue(null);
-      return;
-    }
-    try {
-      const lsValue = localStorage.getItem(key);
-      if (!lsValue) {
-        setValue(null);
-        return;
-      }
-      let jsonOrString;
-      try {
-        jsonOrString = JSON.parse(lsValue);
-      } catch {
-        jsonOrString = lsValue;
-      }
-      const parsedValue = schema.safeParse(jsonOrString);
-      if (parsedValue.success) {
-        setValue(parsedValue.data);
-      } else {
-        setError(parsedValue.error);
-        setValue(null);
-      }
-    } finally {
-      setIsInitialLoading(false);
-    }
-  }, [key, schema]);
-  const set = useCallback(
-    (newValue) => {
-      if (!localStorage) {
-        return;
-      }
-      const parsedValue = schema.safeParse(newValue);
-      if (!parsedValue.success) {
-        return;
-      }
-      if (typeof parsedValue.data === "string") {
-        localStorage.setItem(key, parsedValue.data);
-      } else {
-        localStorage.setItem(key, JSON.stringify(parsedValue.data));
-      }
-      setValue(parsedValue.data);
-    },
-    [key, schema]
-  );
-  const remove = useCallback(() => {
-    if (!localStorage) {
-      return;
-    }
-    localStorage.removeItem(key);
-    setValue(null);
-  }, [key]);
-  return { value, set, remove, error, isInitialLoading };
-};
-export {
-  useLocalStorage
-};