@luxonis/common-fe-components 1.19.0 → 1.19.1

package/dist/styled-system/recipes/context-menu.mjs

@@ -1,4 +1,4 @@
-import { splitProps, getSlotCompoundVariant } from '../helpers.mjs';
+import { compact, getSlotCompoundVariant, memo, splitProps } from '../helpers.mjs';
 import { createRecipe } from './create-recipe.mjs';
 
 const contextMenuDefaultVariants = {
@@ -138,13 +138,14 @@ const contextMenuSlotNames = [
 ]
 const contextMenuSlotFns = /* @__PURE__ */ contextMenuSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, contextMenuDefaultVariants, getSlotCompoundVariant(contextMenuCompoundVariants, slotName))])
 
-const contextMenuFn = (props = {}) => {
-  return Object.fromEntries(contextMenuSlotFns.map(([slotName, slotFn]) => [slotName, slotFn(props)]))
-}
+const contextMenuFn = memo((props = {}) => {
+  return Object.fromEntries(contextMenuSlotFns.map(([slotName, slotFn]) => [slotName, slotFn.recipeFn(props)]))
+})
 
 const contextMenuVariantKeys = [
   "inset"
 ]
+const getVariantProps = (variants) => ({ ...contextMenuDefaultVariants, ...compact(variants) })
 
 export const contextMenu = /* @__PURE__ */ Object.assign(contextMenuFn, {
   __recipe__: false,
@@ -159,4 +160,5 @@ export const contextMenu = /* @__PURE__ */ Object.assign(contextMenuFn, {
   splitVariantProps(props) {
     return splitProps(props, contextMenuVariantKeys)
   },
+  getVariantProps
 })

package/dist/styled-system/recipes/create-recipe.mjs

@@ -5,7 +5,7 @@ import { cx } from '../css/cx.mjs';
 import { compact, createCss, splitProps, uniq, withoutSpace } from '../helpers.mjs';
 
 export const createRecipe = (name, defaultVariants, compoundVariants) => {
- const getRecipeStyles = (variants) => {
+ const getVariantProps = (variants) => {
    return {
      [name]: '__ignore__',
      ...defaultVariants,
@@ -34,11 +34,12 @@ export const createRecipe = (name, defaultVariants, compoundVariants) => {
      },
      utility: {
        
+       toHash: (path, hashFn) => hashFn(path.join(":")),
        transform,
      }
    })
 
-   const recipeStyles = getRecipeStyles(variants)
+   const recipeStyles = getVariantProps(variants)
 
    if (withCompoundVariants) {
      const compoundVariantStyles = getCompoundVariantCss(compoundVariants, recipeStyles)
@@ -48,11 +49,13 @@ export const createRecipe = (name, defaultVariants, compoundVariants) => {
    return recipeCss(recipeStyles)
   }
 
-   return Object.assign(recipeFn, {
+   return {
+     recipeFn,
+     getVariantProps,
      __getCompoundVariantCss__: (variants) => {
-       return getCompoundVariantCss(compoundVariants, getRecipeStyles(variants));
+       return getCompoundVariantCss(compoundVariants, getVariantProps(variants));
      },
-   })
+   }
 }
 
 export const mergeRecipes = (recipeA, recipeB) => {

package/dist/styled-system/recipes/dialog.d.mts

@@ -21,7 +21,12 @@ export interface DialogRecipe {
   variantMap: DialogVariantMap
   variantKeys: Array<keyof DialogVariant>
   splitVariantProps<Props extends DialogVariantProps>(props: Props): [DialogVariantProps, Pretty<DistributiveOmit<Props, keyof DialogVariantProps>>]
+  getVariantProps: (props?: DialogVariantProps) => DialogVariantProps
 }
 
-/** Styles for the Dialog component */
+/**
+ * Styles for the Dialog component
+
+
+ */
 export declare const dialog: DialogRecipe

package/dist/styled-system/recipes/dialog.mjs

@@ -1,4 +1,4 @@
-import { splitProps, getSlotCompoundVariant } from '../helpers.mjs';
+import { compact, getSlotCompoundVariant, memo, splitProps } from '../helpers.mjs';
 import { createRecipe } from './create-recipe.mjs';
 
 const dialogDefaultVariants = {}
@@ -88,11 +88,12 @@ const dialogSlotNames = [
 ]
 const dialogSlotFns = /* @__PURE__ */ dialogSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, dialogDefaultVariants, getSlotCompoundVariant(dialogCompoundVariants, slotName))])
 
-const dialogFn = (props = {}) => {
-  return Object.fromEntries(dialogSlotFns.map(([slotName, slotFn]) => [slotName, slotFn(props)]))
-}
+const dialogFn = memo((props = {}) => {
+  return Object.fromEntries(dialogSlotFns.map(([slotName, slotFn]) => [slotName, slotFn.recipeFn(props)]))
+})
 
 const dialogVariantKeys = []
+const getVariantProps = (variants) => ({ ...dialogDefaultVariants, ...compact(variants) })
 
 export const dialog = /* @__PURE__ */ Object.assign(dialogFn, {
   __recipe__: false,
@@ -103,4 +104,5 @@ export const dialog = /* @__PURE__ */ Object.assign(dialogFn, {
   splitVariantProps(props) {
     return splitProps(props, dialogVariantKeys)
   },
+  getVariantProps
 })

package/dist/styled-system/recipes/dropdown-menu.d.mts

@@ -21,7 +21,12 @@ export interface DropdownMenuRecipe {
   variantMap: DropdownMenuVariantMap
   variantKeys: Array<keyof DropdownMenuVariant>
   splitVariantProps<Props extends DropdownMenuVariantProps>(props: Props): [DropdownMenuVariantProps, Pretty<DistributiveOmit<Props, keyof DropdownMenuVariantProps>>]
+  getVariantProps: (props?: DropdownMenuVariantProps) => DropdownMenuVariantProps
 }
 
-/** Styles for the DropdownMenu component */
+/**
+ * Styles for the DropdownMenu component
+
+
+ */
 export declare const dropdownMenu: DropdownMenuRecipe

package/dist/styled-system/recipes/dropdown-menu.mjs

@@ -1,4 +1,4 @@
-import { splitProps, getSlotCompoundVariant } from '../helpers.mjs';
+import { compact, getSlotCompoundVariant, memo, splitProps } from '../helpers.mjs';
 import { createRecipe } from './create-recipe.mjs';
 
 const dropdownMenuDefaultVariants = {}
@@ -136,11 +136,12 @@ const dropdownMenuSlotNames = [
 ]
 const dropdownMenuSlotFns = /* @__PURE__ */ dropdownMenuSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, dropdownMenuDefaultVariants, getSlotCompoundVariant(dropdownMenuCompoundVariants, slotName))])
 
-const dropdownMenuFn = (props = {}) => {
-  return Object.fromEntries(dropdownMenuSlotFns.map(([slotName, slotFn]) => [slotName, slotFn(props)]))
-}
+const dropdownMenuFn = memo((props = {}) => {
+  return Object.fromEntries(dropdownMenuSlotFns.map(([slotName, slotFn]) => [slotName, slotFn.recipeFn(props)]))
+})
 
 const dropdownMenuVariantKeys = []
+const getVariantProps = (variants) => ({ ...dropdownMenuDefaultVariants, ...compact(variants) })
 
 export const dropdownMenu = /* @__PURE__ */ Object.assign(dropdownMenuFn, {
   __recipe__: false,
@@ -151,4 +152,5 @@ export const dropdownMenu = /* @__PURE__ */ Object.assign(dropdownMenuFn, {
   splitVariantProps(props) {
     return splitProps(props, dropdownMenuVariantKeys)
   },
+  getVariantProps
 })

package/dist/styled-system/recipes/form-control.d.mts

@@ -21,7 +21,12 @@ export interface FormControlRecipe {
   variantMap: FormControlVariantMap
   variantKeys: Array<keyof FormControlVariant>
   splitVariantProps<Props extends FormControlVariantProps>(props: Props): [FormControlVariantProps, Pretty<DistributiveOmit<Props, keyof FormControlVariantProps>>]
+  getVariantProps: (props?: FormControlVariantProps) => FormControlVariantProps
 }
 
-/** Styles for the FormControl component */
+/**
+ * Styles for the FormControl component
+
+
+ */
 export declare const formControl: FormControlRecipe

package/dist/styled-system/recipes/form-control.mjs

@@ -1,4 +1,4 @@
-import { splitProps } from '../helpers.mjs';
+import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const formControlFn = /* @__PURE__ */ createRecipe('formControl', {}, [])
@@ -7,9 +7,10 @@ const formControlVariantMap = {}
 
 const formControlVariantKeys = Object.keys(formControlVariantMap)
 
-export const formControl = /* @__PURE__ */ Object.assign(formControlFn, {
+export const formControl = /* @__PURE__ */ Object.assign(memo(formControlFn.recipeFn), {
   __recipe__: true,
   __name__: 'formControl',
+  __getCompoundVariantCss__: formControlFn.__getCompoundVariantCss__,
   raw: (props) => props,
   variantKeys: formControlVariantKeys,
   variantMap: formControlVariantMap,
@@ -19,4 +20,5 @@ export const formControl = /* @__PURE__ */ Object.assign(formControlFn, {
   splitVariantProps(props) {
     return splitProps(props, formControlVariantKeys)
   },
+  getVariantProps: formControlFn.getVariantProps,
 })

package/dist/styled-system/recipes/form-description.d.mts

@@ -21,7 +21,12 @@ export interface FormDescriptionRecipe {
   variantMap: FormDescriptionVariantMap
   variantKeys: Array<keyof FormDescriptionVariant>
   splitVariantProps<Props extends FormDescriptionVariantProps>(props: Props): [FormDescriptionVariantProps, Pretty<DistributiveOmit<Props, keyof FormDescriptionVariantProps>>]
+  getVariantProps: (props?: FormDescriptionVariantProps) => FormDescriptionVariantProps
 }
 
-/** Styles for the FormDescription component */
+/**
+ * Styles for the FormDescription component
+
+
+ */
 export declare const formDescription: FormDescriptionRecipe

package/dist/styled-system/recipes/form-description.mjs

@@ -1,4 +1,4 @@
-import { splitProps } from '../helpers.mjs';
+import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const formDescriptionFn = /* @__PURE__ */ createRecipe('formDescription', {}, [])
@@ -7,9 +7,10 @@ const formDescriptionVariantMap = {}
 
 const formDescriptionVariantKeys = Object.keys(formDescriptionVariantMap)
 
-export const formDescription = /* @__PURE__ */ Object.assign(formDescriptionFn, {
+export const formDescription = /* @__PURE__ */ Object.assign(memo(formDescriptionFn.recipeFn), {
   __recipe__: true,
   __name__: 'formDescription',
+  __getCompoundVariantCss__: formDescriptionFn.__getCompoundVariantCss__,
   raw: (props) => props,
   variantKeys: formDescriptionVariantKeys,
   variantMap: formDescriptionVariantMap,
@@ -19,4 +20,5 @@ export const formDescription = /* @__PURE__ */ Object.assign(formDescriptionFn,
   splitVariantProps(props) {
     return splitProps(props, formDescriptionVariantKeys)
   },
+  getVariantProps: formDescriptionFn.getVariantProps,
 })

package/dist/styled-system/recipes/form-item.d.mts

@@ -21,7 +21,12 @@ export interface FormItemRecipe {
   variantMap: FormItemVariantMap
   variantKeys: Array<keyof FormItemVariant>
   splitVariantProps<Props extends FormItemVariantProps>(props: Props): [FormItemVariantProps, Pretty<DistributiveOmit<Props, keyof FormItemVariantProps>>]
+  getVariantProps: (props?: FormItemVariantProps) => FormItemVariantProps
 }
 
-/** Styles for the FormItem component */
+/**
+ * Styles for the FormItem component
+
+
+ */
 export declare const formItem: FormItemRecipe

package/dist/styled-system/recipes/form-item.mjs

@@ -1,4 +1,4 @@
-import { splitProps } from '../helpers.mjs';
+import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const formItemFn = /* @__PURE__ */ createRecipe('formItem', {}, [])
@@ -7,9 +7,10 @@ const formItemVariantMap = {}
 
 const formItemVariantKeys = Object.keys(formItemVariantMap)
 
-export const formItem = /* @__PURE__ */ Object.assign(formItemFn, {
+export const formItem = /* @__PURE__ */ Object.assign(memo(formItemFn.recipeFn), {
   __recipe__: true,
   __name__: 'formItem',
+  __getCompoundVariantCss__: formItemFn.__getCompoundVariantCss__,
   raw: (props) => props,
   variantKeys: formItemVariantKeys,
   variantMap: formItemVariantMap,
@@ -19,4 +20,5 @@ export const formItem = /* @__PURE__ */ Object.assign(formItemFn, {
   splitVariantProps(props) {
     return splitProps(props, formItemVariantKeys)
   },
+  getVariantProps: formItemFn.getVariantProps,
 })

package/dist/styled-system/recipes/form-label.d.mts

@@ -21,7 +21,12 @@ export interface FormLabelRecipe {
   variantMap: FormLabelVariantMap
   variantKeys: Array<keyof FormLabelVariant>
   splitVariantProps<Props extends FormLabelVariantProps>(props: Props): [FormLabelVariantProps, Pretty<DistributiveOmit<Props, keyof FormLabelVariantProps>>]
+  getVariantProps: (props?: FormLabelVariantProps) => FormLabelVariantProps
 }
 
-/** Styles for the FormLabel component */
+/**
+ * Styles for the FormLabel component
+
+
+ */
 export declare const formLabel: FormLabelRecipe

package/dist/styled-system/recipes/form-label.mjs

@@ -1,4 +1,4 @@
-import { splitProps } from '../helpers.mjs';
+import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const formLabelFn = /* @__PURE__ */ createRecipe('formLabel', {}, [])
@@ -7,9 +7,10 @@ const formLabelVariantMap = {}
 
 const formLabelVariantKeys = Object.keys(formLabelVariantMap)
 
-export const formLabel = /* @__PURE__ */ Object.assign(formLabelFn, {
+export const formLabel = /* @__PURE__ */ Object.assign(memo(formLabelFn.recipeFn), {
   __recipe__: true,
   __name__: 'formLabel',
+  __getCompoundVariantCss__: formLabelFn.__getCompoundVariantCss__,
   raw: (props) => props,
   variantKeys: formLabelVariantKeys,
   variantMap: formLabelVariantMap,
@@ -19,4 +20,5 @@ export const formLabel = /* @__PURE__ */ Object.assign(formLabelFn, {
   splitVariantProps(props) {
     return splitProps(props, formLabelVariantKeys)
   },
+  getVariantProps: formLabelFn.getVariantProps,
 })

package/dist/styled-system/recipes/form-message.d.mts

@@ -21,7 +21,12 @@ export interface FormMessageRecipe {
   variantMap: FormMessageVariantMap
   variantKeys: Array<keyof FormMessageVariant>
   splitVariantProps<Props extends FormMessageVariantProps>(props: Props): [FormMessageVariantProps, Pretty<DistributiveOmit<Props, keyof FormMessageVariantProps>>]
+  getVariantProps: (props?: FormMessageVariantProps) => FormMessageVariantProps
 }
 
-/** Styles for the FormMessage component */
+/**
+ * Styles for the FormMessage component
+
+
+ */
 export declare const formMessage: FormMessageRecipe

package/dist/styled-system/recipes/form-message.mjs

@@ -1,4 +1,4 @@
-import { splitProps } from '../helpers.mjs';
+import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const formMessageFn = /* @__PURE__ */ createRecipe('formMessage', {}, [])
@@ -7,9 +7,10 @@ const formMessageVariantMap = {}
 
 const formMessageVariantKeys = Object.keys(formMessageVariantMap)
 
-export const formMessage = /* @__PURE__ */ Object.assign(formMessageFn, {
+export const formMessage = /* @__PURE__ */ Object.assign(memo(formMessageFn.recipeFn), {
   __recipe__: true,
   __name__: 'formMessage',
+  __getCompoundVariantCss__: formMessageFn.__getCompoundVariantCss__,
   raw: (props) => props,
   variantKeys: formMessageVariantKeys,
   variantMap: formMessageVariantMap,
@@ -19,4 +20,5 @@ export const formMessage = /* @__PURE__ */ Object.assign(formMessageFn, {
   splitVariantProps(props) {
     return splitProps(props, formMessageVariantKeys)
   },
+  getVariantProps: formMessageFn.getVariantProps,
 })

package/dist/styled-system/recipes/h1.d.mts

@@ -21,7 +21,12 @@ export interface H1Recipe {
   variantMap: H1VariantMap
   variantKeys: Array<keyof H1Variant>
   splitVariantProps<Props extends H1VariantProps>(props: Props): [H1VariantProps, Pretty<DistributiveOmit<Props, keyof H1VariantProps>>]
+  getVariantProps: (props?: H1VariantProps) => H1VariantProps
 }
 
-/** Typography - h1 style */
+/**
+ * Typography - h1 style
+
+
+ */
 export declare const h1: H1Recipe

package/dist/styled-system/recipes/h1.mjs

@@ -1,4 +1,4 @@
-import { splitProps } from '../helpers.mjs';
+import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const h1Fn = /* @__PURE__ */ createRecipe('h1', {}, [])
@@ -7,9 +7,10 @@ const h1VariantMap = {}
 
 const h1VariantKeys = Object.keys(h1VariantMap)
 
-export const h1 = /* @__PURE__ */ Object.assign(h1Fn, {
+export const h1 = /* @__PURE__ */ Object.assign(memo(h1Fn.recipeFn), {
   __recipe__: true,
   __name__: 'h1',
+  __getCompoundVariantCss__: h1Fn.__getCompoundVariantCss__,
   raw: (props) => props,
   variantKeys: h1VariantKeys,
   variantMap: h1VariantMap,
@@ -19,4 +20,5 @@ export const h1 = /* @__PURE__ */ Object.assign(h1Fn, {
   splitVariantProps(props) {
     return splitProps(props, h1VariantKeys)
   },
+  getVariantProps: h1Fn.getVariantProps,
 })

package/dist/styled-system/recipes/h2.d.mts

@@ -21,7 +21,12 @@ export interface H2Recipe {
   variantMap: H2VariantMap
   variantKeys: Array<keyof H2Variant>
   splitVariantProps<Props extends H2VariantProps>(props: Props): [H2VariantProps, Pretty<DistributiveOmit<Props, keyof H2VariantProps>>]
+  getVariantProps: (props?: H2VariantProps) => H2VariantProps
 }
 
-/** Typography - h2 style */
+/**
+ * Typography - h2 style
+
+
+ */
 export declare const h2: H2Recipe

package/dist/styled-system/recipes/h2.mjs

@@ -1,4 +1,4 @@
-import { splitProps } from '../helpers.mjs';
+import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const h2Fn = /* @__PURE__ */ createRecipe('h2', {}, [])
@@ -7,9 +7,10 @@ const h2VariantMap = {}
 
 const h2VariantKeys = Object.keys(h2VariantMap)
 
-export const h2 = /* @__PURE__ */ Object.assign(h2Fn, {
+export const h2 = /* @__PURE__ */ Object.assign(memo(h2Fn.recipeFn), {
   __recipe__: true,
   __name__: 'h2',
+  __getCompoundVariantCss__: h2Fn.__getCompoundVariantCss__,
   raw: (props) => props,
   variantKeys: h2VariantKeys,
   variantMap: h2VariantMap,
@@ -19,4 +20,5 @@ export const h2 = /* @__PURE__ */ Object.assign(h2Fn, {
   splitVariantProps(props) {
     return splitProps(props, h2VariantKeys)
   },
+  getVariantProps: h2Fn.getVariantProps,
 })

package/dist/styled-system/recipes/h3.d.mts

@@ -21,7 +21,12 @@ export interface H3Recipe {
   variantMap: H3VariantMap
   variantKeys: Array<keyof H3Variant>
   splitVariantProps<Props extends H3VariantProps>(props: Props): [H3VariantProps, Pretty<DistributiveOmit<Props, keyof H3VariantProps>>]
+  getVariantProps: (props?: H3VariantProps) => H3VariantProps
 }
 
-/** Typography - h3 style */
+/**
+ * Typography - h3 style
+
+
+ */
 export declare const h3: H3Recipe

package/dist/styled-system/recipes/h3.mjs

@@ -1,4 +1,4 @@
-import { splitProps } from '../helpers.mjs';
+import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const h3Fn = /* @__PURE__ */ createRecipe('h3', {}, [])
@@ -7,9 +7,10 @@ const h3VariantMap = {}
 
 const h3VariantKeys = Object.keys(h3VariantMap)
 
-export const h3 = /* @__PURE__ */ Object.assign(h3Fn, {
+export const h3 = /* @__PURE__ */ Object.assign(memo(h3Fn.recipeFn), {
   __recipe__: true,
   __name__: 'h3',
+  __getCompoundVariantCss__: h3Fn.__getCompoundVariantCss__,
   raw: (props) => props,
   variantKeys: h3VariantKeys,
   variantMap: h3VariantMap,
@@ -19,4 +20,5 @@ export const h3 = /* @__PURE__ */ Object.assign(h3Fn, {
   splitVariantProps(props) {
     return splitProps(props, h3VariantKeys)
   },
+  getVariantProps: h3Fn.getVariantProps,
 })

package/dist/styled-system/recipes/h4.d.mts

@@ -21,7 +21,12 @@ export interface H4Recipe {
   variantMap: H4VariantMap
   variantKeys: Array<keyof H4Variant>
   splitVariantProps<Props extends H4VariantProps>(props: Props): [H4VariantProps, Pretty<DistributiveOmit<Props, keyof H4VariantProps>>]
+  getVariantProps: (props?: H4VariantProps) => H4VariantProps
 }
 
-/** Typography - h4 style */
+/**
+ * Typography - h4 style
+
+
+ */
 export declare const h4: H4Recipe

package/dist/styled-system/recipes/h4.mjs

@@ -1,4 +1,4 @@
-import { splitProps } from '../helpers.mjs';
+import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const h4Fn = /* @__PURE__ */ createRecipe('h4', {}, [])
@@ -7,9 +7,10 @@ const h4VariantMap = {}
 
 const h4VariantKeys = Object.keys(h4VariantMap)
 
-export const h4 = /* @__PURE__ */ Object.assign(h4Fn, {
+export const h4 = /* @__PURE__ */ Object.assign(memo(h4Fn.recipeFn), {
   __recipe__: true,
   __name__: 'h4',
+  __getCompoundVariantCss__: h4Fn.__getCompoundVariantCss__,
   raw: (props) => props,
   variantKeys: h4VariantKeys,
   variantMap: h4VariantMap,
@@ -19,4 +20,5 @@ export const h4 = /* @__PURE__ */ Object.assign(h4Fn, {
   splitVariantProps(props) {
     return splitProps(props, h4VariantKeys)
   },
+  getVariantProps: h4Fn.getVariantProps,
 })

package/dist/styled-system/recipes/hover-card.d.mts

@@ -21,7 +21,12 @@ export interface HoverCardRecipe {
   variantMap: HoverCardVariantMap
   variantKeys: Array<keyof HoverCardVariant>
   splitVariantProps<Props extends HoverCardVariantProps>(props: Props): [HoverCardVariantProps, Pretty<DistributiveOmit<Props, keyof HoverCardVariantProps>>]
+  getVariantProps: (props?: HoverCardVariantProps) => HoverCardVariantProps
 }
 
-/** Styles for the HoverCard component */
+/**
+ * Styles for the HoverCard component
+
+
+ */
 export declare const hoverCard: HoverCardRecipe

package/dist/styled-system/recipes/hover-card.mjs

@@ -1,4 +1,4 @@
-import { splitProps, getSlotCompoundVariant } from '../helpers.mjs';
+import { compact, getSlotCompoundVariant, memo, splitProps } from '../helpers.mjs';
 import { createRecipe } from './create-recipe.mjs';
 
 const hoverCardDefaultVariants = {}
@@ -32,11 +32,12 @@ const hoverCardSlotNames = [
 ]
 const hoverCardSlotFns = /* @__PURE__ */ hoverCardSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, hoverCardDefaultVariants, getSlotCompoundVariant(hoverCardCompoundVariants, slotName))])
 
-const hoverCardFn = (props = {}) => {
-  return Object.fromEntries(hoverCardSlotFns.map(([slotName, slotFn]) => [slotName, slotFn(props)]))
-}
+const hoverCardFn = memo((props = {}) => {
+  return Object.fromEntries(hoverCardSlotFns.map(([slotName, slotFn]) => [slotName, slotFn.recipeFn(props)]))
+})
 
 const hoverCardVariantKeys = []
+const getVariantProps = (variants) => ({ ...hoverCardDefaultVariants, ...compact(variants) })
 
 export const hoverCard = /* @__PURE__ */ Object.assign(hoverCardFn, {
   __recipe__: false,
@@ -47,4 +48,5 @@ export const hoverCard = /* @__PURE__ */ Object.assign(hoverCardFn, {
   splitVariantProps(props) {
     return splitProps(props, hoverCardVariantKeys)
   },
+  getVariantProps
 })

package/dist/styled-system/recipes/icon.d.mts

@@ -3,10 +3,25 @@ import type { ConditionalValue } from '../types/index.d.mts';
 import type { DistributiveOmit, Pretty } from '../types/system-types.d.mts';
 
 interface IconVariant {
-  size: "xl" | "lg" | "md" | "sm" | "xs"
+  /**
+ * @default "md"
+ */
+size: "xl" | "lg" | "md" | "sm" | "xs"
+/**
+ * @default "none"
+ */
 left: "none" | "sm" | "auto"
+/**
+ * @default "none"
+ */
 right: "none" | "sm" | "auto"
+/**
+ * @default false
+ */
 fillCurrent: boolean
+/**
+ * @default false
+ */
 dimmed: boolean
 }
 
@@ -25,7 +40,12 @@ export interface IconRecipe {
   variantMap: IconVariantMap
   variantKeys: Array<keyof IconVariant>
   splitVariantProps<Props extends IconVariantProps>(props: Props): [IconVariantProps, Pretty<DistributiveOmit<Props, keyof IconVariantProps>>]
+  getVariantProps: (props?: IconVariantProps) => IconVariantProps
 }
 
-/** Styles for the icons */
+/**
+ * Styles for the icons
+
+
+ */
 export declare const icon: IconRecipe

package/dist/styled-system/recipes/icon.mjs

@@ -1,4 +1,4 @@
-import { splitProps } from '../helpers.mjs';
+import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const iconFn = /* @__PURE__ */ createRecipe('icon', {
@@ -37,9 +37,10 @@ const iconVariantMap = {
 
 const iconVariantKeys = Object.keys(iconVariantMap)
 
-export const icon = /* @__PURE__ */ Object.assign(iconFn, {
+export const icon = /* @__PURE__ */ Object.assign(memo(iconFn.recipeFn), {
   __recipe__: true,
   __name__: 'icon',
+  __getCompoundVariantCss__: iconFn.__getCompoundVariantCss__,
   raw: (props) => props,
   variantKeys: iconVariantKeys,
   variantMap: iconVariantMap,
@@ -49,4 +50,5 @@ export const icon = /* @__PURE__ */ Object.assign(iconFn, {
   splitVariantProps(props) {
     return splitProps(props, iconVariantKeys)
   },
+  getVariantProps: iconFn.getVariantProps,
 })

package/dist/styled-system/recipes/inline-code.d.mts

@@ -21,7 +21,12 @@ export interface InlineCodeRecipe {
   variantMap: InlineCodeVariantMap
   variantKeys: Array<keyof InlineCodeVariant>
   splitVariantProps<Props extends InlineCodeVariantProps>(props: Props): [InlineCodeVariantProps, Pretty<DistributiveOmit<Props, keyof InlineCodeVariantProps>>]
+  getVariantProps: (props?: InlineCodeVariantProps) => InlineCodeVariantProps
 }
 
-/** Typography - InlineCode style */
+/**
+ * Typography - InlineCode style
+
+
+ */
 export declare const inlineCode: InlineCodeRecipe

package/dist/styled-system/recipes/inline-code.mjs

@@ -1,4 +1,4 @@
-import { splitProps } from '../helpers.mjs';
+import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const inlineCodeFn = /* @__PURE__ */ createRecipe('inlineCode', {}, [])
@@ -7,9 +7,10 @@ const inlineCodeVariantMap = {}
 
 const inlineCodeVariantKeys = Object.keys(inlineCodeVariantMap)
 
-export const inlineCode = /* @__PURE__ */ Object.assign(inlineCodeFn, {
+export const inlineCode = /* @__PURE__ */ Object.assign(memo(inlineCodeFn.recipeFn), {
   __recipe__: true,
   __name__: 'inlineCode',
+  __getCompoundVariantCss__: inlineCodeFn.__getCompoundVariantCss__,
   raw: (props) => props,
   variantKeys: inlineCodeVariantKeys,
   variantMap: inlineCodeVariantMap,
@@ -19,4 +20,5 @@ export const inlineCode = /* @__PURE__ */ Object.assign(inlineCodeFn, {
   splitVariantProps(props) {
     return splitProps(props, inlineCodeVariantKeys)
   },
+  getVariantProps: inlineCodeFn.getVariantProps,
 })