@trilogy-ds/react 0.0.17-esm-cjs → 0.0.19-esm-cjs

package/lib/{chunk-Q6FQTPU4.mjs → chunk-KUVBW2U7.mjs}

@@ -1,13 +1,13 @@
 "use client";
 import {
   View_native_default
-} from "./chunk-MK63OCEA.mjs";
+} from "./chunk-4GKCUICZ.mjs";
 import {
   Text_native_default
-} from "./chunk-2AL4D3MJ.mjs";
+} from "./chunk-MVQ252OA.mjs";
 import {
   getColorStyle
-} from "./chunk-VI2KFLCZ.mjs";
+} from "./chunk-E4YRRUI3.mjs";
 
 // components/table/th/TableTh.native.tsx
 import * as React from "react";

package/lib/{chunk-AZVPP2GA.mjs → chunk-KY7T6Q73.mjs}

@@ -1,13 +1,13 @@
 "use client";
 import {
   getVariantClassName
-} from "./chunk-JA5LYEG4.mjs";
+} from "./chunk-6CVNPSI3.mjs";
 import {
   getStatusClassName
-} from "./chunk-AD63JH53.mjs";
+} from "./chunk-ZUSPKNMI.mjs";
 import {
   Icon_default
-} from "./chunk-SGAZRZIK.mjs";
+} from "./chunk-ALGX47MZ.mjs";
 import {
   has,
   is

package/lib/{chunk-RZQA2M2N.mjs → chunk-KYCWE6NL.mjs}

@@ -2,7 +2,7 @@
 
 // version.json
 var version_default = {
-  VERSION: "47"
+  VERSION: "410"
 };
 
 export {

package/lib/{chunk-FSTU72UW.mjs → chunk-LBSTQNK7.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   getBackgroundClassName
-} from "./chunk-WC3ULY5W.mjs";
+} from "./chunk-XXKEMYTB.mjs";
 import {
   has,
   is
@@ -14,7 +14,7 @@ import {
 } from "./chunk-ZB4OWTDD.mjs";
 import {
   getAlignClassName
-} from "./chunk-HV6TXVFA.mjs";
+} from "./chunk-CD6DMMCL.mjs";
 
 // components/box/header/BoxHeader.tsx
 import clsx from "clsx";

package/lib/{chunk-JYONTZJI.mjs → chunk-LEXUEUIJ.mjs}

@@ -1,13 +1,13 @@
 "use client";
 import {
   Input_default
-} from "./chunk-WCYJXOFQ.mjs";
-import {
-  menu_default
-} from "./chunk-P2RMWELW.mjs";
+} from "./chunk-3HY3E3O3.mjs";
 import {
   item_default
 } from "./chunk-IRYNHKFI.mjs";
+import {
+  menu_default
+} from "./chunk-ZUZ6IVLL.mjs";
 import {
   debounce
 } from "./chunk-ESZE7E3N.mjs";

package/lib/chunk-LGL3XQ7F.mjs

@@ -0,0 +1 @@
+"use client";

package/lib/chunk-LJF3YLMG.mjs

@@ -0,0 +1,25 @@
+"use client";
+import {
+  hashClass
+} from "./chunk-UFMRE754.mjs";
+import {
+  useTrilogyContext
+} from "./chunk-ZB4OWTDD.mjs";
+
+// components/timeline/item/TimelineItem.tsx
+import clsx from "clsx";
+import * as React from "react";
+var TimelineItem = React.forwardRef(({ className, id, done, active, cancel, ...others }, ref) => {
+  const { styled } = useTrilogyContext();
+  const classes = hashClass(
+    styled,
+    clsx("timeline-item", done && "done", active && "active", cancel && "cancel", className)
+  );
+  return /* @__PURE__ */ React.createElement("div", { ref, id, className: classes, ...others });
+});
+TimelineItem.displayName = "TimelineItem" /* TimelineItem */;
+var TimelineItem_default = TimelineItem;
+
+export {
+  TimelineItem_default
+};

