lkd-web-kit 0.3.4 → 0.3.7

package/dist/index.es20.js

@@ -0,0 +1,16 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { createContext, useContext } from 'react';
+
+const PageData = createContext(void 0);
+const PageDataProvider = ({
+  value,
+  children
+}) => /* @__PURE__ */ jsx(PageData.Provider, { value, children });
+const usePageData = () => {
+  const data = useContext(PageData);
+  if (data === void 0) throw new Error("Out of context: usePageData");
+  return data;
+};
+
+export { PageDataProvider, usePageData };

package/dist/index.es21.js

@@ -0,0 +1,26 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { Box } from '@mantine/core';
+import { FormProvider } from 'react-hook-form';
+
+const Form = ({
+  methods,
+  onSubmit = () => {
+  },
+  onSubmitError,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsx(FormProvider, { ...methods, children: /* @__PURE__ */ jsx(
+    Box,
+    {
+      component: "form",
+      onSubmit: (e) => {
+        e.stopPropagation();
+        methods.handleSubmit(onSubmit, onSubmitError)(e);
+      },
+      ...rest
+    }
+  ) });
+};
+
+export { Form };

package/dist/index.es22.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { Button } from '@mantine/core';
+import { useFormContext } from 'react-hook-form';
+
+const FormButtonSubmit = (props) => {
+  const { formState } = useFormContext();
+  const { isSubmitting } = formState;
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      loading: isSubmitting,
+      type: "submit",
+      ...props
+    }
+  );
+};
+
+export { FormButtonSubmit };

package/dist/index.es23.js

@@ -0,0 +1,11 @@
+const zodValidator = (schema) => {
+  return (values) => {
+    const result = schema.safeParse(values);
+    if (result.success) return;
+    const { error } = result;
+    const firstError = error.issues[0];
+    return firstError?.message;
+  };
+};
+
+export { zodValidator };

package/dist/index.es24.js

@@ -0,0 +1,12 @@
+import { z } from 'zod';
+
+const nullableButRequired = (schema, message = "Campo requerido") => schema.nullable().superRefine((val, ctx) => {
+  if (val === null) {
+    ctx.addIssue({
+      code: z.ZodIssueCode.custom,
+      message
+    });
+  }
+});
+
+export { nullableButRequired };

package/dist/index.es25.js

@@ -0,0 +1,12 @@
+import { z } from 'zod';
+
+const optionalButRequired = (schema, message = "Campo requerido") => schema.optional().superRefine((val, ctx) => {
+  if (val === void 0) {
+    ctx.addIssue({
+      code: z.ZodIssueCode.custom,
+      message
+    });
+  }
+});
+
+export { optionalButRequired };

package/dist/index.es26.js

@@ -0,0 +1,14 @@
+import { jsx } from 'react/jsx-runtime';
+import { Checkbox } from '@mantine/core';
+import { withForm } from './index.es38.js';
+
+const FormCheckbox = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  Checkbox,
+  {
+    ...field,
+    checked: field.value,
+    ...props
+  }
+));
+
+export { FormCheckbox };

package/dist/index.es27.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { MyDatePickerInput } from './index.es6.js';
+import { withForm } from './index.es38.js';
+
+const FormDatePickerInput = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  MyDatePickerInput,
+  {
+    ...field,
+    ...props
+  }
+));
+
+export { FormDatePickerInput };

package/dist/index.es28.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { MyDateTimePicker } from './index.es7.js';
+import { withForm } from './index.es38.js';
+
+const FormDateTimePicker = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  MyDateTimePicker,
+  {
+    ...field,
+    ...props
+  }
+));
+
+export { FormDateTimePicker };

package/dist/index.es29.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { MyNumberInput } from './index.es9.js';
+import { withForm } from './index.es38.js';
+
+const FormNumberInput = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  MyNumberInput,
+  {
+    ...field,
+    ...props
+  }
+));
+
+export { FormNumberInput };

package/dist/index.es3.js

@@ -0,0 +1,8 @@
+import { jsx } from 'react/jsx-runtime';
+import { Center, Loader } from '@mantine/core';
+
+const InfinityLoader = ({ infinity, loaderProps, ...props }) => {
+  return /* @__PURE__ */ jsx(Center, { ...props, children: infinity.isFetching ? /* @__PURE__ */ jsx(Loader, { ...loaderProps }) : !infinity.hasNextPage && (infinity.data?.pages.length ?? 0) > 1 && /* @__PURE__ */ jsx("p", { children: "No hay más resultados" }) });
+};
+
+export { InfinityLoader };

