@studio-helga/once-ui-core 1.7.8

package/dist/components/HoloFx.js

@@ -0,0 +1,90 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+import styles from "./HoloFx.module.scss";
+import { Flex } from ".";
+import classNames from "classnames";
+import { useInViewport } from "../hooks/useInViewport";
+import { useReducedMotion } from "../hooks/useReducedMotion";
+const formatMask = (maskPosition = "100 200") => {
+    const [x, y] = maskPosition.split(" ");
+    const formattedX = `${x}%`;
+    const formattedY = `${y ? y : x}%`;
+    return `radial-gradient(ellipse ${formattedX} ${formattedY} at var(--gradient-pos-x, 50%) var(--gradient-pos-y, 50%), black 50%, transparent 100%)`;
+};
+const getMaskStyle = (mask) => {
+    return mask?.maskPosition ? formatMask(mask.maskPosition) : formatMask();
+};
+const HoloFx = ({ children, reducedMotion = "auto", shine, burn, texture, ...rest }) => {
+    const ref = useRef(null);
+    const lastCallRef = useRef(0);
+    const isInViewport = useInViewport(ref);
+    const { shouldAnimate } = useReducedMotion(reducedMotion);
+    const isActive = isInViewport && shouldAnimate;
+    const shineDefaults = {
+        opacity: 30,
+        blending: "color-dodge",
+        mask: getMaskStyle(shine?.mask),
+        ...shine,
+    };
+    const burnDefaults = {
+        opacity: 30,
+        filter: "brightness(0.2) contrast(2)",
+        blending: "color-dodge",
+        mask: getMaskStyle(burn?.mask),
+        ...burn,
+    };
+    const textureDefaults = {
+        opacity: 10,
+        blending: "color-dodge",
+        image: "repeating-linear-gradient(-45deg, var(--static-white) 0, var(--static-white) 1px, transparent 3px, transparent 2px)",
+        mask: getMaskStyle(texture?.mask),
+        ...texture,
+    };
+    useEffect(() => {
+        if (!isActive)
+            return;
+        const handleMouseMove = (event) => {
+            const now = Date.now();
+            if (now - lastCallRef.current < 16)
+                return;
+            lastCallRef.current = now;
+            const element = ref.current;
+            if (!element)
+                return;
+            const rect = element.getBoundingClientRect();
+            const offsetX = event.clientX - rect.left;
+            const offsetY = event.clientY - rect.top;
+            const centerX = rect.width / 2;
+            const centerY = rect.height / 2;
+            const deltaX = ((offsetX - centerX) / centerX) * 100;
+            const deltaY = ((offsetY - centerY) / centerY) * 100;
+            element.style.setProperty("--gradient-pos-x", `${deltaX}%`);
+            element.style.setProperty("--gradient-pos-y", `${deltaY}%`);
+        };
+        document.addEventListener("mousemove", handleMouseMove, { passive: true });
+        return () => {
+            document.removeEventListener("mousemove", handleMouseMove);
+        };
+    }, [isActive]);
+    return (_jsxs(Flex, { overflow: "hidden", className: styles.holoFx, ref: ref, ...rest, children: [_jsx(Flex, { fill: true, className: styles.base, children: children }), _jsx(Flex, { m: { hide: true }, position: "absolute", fill: true, pointerEvents: "none", className: classNames(styles.overlay, styles.burn), style: {
+                    ["--burn-opacity"]: burnDefaults.opacity + "%",
+                    filter: burnDefaults.filter,
+                    mixBlendMode: burnDefaults.blending,
+                    maskImage: burnDefaults.mask,
+                }, children: children }), _jsx(Flex, { m: { hide: true }, position: "absolute", fill: true, pointerEvents: "none", className: classNames(styles.overlay, styles.shine), style: {
+                    ["--shine-opacity"]: shineDefaults.opacity + "%",
+                    filter: shineDefaults.filter,
+                    mixBlendMode: shineDefaults.blending,
+                    maskImage: shineDefaults.mask,
+                }, children: children }), _jsx(Flex, { m: { hide: true }, position: "absolute", fill: true, pointerEvents: "none", className: classNames(styles.overlay, styles.texture), style: {
+                    ["--texture-opacity"]: textureDefaults.opacity + "%",
+                    backgroundImage: textureDefaults.image,
+                    filter: textureDefaults.filter,
+                    mixBlendMode: textureDefaults.blending,
+                    maskImage: textureDefaults.mask,
+                } })] }));
+};
+HoloFx.displayName = "HoloFx";
+export { HoloFx };
+//# sourceMappingURL=HoloFx.js.map

package/dist/components/HoloFx.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HoloFx.js","sourceRoot":"","sources":["../../src/components/HoloFx.tsx"],"names":[],"mappings":"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"}

package/dist/components/HoloFx.module.scss

