@tedi-design-system/react 15.0.0-rc.1 → 15.0.0-rc.11

package/src/community/components/ellipsis/ellipsis.es.js

@@ -1,34 +0,0 @@
-import { jsx as t, jsxs as d } from "react/jsx-runtime";
-import r from "react";
-import { useElementSize as u } from "../../../tedi/helpers/hooks/use-element-size.es.js";
-import s from "./ellipsis.module.scss.es.js";
-import { TooltipProvider as h } from "../tooltip/tooltip-provider.es.js";
-import { TooltipTrigger as T } from "../tooltip/tooltip-trigger.es.js";
-import { Tooltip as g } from "../tooltip/tooltip.es.js";
-import { Card as C } from "../card/card.es.js";
-import { CardContent as R } from "../card/card-content/card-content.es.js";
-const H = (n) => {
-  const { children: i, lineClamp: o = 2, showTooltip: m = !0, ...p } = n, e = r.useRef(null), [c, a] = r.useState(!1), f = u(e);
-  r.useEffect(() => {
-    e.current && a(e.current.scrollHeight > e.current.clientHeight);
-  }, [e, f]);
-  const l = /* @__PURE__ */ t(
-    "div",
-    {
-      "data-name": "ellipsis",
-      ...p,
-      ref: e,
-      className: s.ellipsis,
-      style: { lineClamp: o, WebkitLineClamp: o },
-      children: i
-    }
-  );
-  return c && m ? /* @__PURE__ */ d(h, { children: [
-    /* @__PURE__ */ t(T, { children: l }),
-    /* @__PURE__ */ t(g, { children: /* @__PURE__ */ t(C, { borderless: !0, className: s.ellipsis__tooltip, children: /* @__PURE__ */ t(R, { padding: 0.75, children: i }) }) })
-  ] }) : l;
-};
-export {
-  H as Ellipsis,
-  H as default
-};

package/src/community/components/ellipsis/ellipsis.module.scss.cjs.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l="ellipsis-619434e4",s="ellipsis__tooltip-9735eba5",e={ellipsis:l,ellipsis__tooltip:s};exports.default=e;exports.ellipsis=l;exports.ellipsis__tooltip=s;

package/src/community/components/ellipsis/ellipsis.module.scss.es.js

@@ -1,9 +0,0 @@
-const s = "ellipsis-619434e4", l = "ellipsis__tooltip-9735eba5", i = {
-  ellipsis: s,
-  ellipsis__tooltip: l
-};
-export {
-  i as default,
-  s as ellipsis,
-  l as ellipsis__tooltip
-};

package/src/community/components/icon/icon.cjs.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const y=require("react/jsx-runtime"),p=require("../../../../external/classnames/index.cjs.js"),q=require("react"),l=require("./icon.module.scss.cjs.js"),e=q.forwardRef((o,r)=>{const{className:s,name:c,filled:d=!1,label:a,type:i="outlined",size:n=24,display:u="block",color:t,...m}=o,f=p.default("notranslate","material-symbols",l.default.icon,l.default[`icon--${u}`],{[`material-symbols--${i}`]:i,[`text-${t}`]:t},s),b={...n?{"--icon-internal-variation-size":`${n/16}rem`}:{},...d?{"--icon-internal-variation-fill":1}:{}};return y.jsx("span",{"data-name":"icon",role:"img","aria-hidden":!a,...m,className:f,style:b,ref:r,"aria-label":a,children:c})});e.displayName="Icon";exports.Icon=e;exports.default=e;

package/src/community/components/icon/icon.d.ts

