@g4rcez/components 5.0.1 → 5.0.3

package/dist/lib/dom.js

@@ -0,0 +1,185 @@
+import { clsx } from "clsx";
+import { Is } from "sidekicker";
+import { extendTailwindMerge } from "tailwind-merge";
+import { components } from "../styles/components";
+const componentPrefixes = Object.keys(components);
+const isFontSizeAttr = (attr) => attr === "text" || attr.endsWith("-text") || attr.startsWith("text-");
+const isBorderWidthAttr = (attr) => attr === "border" || attr.endsWith("-border");
+const isRadiusAttr = (attr) => attr === "radius" || attr.endsWith("-radius");
+const fontSizeTokens = new Set();
+const borderWidthTokens = new Set();
+const radiusTokens = new Set();
+const spacingTokens = new Set();
+for (const [component, attrs] of Object.entries(components)) {
+    if (!attrs || typeof attrs !== "object")
+        continue;
+    if (component === "typography") {
+        for (const attr of Object.keys(attrs))
+            fontSizeTokens.add(attr);
+        continue;
+    }
+    for (const attr of Object.keys(attrs)) {
+        const key = `${component}-${attr}`;
+        if (isRadiusAttr(attr))
+            radiusTokens.add(key);
+        else if (isBorderWidthAttr(attr)) {
+            borderWidthTokens.add(key);
+            spacingTokens.add(key);
+        }
+        else if (isFontSizeAttr(attr)) {
+            fontSizeTokens.add(key);
+            spacingTokens.add(key);
+        }
+        else
+            spacingTokens.add(key);
+    }
+}
+const isComponentToken = (value) => componentPrefixes.some((p) => value === p || value.startsWith(`${p}-`));
+const isSpacingValue = (value) => spacingTokens.has(value);
+const isRadiusValue = (value) => radiusTokens.has(value);
+const isFontSizeValue = (value) => {
+    if (fontSizeTokens.has(value))
+        return true;
+    if (value.startsWith("typography-"))
+        return fontSizeTokens.has(value.slice("typography-".length));
+    return false;
+};
+const isBorderWidthValue = (value) => borderWidthTokens.has(value);
+const isTextColorValue = (value) => !isFontSizeValue(value) && isComponentToken(value);
+const isBorderColorValue = (value) => !isBorderWidthValue(value) && isComponentToken(value);
+const spacingGroupIds = [
+    "p",
+    "px",
+    "py",
+    "pt",
+    "pr",
+    "pb",
+    "pl",
+    "ps",
+    "pe",
+    "m",
+    "mx",
+    "my",
+    "mt",
+    "mr",
+    "mb",
+    "ml",
+    "ms",
+    "me",
+    "gap",
+    "gap-x",
+    "gap-y",
+    "h",
+    "w",
+    "size",
+    "min-h",
+    "min-w",
+    "max-h",
+    "max-w",
+    "top",
+    "right",
+    "bottom",
+    "left",
+    "inset",
+    "inset-x",
+    "inset-y",
+];
+const radiusGroupIds = [
+    "rounded",
+    "rounded-s",
+    "rounded-e",
+    "rounded-t",
+    "rounded-r",
+    "rounded-b",
+    "rounded-l",
+    "rounded-ss",
+    "rounded-se",
+    "rounded-ee",
+    "rounded-es",
+    "rounded-tl",
+    "rounded-tr",
+    "rounded-br",
+    "rounded-bl",
+];
+const wrap = (ids, match) => Object.fromEntries(ids.map((id) => [id, [{ [id]: [match] }]]));
+const twMerge = extendTailwindMerge({
+    extend: {
+        classGroups: {
+            ...wrap(spacingGroupIds, isSpacingValue),
+            ...wrap(radiusGroupIds, isRadiusValue),
+            "font-size": [{ text: [isFontSizeValue] }],
+            "text-color": [{ text: [isTextColorValue] }],
+            "border-w": [{ border: [isBorderWidthValue] }],
+            "border-color": [{ border: [isBorderColorValue] }],
+        },
+    },
+});
+export const mergeRefs = (...refs) => (value) => {
+    refs.forEach((ref) => {
+        if (typeof ref === "function") {
+            ref(value);
+        }
+        else if (ref !== null) {
+            ref.current = value;
+        }
+    });
+};
+export const isReactComponent = (a) => {
+    if (typeof a !== "object" || a === null)
+        return false;
+    const elem = a;
+    if (elem.$$typeof === Symbol.for("react.forward_ref"))
+        return true;
+    if (elem.$$typeof === Symbol.for("react.fragment"))
+        return true;
+    return elem.$$typeof === Symbol.for("react.element");
+};
+export const isReactFC = (a) => Is.function(a);
+export const css = (...styles) => twMerge(clsx(styles));
+export const synthesizeChangeEvent = (input) => {
+    return {
+        target: input,
+        currentTarget: input,
+    };
+};
+export const dispatchInput = (input) => {
+    const event = new Event("input", { bubbles: true, composed: true });
+    input?.dispatchEvent(event);
+    return Object.assign({}, event, { target: input, currentTarget: input });
+};
+export const initializeInputDataset = (input) => {
+    const focus = () => input.setAttribute("data-initialized", "true");
+    input.addEventListener("focus", focus);
+    return () => input.removeEventListener("focus", focus);
+};
+export const hasVerticalScroll = (htmlElement) => htmlElement.scrollHeight > htmlElement.clientHeight;
+export const getRemainingSize = (element, windowSize) => {
+    if (element && element.getBoundingClientRect) {
+        const rect = element.getBoundingClientRect();
+        return Math.abs(windowSize - rect.bottom);
+    }
+    return 320;
+};
+export const getCoords = (elem, docEl) => {
+    const box = elem.getBoundingClientRect();
+    const parent = docEl.getBoundingClientRect();
+    return {
+        top: Math.round(box.top - parent.top),
+        left: Math.round(box.left - parent.left),
+    };
+};
+export const isChildVisible = (container, child, partial = true) => {
+    const containerRect = container.getBoundingClientRect();
+    const childRect = child.getBoundingClientRect();
+    const isWithinTop = childRect.top >= containerRect.top;
+    const isWithinBottom = childRect.bottom <= containerRect.bottom;
+    const isWithinLeft = childRect.left >= containerRect.left;
+    const isWithinRight = childRect.right <= containerRect.right;
+    if (partial) {
+        return (childRect.top < containerRect.bottom &&
+            childRect.bottom > containerRect.top &&
+            childRect.left < containerRect.right &&
+            childRect.right > containerRect.left);
+    }
+    return isWithinTop && isWithinBottom && isWithinLeft && isWithinRight;
+};