@@ -0,0 +1,32 @@
+.overlay {
+    opacity: 0;
+    transition: opacity 0.3s ease-in-out;
+    pointer-events: none;
+}
+
+.holoFx {
+    isolation: isolate;
+    z-index: 0;
+
+    &:hover {
+        .burn {
+            transform: translateX(1px) translateY(1px);
+            opacity: var(--burn-opacity);
+            z-index: 1;
+        }
+
+        .shine {
+            transform: translateX(-1px) translateY(-1px);
+            opacity: var(--light-opacity);
+            z-index: 2;
+        }
+
+        .texture {
+            opacity: var(--texture-opacity);
+            transform: translateX(calc(var(--gradient-pos-x) / 50)) scale(1.1);
+            background-size: 150% 150%;
+            background-position: center;
+            z-index: 3;
+        }
+    }
+}

package/dist/components/Hover.d.ts

@@ -0,0 +1,14 @@
+import React, { ReactNode } from "react";
+import { Flex } from ".";
+export interface HoverProps extends React.ComponentProps<typeof Flex> {
+    trigger: ReactNode;
+    overlay: ReactNode;
+    interactive?: boolean;
+    delay?: number;
+    hideDelay?: number;
+    disabled?: boolean;
+    touch?: "disable" | "enable" | "display";
+}
+declare const Hover: React.ForwardRefExoticComponent<Omit<HoverProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Hover };
+//# sourceMappingURL=Hover.d.ts.map

package/dist/components/Hover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Hover.d.ts","sourceRoot":"","sources":["../../src/components/Hover.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAIZ,SAAS,EAIV,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,IAAI,EAAO,MAAM,GAAG,CAAC;AAG9B,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC;IACnE,OAAO,EAAE,SAAS,CAAC;IACnB,OAAO,EAAE,SAAS,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;CAC1C;AAED,QAAA,MAAM,KAAK,gGA2IV,CAAC;AAGF,OAAO,EAAE,KAAK,EAAE,CAAC"}

package/dist/components/Hover.js

@@ -0,0 +1,99 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useRef, useEffect, forwardRef, useImperativeHandle, useCallback, } from "react";
+import { Row } from ".";
+import styles from "./Hover.module.scss";
+const Hover = forwardRef(({ trigger, overlay, interactive = false, delay = 0, hideDelay = 0, disabled = false, touch = "disable", ...flex }, ref) => {
+    const [isHovered, setIsHovered] = useState(false);
+    const [isFocused, setIsFocused] = useState(false);
+    const [mounted, setMounted] = useState(false);
+    const [isTouchDevice, setIsTouchDevice] = useState(false);
+    const wrapperRef = useRef(null);
+    const showTimeoutRef = useRef(null);
+    const hideTimeoutRef = useRef(null);
+    useImperativeHandle(ref, () => wrapperRef.current);
+    useEffect(() => {
+        setMounted(true);
+        setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
+    }, []);
+    const showOverlay = useCallback(() => {
+        if (disabled)
+            return;
+        // Clear any pending hide timeout
+        if (hideTimeoutRef.current) {
+            clearTimeout(hideTimeoutRef.current);
+            hideTimeoutRef.current = null;
+        }
+        if (delay > 0) {
+            showTimeoutRef.current = setTimeout(() => {
+                setIsHovered(true);
+            }, delay);
+        }
+        else {
+            setIsHovered(true);
+        }
+    }, [delay, disabled]);
+    const hideOverlay = useCallback(() => {
+        // Clear any pending show timeout
+        if (showTimeoutRef.current) {
+            clearTimeout(showTimeoutRef.current);
+            showTimeoutRef.current = null;
+        }
+        if (hideDelay > 0) {
+            hideTimeoutRef.current = setTimeout(() => {
+                setIsHovered(false);
+            }, hideDelay);
+        }
+        else {
+            setIsHovered(false);
+        }
+    }, [hideDelay]);
+    const handleMouseEnter = useCallback(() => {
+        showOverlay();
+    }, [showOverlay]);
+    const handleMouseLeave = useCallback(() => {
+        hideOverlay();
+    }, [hideOverlay]);
+    const handleFocus = useCallback(() => {
+        setIsFocused(true);
+        showOverlay();
+    }, [showOverlay]);
+    const handleBlur = useCallback(() => {
+        setIsFocused(false);
+        hideOverlay();
+    }, [hideOverlay]);
+    // Cleanup timeouts on unmount
+    useEffect(() => {
+        return () => {
+            if (showTimeoutRef.current) {
+                clearTimeout(showTimeoutRef.current);
+            }
+            if (hideTimeoutRef.current) {
+                clearTimeout(hideTimeoutRef.current);
+            }
+        };
+    }, []);
+    // Determine if overlay should show based on touch mode
+    const shouldShowOverlay = (() => {
+        if (!mounted || disabled)
+            return false;
+        // If on touch device, handle based on touch prop
+        if (isTouchDevice) {
+            if (touch === 'disable')
+                return false;
+            if (touch === 'display')
+                return true;
+            // touch === 'enable', fall through to normal hover logic
+        }
+        return isHovered || isFocused;
+    })();
+    return (_jsxs(Row, { ref: wrapperRef, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onFocus: handleFocus, onBlur: handleBlur, ...flex, children: [trigger, shouldShowOverlay && (_jsx(Row, { position: "absolute", pointerEvents: interactive ? "auto" : "none", fill: true, style: {
+                    top: 0,
+                    left: 0,
+                    right: 0,
+                    bottom: 0,
+                }, className: styles.fadeIn, children: overlay }))] }));
+});
+Hover.displayName = "Hover";
+export { Hover };
+//# sourceMappingURL=Hover.js.map

