@luxonis/depthai-pipeline-lib 1.4.8 → 1.4.10

package/dist/src/components/Node.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import type { NodeProps } from '@xyflow/react';
-import type { ParsedNode } from '../services/pipeline.js';
-export type PipelineNodeProps = NodeProps<ParsedNode>;
-export declare const PipelineNode: React.FC<PipelineNodeProps>;

package/dist/src/components/Node.js

@@ -1,42 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Handle, Position } from '@xyflow/react';
-import { clsx } from '@luxonis/common-fe-components/helpers';
-import { Button, Flex, HelpIcon, Label, SubLabel } from '@luxonis/common-fe-components';
-import { css } from '../styled-system/css/css.mjs';
-const DOCS_BASE_URL = `https://docs.luxonis.com/software/depthai-components/nodes/`;
-const NodeHandles = props => {
-    const { handles, type } = props;
-    return (_jsx(Flex, { full: true, direction: "column", align: type === 'input' ? 'start' : 'end', children: handles.map(({ type: handleType, id, blocking, queueSize, name }) => (_jsxs(Flex, { position: "relative", align: "end", direction: handleType === 'input' ? 'row' : 'row-reverse', children: [_jsx(Handle, { type: handleType === 'input' ? 'target' : 'source', position: handleType === 'input' ? Position.Left : Position.Right, id: name, isConnectable: false, className: css({
-                        width: 'custom.handle.dot!',
-                        height: 'custom.handle.dot!',
-                        backgroundColor: blocking ? 'dark.warning!' : 'dark.success!',
-                        border: 'none!',
-                    }) }), _jsx(SubLabel, { className: css({
-                        ...(type === 'input' //
-                            ? { 'marginLeft': 'xs' }
-                            : { 'marginRight': 'xs' }),
-                    }), text: type === 'input' ? `[${queueSize}] ${name}` : name, break: "none" })] }, id))) }));
-};
-export const PipelineNode = props => {
-    const { data: node } = props;
-    return (_jsxs(Flex, { direction: "column", className: css({
-            'minWidth': 'container.smaller.xxs',
-            'border': 'base',
-            'rounded': 'common',
-            'backgroundColor': 'white',
-            '&:hover .node-help-icon': {
-                color: 'text.normal',
-            },
-        }), children: [_jsxs(Flex, { align: "center", justify: "space-between", gap: "xs", className: css({
-                    width: 'full',
-                    backgroundColor: 'light.gray',
-                    roundedTop: 'common',
-                }), children: [_jsx("span", { className: css({
-                            width: 'icon.sm',
-                            height: 'icon.sm',
-                        }) }), _jsx(Label, { text: node.name, color: "unset" }), _jsx(Button, { variant: "ghost", color: "transparent", icon: HelpIcon, onClick: () => window.open(DOCS_BASE_URL, '_blank'), className: clsx('node-help-icon', css({
-                            width: 'auto',
-                            height: 'auto',
-                            right: 'xs',
-                        })) })] }), _jsxs(Flex, { gap: "sm", paddingY: "xs", children: [_jsx(NodeHandles, { type: "input", handles: node.handles.input }), _jsx(NodeHandles, { type: "output", handles: node.handles.output })] })] }));
-};

package/dist/src/components/PipelineCanvas.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import type { FlexProps } from '@luxonis/common-fe-components';
-import type { Pipeline } from '../services/pipeline.js';
-export type PipelineCanvasProps = FlexProps & {
-    pipeline: Pipeline | null;
-};
-export declare const PipelineCanvas: React.FC<PipelineCanvasProps>;

package/dist/src/components/PipelineCanvas.js