package/dist/lib/fns.d.ts

@@ -0,0 +1,11 @@
+import type { AllPaths } from "sidekicker";
+import { Any } from "../types";
+export declare const uuid: () => string;
+export declare const path: <T extends Any, K extends AllPaths<T>>(obj: T, path: K) => Any | undefined;
+export declare const isSsr: () => boolean;
+export declare const safeRegex: (string: string) => string;
+export declare const splitInto: <T>(array: T[], size: number) => T[][];
+export declare const negate: (b: boolean) => boolean;
+export declare const noop: () => void;
+export declare const isMobile: () => boolean;
+//# sourceMappingURL=fns.d.ts.map

package/dist/lib/fns.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fns.d.ts","sourceRoot":"","sources":["../../src/lib/fns.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/B,eAAO,MAAM,IAAI,QAAO,MAkBvB,CAAC;AAUF,eAAO,MAAM,IAAI,GAAI,CAAC,SAAS,GAAG,EAAE,CAAC,SAAS,QAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC,oBAGzE,CAAC;AAEF,eAAO,MAAM,KAAK,eAAsC,CAAC;AAEzD,eAAO,MAAM,SAAS,GAAI,QAAQ,MAAM,WAAkD,CAAC;AAE3F,eAAO,MAAM,SAAS,GAAI,CAAC,EAAE,OAAO,CAAC,EAAE,EAAE,MAAM,MAAM,UAQpD,CAAC;AAEF,eAAO,MAAM,MAAM,GAAI,GAAG,OAAO,YAAO,CAAC;AAEzC,eAAO,MAAM,IAAI,YAAW,CAAC;AAE7B,eAAO,MAAM,QAAQ,eAGpB,CAAC"}

package/dist/lib/fns.js