package/dist/components/Hover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Hover.js","sourceRoot":"","sources":["../../src/components/Hover.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EACZ,QAAQ,EACR,MAAM,EACN,SAAS,EAET,UAAU,EACV,mBAAmB,EACnB,WAAW,GACZ,MAAM,OAAO,CAAC;AACf,OAAO,EAAQ,GAAG,EAAE,MAAM,GAAG,CAAC;AAC9B,OAAO,MAAM,MAAM,qBAAqB,CAAC;AAYzC,MAAM,KAAK,GAAG,UAAU,CACtB,CACE,EACE,OAAO,EACP,OAAO,EACP,WAAW,GAAG,KAAK,EACnB,KAAK,GAAG,CAAC,EACT,SAAS,GAAG,CAAC,EACb,QAAQ,GAAG,KAAK,EAChB,KAAK,GAAG,SAAS,EACjB,GAAG,IAAI,EACR,EACD,GAAG,EACH,EAAE;IACF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE1D,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAChD,MAAM,cAAc,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAC3D,MAAM,cAAc,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAE3D,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,OAAyB,CAAC,CAAC;IAErE,SAAS,CAAC,GAAG,EAAE;QACb,UAAU,CAAC,IAAI,CAAC,CAAC;QACjB,gBAAgB,CACd,cAAc,IAAI,MAAM,IAAI,SAAS,CAAC,cAAc,GAAG,CAAC,CACzD,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACnC,IAAI,QAAQ;YAAE,OAAO;QAErB,iCAAiC;QACjC,IAAI,cAAc,CAAC,OAAO,EAAE,CAAC;YAC3B,YAAY,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;YACrC,cAAc,CAAC,OAAO,GAAG,IAAI,CAAC;QAChC,CAAC;QAED,IAAI,KAAK,GAAG,CAAC,EAAE,CAAC;YACd,cAAc,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;gBACvC,YAAY,CAAC,IAAI,CAAC,CAAC;YACrB,CAAC,EAAE,KAAK,CAAC,CAAC;QACZ,CAAC;aAAM,CAAC;YACN,YAAY,CAAC,IAAI,CAAC,CAAC;QACrB,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEtB,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACnC,iCAAiC;QACjC,IAAI,cAAc,CAAC,OAAO,EAAE,CAAC;YAC3B,YAAY,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;YACrC,cAAc,CAAC,OAAO,GAAG,IAAI,CAAC;QAChC,CAAC;QAED,IAAI,SAAS,GAAG,CAAC,EAAE,CAAC;YAClB,cAAc,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;gBACvC,YAAY,CAAC,KAAK,CAAC,CAAC;YACtB,CAAC,EAAE,SAAS,CAAC,CAAC;QAChB,CAAC;aAAM,CAAC;YACN,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,WAAW,EAAE,CAAC;IAChB,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,WAAW,EAAE,CAAC;IAChB,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACnC,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,WAAW,EAAE,CAAC;IAChB,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,EAAE;QAClC,YAAY,CAAC,KAAK,CAAC,CAAC;QACpB,WAAW,EAAE,CAAC;IAChB,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,8BAA8B;IAC9B,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,IAAI,cAAc,CAAC,OAAO,EAAE,CAAC;gBAC3B,YAAY,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;YACvC,CAAC;YACD,IAAI,cAAc,CAAC,OAAO,EAAE,CAAC;gBAC3B,YAAY,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;YACvC,CAAC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,uDAAuD;IACvD,MAAM,iBAAiB,GAAG,CAAC,GAAG,EAAE;QAC9B,IAAI,CAAC,OAAO,IAAI,QAAQ;YAAE,OAAO,KAAK,CAAC;QAEvC,iDAAiD;QACjD,IAAI,aAAa,EAAE,CAAC;YAClB,IAAI,KAAK,KAAK,SAAS;gBAAE,OAAO,KAAK,CAAC;YACtC,IAAI,KAAK,KAAK,SAAS;gBAAE,OAAO,IAAI,CAAC;YACrC,yDAAyD;QAC3D,CAAC;QAED,OAAO,SAAS,IAAI,SAAS,CAAC;IAChC,CAAC,CAAC,EAAE,CAAC;IAEL,OAAO,CACL,MAAC,GAAG,IACF,GAAG,EAAE,UAAU,EACf,YAAY,EAAE,gBAAgB,EAC9B,YAAY,EAAE,gBAAgB,EAC9B,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,KACd,IAAI,aAEP,OAAO,EACP,iBAAiB,IAAI,CACpB,KAAC,GAAG,IACF,QAAQ,EAAC,UAAU,EACnB,aAAa,EAAE,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,EAC5C,IAAI,QACJ,KAAK,EAAE;oBACL,GAAG,EAAE,CAAC;oBACN,IAAI,EAAE,CAAC;oBACP,KAAK,EAAE,CAAC;oBACR,MAAM,EAAE,CAAC;iBACV,EACD,SAAS,EAAE,MAAM,CAAC,MAAM,YAEvB,OAAO,GACJ,CACP,IACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC;AAC5B,OAAO,EAAE,KAAK,EAAE,CAAC"}