@@ -1,56 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { ReactFlow, ReactFlowProvider, useEdgesState, useNodesState, useReactFlow, } from '@xyflow/react';
-import { Flex, Header } from '@luxonis/common-fe-components';
-import Dagre from '@dagrejs/dagre';
-import { PipelineNode } from './Node.js';
-const getLayoutedElements = (nodes, edges) => {
-    const graph = new Dagre.graphlib.Graph().setDefaultEdgeLabel(() => ({}));
-    graph.setGraph({ rankdir: 'LR' });
-    for (const edge of edges) {
-        graph.setEdge(edge.source, edge.target);
-    }
-    for (const node of nodes) {
-        graph.setNode(node.id, {
-            ...node,
-            width: node.measured?.width ?? 200,
-            height: node.measured?.height ?? 100,
-        });
-    }
-    Dagre.layout(graph);
-    return {
-        nodes: nodes.map((node) => {
-            const position = graph.node(node.id);
-            // Shift Dagre anchor (center) to React Flow anchor (top left)
-            const x = position.x - (node.measured?.width ?? 200) / 2;
-            const y = position.y - (node.measured?.height ?? 100) / 2;
-            return { ...node, position: { x, y } };
-        }),
-        edges,
-    };
-};
-const PipelineCanvasBody = ({ pipeline, ...flexProps }) => {
-    const { fitView, setViewport, getViewport } = useReactFlow();
-    const autoArrangeRef = React.useRef(true);
-    const [nodes, setNodes, onNodesChange] = useNodesState([]);
-    const [edges, setEdges] = useEdgesState([]);
-    React.useEffect(() => {
-        if (!autoArrangeRef.current) {
-            return;
-        }
-        const layouted = getLayoutedElements(pipeline?.nodes ?? [], pipeline?.edges ?? []);
-        setNodes([...layouted.nodes]);
-        setEdges([...layouted.edges]);
-        window.requestAnimationFrame(async () => {
-            await fitView({ minZoom: 1 });
-            const viewport = getViewport();
-            await setViewport({
-                x: 50,
-                y: viewport.y,
-                zoom: 1,
-            });
-        });
-    }, [fitView, getViewport, pipeline?.edges, pipeline?.nodes, setEdges, setNodes, setViewport]);
-    return (_jsxs(Flex, { align: "center", justify: "center", full: true, height: "container.xs", rounded: "common", border: "base", ...flexProps, children: [!pipeline && _jsx(Header, { text: "Loading pipeline..." }), pipeline && (_jsx(ReactFlow, { nodes: nodes, edges: edges, onNodeDragStart: () => (autoArrangeRef.current = false), onNodesChange: onNodesChange, fitView: true, nodeTypes: { generic: PipelineNode } }))] }));
-};
-export const PipelineCanvas = props => (_jsx(ReactFlowProvider, { children: _jsx(PipelineCanvasBody, { ...props }) }));

package/dist/src/index.d.ts

@@ -1,4 +0,0 @@
-export { parsePipeline } from './services/pipeline.js';
-export type { Pipeline, RawPipelinePayload } from './services/pipeline.js';
-export { PipelineCanvas } from './components/PipelineCanvas.js';
-export type { PipelineCanvasProps } from './components/PipelineCanvas.js';

package/dist/src/index.js

@@ -1,2 +0,0 @@
-export { parsePipeline } from './services/pipeline.js';
-export { PipelineCanvas } from './components/PipelineCanvas.js';

package/dist/src/services/pipeline.d.ts

@@ -1,51 +0,0 @@
-import type { Edge, Node } from '@xyflow/react';
-export type RawPipelineNodeIO = [
-    [
-        string,
-        string
-    ],
-    {
-        id: number;
-        name: string;
-        type: 0 | 3;
-        blocking: boolean;
-        queueSize: number;
-    }
-];
-export type RawPipelineNode = {
-    id: number;
-    ioInfo: RawPipelineNodeIO[];
-    name: string;
-};
-export type RawPipelineEdge = {
-    node1Id: number;
-    node1Output: string;
-    node2Id: number;
-    node2Input: string;
-};
-export type RawPipelinePayload = {
-    pipeline: RawPipeline;
-};
-export type RawPipeline = {
-    connections: RawPipelineEdge[];
-    nodes: [number, RawPipelineNode][];
-};
-export type Pipeline = {
-    nodes: ParsedNode[];
-    edges: Edge[];
-};
-export type ParsedHandle = {
-    id: number;
-    name: string;
-    type: 'input' | 'output';
-    blocking: boolean;
-    queueSize: number;
-};
-export type ParsedNode = Node<{
-    name: string;
-    handles: {
-        input: ParsedHandle[];
-        output: ParsedHandle[];
-    };
-}>;
-export declare function parsePipeline(rawPayload: RawPipelinePayload): Pipeline;