package/dist/index.es30.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { Radio } from '@mantine/core';
+import { withForm } from './index.es38.js';
+
+const FormRadioGroup = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  Radio.Group,
+  {
+    ...field,
+    ...props
+  }
+));
+
+export { FormRadioGroup };

package/dist/index.es31.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { MySelect } from './index.es10.js';
+import { withForm } from './index.es38.js';
+
+const FormSelect = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  MySelect,
+  {
+    ...field,
+    ...props
+  }
+));
+
+export { FormSelect };

package/dist/index.es32.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { SelectInfinity } from './index.es14.js';
+import { withForm } from './index.es38.js';
+
+const FormSelectInfinity = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  SelectInfinity,
+  {
+    ...field,
+    ...props
+  }
+));
+
+export { FormSelectInfinity };

package/dist/index.es33.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { MyTextarea } from './index.es11.js';
+import { withForm } from './index.es38.js';
+
+const FormTextarea = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  MyTextarea,
+  {
+    ...field,
+    ...props
+  }
+));
+
+export { FormTextarea };

package/dist/index.es34.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { MyTextInput } from './index.es12.js';
+import { withForm } from './index.es38.js';
+
+const FormTextInput = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  MyTextInput,
+  {
+    ...field,
+    ...props
+  }
+));
+
+export { FormTextInput };

package/dist/index.es35.js