package/dist/components/Hover.module.scss

@@ -0,0 +1,12 @@
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+.fadeIn {
+  animation: fadeIn 0.2s ease-in-out;
+}

package/dist/components/HoverCard.d.ts

@@ -0,0 +1,5 @@
+import { AnimationProps } from ".";
+type HoverCardProps = Omit<AnimationProps, 'triggerType' | 'portal'>;
+declare const HoverCard: import("react").ForwardRefExoticComponent<Omit<HoverCardProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export { HoverCard };
+//# sourceMappingURL=HoverCard.d.ts.map

package/dist/components/HoverCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HoverCard.d.ts","sourceRoot":"","sources":["../../src/components/HoverCard.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAa,cAAc,EAAE,MAAM,GAAG,CAAC;AAE9C,KAAK,cAAc,GAAG,IAAI,CAAC,cAAc,EAAE,aAAa,GAAG,QAAQ,CAAC,CAAC;AAErE,QAAA,MAAM,SAAS,wHAkBd,CAAC;AAGF,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/dist/components/HoverCard.js

@@ -0,0 +1,10 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { Animation } from ".";
+const HoverCard = forwardRef(({ children, ...props }, ref) => {
+    return (_jsx(Animation, { ref: ref, fade: 0, slideUp: 0.5, scale: 0.9, duration: 200, triggerType: "hover", placement: "top", portal: true, ...props, children: children }));
+});
+HoverCard.displayName = "HoverCard";
+export { HoverCard };
+//# sourceMappingURL=HoverCard.js.map

package/dist/components/HoverCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HoverCard.js","sourceRoot":"","sources":["../../src/components/HoverCard.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,SAAS,EAAkB,MAAM,GAAG,CAAC;AAI9C,MAAM,SAAS,GAAG,UAAU,CAC1B,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC9B,OAAO,CACL,KAAC,SAAS,IACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,CAAC,EACP,OAAO,EAAE,GAAG,EACZ,KAAK,EAAE,GAAG,EACV,QAAQ,EAAE,GAAG,EACb,WAAW,EAAC,OAAO,EACnB,SAAS,EAAC,KAAK,EACf,MAAM,WACF,KAAK,YAER,QAAQ,GACC,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC;AACpC,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/dist/components/HoverCard.module.scss

@@ -0,0 +1,12 @@
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+.fadeIn {
+  animation: fadeIn 0.2s ease-out;
+}

package/dist/components/Icon.d.ts

@@ -0,0 +1,18 @@
+import React, { ReactNode } from "react";
+import { IconName } from "../icons";
+import { ColorScheme, ColorWeight } from "../types";
+import { Flex } from ".";
+interface IconProps extends React.ComponentProps<typeof Flex> {
+    name: IconName;
+    onBackground?: `${ColorScheme}-${ColorWeight}`;
+    onSolid?: `${ColorScheme}-${ColorWeight}`;
+    size?: "xs" | "s" | "m" | "l" | "xl";
+    decorative?: boolean;
+    tooltip?: ReactNode;
+    tooltipPosition?: "top" | "bottom" | "left" | "right";
+    className?: string;
+    style?: React.CSSProperties;
+}
+declare const Icon: React.ForwardRefExoticComponent<Omit<IconProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Icon };
+//# sourceMappingURL=Icon.d.ts.map

package/dist/components/Icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../src/components/Icon.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AAGrD,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEpC,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACpD,OAAO,EAAE,IAAI,EAAsB,MAAM,GAAG,CAAC;AAG7C,UAAU,SAAU,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC;IAC3D,IAAI,EAAE,QAAQ,CAAC;IACf,YAAY,CAAC,EAAE,GAAG,WAAW,IAAI,WAAW,EAAE,CAAC;IAC/C,OAAO,CAAC,EAAE,GAAG,WAAW,IAAI,WAAW,EAAE,CAAC;IAC1C,IAAI,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,eAAe,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED,QAAA,MAAM,IAAI,+FAqET,CAAC;AAIF,OAAO,EAAE,IAAI,EAAE,CAAC"}

