@orfium/ictinus 5.41.1 → 5.41.3

package/dist/src/vanilla/Table/TableRow.d.ts

@@ -22,12 +22,14 @@ export declare const TableRow: import('react').ForwardRefExoticComponent<Omit<No
     fontSize?: "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10";
     typography?: "headline01" | "headline02" | "headline03" | "headline04" | "headline05" | "title01" | "title02" | "title03" | "label01" | "label02" | "label03" | "label04" | "body01" | "body02" | "body03" | "body04";
     fontWeight?: "regular" | "medium" | "bold";
+    fontStyle?: "italic";
     lineHeight?: "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11";
     letterSpacing?: "0" | "1" | "2" | "3";
     isolation?: "isolate";
     objectFit?: "contain" | "cover";
     pointerEvents?: "none" | "auto";
     textTransform?: "none" | "capitalize" | "uppercase";
+    textDecoration?: "underline";
     visibility?: "hidden" | "visible";
     wordBreak?: "break-word";
     wordWrap?: "normal" | "break-word";
@@ -129,6 +131,12 @@ export declare const TableRow: import('react').ForwardRefExoticComponent<Omit<No
         lg?: "row" | "column" | "row-reverse" | "column-reverse";
         xl?: "row" | "column" | "row-reverse" | "column-reverse";
     };