@@ -0,0 +1,46 @@
+export const uuid = () => {
+    const timestamp = Date.now();
+    const bytes = new Uint8Array(16);
+    bytes[0] = (timestamp / Math.pow(2, 40)) & 0xff;
+    bytes[1] = (timestamp / Math.pow(2, 32)) & 0xff;
+    bytes[2] = (timestamp / Math.pow(2, 24)) & 0xff;
+    bytes[3] = (timestamp / Math.pow(2, 16)) & 0xff;
+    bytes[4] = (timestamp / Math.pow(2, 8)) & 0xff;
+    bytes[5] = timestamp & 0xff;
+    const randomBytes = new Uint8Array(10);
+    crypto.getRandomValues(randomBytes);
+    bytes.set(randomBytes, 6);
+    bytes[6] = (bytes[6] & 0x0f) | 0x70;
+    bytes[8] = (bytes[8] & 0x3f) | 0x80;
+    const hex = Array.from(bytes)
+        .map((b) => b.toString(16).padStart(2, "0"))
+        .join("");
+    return `${hex.slice(0, 8)}-${hex.slice(8, 12)}-${hex.slice(12, 16)}-${hex.slice(16, 20)}-${hex.slice(20)}`;
+};
+const travel = (path, regexp, obj) => path
+    .split(regexp)
+    .filter(Boolean)
+    .reduce((res, key) => (res !== null && res !== undefined ? res[key] : res), obj);
+const regexPaths = { basic: /[,[\]]+?/, extend: /[,[\].]+?/ };
+export const path = (obj, path) => {
+    const result = travel(path, regexPaths.basic, obj) || travel(path, regexPaths.extend, obj);
+    return result === undefined || result === obj ? undefined : result;
+};
+export const isSsr = () => typeof window === "undefined";
+export const safeRegex = (string) => string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+export const splitInto = (array, size) => {
+    const newArray = [];
+    for (let i = 0; i < size; i++) {
+        const init = i * size;
+        const result = array.slice(init, init + size);
+        if (result.length > 0)
+            newArray.push(result);
+    }
+    return newArray;
+};
+export const negate = (b) => !b;
+export const noop = () => { };
+export const isMobile = () => {
+    const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+    return /android|iphone|ipad|ipod|opera mini|iemobile|wpdesktop/i.test(userAgent ?? "");
+};

package/dist/lib/fzf.d.ts

@@ -0,0 +1,16 @@
+import { Any, Walk } from "../types";
+export declare const fuzzyMatch: (text: string, search: string) => number | null;
+export type Match = "EQUAL" | "CONTAINS" | "CONTAINS_NUMBERS" | "STARTS_WITH" | "ENDS_WITH" | "FUZZY";
+export type MatchValue<T> = {
+    match?: Match;
+    score?: number;
+    key: Walk<T>;
+    value: string | string[];
+    ifNotMatch?: (value: string, source: string) => boolean;
+};
+export type Matcher<T> = {
+    match?: Match;
+    key: Walk<T>;
+};
+export declare const fzf: <T extends Any, ID extends Walk<T>>(items: T[], id: ID, keys: MatchValue<T>[]) => T[];
+//# sourceMappingURL=fzf.d.ts.map

package/dist/lib/fzf.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fzf.d.ts","sourceRoot":"","sources":["../../src/lib/fzf.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAErC,eAAO,MAAM,UAAU,GAAI,MAAM,MAAM,EAAE,QAAQ,MAAM,KAAG,MAAM,GAAG,IAmClE,CAAC;AAEF,MAAM,MAAM,KAAK,GAAG,OAAO,GAAG,UAAU,GAAG,kBAAkB,GAAG,aAAa,GAAG,WAAW,GAAG,OAAO,CAAC;AAEtG,MAAM,MAAM,UAAU,CAAC,CAAC,IAAI;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;IACb,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACzB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC;CAC3D,CAAC;AAEF,MAAM,MAAM,OAAO,CAAC,CAAC,IAAI;IAAE,KAAK,CAAC,EAAE,KAAK,CAAC;IAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,CAAA;CAAE,CAAC;AAoDzD,eAAO,MAAM,GAAG,GAAI,CAAC,SAAS,GAAG,EAAE,EAAE,SAAS,IAAI,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,EAAE,IAAI,EAAE,EAAE,MAAM,UAAU,CAAC,CAAC,CAAC,EAAE,QA2B/F,CAAC"}

package/dist/lib/fzf.js