@@ -0,0 +1,23 @@
+import { jsx } from 'react/jsx-runtime';
+import { MyTimeInput } from './index.es13.js';
+import { withForm } from './index.es38.js';
+
+const FormTimeInput = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  MyTimeInput,
+  {
+    ...field,
+    ...props
+  }
+));
+const timeInputToNumber = (timeInput) => {
+  const [hours, minutes] = timeInput.split(":").map(Number);
+  const result = hours + minutes / 60;
+  return Number(result.toFixed(2));
+};
+const numberToTimeInput = (number) => {
+  const hours = Math.floor(number);
+  const minutes = Math.round((number - hours) * 60);
+  return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}`;
+};
+
+export { FormTimeInput, numberToTimeInput, timeInputToNumber };

package/dist/index.es36.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { MyMultiSelect } from './index.es15.js';
+import { withForm } from './index.es38.js';
+
+const FormMultiSelect = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  MyMultiSelect,
+  {
+    ...field,
+    ...props
+  }
+));
+
+export { FormMultiSelect };

package/dist/index.es37.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { MyMonthPickerInput } from './index.es16.js';
+import { withForm } from './index.es38.js';
+
+const FormMonthPickerInput = withForm(({ field, props }) => /* @__PURE__ */ jsx(
+  MyMonthPickerInput,
+  {
+    ...field,
+    ...props
+  }
+));
+
+export { FormMonthPickerInput };

package/dist/index.es38.js

@@ -0,0 +1,47 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { Controller } from 'react-hook-form';
+import { zodValidator } from './index.es23.js';
+
+const withForm = (WrappedComponent, getControllerProps) => {
+  const FormField = (props) => {
+    const { validate, name = "", placeholder, label, description, ...withFormRestProps } = props;
+    return /* @__PURE__ */ jsx(
+      Controller,
+      {
+        name,
+        defaultValue: "",
+        rules: {
+          validate: validate && !props.disabled ? zodValidator(validate) : void 0
+        },
+        disabled: props.disabled,
+        ...getControllerProps?.(props),
+        render: (renderProps) => {
+          const {
+            fieldState: { error }
+          } = renderProps;
+          const fieldProps = {
+            ...renderProps,
+            props: {
+              ...props,
+              validate: void 0
+            },
+            field: {
+              ...renderProps.field,
+              label,
+              placeholder,
+              description,
+              error: error?.message
+            },
+            ...withFormRestProps
+          };
+          return /* @__PURE__ */ jsx(WrappedComponent, { ...fieldProps });
+        }
+      }
+    );
+  };
+  FormField.displayName = `WithForm(${WrappedComponent.displayName})`;
+  return FormField;
+};
+
+export { withForm };

package/dist/index.es39.js

@@ -0,0 +1,34 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
+
+const withModalManager = (WrappedComponent) => {
+  const Component = ({
+    removeModal,
+    opened,
+    ...props
+  }) => {
+    const [isOpen, setIsOpen] = useState(false);
+    const onClose = () => {
+      setIsOpen(false);
+      setTimeout(() => removeModal(), 200);
+      props.onClose?.();
+    };
+    useEffect(() => {
+      if (opened) setTimeout(() => setIsOpen(true), 0);
+      else onClose();
+    }, [opened]);
+    return /* @__PURE__ */ jsx(
+      WrappedComponent,
+      {
+        ...props,
+        opened: isOpen,
+        onClose
+      }
+    );
+  };
+  Component.displayName = `WithModalManager(${WrappedComponent.displayName})`;
+  return Component;
+};
+
+export { withModalManager };

package/dist/index.es4.js

@@ -0,0 +1,36 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { Stack, NavLink } from '@mantine/core';
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+
+const NavItems = ({ items, activeStrategy = "includes" }) => {
+  const pathname = usePathname();
+  return /* @__PURE__ */ jsx(Stack, { gap: 0, children: items.map(({ href, isActive, ...navLinkProps }) => {
+    if (href) {
+      const active = isActive ?? (activeStrategy === "equals" ? href === pathname : href.includes(pathname));
+      return /* @__PURE__ */ jsx(
+        NavLink,
+        {
+          active,
+          component: Link,
+          prefetch: false,
+          href,
+          ...navLinkProps
+        },
+        navLinkProps.label
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      NavLink,
+      {
+        active: isActive,
+        component: "button",
+        ...navLinkProps
+      },
+      navLinkProps.label
+    );
+  }) });
+};
+
+export { NavItems };

package/dist/index.es40.js

@@ -0,0 +1,11 @@
+'use client';
+import { useMatches } from '@mantine/core';
+
+const useBreakpoint = (breakpoint) => {
+  const result = useMatches({
+    [breakpoint]: true
+  });
+  return !!result;
+};
+
+export { useBreakpoint };

package/dist/index.es41.js

@@ -0,0 +1,19 @@
+'use client';
+import { useOnScrollProgress } from './index.es42.js';
+
+const useFetchNextPageOnScroll = ({
+  infinity,
+  scrollRef,
+  disabled = false
+}) => {
+  useOnScrollProgress({
+    triggerPercentage: 0.9,
+    callback: () => {
+      if (infinity.hasNextPage) infinity.fetchNextPage();
+    },
+    scrollRef,
+    disabled
+  });
+};
+
+export { useFetchNextPageOnScroll };

package/dist/index.es42.js

@@ -0,0 +1,35 @@
+'use client';
+import { useEffect } from 'react';
+
+const useOnScrollProgress = ({
+  triggerPercentage,
+  callback,
+  scrollRef,
+  disabled = false
+}) => {
+  if (triggerPercentage < 0 || triggerPercentage > 1)
+    throw new Error("El porcentaje debe estar entre 0 y 1");
+  useEffect(() => {
+    if (disabled || scrollRef && scrollRef.current === null) return;
+    let hasTriggered = false;
+    const handleScroll = () => {
+      const el = scrollRef?.current;
+      const target = el ?? document.documentElement;
+      const scrollHeight = target.scrollHeight - target.clientHeight;
+      const scrollTop = el ? target.scrollTop : window.scrollY;
+      const scrollProgress = scrollHeight > 0 ? Math.min(1, scrollTop / scrollHeight) : 0;
+      if (!hasTriggered && scrollProgress >= triggerPercentage) {
+        callback();
+        hasTriggered = true;
+      }
+    };
+    const scrollTarget = scrollRef?.current ?? window;
+    scrollTarget.addEventListener("scroll", handleScroll);
+    handleScroll();
+    return () => {
+      scrollTarget.removeEventListener("scroll", handleScroll);
+    };
+  }, [triggerPercentage, callback, scrollRef, disabled]);
+};
+
+export { useOnScrollProgress };

package/dist/index.es43.js

@@ -0,0 +1,20 @@
+'use client';
+import { useSearchParams } from 'next/navigation';
+
+const useUpdateSearchParams = () => {
+  const searchParams = useSearchParams();
+  const updateSearchParams = (newSearchparams) => {
+    const params = new URLSearchParams(searchParams.toString());
+    Object.entries(newSearchparams).forEach(([key, value]) => {
+      if (value === null) {
+        params.delete(key);
+        return;
+      }
+      params.set(key, String(value));
+    });
+    window?.history?.pushState(null, "", `?${params.toString()}`);
+  };
+  return { updateSearchParams, searchParams };
+};
+
+export { useUpdateSearchParams };

package/dist/index.es44.js

@@ -0,0 +1,10 @@
+const breakpointsWithPx = {
+  xs: "576px",
+  sm: "640px",
+  md: "768px",
+  lg: "1024px",
+  xl: "1280px",
+  ["2xl"]: "1536px"
+};
+
+export { breakpointsWithPx };

package/dist/index.es45.js

@@ -0,0 +1,15 @@
+const toTailwindColors = (colors) => Object.entries(colors).reduce(
+  (acc, [key, value]) => {
+    acc[key] = value.reduce(
+      (acc2, color, index) => {
+        acc2[index] = color;
+        return acc2;
+      },
+      {}
+    );
+    return acc;
+  },
+  {}
+);
+
+export { toTailwindColors };

package/dist/index.es46.js

@@ -0,0 +1,39 @@
+import { Tooltip, Menu, Select, AppShell, Notification } from '@mantine/core';
+import { breakpointsWithPx } from './index.es44.js';
+
+const myDefaultTheme = {
+  breakpoints: breakpointsWithPx,
+  cursorType: "pointer",
+  components: {
+    Notification: Notification.extend({
+      defaultProps: {
+        withBorder: true
+      }
+    }),
+    AppShell: AppShell.extend({
+      defaultProps: {
+        padding: 0
+      }
+    }),
+    Select: Select.extend({
+      defaultProps: {
+        allowDeselect: false,
+        withCheckIcon: false,
+        clearable: true
+      }
+    }),
+    Menu: Menu.extend({
+      defaultProps: {
+        position: "bottom-end"
+      }
+    }),
+    Tooltip: Tooltip.extend({
+      defaultProps: {
+        multiline: true,
+        w: 300
+      }
+    })
+  }
+};
+
+export { myDefaultTheme };

package/dist/index.es47.js

@@ -0,0 +1,10 @@
+function formatBytes(bytes, decimals = 2) {
+  if (!+bytes) return "0 Bytes";
+  const k = 1024;
+  const dm = decimals < 0 ? 0 : decimals;
+  const sizes = ["Bytes", "KB", "MB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`;
+}
+
+export { formatBytes };