package/lib/{chunk-JZ3SSSRS.mjs → chunk-LOROW3UU.mjs}

@@ -2,12 +2,13 @@
 
 // components/columns/context/index.tsx
 import React from "react";
-var ColumnsContext = React.createContext({
+var defaultContextValue = {
   scrollable: false,
   width: 0,
   realGap: 16,
   childrensLength: 1
-});
+};
+var ColumnsContext = React.createContext(defaultContextValue);
 
 export {
   ColumnsContext

package/lib/{chunk-IERXTGCG.mjs → chunk-LQ2EKGFZ.mjs}

@@ -1,16 +1,16 @@
 "use client";
 import {
   View_native_default
-} from "./chunk-MK63OCEA.mjs";
+} from "./chunk-4GKCUICZ.mjs";
 import {
   Text_native_default
-} from "./chunk-2AL4D3MJ.mjs";
+} from "./chunk-MVQ252OA.mjs";
 import {
   getStatusStyle
-} from "./chunk-KNRXLZZP.mjs";
+} from "./chunk-MB55ARZ7.mjs";
 import {
   getColorStyle
-} from "./chunk-VI2KFLCZ.mjs";
+} from "./chunk-E4YRRUI3.mjs";
 
 // components/progress/Progress.native.tsx
 import React, { useEffect, useRef } from "react";

package/lib/{chunk-GNSLOYT2.mjs → chunk-M2TC4BZG.mjs}

@@ -1,11 +1,11 @@
 "use client";
-import {
-  autoLayoutChildrenHandler,
-  parseChildren
-} from "./chunk-WG6PNVJM.mjs";
 import {
   DEFAULT_SPACING_MATRIX
 } from "./chunk-AQYNL523.mjs";
+import {
+  autoLayoutChildrenHandler,
+  parseChildren
+} from "./chunk-5LGX4H46.mjs";
 import {
   Spacer_native_default
 } from "./chunk-54DJB6AO.mjs";

package/lib/chunk-M3FKAS2D.mjs

@@ -0,0 +1,85 @@
+"use client";
+import {
+  TitleMarkup
+} from "./chunk-GVBMUMGT.mjs";
+import {
+  is
+} from "./chunk-SWVRRUW7.mjs";
+import {
+  hashClass
+} from "./chunk-UFMRE754.mjs";
+import {
+  useTrilogyContext
+} from "./chunk-ZB4OWTDD.mjs";
+
+// components/title/Title.tsx
+import clsx from "clsx";
+import React from "react";
+var getTitleLevel = (level) => {
+  if (level) {
+    switch (level) {
+      case 1 /* ONE */:
+        return is(`level-1`);
+      case 2 /* TWO */:
+        return is(`level-2`);
+      case 3 /* THREE */:
+        return is(`level-3`);
+      case 4 /* FOUR */:
+        return is(`level-4`);
+      case 5 /* FIVE */:
+        return is(`level-5`);
+      case 6 /* SIX */:
+        return is(`level-6`);
+      default:
+        return is(`level-${level}`);
+    }
+  }
+};
+var isCorrectMarkup = (stringMarkup) => {
+  return stringMarkup in TitleMarkup || Object.values(TitleMarkup).includes(stringMarkup);
+};
+var Title = React.forwardRef(({
+  level = 1 /* ONE */,
+  markup,
+  children,
+  className,
+  id,
+  typo,
+  skeleton,
+  inverted,
+  onClick,
+  accessibilityLabel,
+  subtitle,
+  overline,
+  marginless,
+  ...others
+}, ref) => {
+  const { styled } = useTrilogyContext();
+  const classes = hashClass(
+    styled,
+    clsx(
+      "title",
+      level && getTitleLevel(level),
+      typo,
+      skeleton && is("loading"),
+      inverted && is("inverted"),
+      marginless && is("marginless"),
+      className
+    )
+  );
+  const subtitleClasses = hashClass(styled, clsx("subtitle", typo, className));
+  const overlineClasses = hashClass(styled, clsx("overline", typo, className));
+  const Tag = markup && isCorrectMarkup(markup) ? markup : "p";
+  const getClassname = () => {
+    if (subtitle) return subtitleClasses;
+    if (overline) return overlineClasses;
+    return classes;
+  };
+  return /* @__PURE__ */ React.createElement(Tag, { ref, id, "aria-label": accessibilityLabel, onClick, className: getClassname(), ...others }, children);
+});
+Title.displayName = "Title" /* Title */;
+var Title_default = Title;
+
+export {
+  Title_default
+};