package/dist/src/services/pipeline.js

@@ -1,40 +0,0 @@
-function parseHandles(handles) {
-    const parsedHandles = {
-        input: [],
-        output: [],
-    };
-    for (const [_, handle] of handles) {
-        const type = handle.type === 3 ? 'input' : 'output';
-        const parsed = {
-            id: handle.id,
-            name: handle.name,
-            type,
-            blocking: handle.blocking,
-            queueSize: handle.queueSize,
-        };
-        parsedHandles[type].push(parsed);
-    }
-    return parsedHandles;
-}
-export function parsePipeline(rawPayload) {
-    const { pipeline } = rawPayload;
-    const nodes = pipeline.nodes
-        .filter(([_, node]) => pipeline.connections.some(connection => connection.node1Id === node.id || connection.node2Id === node.id))
-        .map(([id, node]) => ({
-        type: 'generic',
-        id: id.toString(),
-        position: { x: 0, y: 0 },
-        data: {
-            name: node.name,
-            handles: parseHandles(node.ioInfo),
-        },
-    })) ?? [];
-    const edges = pipeline.connections.map(connection => ({
-        id: `${connection.node1Id}-${connection.node2Id}`,
-        source: connection.node1Id.toString(),
-        target: connection.node2Id.toString(),
-        sourceHandle: connection.node1Output,
-        targetHandle: connection.node2Input,
-    })) ?? [];
-    return { nodes, edges };
-}

package/dist/src/styled-system/chunks/src__components__Node.css