package/dist/components/Icon.js

@@ -0,0 +1,35 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import { useIcons } from "../contexts/IconProvider";
+import { Flex, Tooltip, HoverCard } from ".";
+import styles from "./Icon.module.scss";
+const Icon = forwardRef(({ name, onBackground, onSolid, size = "m", decorative = true, tooltip, tooltipPosition = "top", className, style, ...rest }, ref) => {
+    const { icons } = useIcons();
+    const IconComponent = icons[name];
+    if (!IconComponent) {
+        console.warn(`Icon "${name}" does not exist in the library.`);
+        return null;
+    }
+    if (onBackground && onSolid) {
+        console.warn("You cannot use both 'onBackground' and 'onSolid' props simultaneously. Only one will be applied.");
+    }
+    let colorClass = "color-inherit";
+    if (onBackground) {
+        const [scheme, weight] = onBackground.split("-");
+        colorClass = `${scheme}-on-background-${weight}`;
+    }
+    else if (onSolid) {
+        const [scheme, weight] = onSolid.split("-");
+        colorClass = `${scheme}-on-solid-${weight}`;
+    }
+    const icon = (_jsx(Flex, { inline: true, fit: true, as: "span", ref: ref, className: classNames(colorClass, styles.icon, styles[size], className), "aria-hidden": decorative ? "true" : undefined, "aria-label": decorative ? undefined : name, style: style, ...rest, children: _jsx(IconComponent, {}) }));
+    if (tooltip) {
+        return (_jsx(HoverCard, { trigger: icon, placement: tooltipPosition, offsetDistance: "4", children: _jsx(Tooltip, { label: tooltip }) }));
+    }
+    return icon;
+});
+Icon.displayName = "Icon";
+export { Icon };
+//# sourceMappingURL=Icon.js.map

package/dist/components/Icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../src/components/Icon.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,UAAU,EAAa,MAAM,OAAO,CAAC;AACrD,OAAO,UAAU,MAAM,YAAY,CAAC;AAGpC,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAEpD,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC;AAC7C,OAAO,MAAM,MAAM,oBAAoB,CAAC;AAcxC,MAAM,IAAI,GAAG,UAAU,CACrB,CACE,EACE,IAAI,EACJ,YAAY,EACZ,OAAO,EACP,IAAI,GAAG,GAAG,EACV,UAAU,GAAG,IAAI,EACjB,OAAO,EACP,eAAe,GAAG,KAAK,EACvB,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EACD,GAAG,EACH,EAAE;IACF,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC7B,MAAM,aAAa,GAAyB,KAAK,CAAC,IAAI,CAAC,CAAC;IAExD,IAAI,CAAC,aAAa,EAAE,CAAC;QACnB,OAAO,CAAC,IAAI,CAAC,SAAS,IAAI,kCAAkC,CAAC,CAAC;QAC9D,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,YAAY,IAAI,OAAO,EAAE,CAAC;QAC5B,OAAO,CAAC,IAAI,CACV,kGAAkG,CACnG,CAAC;IACJ,CAAC;IAED,IAAI,UAAU,GAAG,eAAe,CAAC;IACjC,IAAI,YAAY,EAAE,CAAC;QACjB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,YAAY,CAAC,KAAK,CAAC,GAAG,CAA+B,CAAC;QAC/E,UAAU,GAAG,GAAG,MAAM,kBAAkB,MAAM,EAAE,CAAC;IACnD,CAAC;SAAM,IAAI,OAAO,EAAE,CAAC;QACnB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,OAAO,CAAC,KAAK,CAAC,GAAG,CAA+B,CAAC;QAC1E,UAAU,GAAG,GAAG,MAAM,aAAa,MAAM,EAAE,CAAC;IAC9C,CAAC;IAED,MAAM,IAAI,GAAG,CACX,KAAC,IAAI,IACH,MAAM,QACN,GAAG,QACH,EAAE,EAAC,MAAM,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,UAAU,CAAC,UAAU,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,iBAC1D,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,gBAChC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,EACzC,KAAK,EAAE,KAAK,KACR,IAAI,YAER,KAAC,aAAa,KAAG,GACZ,CACR,CAAC;IAEF,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CACL,KAAC,SAAS,IACR,OAAO,EAAE,IAAI,EACb,SAAS,EAAE,eAAe,EAC1B,cAAc,EAAC,GAAG,YAElB,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,GAAI,GACjB,CACb,CAAC;IACJ,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC,CACF,CAAC;AAEF,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC;AAE1B,OAAO,EAAE,IAAI,EAAE,CAAC"}