@@ -1,49 +0,0 @@
-import { default as React } from 'react';
-import { TextColor } from '../typography/text/text';
-export type IconSize = 12 | 14 | 16 | 18 | 24 | 36 | 48;
-export interface IconProps {
-    /**
-     * Name of material symbols icon.
-     * https://fonts.google.com/icons?icon.set=Material+Symbols
-     */
-    name: string;
-    /**
-     * Additional classes.
-     */
-    className?: string;
-    /**
-     * Type of icon.
-     * It is recommended to only use one type throughout your app.
-     * This ensures that only one icon font is downloaded.
-     * @default outlined
-     */
-    type?: 'outlined' | 'rounded' | 'sharp';
-    /**
-     * Render a filled variant of the icon.
-     * @default false
-     */
-    filled?: boolean;
-    /**
-     * Size of the icon.
-     * @default 24
-     */
-    size?: IconSize;
-    /**
-     * Which color Icon should be.
-     * Use 'positive', 'important' or 'warning' with caution, usually they should not be in application UI.
-     * @default default
-     */
-    color?: TextColor;
-    /**
-     * Type of display. block by default.
-     * @default block
-     */
-    display?: 'block' | 'inline';
-    /**
-     * Icons label for screen-readers.
-     * If omitted then the icon is hidden for screen-readers.
-     */
-    label?: string;
-}
-export declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<HTMLDivElement>>;
-export default Icon;

package/src/community/components/icon/icon.es.js

@@ -1,47 +0,0 @@
-import { jsx as y } from "react/jsx-runtime";
-import b from "../../../../external/classnames/index.es.js";
-import { forwardRef as N } from "react";
-import l from "./icon.module.scss.es.js";
-const $ = N((n, r) => {
-  const {
-    className: s,
-    name: t,
-    filled: m = !1,
-    label: a,
-    type: o = "outlined",
-    size: i = 24,
-    display: c = "block",
-    color: e,
-    ...d
-  } = n, f = b(
-    "notranslate",
-    // Added to prevent Google Translate from translating the icon
-    "material-symbols",
-    l.icon,
-    l[`icon--${c}`],
-    { [`material-symbols--${o}`]: o, [`text-${e}`]: e },
-    s
-  ), p = {
-    ...i ? { "--icon-internal-variation-size": `${i / 16}rem` } : {},
-    ...m ? { "--icon-internal-variation-fill": 1 } : {}
-  };
-  return /* @__PURE__ */ y(
-    "span",
-    {
-      "data-name": "icon",
-      role: "img",
-      "aria-hidden": !a,
-      ...d,
-      className: f,
-      style: p,
-      ref: r,
-      "aria-label": a,
-      children: t
-    }
-  );
-});
-$.displayName = "Icon";
-export {
-  $ as Icon,
-  $ as default
-};

package/src/community/components/icon/icon.module.scss.cjs.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="icon-8081be27",o={icon:e,"icon--block":"icon--block-4aa6379d","icon--inline":"icon--inline-5d045b85"};exports.default=o;exports.icon=e;

package/src/community/components/icon/icon.module.scss.es.js

@@ -1,9 +0,0 @@
-const n = "icon-8081be27", o = {
-  icon: n,
-  "icon--block": "icon--block-4aa6379d",
-  "icon--inline": "icon--inline-5d045b85"
-};
-export {
-  o as default,
-  n as icon
-};

package/src/community/components/typography/heading/heading.cjs.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("react/jsx-runtime"),i=require("../text/text.cjs.js"),e=t=>{const{children:r,element:n="h1",...s}=t;return u.jsx(i.Text,{element:n,...s,children:r})};exports.Heading=e;exports.default=e;

package/src/community/components/typography/heading/heading.d.ts

@@ -1,11 +0,0 @@
-import { HeadingModifiers, TextProps } from '../text/text';
-export type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
-export type HeadingProps = Omit<TextProps, 'element'> & {
-    /**
-     * Semantic heading tag. h1-h6 are allowed values.
-     * @default h1
-     */
-    element?: Extract<TextProps['element'], HeadingModifiers>;
-};
-export declare const Heading: (props: HeadingProps) => import("react/jsx-runtime").JSX.Element;
-export default Heading;

package/src/community/components/typography/heading/heading.es.js

@@ -1,10 +0,0 @@
-import { jsx as n } from "react/jsx-runtime";
-import { Text as m } from "../text/text.es.js";
-const a = (e) => {
-  const { children: t, element: r = "h1", ...o } = e;
-  return /* @__PURE__ */ n(m, { element: r, ...o, children: t });
-};
-export {
-  a as Heading,
-  a as default
-};

