@tedi-design-system/react 15.0.0-rc.12 → 15.0.0-rc.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tedi-design-system/react",
-  "version": "15.0.0-rc.12",
+  "version": "15.0.0-rc.14",
   "type": "module",
   "sideEffects": false,
   "exports": {

package/src/tedi/components/content/text-group/text-group.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../../../external/classnames/index.cjs.js"),p=require("../label/label.cjs.js"),t=require("./text-group.module.scss.cjs.js"),x=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),b=a=>{const{getCurrentBreakpointProps:u}=x.useBreakpointProps(a.defaultServerBreakpoint),{label:o,value:s,labelWidth:l="auto",className:d,type:i="vertical"}=u(a),n=r.default(t.default["tedi-text-group"],t.default[`tedi-text-group--${i}`],d),c=typeof l=="number"?`${l}%`:l;return e.jsxs("dl",{className:n,style:{"--label-width":c},children:[e.jsx("dt",{className:r.default(t.default["tedi-text-group__label"]),children:e.jsx(p.Label,{children:o})}),e.jsx("dd",{className:r.default(t.default["tedi-text-group__value"]),children:s})]})};exports.TextGroup=b;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),a=require("../../../../../external/classnames/index.cjs.js"),x=require("../label/label.cjs.js"),e=require("./text-group.module.scss.cjs.js"),f=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),b=u=>{const{getCurrentBreakpointProps:o}=f.useBreakpointProps(u.defaultServerBreakpoint),{label:l,value:s,labelWidth:r="auto",className:i,type:d="vertical",labelAlign:n="left"}=o(u),c=a.default(e.default["tedi-text-group"],e.default[`tedi-text-group--${d}`],i),p=typeof r=="number"?`${r}%`:r;return t.jsxs("dl",{className:c,style:{"--label-width":p},children:[t.jsx("dt",{className:a.default(e.default["tedi-text-group__label"],e.default[`tedi-text-group--align-${n}`]),children:typeof l=="string"?t.jsx(x.Label,{children:l}):l}),t.jsx("dd",{className:a.default(e.default["tedi-text-group__value"]),children:s})]})};exports.TextGroup=b;

package/src/tedi/components/content/text-group/text-group.d.ts

@@ -1,22 +1,42 @@
 import { default as React } from 'react';
 import { BreakpointSupport } from '../../../helpers';
-type TextGroupType = 'vertical' | 'horizontal';
+type TextAlign = 'left' | 'right';
 type TextGroupBreakpointProps = {
     /**
      * Type of text group layout
      */
-    type?: TextGroupType;
+    type?: 'horizontal';
+    /**
+     * Alignment for the label text
+     *  @default 'left'
+     */
+    labelAlign?: TextAlign;
+    /**
+     * Width for the label (e.g., '200px', '30%', etc.)
+     * @default 'auto'
+     */
+    labelWidth?: string | number;
+} | {
+    /**
+     * Type of text group layout
+     */
+    type: 'vertical';
+    /**
+     * Alignment for the label text
+     *  @default 'left'
+     */
+    labelAlign?: 'left';
     /**
      * Width for the label (e.g., '200px', '30%', etc.)
      * @default 'auto'
      */
     labelWidth?: string | number;
 };
-export interface TextGroupProps extends BreakpointSupport<TextGroupBreakpointProps> {
+export type TextGroupProps = BreakpointSupport<TextGroupBreakpointProps> & {
     /**
      * Label for the text group
      */
-    label: string;
+    label: React.ReactNode;
     /**
      * Value displayed alongside the label
      */
@@ -25,6 +45,6 @@ export interface TextGroupProps extends BreakpointSupport<TextGroupBreakpointPro
      * Additional class name(s) to apply to the element
      */
     className?: string;
-}
+};
 export declare const TextGroup: (props: TextGroupProps) => JSX.Element;
 export {};

package/src/tedi/components/content/text-group/text-group.es.js

@@ -1,21 +1,22 @@
-import { jsxs as n, jsx as r } from "react/jsx-runtime";
-import l from "../../../../../external/classnames/index.es.js";
-import { Label as u } from "../label/label.es.js";
+import { jsxs as u, jsx as l } from "react/jsx-runtime";
+import o from "../../../../../external/classnames/index.es.js";
+import { Label as x } from "../label/label.es.js";
 import e from "./text-group.module.scss.es.js";
-import { useBreakpointProps as x } from "../../../helpers/hooks/use-breakpoint-props.es.js";
-const N = (o) => {
-  const { getCurrentBreakpointProps: a } = x(o.defaultServerBreakpoint), {
-    label: s,
+import { useBreakpointProps as f } from "../../../helpers/hooks/use-breakpoint-props.es.js";
+const v = (a) => {
+  const { getCurrentBreakpointProps: s } = f(a.defaultServerBreakpoint), {
+    label: t,
     value: i,
-    labelWidth: t = "auto",
+    labelWidth: r = "auto",
     className: p,
-    type: d = "vertical"
-  } = a(o), m = l(e["tedi-text-group"], e[`tedi-text-group--${d}`], p), c = typeof t == "number" ? `${t}%` : t;
-  return /* @__PURE__ */ n("dl", { className: m, style: { "--label-width": c }, children: [
-    /* @__PURE__ */ r("dt", { className: l(e["tedi-text-group__label"]), children: /* @__PURE__ */ r(u, { children: s }) }),
-    /* @__PURE__ */ r("dd", { className: l(e["tedi-text-group__value"]), children: i })
+    type: n = "vertical",
+    labelAlign: d = "left"
+  } = s(a), m = o(e["tedi-text-group"], e[`tedi-text-group--${n}`], p), c = typeof r == "number" ? `${r}%` : r;
+  return /* @__PURE__ */ u("dl", { className: m, style: { "--label-width": c }, children: [
+    /* @__PURE__ */ l("dt", { className: o(e["tedi-text-group__label"], e[`tedi-text-group--align-${d}`]), children: typeof t == "string" ? /* @__PURE__ */ l(x, { children: t }) : t }),
+    /* @__PURE__ */ l("dd", { className: o(e["tedi-text-group__value"]), children: i })
   ] });
 };
 export {
-  N as TextGroup
+  v as TextGroup
 };

package/src/tedi/components/content/text-group/text-group.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t={"tedi-text-group":"tedi-text-group-be3b15d8","tedi-text-group--horizontal":"tedi-text-group--horizontal-9d91c910","tedi-text-group__label":"tedi-text-group__label-a8904597","tedi-text-group__value":"tedi-text-group__value-4bbf1a22"};exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t={"tedi-text-group":"tedi-text-group-be3b15d8","tedi-text-group--horizontal":"tedi-text-group--horizontal-9d91c910","tedi-text-group__label":"tedi-text-group__label-a8904597","tedi-text-group__value":"tedi-text-group__value-4bbf1a22","tedi-text-group--align-left":"tedi-text-group--align-left-cc82fd31","tedi-text-group--align-right":"tedi-text-group--align-right-0eebe973"};exports.default=t;

package/src/tedi/components/content/text-group/text-group.module.scss.es.js

@@ -2,7 +2,9 @@ const t = {
   "tedi-text-group": "tedi-text-group-be3b15d8",
   "tedi-text-group--horizontal": "tedi-text-group--horizontal-9d91c910",
   "tedi-text-group__label": "tedi-text-group__label-a8904597",
-  "tedi-text-group__value": "tedi-text-group__value-4bbf1a22"
+  "tedi-text-group__value": "tedi-text-group__value-4bbf1a22",
+  "tedi-text-group--align-left": "tedi-text-group--align-left-cc82fd31",
+  "tedi-text-group--align-right": "tedi-text-group--align-right-0eebe973"
 };
 export {
   t as default