package/dist/components/Icon.module.scss

@@ -0,0 +1,19 @@
+.xs { 
+    font-size: var(--static-space-16)
+}
+
+.s { 
+    font-size: var(--static-space-20)
+}
+
+.m { 
+    font-size: var(--static-space-24)
+}
+
+.l { 
+    font-size: var(--static-space-32)
+}
+
+.xl { 
+    font-size: var(--static-space-40)
+}

package/dist/components/IconButton.d.ts

@@ -0,0 +1,23 @@
+import React, { ReactNode } from "react";
+import { IconName } from "../icons";
+interface CommonProps {
+    icon?: IconName;
+    id?: string;
+    size?: "xs" | "s" | "m" | "l" | "xl";
+    radius?: "none" | "top" | "right" | "bottom" | "left" | "top-left" | "top-right" | "bottom-right" | "bottom-left";
+    rounded?: boolean;
+    tooltip?: ReactNode;
+    tooltipPosition?: "top" | "bottom" | "left" | "right";
+    variant?: "primary" | "secondary" | "tertiary" | "danger" | "ghost";
+    loading?: boolean;
+    disabled?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+    href?: string;
+    children?: ReactNode;
+}
+export type IconButtonProps = CommonProps & React.ButtonHTMLAttributes<HTMLButtonElement>;
+type AnchorProps = CommonProps & React.AnchorHTMLAttributes<HTMLAnchorElement>;
+declare const IconButton: React.ForwardRefExoticComponent<(IconButtonProps | AnchorProps) & React.RefAttributes<HTMLButtonElement>>;
+export { IconButton };
+//# sourceMappingURL=IconButton.d.ts.map

package/dist/components/IconButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../src/components/IconButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AAMrD,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEpC,UAAU,WAAW;IACnB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;IACrC,MAAM,CAAC,EACH,MAAM,GACN,KAAK,GACL,OAAO,GACP,QAAQ,GACR,MAAM,GACN,UAAU,GACV,WAAW,GACX,cAAc,GACd,aAAa,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,eAAe,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;IACtD,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,MAAM,MAAM,eAAe,GAAG,WAAW,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;AAC1F,KAAK,WAAW,GAAG,WAAW,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;AAE/E,QAAA,MAAM,UAAU,2GA+Ef,CAAC;AAGF,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/dist/components/IconButton.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { ElementType } from "./ElementType";
+import { Flex, Icon, Tooltip, HoverCard, Spinner } from ".";
+import buttonStyles from "./Button.module.scss";
+import iconStyles from "./IconButton.module.scss";
+import classNames from "classnames";
+const IconButton = forwardRef(({ icon = "refresh", size = "m", id, radius, rounded = false, tooltip, tooltipPosition = "top", variant = "primary", loading = false, disabled = false, href, children, className, style, ...props }, ref) => {
+    const radiusSize = size === "s" || size === "m" ? "m" : "l";
+    const button = (_jsx(ElementType, { id: id, href: href, ref: ref, disabled: disabled, "data-disabled": disabled ? true : undefined, "data-border": rounded ? "rounded" : undefined, className: classNames(buttonStyles.button, buttonStyles[variant], iconStyles[size], radius === "none"
+            ? "radius-none"
+            : radius
+                ? `radius-${radiusSize}-${radius}`
+                : `radius-${radiusSize}`, "text-decoration-none", "button", disabled ? "cursor-not-allowed" : "cursor-interactive", className), style: style, "aria-label": tooltip || icon, "aria-disabled": disabled, ...props, children: _jsx(Flex, { fill: true, center: true, children: loading ? (_jsx(Spinner, { size: size === "l" ? "s" : "xs" })) : children ? (children) : (_jsx(Icon, { name: icon, size: "s" })) }) }));
+    if (tooltip) {
+        return (_jsx(HoverCard, { trigger: button, placement: tooltipPosition, fade: 0, scale: 0.9, duration: 200, offsetDistance: "4", children: _jsx(Tooltip, { label: tooltip }) }));
+    }
+    return button;
+});
+IconButton.displayName = "IconButton";
+export { IconButton };
+//# sourceMappingURL=IconButton.js.map