+    flexShrink?: "0" | "1" | {
+        xs?: "0" | "1";
+        md?: "0" | "1";
+        lg?: "0" | "1";
+        xl?: "0" | "1";
+    };
     position?: "absolute" | "fixed" | "relative" | "sticky" | {
         xs?: "absolute" | "fixed" | "relative" | "sticky";
         md?: "absolute" | "fixed" | "relative" | "sticky";

package/dist/src/vanilla/Text/Text.d.ts

@@ -2,7 +2,7 @@ import { ElementType } from 'react';
 import { ExtendProps } from '../../utils/ExtendProps';
 import { BoxProps } from '../Box';
 import * as styles from './Text.css';
-export type TextProps<T extends ElementType = 'p', P = unknown> = BoxProps<T, ExtendProps<styles.TextVariants, P>>;
+export type TextProps<T extends ElementType = 'span', P = unknown> = BoxProps<T, ExtendProps<styles.TextVariants, P>>;
 export declare const Text: import('react').ForwardRefExoticComponent<Omit<{
     lineClamp?: "1" | "2" | "3" | "4";
     truncate?: boolean;
@@ -28,12 +28,14 @@ export declare const Text: import('react').ForwardRefExoticComponent<Omit<{
     fontSize?: "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10";
     typography?: "headline01" | "headline02" | "headline03" | "headline04" | "headline05" | "title01" | "title02" | "title03" | "label01" | "label02" | "label03" | "label04" | "body01" | "body02" | "body03" | "body04";
     fontWeight?: "regular" | "medium" | "bold";
+    fontStyle?: "italic";
     lineHeight?: "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11";
     letterSpacing?: "0" | "1" | "2" | "3";
     isolation?: "isolate";
     objectFit?: "contain" | "cover";
     pointerEvents?: "none" | "auto";
     textTransform?: "none" | "capitalize" | "uppercase";
+    textDecoration?: "underline";
     visibility?: "hidden" | "visible";
     wordBreak?: "break-word";
     wordWrap?: "normal" | "break-word";
@@ -135,6 +137,12 @@ export declare const Text: import('react').ForwardRefExoticComponent<Omit<{
         lg?: "row" | "column" | "row-reverse" | "column-reverse";
         xl?: "row" | "column" | "row-reverse" | "column-reverse";
     };
+    flexShrink?: "0" | "1" | {
+        xs?: "0" | "1";
+        md?: "0" | "1";
+        lg?: "0" | "1";
+        xl?: "0" | "1";
+    };
     position?: "absolute" | "fixed" | "relative" | "sticky" | {
         xs?: "absolute" | "fixed" | "relative" | "sticky";
         md?: "absolute" | "fixed" | "relative" | "sticky";
@@ -361,4 +369,4 @@ export declare const Text: import('react').ForwardRefExoticComponent<Omit<{
 } & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref">, "color" | "className"> & import('react').RefAttributes<HTMLParagraphElement>>;
+}>, never> & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref">, "color" | "className"> & import('react').RefAttributes<HTMLSpanElement>>;

package/dist/src/vanilla/Tooltip/Tooltip.css.d.ts

@@ -0,0 +1,20 @@
+import { RecipeVariants } from '@vanilla-extract/recipes';
+export declare const tooltip: import('@vanilla-extract/recipes').RuntimeFn<{
+    inverse: {
+        true: string;
+        false: string;
+    };
+}>;
+export declare const trigger: string;
+export declare const arrow: import('@vanilla-extract/recipes').RuntimeFn<{
+    [x: string]: {
+        [x: string]: string | import('@vanilla-extract/css').ComplexStyleRule;
+    };
+}>;
+export declare const arrowInverse: import('@vanilla-extract/recipes').RuntimeFn<{
+    [x: string]: {
+        [x: string]: string | import('@vanilla-extract/css').ComplexStyleRule;
+    };
+}>;
+export declare const arrowInverseBorder: string;
+export type TooltipVariants = RecipeVariants<typeof tooltip>;

package/dist/src/vanilla/Tooltip/Tooltip.d.ts

@@ -0,0 +1,21 @@
+import { ComponentProps, ReactNode } from 'react';
+import { TooltipProps as TooltipPrimitiveProps, Focusable, TooltipTrigger as TooltipTriggerPrimitive } from 'react-aria-components';
+import * as styles from './Tooltip.css';
+type TooltipProps = ComponentProps<typeof TooltipTriggerPrimitive> & {
+    /**
+     * Only show the tooltip when children are partially hidden due to text overflow.
+     */
+    auto?: boolean;
+};
+declare const Tooltip: {
+    ({ delay, auto, defaultOpen, onOpenChange, isOpen: openProp, ...props }: TooltipProps): import("@emotion/react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface TooltipContentProps extends Omit<TooltipPrimitiveProps, 'children'>, NonNullable<styles.TooltipVariants> {
+    showArrow?: boolean;
+    children?: ReactNode;
+}
+declare const TooltipContent: ({ offset, inverse, showArrow, children, ...props }: TooltipContentProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+declare function TooltipTrigger({ ...props }: ComponentProps<typeof Focusable>): import("@emotion/react/jsx-runtime").JSX.Element;
+export { Tooltip, TooltipContent, TooltipTrigger };
+export type { TooltipContentProps, TooltipProps };

package/dist/src/vanilla/Tooltip/index.d.ts

@@ -0,0 +1 @@
+export * from './Tooltip';

package/dist/src/vanilla/index.d.ts

@@ -2,3 +2,4 @@ export * from './Box';
 export * from './Table';
 export * from './Text';
 export * from './ThemeProvider';
+export * from './Tooltip';

package/dist/vanilla/Table/Table-css.js

@@ -1,10 +1,10 @@
 import './../assets/src/layers/layers.css.ts.vanilla-CBkaYCBT.css';
 import './../assets/src/vanilla-extract/global.css.ts.vanilla-t__QdzLU.css';
-import './../assets/src/sprinkles/properties.css.ts.vanilla-BQPG2W33.css';
+import './../assets/src/sprinkles/properties.css.ts.vanilla-Ckyezauv.css';
 import './../assets/src/vanilla/Table/Table.css.ts.vanilla-D8zK7RSt.css';
 import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
 
-var table = createRuntimeFn({defaultClassName:'_146hxcf64 _146hxcf212 _146hxcf1i7 ekwznl0',variantClassNames:{layout:{auto:'ekwznl1',fixed:'ekwznl5 ekwznl2'}},defaultVariants:{},compoundVariants:[]});
-var wrapper = createRuntimeFn({defaultClassName:'_146hxcf1ht _146hxcf1hw _146hxcf1hh _146hxcf1g4 _146hxcf1hb _146hxcf1he _146hxcf1g9 _146hxcfh8 _146hxcf1ki _146hxcf1g2 _146hxcf1u2 ekwznl6',variantClassNames:{},defaultVariants:{},compoundVariants:[]});
+var table = createRuntimeFn({defaultClassName:'_146hxcf64 _146hxcf21c _146hxcf1if ekwznl0',variantClassNames:{layout:{auto:'ekwznl1',fixed:'ekwznl5 ekwznl2'}},defaultVariants:{},compoundVariants:[]});
+var wrapper = createRuntimeFn({defaultClassName:'_146hxcf1i1 _146hxcf1i4 _146hxcf1hp _146hxcf1gc _146hxcf1hj _146hxcf1hm _146hxcf1gh _146hxcfh8 _146hxcf1ks _146hxcf1ga _146hxcf1uc ekwznl6',variantClassNames:{},defaultVariants:{},compoundVariants:[]});
 
 export { table, wrapper };

package/dist/vanilla/Table/TableCell-css.js

@@ -1,10 +1,10 @@
 import './../assets/src/layers/layers.css.ts.vanilla-CBkaYCBT.css';
 import './../assets/src/vanilla-extract/global.css.ts.vanilla-t__QdzLU.css';
-import './../assets/src/sprinkles/properties.css.ts.vanilla-BQPG2W33.css';
+import './../assets/src/sprinkles/properties.css.ts.vanilla-Ckyezauv.css';
 import './../assets/src/vanilla/Table/TableCell.css.ts.vanilla-BmF3z2D_.css';
 import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
 
-var cell = createRuntimeFn({defaultClassName:'_146hxcf1u2 _1p0g5yn0',variantClassNames:{pinned:{false:'_1p0g5yn1',true:'_1p0g5yn2'}},defaultVariants:{},compoundVariants:[]});
-var content = createRuntimeFn({defaultClassName:'_146hxcf64 _146hxcf8w _146hxcf4 _146hxcf212 _146hxcf2c _146hxcf1is _146hxcf1u2 _146hxcfd4 _1p0g5yn6',variantClassNames:{size:{sm:'_146hxcf7k',md:'_146hxcf7s',lg:'_146hxcf80'},bordered:{true:'_1p0g5yn7'}},defaultVariants:{},compoundVariants:[]});
+var cell = createRuntimeFn({defaultClassName:'_146hxcf1uc _1p0g5yn0',variantClassNames:{pinned:{false:'_1p0g5yn1',true:'_1p0g5yn2'}},defaultVariants:{},compoundVariants:[]});
+var content = createRuntimeFn({defaultClassName:'_146hxcf64 _146hxcf8w _146hxcf4 _146hxcf21c _146hxcf2c _146hxcf1j0 _146hxcf1uc _146hxcfd4 _1p0g5yn6',variantClassNames:{size:{sm:'_146hxcf7k',md:'_146hxcf7s',lg:'_146hxcf80'},bordered:{true:'_1p0g5yn7'}},defaultVariants:{},compoundVariants:[]});
 
 export { cell, content };

package/dist/vanilla/Table/TableHeader.js

@@ -6,7 +6,16 @@ import '../src/sprinkles/sprinkles.js';
 import { header } from './TableHeader-css.js';
 
 const TableHeader = forwardRef(
-  ({ children, className, pinned, ...props }, ref) => /* @__PURE__ */ jsx(Box, { asChild: true, className: cn(header({ pinned }), className), ...props, children: /* @__PURE__ */ jsx("thead", { ref, children }) })
+  ({ children, className, pinned, ...props }, ref) => /* @__PURE__ */ jsx(
+    Box,
+    {
+      asChild: true,
+      "data-pinned": pinned ? "" : void 0,
+      className: cn(header({ pinned }), className),
+      ...props,
+      children: /* @__PURE__ */ jsx("thead", { ref, children })
+    }
+  )
 );
 TableHeader.displayName = "TableHeader";
 

package/dist/vanilla/Table/TableHeaderCell-css.js

@@ -1,10 +1,12 @@
 import './../assets/src/layers/layers.css.ts.vanilla-CBkaYCBT.css';
 import './../assets/src/vanilla-extract/global.css.ts.vanilla-t__QdzLU.css';
-import './../assets/src/sprinkles/properties.css.ts.vanilla-BQPG2W33.css';
-import './../assets/src/vanilla/Table/TableHeaderCell.css.ts.vanilla-DesAfHw6.css';
+import './../assets/src/sprinkles/properties.css.ts.vanilla-Ckyezauv.css';
+import './../assets/src/vanilla/Table/TableHeader.css.ts.vanilla-2yw_MsU1.css';
+import './../assets/src/vanilla/Table/TableRow.css.ts.vanilla-CZN81sTW.css';
+import './../assets/src/vanilla/Table/TableHeaderCell.css.ts.vanilla-DHGpcMTl.css';
 import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
 
-var cell = createRuntimeFn({defaultClassName:'_146hxcf1u2 _92ef850',variantClassNames:{pinned:{false:'_92ef851',true:'_92ef852'}},defaultVariants:{},compoundVariants:[]});
-var content = createRuntimeFn({defaultClassName:'_146hxcf64 _146hxcf8w _146hxcf4 _146hxcf216 _146hxcf2c _146hxcf1is _146hxcfd4 _146hxcf1u2 _92ef856',variantClassNames:{size:{sm:'_146hxcf7k',md:'_146hxcf7s',lg:'_146hxcf80'},bordered:{true:'_92ef857'}},defaultVariants:{},compoundVariants:[]});
+var cell = createRuntimeFn({defaultClassName:'_146hxcf1uc _92ef850',variantClassNames:{pinned:{false:'_92ef851',true:'_92ef852'}},defaultVariants:{},compoundVariants:[]});
+var content = createRuntimeFn({defaultClassName:'_146hxcf64 _146hxcf8w _146hxcf4 _146hxcf21g _146hxcf2c _146hxcf1j0 _146hxcfd4 _146hxcf1uc _92ef856',variantClassNames:{size:{sm:'_146hxcf7k',md:'_146hxcf7s',lg:'_146hxcf80'},bordered:{true:'_92ef857'}},defaultVariants:{},compoundVariants:[]});
 
 export { cell, content };

package/dist/vanilla/Table/TableRow-css.js

@@ -1,6 +1,6 @@
 import './../assets/src/layers/layers.css.ts.vanilla-CBkaYCBT.css';
 import './../assets/src/vanilla-extract/global.css.ts.vanilla-t__QdzLU.css';
-import './../assets/src/sprinkles/properties.css.ts.vanilla-BQPG2W33.css';
+import './../assets/src/sprinkles/properties.css.ts.vanilla-Ckyezauv.css';
 import './../assets/src/vanilla/Table/TableRow.css.ts.vanilla-CZN81sTW.css';
 import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
 

package/dist/vanilla/Text/Text.js

@@ -9,7 +9,7 @@ import { text } from './Text-css.js';
 const Slot = createSlot("@orfium/ictinus/Text");
 const Text = forwardRef(
   ({ asChild, children, className, lineClamp, truncate, ...props }, ref) => {
-    const Comp = asChild ? Slot : "p";
+    const Comp = asChild ? Slot : "span";
     return /* @__PURE__ */ jsx(
       Box,
       {

package/dist/vanilla/Tooltip/Tooltip-css.js

@@ -0,0 +1,12 @@
+import './../assets/src/layers/layers.css.ts.vanilla-CBkaYCBT.css';
+import './../assets/src/vanilla-extract/global.css.ts.vanilla-t__QdzLU.css';
+import './../assets/src/sprinkles/properties.css.ts.vanilla-Ckyezauv.css';
+import './../assets/src/vanilla/Tooltip/Tooltip.css.ts.vanilla-nRPDcOsw.css';
+import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
+
+var arrow = createRuntimeFn({defaultClassName:'_1gov5q56',variantClassNames:{},defaultVariants:{},compoundVariants:[]});
+var arrowInverse = createRuntimeFn({defaultClassName:'_1gov5q58',variantClassNames:{},defaultVariants:{},compoundVariants:[]});
+var arrowInverseBorder = '_1gov5q5a';
+var tooltip = createRuntimeFn({defaultClassName:'_146hxcf13o _146hxcf2c _146hxcfk8 _146hxcf1gh _146hxcf1j1 _1gov5q50',variantClassNames:{inverse:{true:'_146hxcf1hp _146hxcf1gc _146hxcf1hj _146hxcf1hm _146hxcf1kw _146hxcf21c _146hxcf1uc _146hxcf1hu',false:'_146hxcf1l0 _146hxcf224'}},defaultVariants:{},compoundVariants:[]});
+
+export { arrow, arrowInverse, arrowInverseBorder, tooltip };

package/dist/vanilla/Tooltip/Tooltip.js

@@ -0,0 +1,96 @@
+import { jsx, jsxs } from '@emotion/react/jsx-runtime';
+import { useControllableState } from '@radix-ui/react-use-controllable-state';
+import { createContext, useRef, useContext } from 'react';
+import { TooltipTrigger as TooltipTrigger$1, Tooltip as Tooltip$1, composeRenderProps, OverlayArrow, Focusable } from 'react-aria-components';
+import { cn } from '../src/utils/cn.js';
+import { arrowInverse, arrowInverseBorder, arrow, tooltip } from './Tooltip-css.js';
+
+const TooltipContext = createContext({ triggerRef: null });
+const Tooltip = ({
+  delay = 500,
+  auto = false,
+  defaultOpen = false,
+  onOpenChange,
+  isOpen: openProp,
+  ...props
+}) => {
+  const triggerRef = useRef(null);
+  const [open, setOpen] = useControllableState({
+    caller: "Tooltip",
+    defaultProp: defaultOpen,
+    onChange: onOpenChange,
+    prop: openProp
+  });
+  return /* @__PURE__ */ jsx(TooltipContext.Provider, { value: { triggerRef }, children: /* @__PURE__ */ jsx(
+    TooltipTrigger$1,
+    {
+      delay,
+      defaultOpen: auto ? open : defaultOpen,
+      isDisabled: auto && openProp === void 0 ? void 0 : props.isDisabled,
+      isOpen: auto ? open : openProp,
+      onOpenChange: (isOpen) => {
+        if (auto && isOpen && triggerRef.current && !hasTruncatedContent(triggerRef.current)) {
+          return;
+        }
+        setOpen(isOpen);
+      },
+      ...props
+    }
+  ) });
+};
+Tooltip.displayName = "Tooltip";
+const TooltipContent = ({
+  offset = 8,
+  inverse = false,
+  showArrow = true,
+  children,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxs(
+    Tooltip$1,
+    {
+      ...props,
+      offset,
+      className: composeRenderProps(
+        props.className,
+        (className) => cn(tooltip({ inverse }), className)
+      ),
+      children: [
+        showArrow && /* @__PURE__ */ jsx(OverlayArrow, { children: inverse ? /* @__PURE__ */ jsxs("svg", { width: 18, height: 8, viewBox: "0 0 18 8", className: arrowInverse(), children: [
+          /* @__PURE__ */ jsx("path", { d: "M9.00744 6.52304L1.6397 0.000488281L16.3752 0.000489658L9.00744 6.52304Z" }),
+          /* @__PURE__ */ jsx(
+            "path",
+            {
+              d: "M9.00337 6.51095L16.3588 0.00158653H18.0034L9.00337 8.00049L0.00337219 0.00158653L1.6397 0.000488281L9.00337 6.51095Z",
+              className: arrowInverseBorder
+            }
+          )
+        ] }) : /* @__PURE__ */ jsx("svg", { width: 15, height: 6, viewBox: "0 0 15 6", className: arrow(), children: /* @__PURE__ */ jsx("path", { d: "M7.5 6L0.500001 -1.22392e-06L14.5 0L7.5 6Z" }) }) }),
+        children
+      ]
+    }
+  );
+};
+function TooltipTrigger({ ...props }) {
+  const { triggerRef } = useContext(TooltipContext);
+  return /* @__PURE__ */ jsx(Focusable, { ref: triggerRef, "data-slot": "tooltip-trigger", ...props });
+}
+const hasTruncatedContent = (element) => {
+  let truncated = false;
+  const elements = [element];
+  while (!truncated && elements.length) {
+    const element2 = elements.shift();
+    if (!(element2 instanceof HTMLElement)) {
+      continue;
+    }
+    const { offsetHeight, offsetWidth, scrollHeight, scrollWidth } = element2;
+    if (offsetWidth < scrollWidth || offsetHeight < scrollHeight) {
+      truncated = true;
+      break;
+    }
+    elements.push(...element2.children);
+  }
+  return truncated;
+};
+
+export { Tooltip, TooltipContent, TooltipTrigger };