package/lib/chunk-M5W5FRMF.mjs

@@ -0,0 +1,63 @@
+"use client";
+import {
+  Column_native_default
+} from "./chunk-ZNF2AXYR.mjs";
+import {
+  Columns_native_default
+} from "./chunk-NRTMJLXK.mjs";
+import {
+  Text_native_default
+} from "./chunk-MVQ252OA.mjs";
+import {
+  Icon_native_default
+} from "./chunk-UPP3GX33.mjs";
+import {
+  getColorStyle
+} from "./chunk-E4YRRUI3.mjs";
+
+// components/select/option/SelectOption.native.tsx
+import * as React from "react";
+import { StyleSheet, TouchableOpacity } from "react-native";
+var SelectOption = React.forwardRef(({ disabled, children, onClick, label, iconName, ...others }, ref) => {
+  const { checked } = others;
+  const styles = StyleSheet.create({
+    container: {
+      backgroundColor: getColorStyle(disabled ? "DISABLED_FADE" /* DISABLED_FADE */ : "transparent"),
+      width: "100%",
+      paddingVertical: checked && !iconName ? 8.5 : 10
+    }
+  });
+  const textColor = React.useMemo(() => {
+    switch (true) {
+      case disabled === true:
+        return "DISABLED" /* DISABLED */;
+      default:
+        return "MAIN" /* MAIN */;
+    }
+  }, [disabled]);
+  const iconColor = React.useMemo(() => {
+    switch (true) {
+      case disabled === true:
+        return "DISABLED" /* DISABLED */;
+      default:
+        return "MAIN" /* MAIN */;
+    }
+  }, [disabled]);
+  const columnLabelSize = React.useMemo(() => {
+    return iconName ? checked && 10 || 11 : checked && 11 || 12;
+  }, [iconName, checked]);
+  return /* @__PURE__ */ React.createElement(TouchableOpacity, { ref, style: [styles.container], ...others, onPress: onClick }, /* @__PURE__ */ React.createElement(Columns_native_default, { verticalAlign: "ALIGNED_CENTER" /* ALIGNED_CENTER */ }, iconName && /* @__PURE__ */ React.createElement(Column_native_default, { size: 1 }, /* @__PURE__ */ React.createElement(Icon_native_default, { size: "small" /* SMALL */, name: iconName, color: iconColor })), /* @__PURE__ */ React.createElement(Column_native_default, { size: columnLabelSize }, /* @__PURE__ */ React.createElement(
+    Text_native_default,
+    {
+      typo: [checked && "has-text-weight-semibold" /* TEXT_WEIGHT_SEMIBOLD */],
+      ...{ style: { paddingLeft: 8, color: getColorStyle(textColor) } }
+    },
+    children || label
+  )), checked && /* @__PURE__ */ React.createElement(Column_native_default, { size: 1 }, /* @__PURE__ */ React.createElement(Icon_native_default, { size: "small" /* SMALL */, name: "tri-check", color: iconColor }))));
+});
+SelectOption.displayName = "SelectOption" /* SelectOption */;
+var SelectOption_native_default = SelectOption;
+
+export {
+  SelectOption_native_default
+};

package/lib/{chunk-K2VWHGPL.mjs → chunk-MAX3RSBG.mjs}