package/dist/components/IconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../src/components/IconButton.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,UAAU,EAAa,MAAM,OAAO,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,GAAG,CAAC;AAC5D,OAAO,YAAY,MAAM,sBAAsB,CAAC;AAChD,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAClD,OAAO,UAAU,MAAM,YAAY,CAAC;AAgCpC,MAAM,UAAU,GAAG,UAAU,CAC3B,CACE,EACE,IAAI,GAAG,SAAS,EAChB,IAAI,GAAG,GAAG,EACV,EAAE,EACF,MAAM,EACN,OAAO,GAAG,KAAK,EACf,OAAO,EACP,eAAe,GAAG,KAAK,EACvB,OAAO,GAAG,SAAS,EACnB,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,UAAU,GAAG,IAAI,KAAK,GAAG,IAAI,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC;IAE5D,MAAM,MAAM,GAAG,CACb,KAAC,WAAW,IACV,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,mBACH,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,iBAC7B,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAC5C,SAAS,EAAE,UAAU,CACnB,YAAY,CAAC,MAAM,EACnB,YAAY,CAAC,OAAO,CAAC,EACrB,UAAU,CAAC,IAAI,CAAC,EAChB,MAAM,KAAK,MAAM;YACf,CAAC,CAAC,aAAa;YACf,CAAC,CAAC,MAAM;gBACN,CAAC,CAAC,UAAU,UAAU,IAAI,MAAM,EAAE;gBAClC,CAAC,CAAC,UAAU,UAAU,EAAE,EAC5B,sBAAsB,EACtB,QAAQ,EACR,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,oBAAoB,EACtD,SAAS,CACV,EACD,KAAK,EAAE,KAAK,gBACA,OAAO,IAAI,IAAI,mBACZ,QAAQ,KACnB,KAAK,YAET,KAAC,IAAI,IAAC,IAAI,QAAC,MAAM,kBACd,OAAO,CAAC,CAAC,CAAC,CACT,KAAC,OAAO,IAAC,IAAI,EAAE,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,GAAI,CAC7C,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CACb,QAAQ,CACT,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,GAAG,GAAG,CAC9B,GACI,GACK,CACf,CAAC;IAEF,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CACL,KAAC,SAAS,IACR,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,eAAe,EAC1B,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,GAAG,EACV,QAAQ,EAAE,GAAG,EACb,cAAc,EAAC,GAAG,YAElB,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,GAAI,GACjB,CACb,CAAC;IACJ,CAAC;IAED,OAAO,MAAM,CAAC;AAChB,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/dist/components/IconButton.module.scss

@@ -0,0 +1,34 @@
+.xs {
+	min-height: var(--static-space-20);
+	min-width: var(--static-space-20);
+	height: var(--static-space-20);
+	width: var(--static-space-20);
+}
+
+.s {
+	min-height: var(--static-space-24);
+	min-width: var(--static-space-24);
+	height: var(--static-space-24);
+	width: var(--static-space-24);
+}
+
+.m {
+	min-height: var(--static-space-32);
+	min-width: var(--static-space-32);
+	height: var(--static-space-32);
+	width: var(--static-space-32);
+}
+
+.l {
+	min-height: var(--static-space-40);
+	min-width: var(--static-space-40);
+	height: var(--static-space-40);
+	width: var(--static-space-40);
+}
+
+.xl {
+	min-height: var(--static-space-48);
+	min-width: var(--static-space-48);
+	height: var(--static-space-48);
+	width: var(--static-space-48);
+}

package/dist/components/InfiniteScroll.d.ts

@@ -0,0 +1,16 @@
+import React, { ReactNode } from "react";
+import { Row } from ".";
+export interface InfiniteScrollProps<T> extends React.ComponentProps<typeof Row> {
+    items: T[];
+    renderItem: (item: T, index: number) => ReactNode;
+    loadMore: () => Promise<boolean>;
+    loading?: boolean;
+    threshold?: number;
+    className?: string;
+}
+declare function InfiniteScroll<T>({ items, renderItem, loadMore, loading, threshold, ...flex }: InfiniteScrollProps<T>): import("react/jsx-runtime").JSX.Element;
+declare namespace InfiniteScroll {
+    var displayName: string;
+}
+export { InfiniteScroll };
+//# sourceMappingURL=InfiniteScroll.d.ts.map

package/dist/components/InfiniteScroll.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfiniteScroll.d.ts","sourceRoot":"","sources":["../../src/components/InfiniteScroll.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AACtE,OAAO,EAAU,GAAG,EAAW,MAAM,GAAG,CAAC;AAEzC,MAAM,WAAW,mBAAmB,CAAC,CAAC,CAAE,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC;IAC9E,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IAClD,QAAQ,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,iBAAS,cAAc,CAAC,CAAC,EAAE,EACzB,KAAK,EACL,UAAU,EACV,QAAQ,EACR,OAAe,EACf,SAAe,EACf,GAAG,IAAI,EACR,EAAE,mBAAmB,CAAC,CAAC,CAAC,2CAoExB;kBA3EQ,cAAc;;;AA8EvB,OAAO,EAAE,cAAc,EAAE,CAAC"}

package/dist/components/InfiniteScroll.js

