@luxonis/depthai-pipeline-lib 1.4.12 → 1.4.14

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

@@ -1,18 +1,114 @@
 /* eslint-disable */
-import type {  ConditionalValue, Conditions, Nested  } from './conditions.d.mts';
-import type {  PropertiesFallback  } from './csstype.d.mts';
+import type {  ConditionalValue, Nested  } from './conditions.d.mts';
+import type {  AtRule, Globals, PropertiesFallback  } from './csstype.d.mts';
 import type {  SystemProperties, CssVarProperties  } from './style-props.d.mts';
 
 type String = string & {}
 type Number = number & {}
 
+export type Pretty<T> = { [K in keyof T]: T[K] } & {}
+
+export type DistributiveOmit<T, K extends keyof any> = T extends unknown ? Omit<T, K> : never
+
+export type DistributiveUnion<T, U> = {
+  [K in keyof T]: K extends keyof U ? U[K] | T[K] : T[K]
+} & DistributiveOmit<U, keyof T>
+
+export type Assign<T, U> = {
+  [K in keyof T]: K extends keyof U ? U[K] : T[K]
+} & U
+
 /* -----------------------------------------------------------------------------
  * Native css properties
  * -----------------------------------------------------------------------------*/
 
+type DashedIdent = `--${string}`
+
+type StringToMultiple<T extends string> = T | `${T}, ${T}`
+
+export type PositionAreaAxis =
+  | 'left'
+  | 'center'
+  | 'right'
+  | 'x-start'
+  | 'x-end'
+  | 'span-x-start'
+  | 'span-x-end'
+  | 'x-self-start'
+  | 'x-self-end'
+  | 'span-x-self-start'
+  | 'span-x-self-end'
+  | 'span-all'
+  | 'top'
+  | 'bottom'
+  | 'span-top'
+  | 'span-bottom'
+  | 'y-start'
+  | 'y-end'
+  | 'span-y-start'
+  | 'span-y-end'
+  | 'y-self-start'
+  | 'y-self-end'
+  | 'span-y-self-start'
+  | 'span-y-self-end'
+  | 'block-start'
+  | 'block-end'
+  | 'span-block-start'
+  | 'span-block-end'
+  | 'inline-start'
+  | 'inline-end'
+  | 'span-inline-start'
+  | 'span-inline-end'
+  | 'self-block-start'
+  | 'self-block-end'
+  | 'span-self-block-start'
+  | 'span-self-block-end'
+  | 'self-inline-start'
+  | 'self-inline-end'
+  | 'span-self-inline-start'
+  | 'span-self-inline-end'
+  | 'start'
+  | 'end'
+  | 'span-start'
+  | 'span-end'
+  | 'self-start'
+  | 'self-end'
+  | 'span-self-start'
+  | 'span-self-end'
+
+type PositionTry =
+  | 'normal'
+  | 'flip-block'
+  | 'flip-inline'
+  | 'top'
+  | 'bottom'
+  | 'left'
+  | 'right'
+  | 'block-start'
+  | 'block-end'
+  | 'inline-start'
+  | 'inline-end'
+  | DashedIdent
+
+export interface ModernCssProperties {
+  anchorName?: Globals | 'none' | DashedIdent | StringToMultiple<DashedIdent>
+  anchorScope?: Globals | 'none' | 'all' | DashedIdent | StringToMultiple<DashedIdent>
+  fieldSizing?: Globals | 'fixed' | 'content'
+  interpolateSize?: Globals | 'allow-keywords' | 'numeric-only'
+  positionAnchor?: Globals | 'auto' | DashedIdent
+  positionArea?: Globals | 'auto' | PositionAreaAxis | `${PositionAreaAxis} ${PositionAreaAxis}` | String
+  positionTry?: Globals | StringToMultiple<PositionTry> | String
+  positionTryFallback?: Globals | 'none' | StringToMultiple<PositionTry> | String
+  positionTryOrder?: Globals | 'normal' | 'most-width' | 'most-height' | 'most-block-size' | 'most-inline-size'
+  positionVisibility?: Globals | 'always' | 'anchors-visible' | 'no-overflow'
+  textWrapMode?: Globals | 'wrap' | 'nowrap'
+  textSpacingTrim?: Globals | 'normal' | 'space-all' | 'space-first' | 'trim-start'
+  textWrapStyle?: Globals | 'auto' | 'balance' | 'pretty' | 'stable'
+}
+
 export type CssProperty = keyof PropertiesFallback
 