package/dist/index.es48.js

@@ -0,0 +1,15 @@
+import { HTTPError } from 'ky';
+import { parseJSON } from './index.es49.js';
+
+class KyError extends HTTPError {
+  constructor(response, request, options, bodyJson) {
+    super(response, request, options);
+    this.response.bodyJson = bodyJson;
+  }
+}
+const addBodyJsonHook = async (error) => {
+  error.response.bodyJson = await parseJSON(error.response);
+  return error;
+};
+
+export { KyError, addBodyJsonHook };

package/dist/index.es49.js

@@ -0,0 +1,7 @@
+const parseJSON = async (response) => {
+  return response.text().then(function(text) {
+    return text ? JSON.parse(text) : {};
+  });
+};
+
+export { parseJSON };

package/dist/index.es5.js

@@ -0,0 +1,50 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+
+const Icon = ({ i: I, size = "md", style, rotate, className, ...rest }) => {
+  return /* @__PURE__ */ jsx(
+    I,
+    {
+      ...typeof size === "number" ? {
+        height: size,
+        width: size
+      } : stylesBySize[size],
+      viewBox: "0 0 24 24",
+      style: {
+        ...style,
+        transform: `rotate(${rotate}deg)`
+      },
+      className: clsx("shrink-0", className),
+      ...rest
+    }
+  );
+};
+const stylesBySize = {
+  xs: {
+    height: 16,
+    width: 16
+  },
+  sm: {
+    height: 20,
+    width: 20
+  },
+  md: {
+    height: 24,
+    width: 24
+  },
+  lg: {
+    height: 28,
+    width: 28
+  },
+  xl: {
+    height: 32,
+    width: 32
+  },
+  ["2xl"]: {
+    height: 40,
+    width: 40
+  }
+};
+
+export { Icon };