@@ -0,0 +1,115 @@
+import { Is } from "sidekicker";
+export const fuzzyMatch = (text, search) => {
+    text = String(text).toLocaleLowerCase();
+    search = String(search).toLocaleLowerCase();
+    if (text === search)
+        return 1;
+    const firstChar = search[0];
+    if (!firstChar)
+        return null;
+    const matchedIndexes = [];
+    let cursor = 0;
+    while (cursor < text.length) {
+        const startIdx = text.indexOf(firstChar, cursor);
+        if (startIdx === -1)
+            break;
+        let pos = startIdx + 1;
+        const indexes = [startIdx];
+        let matched = true;
+        for (let i = 1; i < search.length; i++) {
+            const foundAt = text.indexOf(search[i], pos);
+            if (foundAt === -1) {
+                matched = false;
+                break;
+            }
+            indexes.push(foundAt);
+            pos = foundAt + 1;
+        }
+        if (matched)
+            matchedIndexes.push(indexes);
+        cursor = startIdx + 1;
+    }
+    if (matchedIndexes.length === 0)
+        return null;
+    const bestMatch = matchedIndexes.sort((a, b) => {
+        if (a.length === 1)
+            return a[0] - b[0];
+        return a[a.length - 1] - a[0] - (b[b.length - 1] - b[0]);
+    })[0];
+    if (bestMatch.length > 1)
+        return 2 + (bestMatch[bestMatch.length - 1] - bestMatch[0]);
+    return 2 + bestMatch[0];
+};
+const travel = (path, regexp, obj) => {
+    const keys = path.split(regexp).filter(Boolean);
+    let res = obj;
+    for (const key of keys) {
+        if (res === null || res === undefined) {
+            return res;
+        }
+        res = res[key];
+    }
+    return res;
+};
+const regexPaths = { basic: /[,[\]]+?/, extend: /[,[\].]+?/ };
+const path = (obj, path) => {
+    const result = travel(path, regexPaths.basic, obj);
+    if (result !== undefined && result !== obj)
+        return result;
+    return travel(path, regexPaths.extend, obj);
+};
+const onlyNumbers = (str) => str.replace(/[^0-9]/g, "");
+const diacritics = (input) => input.normalize("NFD").replace(/[\u0300-\u036f]/g, "");
+const strCompare = (text, value, _, match = "FUZZY") => {
+    if (match === "CONTAINS") {
+        return text.includes(value);
+    }
+    if (match === "EQUAL") {
+        return text === value;
+    }
+    if (match === "CONTAINS_NUMBERS") {
+        return onlyNumbers(text).includes(onlyNumbers(value));
+    }
+    if (match === "STARTS_WITH") {
+        return text.startsWith(value);
+    }
+    if (match === "ENDS_WITH") {
+        return text.endsWith(value);
+    }
+    if (match === "FUZZY") {
+        const r = fuzzyMatch(text, value);
+        return r !== null;
+    }
+    return false;
+};
+const compare = (search, value, defaultScore, match = "FUZZY") => Array.isArray(value) ? value.some((x) => strCompare(search, x, defaultScore, match)) : strCompare(search, value, defaultScore, match);
+export const fzf = (items, id, keys) => {
+    if (keys.length === 0) {
+        return items;
+    }
+    const map = new Map();
+    const remap = keys.map((x) => {
+        const target = Is.array(x.value)
+            ? x.value.map((v) => diacritics(`${v}`.toLocaleLowerCase()).trim())
+            : diacritics(`${x.value}`.toLocaleLowerCase()).trim();
+        return { ...x, target };
+    });
+    items.forEach((item) => {
+        const idVal = path(item, id);
+        remap.forEach((filter) => {
+            const searchValue = path(item, filter.key);
+            if (!searchValue)
+                return;
+            const search = diacritics(`${searchValue}`.toLocaleLowerCase()).trim();
+            if (compare(search, filter.target, filter.score, filter.match)) {
+                return void map.set(idVal, item);
+            }
+            if (Is.function(filter.ifNotMatch)) {
+                const result = filter.ifNotMatch(filter.target, search);
+                if (result)
+                    map.set(idVal, item);
+            }
+        });
+    });
+    return Array.from(map.values());
+};

