@likec4/diagram 1.34.2 → 1.36.0

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconPlayerSkipBackFilled.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconPlayerSkipBackFilled = createReactComponent("filled", "player-skip-back-filled", "IconPlayerSkipBackFilled", [["path", { "d": "M19.496 4.136l-12 7a1 1 0 0 0 0 1.728l12 7a1 1 0 0 0 1.504 -.864v-14a1 1 0 0 0 -1.504 -.864z", "key": "svg-0" }], ["path", { "d": "M4 4a1 1 0 0 1 .993 .883l.007 .117v14a1 1 0 0 1 -1.993 .117l-.007 -.117v-14a1 1 0 0 1 1 -1z", "key": "svg-1" }]]);
-
-export { IconPlayerSkipBackFilled as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconPlayerSkipForwardFilled.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconPlayerSkipForwardFilled = createReactComponent("filled", "player-skip-forward-filled", "IconPlayerSkipForwardFilled", [["path", { "d": "M3 5v14a1 1 0 0 0 1.504 .864l12 -7a1 1 0 0 0 0 -1.728l-12 -7a1 1 0 0 0 -1.504 .864z", "key": "svg-0" }], ["path", { "d": "M20 4a1 1 0 0 1 .993 .883l.007 .117v14a1 1 0 0 1 -1.993 .117l-.007 -.117v-14a1 1 0 0 1 1 -1z", "key": "svg-1" }]]);
-
-export { IconPlayerSkipForwardFilled as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconPlayerStopFilled.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconPlayerStopFilled = createReactComponent("filled", "player-stop-filled", "IconPlayerStopFilled", [["path", { "d": "M17 4h-10a3 3 0 0 0 -3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3 -3v-10a3 3 0 0 0 -3 -3z", "key": "svg-0" }]]);
-
-export { IconPlayerStopFilled as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconRectangularPrism.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconRectangularPrism = createReactComponent("outline", "rectangular-prism", "IconRectangularPrism", [["path", { "d": "M21 14.008v-5.018a1.98 1.98 0 0 0 -1 -1.717l-4 -2.008a2.016 2.016 0 0 0 -2 0l-10 5.008c-.619 .355 -1 1.01 -1 1.718v5.018c0 .709 .381 1.363 1 1.717l4 2.008a2.016 2.016 0 0 0 2 0l10 -5.008c.619 -.355 1 -1.01 1 -1.718z", "key": "svg-0" }], ["path", { "d": "M9 21v-7.5", "key": "svg-1" }], ["path", { "d": "M9 13.5l11.5 -5.5", "key": "svg-2" }], ["path", { "d": "M3.5 11l5.5 2.5", "key": "svg-3" }]]);
-
-export { IconRectangularPrism as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconReorder.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconReorder = createReactComponent("outline", "reorder", "IconReorder", [["path", { "d": "M3 15m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z", "key": "svg-0" }], ["path", { "d": "M10 15m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z", "key": "svg-1" }], ["path", { "d": "M17 15m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z", "key": "svg-2" }], ["path", { "d": "M5 11v-3a3 3 0 0 1 3 -3h8a3 3 0 0 1 3 3v3", "key": "svg-3" }], ["path", { "d": "M16.5 8.5l2.5 2.5l2.5 -2.5", "key": "svg-4" }]]);
-
-export { IconReorder as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconRouteOff.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconRouteOff = createReactComponent("outline", "route-off", "IconRouteOff", [["path", { "d": "M6 19m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-0" }], ["path", { "d": "M18 5m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-1" }], ["path", { "d": "M12 19h4.5c.71 0 1.372 -.212 1.924 -.576m1.545 -2.459a3.5 3.5 0 0 0 -3.469 -3.965h-.499m-4 0h-3.501a3.5 3.5 0 0 1 -2.477 -5.972m2.477 -1.028h3.5", "key": "svg-2" }], ["path", { "d": "M3 3l18 18", "key": "svg-3" }]]);
-
-export { IconRouteOff as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconSearch.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconSearch = createReactComponent("outline", "search", "IconSearch", [["path", { "d": "M10 10m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0", "key": "svg-0" }], ["path", { "d": "M21 21l-6 -6", "key": "svg-1" }]]);
-
-export { IconSearch as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconSelector.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconSelector = createReactComponent("outline", "selector", "IconSelector", [["path", { "d": "M8 9l4 -4l4 4", "key": "svg-0" }], ["path", { "d": "M16 15l-4 4l-4 -4", "key": "svg-1" }]]);
-
-export { IconSelector as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconStack2.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconStack2 = createReactComponent("outline", "stack-2", "IconStack2", [["path", { "d": "M12 4l-8 4l8 4l8 -4l-8 -4", "key": "svg-0" }], ["path", { "d": "M4 12l8 4l8 -4", "key": "svg-1" }], ["path", { "d": "M4 16l8 4l8 -4", "key": "svg-2" }]]);
-
-export { IconStack2 as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconTarget.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconTarget = createReactComponent("outline", "target", "IconTarget", [["path", { "d": "M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-0" }], ["path", { "d": "M12 12m-5 0a5 5 0 1 0 10 0a5 5 0 1 0 -10 0", "key": "svg-1" }], ["path", { "d": "M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0", "key": "svg-2" }]]);
-
-export { IconTarget as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconTransform.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconTransform = createReactComponent("outline", "transform", "IconTransform", [["path", { "d": "M3 6a3 3 0 1 0 6 0a3 3 0 0 0 -6 0", "key": "svg-0" }], ["path", { "d": "M21 11v-3a2 2 0 0 0 -2 -2h-6l3 3m0 -6l-3 3", "key": "svg-1" }], ["path", { "d": "M3 13v3a2 2 0 0 0 2 2h6l-3 -3m0 6l3 -3", "key": "svg-2" }], ["path", { "d": "M15 18a3 3 0 1 0 6 0a3 3 0 0 0 -6 0", "key": "svg-3" }]]);
-
-export { IconTransform as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconUser.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconUser = createReactComponent("outline", "user", "IconUser", [["path", { "d": "M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0", "key": "svg-0" }], ["path", { "d": "M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2", "key": "svg-1" }]]);
-
-export { IconUser as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconX.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconX = createReactComponent("outline", "x", "IconX", [["path", { "d": "M18 6l-12 12", "key": "svg-0" }], ["path", { "d": "M6 6l12 12", "key": "svg-1" }]]);
-
-export { IconX as default };

package/dist/node_modules/.pnpm/@tabler_icons-react@3.31.0_react@19.1.0/node_modules/@tabler/icons-react/dist/esm/icons/IconZoomScan.js

@@ -1,13 +0,0 @@
-import createReactComponent from '../createReactComponent.js';
-
-/**
- * @license @tabler/icons-react v3.31.0 - MIT
- *
- * This source code is licensed under the MIT license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-var IconZoomScan = createReactComponent("outline", "zoom-scan", "IconZoomScan", [["path", { "d": "M4 8v-2a2 2 0 0 1 2 -2h2", "key": "svg-0" }], ["path", { "d": "M4 16v2a2 2 0 0 0 2 2h2", "key": "svg-1" }], ["path", { "d": "M16 4h2a2 2 0 0 1 2 2v2", "key": "svg-2" }], ["path", { "d": "M16 20h2a2 2 0 0 0 2 -2v-2", "key": "svg-3" }], ["path", { "d": "M8 11a3 3 0 1 0 6 0a3 3 0 0 0 -6 0", "key": "svg-4" }], ["path", { "d": "M16 16l-2.5 -2.5", "key": "svg-5" }]]);
-
-export { IconZoomScan as default };

package/dist/overlays/relationships-browser/custom/nodeTypes.d.ts

@@ -1,45 +0,0 @@
-import { NodeProps } from '../../../base';
-import { RelationshipsBrowserTypes } from '../_types';
-import { MemoExoticComponent } from 'react';
-import { Dimmed } from '../../../base/types.Base';
-import { ElementStyle, Color, Any, ViewId, Fqn, RichTextOrEmpty, IconUrl } from '@likec4/core';
-import { Tags } from '@likec4/core/types/_aux';
-export declare const ElementNode: MemoExoticComponent<(props: NodeProps<{
-    hovered?: boolean;
-    dimmed?: Dimmed;
-    width: number;
-    height: number;
-    style: ElementStyle;
-    color: Color;
-    title: string;
-    shape: "rectangle" | "person" | "browser" | "mobile" | "cylinder" | "storage" | "queue";
-    tags: Tags<Any>;
-    technology: string | null | undefined;
-    navigateTo: ViewId<string> | null | undefined;
-    column: RelationshipsBrowserTypes.Column;
-    fqn: Fqn;
-    icon: string | null;
-    ports: RelationshipsBrowserTypes.Ports;
-    existsInCurrentView: boolean;
-    description: RichTextOrEmpty;
-}, string>) => import("react/jsx-runtime").JSX.Element>;
-export declare const CompoundNode: MemoExoticComponent<(props: NodeProps<{
-    hovered?: boolean;
-    dimmed?: Dimmed;
-    style: ElementStyle;
-    color: Color;
-    title: string;
-    shape: "rectangle" | "person" | "browser" | "mobile" | "cylinder" | "storage" | "queue";
-    column: RelationshipsBrowserTypes.Column;
-    fqn: Fqn;
-    depth: number;
-    icon: IconUrl;
-    ports: RelationshipsBrowserTypes.Ports;
-    existsInCurrentView: boolean;
-}, string>) => import("react/jsx-runtime").JSX.Element>;
-export declare const EmptyNode: MemoExoticComponent<(props: NodeProps<RelationshipsBrowserTypes.EmptyNodeData, string>) => import("react/jsx-runtime").JSX.Element>;
-type ElementPortsProps = NodeProps<Pick<RelationshipsBrowserTypes.ElementNodeData, 'ports' | 'height'>>;
-export declare const ElementPorts: ({ data: { ports, height: h } }: ElementPortsProps) => import("react/jsx-runtime").JSX.Element;
-type CompoundPortsProps = NodeProps<Pick<RelationshipsBrowserTypes.CompoundNodeData, 'ports'>>;
-export declare const CompoundPorts: ({ data }: CompoundPortsProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/src/LikeC4CustomColors.tsx

@@ -1,85 +0,0 @@
-import {
-  type CustomColorDefinitions,
-  type ElementThemeColorValues,
-  type RelationshipThemeColorValues,
-  type ThemeColorValues,
-  nonexhaustive,
-} from '@likec4/core'
-import { useMantineStyleNonce } from '@mantine/core'
-import { memo, useState } from 'react'
-import { entries, isEmpty } from 'remeda'
-import { useUpdateEffect } from './hooks'
-import { useLikeC4Specification } from './likec4model/useLikeC4Model'
-
-interface LikeC4CustomColorsProperties {
-  customColors: CustomColorDefinitions
-}
-function keyToCssVar(key: keyof RelationshipThemeColorValues | keyof ElementThemeColorValues): string {
-  switch (key) {
-    case 'lineColor':
-      return 'line'
-    case 'labelBgColor':
-      return 'label-bg'
-    case 'labelColor':
-      return 'label'
-    case 'fill':
-      return 'fill'
-    case 'stroke':
-      return 'stroke'
-    case 'hiContrast':
-      return 'hi-contrast'
-    case 'loContrast':
-      return 'lo-contrast'
-    default:
-      nonexhaustive(key)
-  }
-}
-
-function toStyle(name: String, colors: ThemeColorValues): String {
-  const darken = (color: string) => `color-mix(in srgb, ${color} 80%, black)`
-  return `
-:where([data-likec4-color=${name}]) {
-  --colors-likec4-palette-hi-contrast: ${colors.elements.hiContrast};
-  --colors-likec4-palette-lo-contrast: ${colors.elements.loContrast};
-  --colors-likec4-palette-fill: ${colors.elements.fill};
-  --colors-likec4-palette-stroke: ${colors.elements.stroke};
-  --colors-likec4-relation-stroke: ${colors.relationships.lineColor};
-  --colors-likec4-relation-stroke-selected: color-mix(in srgb, ${colors.relationships.lineColor}, var(--colors-likec4-mix-color) 20%);
-  --colors-likec4-relation-label: ${colors.relationships.labelColor};
-  --colors-likec4-relation-label-bg: ${colors.relationships.labelBgColor};
-}
-:where(.likec4-compound-node[data-likec4-color=${name}]) {
-  --colors-likec4-palette-fill: ${darken(colors.elements.fill)};
-  --colors-likec4-palette-stroke: ${darken(colors.elements.stroke)};
-}
-  `
-}
-
-function generateCustomColorStyles(customColors: CustomColorDefinitions) {
-  return entries(customColors)
-    .map(([name, color]) => toStyle(name, color))
-    .join('\n')
-    .trim()
-}
-
-export const LikeC4CustomColors = memo(() => {
-  const customColors = useLikeC4Specification().customColors ?? {}
-  const [styles, setStyles] = useState(() => generateCustomColorStyles(customColors))
-
-  useUpdateEffect(() => {
-    setStyles(generateCustomColorStyles(customColors))
-  }, [customColors])
-
-  const nonce = useMantineStyleNonce()?.()
-
-  if (isEmpty(customColors)) {
-    return null
-  }
-
-  return (
-    <>
-      <style type="text/css" dangerouslySetInnerHTML={{ __html: styles }} nonce={nonce} />
-    </>
-  )
-})
-LikeC4CustomColors.displayName = 'LikeC4CustomColors'

package/src/base/primitives/element/ElementTitle.css.ts

@@ -1,206 +0,0 @@
-import { css, sva } from '@likec4/styles/css'
-
-export const iconSize = '--icon-size'
-
-const title = css.raw({
-  textStyle: 'likec4.node.primary',
-  flex: '0 0 auto',
-  textAlign: 'center',
-  color: 'likec4.palette.hiContrast',
-})
-
-const description = css.raw({
-  flexGrow: '0',
-  flexShrink: '1',
-
-  textStyle: 'likec4.node.secondary',
-  color: 'likec4.palette.loContrast',
-  textAlign: 'center',
-  textOverflow: 'ellipsis',
-  overflow: 'hidden',
-  _shapeSizeXs: {
-    display: 'none',
-  },
-  _smallZoom: {
-    display: 'none',
-  },
-})
-
-const technology = css.raw({
-  flex: '0 0 auto',
-  textStyle: 'likec4.node.secondary',
-  color: 'likec4.palette.loContrast',
-  fontSize: `calc(var(--likec4-text-size) * 0.635)`,
-  lineHeight: 1.125,
-  textAlign: 'center',
-  textWrap: 'balance',
-  opacity: 0.92,
-  _whenHovered: {
-    opacity: 1,
-  },
-  _shapeSizeXs: {
-    display: 'none',
-  },
-  _shapeSizeSm: {
-    display: 'none',
-  },
-  _smallZoom: {
-    display: 'none',
-  },
-})
-
-const varIconSize = `var(${iconSize})`
-export const elementIcon = css({
-  flex: `0 0 ${varIconSize}`,
-  height: varIconSize,
-  width: varIconSize,
-  display: 'flex',
-  alignSelf: 'flex-start',
-  alignItems: 'center',
-  justifyContent: 'center',
-  mixBlendMode: {
-    base: 'hard-light',
-    _reduceGraphicsOnPan: 'normal',
-  },
-  [`& svg, & img`]: {
-    width: '100%',
-    height: 'auto',
-    maxHeight: '100%',
-    pointerEvents: 'none',
-    filter: {
-      base: [
-        'drop-shadow(0 0 3px rgb(0 0 0 / 12%))',
-        'drop-shadow(0 1px 8px rgb(0 0 0 / 8%))',
-        'drop-shadow(1px 1px 16px rgb(0 0 0 / 3%))',
-      ],
-      _reduceGraphicsOnPan: 'none',
-    },
-  },
-  [`& img`]: {
-    objectFit: 'contain',
-  },
-})
-
-export const elementTitle = sva({
-  slots: ['root', 'textContainer', 'title', 'description', 'technology'],
-  base: {
-    root: {
-      position: 'relative',
-      flex: '1',
-      height: 'fit-content',
-      width: 'fit-content',
-      maxHeight: '100%',
-      maxWidth: '100%',
-      margin: '0 auto',
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'center',
-      flexDirection: 'row',
-      paddingTop: 'var(--likec4-spacing)',
-      paddingBottom: 'var(--likec4-spacing)',
-      paddingLeft: 'calc(var(--likec4-spacing) + 8px)',
-      paddingRight: 'calc(var(--likec4-spacing) + 8px)',
-      overflow: 'hidden',
-      pointerEvents: 'none',
-      gap: '12px',
-      _shapeQueue: {
-        paddingLeft: '46px',
-        paddingRight: '16px',
-      },
-      _shapeMobile: {
-        paddingLeft: '46px',
-        paddingRight: '16px',
-      },
-      _shapeCylinder: {
-        paddingTop: '30px',
-      },
-      _shapeStorage: {
-        paddingTop: '30px',
-      },
-      _shapeBrowser: {
-        paddingTop: '32px',
-        paddingBottom: '28px',
-      },
-
-      _shapeSizeXs: {
-        [iconSize]: '24px',
-      },
-      _shapeSizeSm: {
-        [iconSize]: '36px',
-      },
-      _shapeSizeMd: {
-        [iconSize]: '60px',
-      },
-      _shapeSizeLg: {
-        [iconSize]: '82px',
-        gap: '16px',
-      },
-      _shapeSizeXl: {
-        [iconSize]: '90px',
-        gap: '16px',
-      },
-    },
-    textContainer: {
-      height: 'fit-content',
-      width: 'fit-content',
-      maxHeight: '100%',
-      maxWidth: '100%',
-      flex: '0 1 auto',
-      display: 'flex',
-      flexDirection: 'column',
-      alignItems: 'stretch',
-      justifyContent: 'center',
-      flexWrap: 'nowrap',
-      overflow: 'hidden',
-      gap: '8px',
-    },
-    title,
-    description,
-    technology,
-  },
-  variants: {
-    hasIcon: {
-      false: {},
-      true: {
-        root: {
-          gap: '16px',
-        },
-        textContainer: {
-          minWidth: `calc(50% + ${varIconSize})`,
-          alignItems: 'flex-start',
-        },
-        title: {
-          textAlign: 'left',
-        },
-        description: {
-          textAlign: 'left',
-        },
-        technology: {
-          textAlign: 'left',
-        },
-      },
-    },
-    hasDescription: {
-      false: {},
-      true: {},
-    },
-    hasTechnology: {
-      false: {},
-      true: {},
-    },
-  },
-  compoundVariants: [
-    {
-      hasDescription: true,
-      hasTechnology: true,
-      css: {
-        textContainer: {
-          gap: '6px',
-        },
-      },
-    },
-  ],
-  defaultVariants: {
-    hasIcon: false,
-  },
-})