package/src/community/components/typography/text/text.cjs.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("react/jsx-runtime"),p=require("../../../../../external/classnames/index.cjs.js"),f=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),s=e=>{const{getCurrentBreakpointProps:o}=f.useBreakpointProps(e.defaultServerBreakpoint),{children:i,className:u,tabIndex:a,element:c="p",modifiers:t,color:r,...l}=o(e,{tabIndex:e.id?-1:void 0}),n=typeof t=="string"?[t]:t,d=p.default(u,n==null?void 0:n.map(x=>`text-${x}`),{[`text-${r}`]:r});return m.jsx(c,{className:d,...l,tabIndex:a,children:i})};exports.Text=s;exports.default=s;

package/src/community/components/typography/text/text.d.ts

@@ -1,43 +0,0 @@
-import { BreakpointSupport } from '../../../helpers';
-import { HeadingLevel } from '../heading/heading';
-export type HeadingModifiers = `h${HeadingLevel}`;
-export type TextModifiers = HeadingModifiers | 'normal' | 'small' | 'bold' | 'thin' | 'italic' | 'center' | 'left' | 'right' | 'nowrap' | 'break-all' | 'break-word' | 'break-spaces' | 'uppercase' | 'lowercase' | 'capitalize' | 'capitalize-first' | 'inline-block' | 'inline' | 'line-normal' | 'line-condensed';
-export type TextColor = 'default' | 'primary' | 'muted' | 'subtle' | 'disabled' | 'inverted' | 'positive' | 'important' | 'warning';
-export type TextElement = 'div' | 'p' | 'span' | 'li' | HeadingModifiers;
-type TextBreakpointProps = {
-    /**
-     * Additional class.
-     */
-    className?: string;
-    /**
-     * Base element.
-     * @default p
-     */
-    element?: TextElement;
-    /**
-     * Single or multiple modifiers to change the text behavior.
-     */
-    modifiers?: TextModifiers[] | TextModifiers;
-    /**
-     * Which color text should be.
-     * Use 'positive', 'important' or 'warning' with caution, usually they should not be in application UI.
-     * @default default
-     */
-    color?: TextColor;
-};
-export interface TextProps extends BreakpointSupport<TextBreakpointProps> {
-    /**
-     * Children of the text.
-     */
-    children: React.ReactNode;
-    /**
-     * ID attribute.
-     */
-    id?: string;
-    /**
-     * Allows to focus the element
-     */
-    tabIndex?: number;
-}
-export declare const Text: (props: TextProps) => JSX.Element;
-export default Text;

package/src/community/components/typography/text/text.es.js

@@ -1,26 +0,0 @@
-import { jsx as d } from "react/jsx-runtime";
-import x from "../../../../../external/classnames/index.es.js";
-import { useBreakpointProps as f } from "../../../helpers/hooks/use-breakpoint-props.es.js";
-const N = (t) => {
-  const { getCurrentBreakpointProps: s } = f(t.defaultServerBreakpoint), {
-    children: n,
-    className: a,
-    tabIndex: m,
-    element: c = "p",
-    modifiers: e,
-    color: r,
-    ...i
-  } = s(t, {
-    tabIndex: t.id ? -1 : void 0
-    // when id is set on a text element we most likely want to jump to it with a reference link
-  }), o = typeof e == "string" ? [e] : e, l = x(
-    a,
-    o == null ? void 0 : o.map((p) => `text-${p}`),
-    { [`text-${r}`]: r }
-  );
-  return /* @__PURE__ */ d(c, { className: l, ...i, tabIndex: m, children: n });
-};
-export {
-  N as Text,
-  N as default
-};

package/src/tedi/providers/storybook-provider/storybook-provider.d.ts

@@ -1,10 +0,0 @@
-import { default as React } from 'react';
-interface TextRowProps {
-    desktopText: React.ReactNode;
-    mobileText: React.ReactNode;
-    isLink?: boolean;
-    noUnderline?: boolean;
-    className?: string;
-}
-export declare const TextRow: React.FC<TextRowProps>;
-export {};