-export interface CssProperties extends PropertiesFallback<String | Number>, CssVarProperties {}
+export interface CssProperties extends PropertiesFallback<String | Number>, CssVarProperties, ModernCssProperties {}
 
 export interface CssKeyframes {
   [name: string]: {
@@ -24,10 +120,6 @@ export interface CssKeyframes {
  * Conditional css properties
  * -----------------------------------------------------------------------------*/
 
-type MinimalNested<P> = {
-  [K in keyof Conditions]?: Nested<P>
-}
-
 interface GenericProperties {
   [key: string]: ConditionalValue<String | Number | boolean>
 }
@@ -38,7 +130,7 @@ interface GenericProperties {
 
 export type NestedCssProperties = Nested<CssProperties>
 
-export type SystemStyleObject = Nested<SystemProperties & CssVarProperties>
+export type SystemStyleObject = Omit<Nested<SystemProperties & CssVarProperties>, 'base'>
 
 export interface GlobalStyleObject {
   [selector: string]: SystemStyleObject
@@ -48,25 +140,41 @@ export interface ExtendableGlobalStyleObject {
   extend?: GlobalStyleObject | undefined
 }
 
-export type CompositionStyleObject<Property extends string> = Nested<{
-  [K in Property]?: K extends keyof SystemStyleObject ? SystemStyleObject[K] : unknown
-}>
+/* -----------------------------------------------------------------------------
+ * Composition (text styles, layer styles)
+ * -----------------------------------------------------------------------------*/
+
+type FilterStyleObject<P extends string> = {
+  [K in P]?: K extends keyof SystemStyleObject ? SystemStyleObject[K] : unknown
+}
+
+export type CompositionStyleObject<Property extends string> = Nested<FilterStyleObject<Property> & CssVarProperties>
 
 /* -----------------------------------------------------------------------------
- * Jsx style props
+ * Font face
  * -----------------------------------------------------------------------------*/
-interface WithCss {
-  css?: SystemStyleObject
+
+export type GlobalFontfaceRule = Omit<AtRule.FontFaceFallback, 'src'> & Required<Pick<AtRule.FontFaceFallback, 'src'>>
+
+export type FontfaceRule = Omit<GlobalFontfaceRule, 'fontFamily'>
+
+export interface GlobalFontface {
+  [name: string]: FontfaceRule | FontfaceRule[]
 }
-type StyleProps = SystemProperties & MinimalNested<SystemStyleObject>
 
-export type JsxStyleProps = StyleProps & WithCss
+export interface ExtendableGlobalFontface {
+  [name: string]: FontfaceRule | FontfaceRule[] | GlobalFontface | undefined
+  extend?: GlobalFontface | undefined
+}
 
-export type DistributiveOmit<T, K extends keyof any> = T extends unknown ? Omit<T, K> : never
+/* -----------------------------------------------------------------------------
+ * Jsx style props
+ * -----------------------------------------------------------------------------*/
+interface WithCss {
+  css?: SystemStyleObject | SystemStyleObject[]
+}
 
-export type Assign<T, U> = {
-  [K in keyof T]: K extends keyof U ? U[K] : T[K]
-} & U
+export type JsxStyleProps = SystemStyleObject & WithCss
 
 export interface PatchedHTMLProps {
   htmlWidth?: string | number

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luxonis/depthai-pipeline-lib",
-  "version": "1.4.12",
+  "version": "1.4.14",
   "type": "module",
   "license": "UNLICENSED",
   "main": "./dist/src/index.js",
@@ -12,7 +12,7 @@
   },
   "dependencies": {
     "@dagrejs/dagre": "^1.1.3",
-    "@luxonis/common-fe-components": "^1.9.5",
+    "@luxonis/common-fe-components": "1.25.9",
     "@xyflow/react": "^12.0.4",
     "postcss-import": "^16.1.0",
     "postcss-nested": "^6.2.0",
@@ -24,7 +24,7 @@
     "react-dom": "^18.3.1"
   },
   "devDependencies": {
-    "@pandacss/dev": "^0.15.5",
+    "@pandacss/dev": "^0.53.0",
     "@stylistic/eslint-plugin": "^2.6.1",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",

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/global.css

@@ -1,70 +0,0 @@
-@layer base {
-  :root {
-    --made-with-panda: '🐼'
-    }
-
-  *, *::before, *::after, ::backdrop {
-    --blur:   ;
-    --brightness:   ;
-    --contrast:   ;
-    --grayscale:   ;
-    --hue-rotate:   ;
-    --invert:   ;
-    --saturate:   ;
-    --sepia:   ;
-    --drop-shadow:   ;
-    --backdrop-blur:   ;
-    --backdrop-brightness:   ;
-    --backdrop-contrast:   ;
-    --backdrop-grayscale:   ;
-    --backdrop-hue-rotate:   ;
-    --backdrop-invert:   ;
-    --backdrop-opacity:   ;
-    --backdrop-saturate:   ;
-    --backdrop-sepia:   ;
-    --scroll-snap-strictness: proximity;
-    --border-spacing-x: 0;
-    --border-spacing-y: 0;
-    --translate-x: 0;
-    --translate-y: 0;
-    --rotate: 0;
-    --skew-x: 0;
-    --skew-y: 0;
-    --scale-x: 1;
-    --scale-y: 1
-    }
-
-  html {
-    -moz-osx-font-smoothing: grayscale;
-    text-rendering: optimizeLegibility;
-    -webkit-font-smoothing: antialiased;
-    -webkit-text-size-adjust: 100%
-    }
-
-  body {
-    background: var(--colors-background);
-    color: var(--colors-foreground);
-    font-family: var(--fonts-sans)
-    }
-
-  button {
-    color: inherit;
-    outline: 2px solid transparent
-    }
-
-  * {
-    box-sizing: border-box;
-    font-family: var(--fonts-body)
-    }
-
-  html, body {
-    margin: var(--spacing-0);
-    padding: var(--spacing-0)
-    }
-
-  #root {
-    display: flex;
-    flex-direction: column;
-    height: 100vh
-    }
-}

package/dist/src/styled-system/patterns/link-box.d.mts

@@ -1,21 +0,0 @@
-/* eslint-disable */
-import type { SystemStyleObject, ConditionalValue } from '../types/index.d.mts';
-import type { Properties } from '../types/csstype.d.mts';
-import type { PropertyValue } from '../types/prop-type.d.mts';
-import type { DistributiveOmit } from '../types/system-types.d.mts';
-import type { Tokens } from '../tokens/index.d.mts';
-
-export interface LinkBoxProperties {
-   
-}
-
-
-interface LinkBoxStyles extends LinkBoxProperties, DistributiveOmit<SystemStyleObject, keyof LinkBoxProperties > {}
-
-interface LinkBoxPatternFn {
-  (styles?: LinkBoxStyles): string
-  raw: (styles?: LinkBoxStyles) => SystemStyleObject
-}
-
-
-export declare const linkBox: LinkBoxPatternFn;

package/dist/src/styled-system/patterns/link-box.mjs

@@ -1,19 +0,0 @@
-import { mapObject } from '../helpers.mjs';
-import { css } from '../css/index.mjs';
-
-const linkBoxConfig = {
-transform(props) {
-  return {
-    position: "relative",
-    "& :where(a, abbr)": {
-      position: "relative",
-      zIndex: "1"
-    },
-    ...props
-  };
-}}
-
-export const getLinkBoxStyle = (styles = {}) => linkBoxConfig.transform(styles, { map: mapObject })
-
-export const linkBox = (styles) => css(getLinkBoxStyle(styles))
-linkBox.raw = getLinkBoxStyle

package/dist/src/styled-system/recipes/create-recipe.d.mts

@@ -1 +0,0 @@
-/* eslint-disable */