@@ -4,6 +4,8 @@
 var DirectionEnum = /* @__PURE__ */ ((DirectionEnum2) => {
   DirectionEnum2["ROW"] = "row";
   DirectionEnum2["COLUMN"] = "column";
+  DirectionEnum2["ROW_REVERSE"] = "row-reverse";
+  DirectionEnum2["COLUMN_REVERSE"] = "column-reverse";
   return DirectionEnum2;
 })(DirectionEnum || {});
 

package/lib/{chunk-KNRXLZZP.mjs → chunk-MB55ARZ7.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   getColorStyle
-} from "./chunk-VI2KFLCZ.mjs";
+} from "./chunk-E4YRRUI3.mjs";
 
 // objects/facets/Status/index.native.ts
 var StatusState = /* @__PURE__ */ ((StatusState2) => {

package/lib/chunk-MDZE2AV3.mjs

@@ -0,0 +1,115 @@
+"use client";
+import {
+  getTypographyBoldStyle
+} from "./chunk-3LXODEBD.mjs";
+import {
+  setTypographyColor
+} from "./chunk-WVL5S3CD.mjs";
+import {
+  getColorStyle
+} from "./chunk-E4YRRUI3.mjs";
+import {
+  StatesContext
+} from "./chunk-CWIO3GEP.mjs";
+import {
+  isAndroid
+} from "./chunk-R6PFY5VS.mjs";
+import {
+  setTypographyAlign
+} from "./chunk-IGMJNGTZ.mjs";
+
+// components/title/Title.native.tsx
+import * as React from "react";
+import { useContext } from "react";
+import ContentLoader, { Rect } from "react-content-loader/native";
+import { StyleSheet, Text as TextNative, TouchableOpacity, View } from "react-native";
+var Title = React.forwardRef(({
+  children,
+  level,
+  style,
+  inverted,
+  typo,
+  onClick,
+  skeleton,
+  accessibilityLabel,
+  subtitle,
+  overline,
+  ...others
+}, ref) => {
+  const statesContext = useContext(StatesContext);
+  const color = setTypographyColor(typo, inverted || statesContext.inverted, skeleton);
+  const colorOverline = getColorStyle("MAIN" /* MAIN */);
+  const fontFamily = level && [1 /* ONE */, 2 /* TWO */].includes(level) ? "has-text-weight-bold" /* TEXT_WEIGHT_BOLD */ : "has-text-weight-semibold" /* TEXT_WEIGHT_SEMIBOLD */;
+  const titlesLevels = () => {
+    switch (level) {
+      case 1 /* ONE */:
+        return 32;
+      case 2 /* TWO */:
+        return 28;
+      case 3 /* THREE */:
+        return 22;
+      case 4 /* FOUR */:
+        return 20;
+      case 5 /* FIVE */:
+        return 18;
+      case 6 /* SIX */:
+        return 16;
+      default:
+        return 16;
+    }
+  };
+  const getAlignSelf = () => {
+    switch (true) {
+      case setTypographyAlign(typo) === "left":
+        return "flex-start";
+      case setTypographyAlign(typo) === "center":
+        return "center";
+      case setTypographyAlign(typo) === "right":
+        return "flex-end";
+      default:
+        return "flex-start";
+    }
+  };
+  const styles = StyleSheet.create({
+    text: {
+      fontFamily: getTypographyBoldStyle(fontFamily),
+      fontSize: titlesLevels(),
+      color: (overline || subtitle) && !level && colorOverline || color,
+      textAlign: setTypographyAlign(typo),
+      textTransform: overline && !level ? "uppercase" : void 0,
+      alignSelf: getAlignSelf()
+    },
+    skeleton: {
+      minWidth: 10,
+      alignSelf: getAlignSelf(),
+      borderRadius: 5,
+      borderWidth: 0.1,
+      borderColor: getColorStyle("NEUTRAL_FADE" /* NEUTRAL_FADE */),
+      overflow: "hidden",
+      height: titlesLevels()
+    }
+  });
+  const titleAccessibilityLabel = accessibilityLabel ? accessibilityLabel : typeof children === "string" ? children : void 0;
+  let titleView = /* @__PURE__ */ React.createElement(
+    TextNative,
+    {
+      ref,
+      maxFontSizeMultiplier: 1.3,
+      accessible: !!titleAccessibilityLabel,
+      accessibilityLabel: titleAccessibilityLabel,
+      style: [styles.text, style],
+      ...others
+    },
+    children
+  );
+  if (skeleton) {
+    titleView = /* @__PURE__ */ React.createElement(ContentLoader, { style: styles.skeleton }, titleView, isAndroid && /* @__PURE__ */ React.createElement(View, null, /* @__PURE__ */ React.createElement(Rect, { rx: "15", ry: "15", width: "100%", height: "100%" })));
+  }
+  return onClick ? /* @__PURE__ */ React.createElement(TouchableOpacity, { onPress: onClick, activeOpacity: 0.85 }, titleView) : titleView;
+});
+Title.displayName = "Title" /* Title */;
+var Title_native_default = Title;
+
+export {
+  Title_native_default
+};

package/lib/{chunk-LAVKSOBD.mjs → chunk-MFPPIGPF.mjs}

@@ -8,7 +8,8 @@ var TagList = React.forwardRef(({ children, ...others }, ref) => {
     tagList: {
       width: "100%",
       flexDirection: "row",
-      flexWrap: "wrap"
+      flexWrap: "wrap",
+      gap: 4
     },
     centered: {
       alignSelf: "center"

package/lib/{chunk-QXMTDX2V.mjs → chunk-MMFURLTB.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   getColorStyle
-} from "./chunk-VI2KFLCZ.mjs";
+} from "./chunk-E4YRRUI3.mjs";
 
 // components/table/td/TableTd.native.tsx
 import * as React from "react";

package/lib/chunk-MVQ252OA.mjs

@@ -0,0 +1,85 @@
+"use client";
+import {
+  getTypographyBoldStyle
+} from "./chunk-3LXODEBD.mjs";
+import {
+  setTypographyColor
+} from "./chunk-WVL5S3CD.mjs";
+import {
+  getColorStyle
+} from "./chunk-E4YRRUI3.mjs";
+import {
+  StatesContext
+} from "./chunk-CWIO3GEP.mjs";
+import {
+  isAndroid
+} from "./chunk-R6PFY5VS.mjs";
+import {
+  setTypographyAlign
+} from "./chunk-IGMJNGTZ.mjs";
+
+// components/text/Text.native.tsx
+import React, { useContext } from "react";
+import ContentLoader, { Rect } from "react-content-loader/native";
+import { StyleSheet, Text as TextNative, View } from "react-native";
+var Text = React.forwardRef(({
+  children,
+  level,
+  style,
+  inverted,
+  typo,
+  skeleton,
+  accessibilityLabel,
+  numberOfLines = 0,
+  ...others
+}, ref) => {
+  const statesContext = useContext(StatesContext);
+  const textLevels = (level2) => {
+    return level2 && level2 == 1 /* ONE */ && 16 || level2 && level2 == 2 /* TWO */ && 14 || level2 && level2 == 3 /* THREE */ && 12 || level2 && level2 == 4 /* FOUR */ && 10 || 14;
+  };
+  const styles = StyleSheet.create({
+    text: {
+      fontFamily: getTypographyBoldStyle(typo),
+      fontSize: textLevels(level),
+      color: setTypographyColor(typo, inverted || statesContext.inverted, skeleton),
+      textAlign: setTypographyAlign(typo),
+      lineHeight: textLevels(level) * 1.2,
+      textDecorationLine: "none",
+      alignSelf: setTypographyAlign(typo) === "left" && "flex-start" || setTypographyAlign(typo) === "center" && "center" || setTypographyAlign(typo) === "right" && "flex-end" || "flex-start"
+    },
+    skeleton: {
+      minWidth: 10,
+      alignSelf: setTypographyAlign(typo) === "left" && "flex-start" || setTypographyAlign(typo) === "center" && "center" || setTypographyAlign(typo) === "right" && "flex-end" || "flex-start",
+      borderRadius: level && level == 1 /* ONE */ && 7 || level && level == 2 /* TWO */ && 7 || level && level == 3 /* THREE */ && 5 || 3,
+      borderWidth: 0.1,
+      borderColor: getColorStyle("NEUTRAL_FADE" /* NEUTRAL_FADE */),
+      overflow: "hidden",
+      height: textLevels(level)
+    }
+  });
+  const textAccessibilityLabel = accessibilityLabel ? accessibilityLabel : typeof children === "string" ? children : void 0;
+  let textView = /* @__PURE__ */ React.createElement(
+    TextNative,
+    {
+      ref,
+      numberOfLines,
+      ellipsizeMode: "tail",
+      maxFontSizeMultiplier: 1.3,
+      accessible: !!textAccessibilityLabel,
+      accessibilityLabel: textAccessibilityLabel,
+      style: [styles.text, style],
+      ...others
+    },
+    children
+  );
+  if (skeleton) {
+    textView = /* @__PURE__ */ React.createElement(ContentLoader, { style: styles.skeleton }, textView, isAndroid && /* @__PURE__ */ React.createElement(View, null, /* @__PURE__ */ React.createElement(Rect, { rx: "7", ry: "7", width: "100%", height: "100%" })));
+  }
+  return textView;
+});
+Text.displayName = "Text" /* Text */;
+var Text_native_default = Text;
+
+export {
+  Text_native_default
+};

package/lib/{chunk-ELTZ3E3O.mjs → chunk-MZHFYHCF.mjs}

@@ -1,10 +1,10 @@
 "use client";
+import {
+  getColorStyle
+} from "./chunk-E4YRRUI3.mjs";
 import {
   StatesContext
 } from "./chunk-CWIO3GEP.mjs";
-import {
-  getColorStyle
-} from "./chunk-VI2KFLCZ.mjs";
 
 // components/box/header/BoxHeader.native.tsx
 import * as React from "react";

package/lib/{chunk-Z7UII2QG.mjs → chunk-NDT4BW3R.mjs}

@@ -1,7 +1,7 @@
 "use client";
 
 // version.ts
-var version = "0.0.17-esm-cjs";
+var version = "0.0.19-esm-cjs";
 
 export {
   version

package/lib/{chunk-PFH5M7W4.mjs → chunk-NE4WGXUM.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   TimelineMarker_native_default
-} from "./chunk-WM3KXXQX.mjs";
+} from "./chunk-ZRWNSZC6.mjs";
 
 // components/timeline/marker/index.native.ts
 var index_native_default = TimelineMarker_native_default;

package/lib/{chunk-ZJJ3ISDC.mjs → chunk-NHPZIDNU.mjs}

@@ -1,10 +1,10 @@
 "use client";
 import {
   version_default
-} from "./chunk-RZQA2M2N.mjs";
+} from "./chunk-KYCWE6NL.mjs";
 import {
   version
-} from "./chunk-Z7UII2QG.mjs";
+} from "./chunk-NDT4BW3R.mjs";
 import {
   TrilogyContext
 } from "./chunk-ZB4OWTDD.mjs";

package/lib/{chunk-PHH6JAI6.mjs → chunk-NKO25SIM.mjs}

@@ -1,10 +1,10 @@
 "use client";
 import {
   Text_native_default
-} from "./chunk-2AL4D3MJ.mjs";
+} from "./chunk-MVQ252OA.mjs";
 import {
   Icon_native_default
-} from "./chunk-H6FVJB5Z.mjs";
+} from "./chunk-UPP3GX33.mjs";
 
 // components/stepper/Stepper.native.tsx
 import * as React from "react";