package/dist/lib/keyboard-area.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+type EventKey = "Backspace" | "Tab" | "Enter" | "Shift" | "Control" | "Alt" | "Pause" | "CapsLock" | "Escape" | "Space" | "PageUp" | "PageDown" | "End" | "Home" | "ArrowLeft" | "ArrowUp" | "ArrowRight" | "ArrowDown" | "PrintScreen" | "Insert" | "Delete" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "a" | "b" | "c" | "d" | "e" | "f" | "g" | "h" | "i" | "j" | "k" | "l" | "m" | "n" | "o" | "p" | "q" | "r" | "s" | "t" | "u" | "v" | "w" | "x" | "y" | "z" | "Meta" | "ContextMenu" | "F1" | "F2" | "F3" | "F4" | "F5" | "F6" | "F7" | "F8" | "F9" | "F10" | "F11" | "F12" | "NumLock" | "ScrollLock" | "AudioVolumeMute" | "AudioVolumeUp" | "AudioVolumeDown" | "MediaTrackNext" | "MediaTrackPrevious" | "MediaStop" | "MediaPlayPause" | "LaunchMail" | "LaunchMediaPlayer" | "LaunchApplication1" | "LaunchApplication2" | "Semicolon" | "Equal" | "Comma" | "Minus" | "Period" | "Slash" | "Backquote" | "BracketLeft" | "Backslash" | "BracketRight" | "Quote";
+export declare const keyboardKeys: {
+    readonly ArrowUp: "ArrowUp";
+    readonly ArrowDown: "ArrowDown";
+    readonly ArrowLeft: "ArrowLeft";
+    readonly ArrowRight: "ArrowRight";
+};
+type Callback<T extends HTMLElement = HTMLElement> = (e: KeyboardEvent | React.KeyboardEvent<T>) => void;
+export declare class KeyboardArea<T extends HTMLElement> {
+    private set;
+    key(key: EventKey, callback: Callback<T>): () => boolean;
+    onKeyDown(_: Callback<T>): void;
+}
+export {};
+//# sourceMappingURL=keyboard-area.d.ts.map

package/dist/lib/keyboard-area.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"keyboard-area.d.ts","sourceRoot":"","sources":["../../src/lib/keyboard-area.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,KAAK,QAAQ,GACP,WAAW,GACX,KAAK,GACL,OAAO,GACP,OAAO,GACP,SAAS,GACT,KAAK,GACL,OAAO,GACP,UAAU,GACV,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,UAAU,GACV,KAAK,GACL,MAAM,GACN,WAAW,GACX,SAAS,GACT,YAAY,GACZ,WAAW,GACX,aAAa,GACb,QAAQ,GACR,QAAQ,GACR,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,GAAG,GACH,MAAM,GACN,aAAa,GACb,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,KAAK,GACL,KAAK,GACL,KAAK,GACL,SAAS,GACT,YAAY,GACZ,iBAAiB,GACjB,eAAe,GACf,iBAAiB,GACjB,gBAAgB,GAChB,oBAAoB,GACpB,WAAW,GACX,gBAAgB,GAChB,YAAY,GACZ,mBAAmB,GACnB,oBAAoB,GACpB,oBAAoB,GACpB,WAAW,GACX,OAAO,GACP,OAAO,GACP,OAAO,GACP,QAAQ,GACR,OAAO,GACP,WAAW,GACX,aAAa,GACb,WAAW,GACX,cAAc,GACd,OAAO,CAAC;AAEd,eAAO,MAAM,YAAY;;;;;CAKf,CAAC;AAEX,KAAK,QAAQ,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI,CAAC,CAAC,EAAE,aAAa,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;AAEzG,qBAAa,YAAY,CAAC,CAAC,SAAS,WAAW;IAC3C,OAAO,CAAC,GAAG,CAAa;IAEjB,GAAG,CAAC,GAAG,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IAKxC,SAAS,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC;CAClC"}

package/dist/lib/keyboard-area.js

@@ -0,0 +1,14 @@
+export const keyboardKeys = {
+    ArrowUp: "ArrowUp",
+    ArrowDown: "ArrowDown",
+    ArrowLeft: "ArrowLeft",
+    ArrowRight: "ArrowRight",
+};
+export class KeyboardArea {
+    set = new Set();
+    key(key, callback) {
+        const fn = (e) => (e.key === key ? callback(e) : undefined);
+        return () => this.set.delete(fn);
+    }
+    onKeyDown(_) { }
+}