@@ -0,0 +1,52 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useEffect, useRef, useState } from "react";
+import { Column, Row, Spinner } from ".";
+function InfiniteScroll({ items, renderItem, loadMore, loading = false, threshold = 200, ...flex }) {
+    const [hasMore, setHasMore] = useState(true);
+    const [isLoading, setIsLoading] = useState(loading);
+    const observerRef = useRef(null);
+    const sentinelRef = useRef(null);
+    // Keep internal loading in sync with prop
+    useEffect(() => {
+        setIsLoading(loading);
+    }, [loading]);
+    const handleLoadMore = async () => {
+        if (isLoading || !hasMore)
+            return;
+        setIsLoading(true);
+        try {
+            const more = await loadMore();
+            setHasMore(more);
+        }
+        catch (error) {
+            console.error("Error loading more items:", error);
+            setHasMore(false);
+        }
+        finally {
+            setIsLoading(false);
+        }
+    };
+    useEffect(() => {
+        if (!hasMore || isLoading)
+            return;
+        observerRef.current?.disconnect();
+        observerRef.current = new IntersectionObserver(([entry]) => {
+            if (entry.isIntersecting) {
+                handleLoadMore();
+            }
+        }, {
+            root: null,
+            rootMargin: `0px 0px ${threshold}px 0px`,
+            threshold: 0,
+        });
+        if (sentinelRef.current) {
+            observerRef.current.observe(sentinelRef.current);
+        }
+        return () => observerRef.current?.disconnect();
+    }, [items.length, hasMore, isLoading, threshold]);
+    return (_jsxs(_Fragment, { children: [items.map((item, index) => (_jsx(React.Fragment, { children: renderItem(item, index) }, index))), _jsx(Row, { ...flex, children: _jsx("div", { ref: sentinelRef, style: { height: 1, width: 1 } }) }), isLoading && (_jsx(Column, { fillWidth: true, horizontal: "center", padding: "24", children: _jsx(Spinner, { size: "m" }) }))] }));
+}
+InfiniteScroll.displayName = "InfiniteScroll";
+export { InfiniteScroll };
+//# sourceMappingURL=InfiniteScroll.js.map

package/dist/components/InfiniteScroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfiniteScroll.js","sourceRoot":"","sources":["../../src/components/InfiniteScroll.tsx"],"names":[],"mappings":"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"}

package/dist/components/InlineCode.d.ts

@@ -0,0 +1,10 @@
+import React, { ReactNode } from "react";
+import { Flex } from ".";
+interface InlineCodeProps extends React.ComponentProps<typeof Flex> {
+    children: ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+declare const InlineCode: React.ForwardRefExoticComponent<Omit<InlineCodeProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { InlineCode };
+//# sourceMappingURL=InlineCode.d.ts.map

package/dist/components/InlineCode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineCode.d.ts","sourceRoot":"","sources":["../../src/components/InlineCode.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AAErD,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,CAAC;AAGzB,UAAU,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC;IACjE,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED,QAAA,MAAM,UAAU,qGAuBf,CAAC;AAIF,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/dist/components/InlineCode.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import styles from "./InlineCode.module.scss";
+import { Flex } from ".";
+import classNames from "classnames";
+const InlineCode = forwardRef(({ children, className, style, ...flex }, ref) => {
+    return (_jsx(Flex, { as: "span", inline: true, fit: true, ref: ref, radius: "s", vertical: "center", paddingX: "4", paddingY: "1", textType: "code", background: "neutral-alpha-weak", border: "neutral-alpha-medium", className: classNames(styles.inlineCode, className), style: style, ...flex, children: children }));
+});
+InlineCode.displayName = "InlineCode";
+export { InlineCode };
+//# sourceMappingURL=InlineCode.js.map

package/dist/components/InlineCode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineCode.js","sourceRoot":"","sources":["../../src/components/InlineCode.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,UAAU,EAAa,MAAM,OAAO,CAAC;AACrD,OAAO,MAAM,MAAM,0BAA0B,CAAC;AAC9C,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,CAAC;AACzB,OAAO,UAAU,MAAM,YAAY,CAAC;AAQpC,MAAM,UAAU,GAAG,UAAU,CAC3B,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,EAAE,EAAE;IAC/C,OAAO,CACL,KAAC,IAAI,IACH,EAAE,EAAC,MAAM,EACT,MAAM,QACN,GAAG,QACH,GAAG,EAAE,GAAG,EACR,MAAM,EAAC,GAAG,EACV,QAAQ,EAAC,QAAQ,EACjB,QAAQ,EAAC,GAAG,EACZ,QAAQ,EAAC,GAAG,EACZ,QAAQ,EAAC,MAAM,EACf,UAAU,EAAC,oBAAoB,EAC/B,MAAM,EAAC,sBAAsB,EAC7B,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,UAAU,EAAE,SAAS,CAAC,EACnD,KAAK,EAAE,KAAK,KACR,IAAI,YAEP,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC;AAEtC,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/dist/components/InlineCode.module.scss

@@ -0,0 +1,5 @@
+.inlineCode {
+    font-size: 80%;
+    line-height: 125%;
+    vertical-align: middle;
+}