@@ -1,195 +0,0 @@
-@layer utilities {
-  .bg_dark\.warning\! {
-    background-color: var(--colors-dark-warning) !important
-    }
-
-  .bg_dark\.success\! {
-    background-color: var(--colors-dark-success) !important
-    }
-
-  .w_custom\.handle\.dot\! {
-    width: var(--sizes-custom-handle-dot) !important
-    }
-
-  .h_custom\.handle\.dot\! {
-    height: var(--sizes-custom-handle-dot) !important
-    }
-
-  .border_none\! {
-    border: var(--borders-none) !important
-    }
-
-  .ml_xs {
-    margin-left: var(--spacing-xs)
-    }
-
-  .mr_xs {
-    margin-right: var(--spacing-xs)
-    }
-
-  .min-w_container\.smaller\.xxs {
-    min-width: var(--sizes-container-smaller-xxs)
-    }
-
-  .border_base {
-    border: var(--borders-base)
-    }
-
-  .rounded_common {
-    border-radius: var(--radii-common)
-    }
-
-  .bg_white {
-    background-color: var(--colors-white)
-    }
-
-  .w_full {
-    width: var(--sizes-full)
-    }
-
-  .bg_light\.gray {
-    background-color: var(--colors-light-gray)
-    }
-
-  .rounded-t_common {
-    border-top-left-radius: var(--radii-common);
-    border-top-right-radius: var(--radii-common)
-    }
-
-  .w_icon\.sm {
-    width: var(--sizes-icon-sm)
-    }
-
-  .h_icon\.sm {
-    height: var(--sizes-icon-sm)
-    }
-
-  .w_auto {
-    width: auto
-    }
-
-  .h_auto {
-    height: auto
-    }
-
-  .right_xs {
-    right: var(--spacing-xs)
-    }
-
-  .text_unset {
-    color: unset
-    }
-
-  .text_transparent {
-    color: var(--colors-transparent)
-    }
-
-  .items_start {
-    align-items: start
-    }
-
-  .flex_row {
-    flex-direction: row
-    }
-
-  .flex_row-reverse {
-    flex-direction: row-reverse
-    }
-
-  .items_end {
-    align-items: end
-    }
-
-  .pos_relative {
-    position: relative
-    }
-
-  .flex_column {
-    flex-direction: column
-    }
-
-  .items_center {
-    align-items: center
-    }
-
-  .justify_space-between {
-    justify-content: space-between
-    }
-
-  .gap_xs {
-    gap: var(--spacing-xs)
-    }
-
-  .d_flex {
-    display: flex
-    }
-
-  .gap_sm {
-    gap: var(--spacing-sm)
-    }
-
-  .py_xs {
-    padding-block: var(--spacing-xs)
-    }
-    .\[\&\:hover_\.node-help-icon\]\:text_text\.normal:hover .node-help-icon {
-      color: var(--colors-text-normal)
-        }
-}
-
-@layer recipes {
-    .button--variant_ghost:is(:hover, [data-hover]) {
-      background: var(--colors-accent);
-      color: var(--colors-accent-foreground)
-        }
-
-  .button--size_default {
-    height: var(--sizes-10);
-    padding-inline: var(--spacing-4);
-    padding-block: var(--spacing-2)
-    }
-
-  @layer _base {
-    .label {
-      font-size: 0.875rem;
-      line-height: var(--line-heights-none);
-      font-weight: var(--font-weights-medium);
-        }
-      .peer:is(:disabled, [disabled], [data-disabled]) ~ .label {
-        cursor: not-allowed;
-        opacity: 0.7
-            }
-    }
-
-  @layer _base {
-    .button {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      border-radius: var(--radii-md);
-      font-size: 0.875rem;
-      line-height: 1.25rem;
-      font-weight: var(--font-weights-medium);
-      transition-property: var(--transition-prop, color, background-color, border-color, outline-color, text-decoration-color, fill, stroke);
-      transition-timing-function: var(--transition-easing, cubic-bezier(0.4, 0, 0.2, 1));
-      transition-duration: var(--transition-duration, 150ms);
-      cursor: pointer;
-      --shadow-panda-ring-offset-color: var(--colors-background);
-      gap: var(--spacing-2);
-        }
-      .button:is(:disabled, [disabled], [data-disabled]) {
-        pointer-events: none;
-        opacity: 50%
-            }
-      .button:is(:focus-visible, [data-focus-visible]) {
-        outline: 2px solid transparent;
-        outline-offset: 2px;
-        --shadow-panda-ring-offset-shadow: var(--shadow-panda-ring-inset,) 0 0 0 var(--shadow-panda-ring-offset-width, 0px) var(--shadow-panda-ring-offset-color);
-        --shadow-panda-ring-shadow: var(--shadow-panda-ring-inset,) 0 0 0 calc(2px + var(--shadow-panda-ring-offset-width, 0px)) var(--shadow-panda-ring-color);
-        box-shadow: var(--shadow-panda-ring-offset-shadow),var(--shadow-panda-ring-shadow),var(--shadow-panda-base-shadow,0 0 #0000);
-        --shadow-panda-ring-color: var(--colors-ring)
-    ;
-        --shadow-panda-ring-offset-width: 2px
-    
-            }
-    }
-}

package/dist/src/styled-system/chunks/src__components__PipelineCanvas.css

@@ -1,25 +0,0 @@
-@layer utilities {
-  .d_flex {
-    display: flex
-    }
-
-  .items_center {
-    align-items: center
-    }
-
-  .justify_center {
-    justify-content: center
-    }
-
-  .h_container\.xs {
-    height: var(--sizes-container-xs)
-    }
-
-  .rounded_common {
-    border-radius: var(--radii-common)
-    }
-
-  .border_base {
-    border: var(--borders-base)
-    }
-}

package/dist/src/styled-system/css/conditions.mjs

@@ -1,34 +0,0 @@
-import { withoutSpace } from '../helpers.mjs';
-
-const conditionsStr = "_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_default,_optional,_open,_fullscreen,_loading,_currentPage,_currentStep,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,sm,smOnly,smDown,md,mdOnly,mdDown,lg,lgOnly,lgDown,2lg,2lgOnly,2lgDown,xl,xlOnly,xlDown,2xl,2xlOnly,2xlDown,smToMd,smToLg,smTo2lg,smToXl,smTo2xl,mdToLg,mdTo2lg,mdToXl,mdTo2xl,lgTo2lg,lgToXl,lgTo2xl,2lgToXl,2lgTo2xl,xlTo2xl,base"
-const conditions = new Set(conditionsStr.split(','))
-
-export function isCondition(value){
-  return conditions.has(value) || /^@|&|&$/.test(value)
-}
-
-const underscoreRegex = /^_/
-const conditionsSelectorRegex = /&|@/
-
-export function finalizeConditions(paths){
-  return paths.map((path) => {
-    if (conditions.has(path)){
-      return path.replace(underscoreRegex, '')
-    }
-
-    if (conditionsSelectorRegex.test(path)){
-      return `[${withoutSpace(path.trim())}]`
-    }
-
-    return path
-  })}
-
-  export function sortConditions(paths){
-    return paths.sort((a, b) => {
-      const aa = isCondition(a)
-      const bb = isCondition(b)
-      if (aa && !bb) return 1
-      if (!aa && bb) return -1
-      return 0
-    })
-  }

package/dist/src/styled-system/css/css.d.mts

@@ -1,9 +0,0 @@
-/* eslint-disable */
-import type { SystemStyleObject } from '../types/index.d.mts';
-
-interface CssFunction {
-  (...styles: Array<SystemStyleObject | undefined | null | false>): string
-  raw: (...styles: Array<SystemStyleObject | undefined | null | false>) => SystemStyleObject
-}
-
-export declare const css: CssFunction;

package/dist/src/styled-system/css/css.mjs

@@ -1,44 +0,0 @@
-import { createCss, createMergeCss, hypenateProperty, withoutSpace } from '../helpers.mjs';
-import { sortConditions, finalizeConditions } from './conditions.mjs';
-
-const utilities = "aspectRatio:aspect,boxDecorationBreak:decoration,zIndex:z,boxSizing:box,objectPosition:object,objectFit:object,overscrollBehavior:overscroll,overscrollBehaviorX:overscroll-x,overscrollBehaviorY:overscroll-y,position:pos/1,top:top,left:left,insetInline:inset-x,insetBlock:inset-y,inset:inset,insetBlockEnd:inset-b,insetBlockStart:inset-t,insetInlineEnd:end/insetEnd/1,insetInlineStart:start/insetStart/1,right:right,bottom:bottom,insetX:inset-x,insetY:inset-y,float:float,visibility:vis,display:d,hideFrom:hide,hideBelow:show,flexBasis:basis,flex:flex,flexDirection:flex/flexDir,flexGrow:grow,flexShrink:shrink,gridTemplateColumns:grid-cols,gridTemplateRows:grid-rows,gridColumn:col-span,gridRow:row-span,gridColumnStart:col-start,gridColumnEnd:col-end,gridAutoFlow:grid-flow,gridAutoColumns:auto-cols,gridAutoRows:auto-rows,gap:gap,gridGap:gap,gridRowGap:gap-x,gridColumnGap:gap-y,rowGap:gap-x,columnGap:gap-y,justifyContent:justify,alignContent:content,alignItems:items,alignSelf:self,padding:p/1,paddingLeft:pl/1,paddingRight:pr/1,paddingTop:pt/1,paddingBottom:pb/1,paddingBlock:py/1/paddingY,paddingBlockEnd:pb,paddingBlockStart:pt,paddingInline:px/paddingX/1,paddingInlineEnd:pe/1/paddingEnd,paddingInlineStart:ps/1/paddingStart,marginLeft:ml/1,marginRight:mr/1,marginTop:mt/1,marginBottom:mb/1,margin:m/1,marginBlock:my/1/marginY,marginBlockEnd:mb,marginBlockStart:mt,marginInline:mx/1/marginX,marginInlineEnd:me/1/marginEnd,marginInlineStart:ms/1/marginStart,outlineWidth:ring/ringWidth,outlineColor:ring/ringColor,outline:ring/1,outlineOffset:ring/ringOffset,divideX:divide-x,divideY:divide-y,divideColor:divide,divideStyle:divide,width:w/1,inlineSize:w,minWidth:min-w/minW,minInlineSize:min-w,maxWidth:max-w/maxW,maxInlineSize:max-w,height:h/1,blockSize:h,minHeight:min-h/minH,minBlockSize:min-h,maxHeight:max-h/maxH,maxBlockSize:max-b,color:text,fontFamily:font,fontSize:fs,fontWeight:font,fontSmoothing:smoothing,fontVariantNumeric:numeric,letterSpacing:tracking/1,lineHeight:leading/1,textAlign:text,textDecoration:text-decor,textDecorationColor:text-decor,textEmphasisColor:text-emphasis,textDecorationStyle:decoration,textDecorationThickness:decoration,textUnderlineOffset:underline-offset,textTransform:text,textIndent:indent,textShadow:text-shadow,textOverflow:text,verticalAlign:align,wordBreak:break,textWrap:text,truncate:truncate,lineClamp:clamp,listStyleType:list,listStylePosition:list,listStyleImage:list-img,backgroundPosition:bg/bgPosition,backgroundPositionX:bg-x/bgPositionX,backgroundPositionY:bg-y/bgPositionY,backgroundAttachment:bg/bgAttachment,backgroundClip:bg-clip/bgClip,background:bg/1,backgroundColor:bg/bgColor,backgroundOrigin:bg-origin/bgOrigin,backgroundImage:bg-img/bgImage,backgroundRepeat:bg-repeat/bgRepeat,backgroundBlendMode:bg-blend/bgBlendMode,backgroundSize:bg/bgSize,backgroundGradient:bg-gradient/bgGradient,textGradient:text-gradient,gradientFrom:from,gradientTo:to,gradientVia:via,borderRadius:rounded/1,borderTopLeftRadius:rounded-tl/roundedTopLeft,borderTopRightRadius:rounded-tr/roundedTopRight,borderBottomRightRadius:rounded-br/roundedBottomRight,borderBottomLeftRadius:rounded-bl/roundedBottomLeft,borderTopRadius:rounded-t/roundedTop,borderRightRadius:rounded-r/roundedRight,borderBottomRadius:rounded-b/roundedBottom,borderLeftRadius:rounded-l/roundedLeft,borderStartStartRadius:rounded-ss/roundedStartStart,borderStartEndRadius:rounded-se/roundedStartEnd,borderStartRadius:rounded-s/roundedStart,borderEndStartRadius:rounded-es/roundedEndStart,borderEndEndRadius:rounded-ee/roundedEndEnd,borderEndRadius:rounded-e/roundedEnd,border:border,borderColor:border,borderInline:border-x/borderX,borderInlineWidth:border-x/borderXWidth,borderInlineColor:border-x/borderXColor,borderBlock:border-y/borderY,borderBlockWidth:border-y/borderYWidth,borderBlockColor:border-y/borderYColor,borderLeft:border-l,borderLeftColor:border-l,borderInlineStart:border-s/borderStart,borderInlineStartWidth:border-s/borderStartWidth,borderInlineStartColor:border-s/borderStartColor,borderRight:border-r,borderRightColor:border-r,borderInlineEnd:border-e/borderEnd,borderInlineEndWidth:border-e/borderEndWidth,borderInlineEndColor:border-e/borderEndColor,borderTop:border-t,borderTopColor:border-t,borderBottom:border-b,borderBottomColor:border-b,borderBlockEnd:border-be,borderBlockEndColor:border-be,borderBlockStart:border-bs,borderBlockStartColor:border-bs,boxShadow:shadow/1,boxShadowColor:shadow/shadowColor,mixBlendMode:mix-blend,filter:filter,brightness:brightness,contrast:contrast,grayscale:grayscale,hueRotate:hue-rotate,invert:invert,saturate:saturate,sepia:sepia,dropShadow:drop-shadow,blur:blur,backdropFilter:backdrop,backdropBlur:backdrop_blur,backdropBrightness:backdrop-brightness,backdropContrast:backdrop-contrast,backdropGrayscale:backdrop-grayscale,backdropHueRotate:backdrop-hue-rotate,backdropInvert:backdrop-invert,backdropOpacity:backdrop-opacity,backdropSaturate:backdrop-saturate,backdropSepia:backdrop-sepia,borderCollapse:border,borderSpacing:border-spacing,borderSpacingX:border-spacing-x,borderSpacingY:border-spacing-y,tableLayout:table,transitionTimingFunction:ease,transitionDelay:delay,transitionDuration:duration,transitionProperty:transition-prop,transition:transition,animation:animation,animationName:animation-name,animationDelay:animation-delay,transformOrigin:origin,scale:scale,scaleX:scale-x,scaleY:scale-y,translate:translate,translateX:translate_x/x,translateY:translate_y/y,accentColor:accent,caretColor:caret,scrollBehavior:scroll,scrollbar:scrollbar,scrollMargin:scroll-m,scrollMarginX:scroll-mx,scrollMarginY:scroll-my,scrollMarginLeft:scroll-ml,scrollMarginRight:scroll-mr,scrollMarginTop:scroll-mt,scrollMarginBottom:scroll-mb,scrollMarginBlock:scroll-my,scrollMarginBlockEnd:scroll-mb,scrollMarginBlockStart:scroll-mt,scrollMarginInline:scroll-mx,scrollMarginInlineEnd:scroll-me,scrollMarginInlineStart:scroll-ms,scrollPadding:scroll-p,scrollPaddingBlock:scroll-pb,scrollPaddingBlockStart:scroll-pt,scrollPaddingBlockEnd:scroll-pb,scrollPaddingInline:scroll-px,scrollPaddingInlineEnd:scroll-pe,scrollPaddingInlineStart:scroll-ps,scrollPaddingX:scroll-px,scrollPaddingY:scroll-py,scrollPaddingLeft:scroll-pl,scrollPaddingRight:scroll-pr,scrollPaddingTop:scroll-pt,scrollPaddingBottom:scroll-pb,scrollSnapAlign:snap,scrollSnapStop:snap,scrollSnapType:snap,scrollSnapStrictness:strictness,scrollSnapMargin:snap-m,scrollSnapMarginTop:snap-mt,scrollSnapMarginBottom:snap-mb,scrollSnapMarginLeft:snap-ml,scrollSnapMarginRight:snap-mr,touchAction:touch,userSelect:select,fill:fill,stroke:stroke,srOnly:sr,debug:debug,appearance:appearance,backfaceVisibility:backface,clipPath:clip-path,hyphens:hyphens,mask:mask,maskImage:mask-image,maskSize:mask-size,textSizeAdjust:text-size-adjust,animateIn:animate_in,animateOut:animate_out,fadeIn:animate_fade_in,fadeOut:animate_fade_out,zoomIn:animate_zoom_in,zoomOut:animate_zoom_out,spinIn:animate_spin_in,spinOut:animate_spin_out,slideInFromTop:animate_slide_in_from_top,slideInFromBottom:animate_slide_in_from_bottom,slideInFromLeft:animate_slide_in_from_left,slideInFromRight:animate_slide_in_from_right,slideOutToTop:animate_slide_out_to_top,slideOutToBottom:animate_slide_out_to_bottom,slideOutToLeft:animate_slide_out_to_left,slideOutToRight:animate_slide_out_to_right,backgroundAlpha:background-alpha/bga,gradientFromAlpha:from-alpha,gradientToAlpha:to-alpha,borderAlpha:border_color_alpha/bca,container:container,focusRingWidth:focus-ring-width,focusRingColor:focus-ring-color,focusRingOffsetWidth:focus-ring-offset-width,focusRingOffsetColor:focus-ring-offset-color,focusRingInset:focus-ring-inset,spaceY:space_y,spaceX:space_x,textAlpha:text_alpha/ca,textStyle:textStyle,layerStyle:layerStyle"
-
-const classNameByProp = new Map()
-const shorthands = new Map()
-utilities.split(',').forEach((utility) => {
-  const [prop, meta] = utility.split(':')
-  const [className, ...shorthandList] = meta.split('/')
-  classNameByProp.set(prop, className)
-  if (shorthandList.length) {
-    shorthandList.forEach((shorthand) => {
-      shorthands.set(shorthand === '1' ? className : shorthand, prop)
-    })
-  }
-})
-
-const resolveShorthand = (prop) => shorthands.get(prop) || prop
-
-const context = {
-  
-  conditions: {
-    shift: sortConditions,
-    finalize: finalizeConditions,
-    breakpoints: { keys: ["base","sm","md","lg","2lg","xl","2xl"] }
-  },
-  utility: {
-    
-    transform: (prop, value) => {
-              const key = resolveShorthand(prop)
-              const propKey = classNameByProp.get(key) || hypenateProperty(key)
-              return { className: `${propKey}_${withoutSpace(value)}` }
-            },
-    hasShorthand: true,
-    resolveShorthand: resolveShorthand,
-  }
-}
-
-const cssFn = createCss(context)
-export const css = (...styles) => cssFn(mergeCss(...styles))
-css.raw = (...styles) => mergeCss(...styles)
-
-export const { mergeCss, assignCss } = createMergeCss(context)

package/dist/src/styled-system/css/cva.d.mts

@@ -1,6 +0,0 @@
-/* eslint-disable */
-import type { RecipeCreatorFn } from '../types/recipe.d.mts';
-
-export declare const cva: RecipeCreatorFn
-
-export type { RecipeVariantProps } from '../types/recipe.d.mts';

package/dist/src/styled-system/css/cva.mjs

@@ -1,63 +0,0 @@
-import { compact, splitProps } from '../helpers.mjs';
-import { css, mergeCss } from './css.mjs';
-
-export function cva(config) {
-  const { base = {}, variants = {}, defaultVariants = {}, compoundVariants = [] } = config
-
-  function resolve(props = {}) {
-    const computedVariants = { ...defaultVariants, ...compact(props) }
-    let variantCss = { ...base }
-    for (const [key, value] of Object.entries(computedVariants)) {
-      if (variants[key]?.[value]) {
-        variantCss = mergeCss(variantCss, variants[key][value])
-      }
-    }
-    const compoundVariantCss = getCompoundVariantCss(compoundVariants, computedVariants)
-    return mergeCss(variantCss, compoundVariantCss)
-  }
-
-  function cvaFn(props) {
-    return css(resolve(props))
-  }
-
-  const variantKeys = Object.keys(variants)
-
-  function splitVariantProps(props) {
-    return splitProps(props, variantKeys)
-  }
-
-  const variantMap = Object.fromEntries(Object.entries(variants).map(([key, value]) => [key, Object.keys(value)]))
-
-  return Object.assign(cvaFn, {
-    __cva__: true,
-    variantMap,
-    variantKeys,
-    raw: resolve,
-    config,
-    splitVariantProps,
-  })
-}
-
-export function getCompoundVariantCss(compoundVariants, variantMap) {
-  let result = {}
-  compoundVariants.forEach((compoundVariant) => {
-    const isMatching = Object.entries(compoundVariant).every(([key, value]) => {
-      if (key === 'css') return true
-
-      const values = Array.isArray(value) ? value : [value]
-      return values.some((value) => variantMap[key] === value)
-    })
-
-    if (isMatching) {
-      result = mergeCss(result, compoundVariant.css)
-    }
-  })
-
-  return result
-}
-
-export function assertCompoundVariant(name, compoundVariants, variants, prop) {
-  if (compoundVariants.length > 0 && typeof variants?.[prop] === 'object') {
-    throw new Error(`[recipe:${name}:${prop}] Conditions are not supported when using compound variants.`)
-  }
-}

package/dist/src/styled-system/css/cx.d.mts

@@ -1,5 +0,0 @@
-/* eslint-disable */
-type Argument = string | boolean | null | undefined
-
-/** Conditionally join classNames into a single string */
-export declare function cx(...args: Argument[]): string

package/dist/src/styled-system/css/cx.mjs

@@ -1,15 +0,0 @@
-function cx() {
-  let str = '',
-    i = 0,
-    arg
-
-  for (; i < arguments.length; ) {
-    if ((arg = arguments[i++]) && typeof arg === 'string') {
-      str && (str += ' ')
-      str += arg
-    }
-  }
-  return str
-}
-
-export { cx }

package/dist/src/styled-system/css/index.d.mts

@@ -1,5 +0,0 @@
-/* eslint-disable */
-export * from './css.d.mts';
-export * from './cx.d.mts';
-export * from './cva.d.mts';
-export * from './sva.d.mts';

package/dist/src/styled-system/css/index.mjs

@@ -1,4 +0,0 @@
-export * from './css.mjs';
-export * from './cx.mjs';
-export * from './cva.mjs';
-export * from './sva.mjs';

package/dist/src/styled-system/css/sva.d.mts

@@ -1,4 +0,0 @@
-/* eslint-disable */
-import type { SlotRecipeCreatorFn } from '../types/recipe.d.mts';
-
-export declare const sva: SlotRecipeCreatorFn