@likec4/styles 1.41.0 → 1.42.1

package/css/package.json

@@ -0,0 +1,4 @@
+{
+  "types": "../dist/css/index.d.ts",
+  "module": "../dist/css/index.mjs"
+}

package/dist/jsx/create-style-context.d.ts

@@ -1,11 +1,11 @@
 /* eslint-disable */
 import type { SlotRecipeRuntimeFn, RecipeVariantProps } from '../types/recipe';
 import type { JsxHTMLProps, JsxStyleProps, Assign } from '../types/system-types';
-import type { JsxFactoryOptions } from '../types/jsx';
-import type { ComponentType, ElementType, ComponentPropsWithoutRef, ElementRef, Ref } from 'react'
+import type { JsxFactoryOptions, ComponentProps } from '../types/jsx';
+import type { ComponentType, ElementType } from 'react'
 
 interface UnstyledProps {
-  unstyled?: boolean
+  unstyled?: boolean | undefined
 }
 
 type SvaFn<S extends string = any> = SlotRecipeRuntimeFn<S, any>
@@ -18,29 +18,36 @@ type SlotRecipe = SvaFn | SlotRecipeFn
 
 type InferSlot<R extends SlotRecipe> = R extends SlotRecipeFn ? R['__slot'] : R extends SvaFn<infer S> ? S : never
 
-type ComponentProps<T extends ElementType> = Omit<ComponentPropsWithoutRef<T>, 'ref'> & {
-  ref?: Ref<ElementRef<T>>
+interface WithProviderOptions<P = {}> {
+  defaultProps?: Partial<P> | undefined
 }
 
 type StyleContextProvider<T extends ElementType, R extends SlotRecipe> = ComponentType<
   JsxHTMLProps<ComponentProps<T> & UnstyledProps, Assign<RecipeVariantProps<R>, JsxStyleProps>>
 >
 
+type StyleContextRootProvider<T extends ElementType, R extends SlotRecipe> = ComponentType<
+  ComponentProps<T> & UnstyledProps & RecipeVariantProps<R>
+>
+
 type StyleContextConsumer<T extends ElementType> = ComponentType<
   JsxHTMLProps<ComponentProps<T> & UnstyledProps, JsxStyleProps>
 >
 
 export interface StyleContext<R extends SlotRecipe> {
-  withRootProvider: <T extends ElementType>(Component: T) => StyleContextProvider<T, R>
+  withRootProvider: <T extends ElementType>(
+    Component: T,
+    options?: WithProviderOptions<ComponentProps<T>> | undefined
+  ) => StyleContextRootProvider<T, R>
   withProvider: <T extends ElementType>(
     Component: T,
     slot: InferSlot<R>,
-    options?: JsxFactoryOptions<ComponentProps<T>>
+    options?: JsxFactoryOptions<ComponentProps<T>> | undefined
   ) => StyleContextProvider<T, R>
   withContext: <T extends ElementType>(
     Component: T,
     slot: InferSlot<R>,
-    options?: JsxFactoryOptions<ComponentProps<T>>
+    options?: JsxFactoryOptions<ComponentProps<T>> | undefined
   ) => StyleContextConsumer<T>
 }
 

package/dist/jsx/create-style-context.mjs

@@ -19,16 +19,20 @@ export function createStyleContext(recipe) {
     return { ...slotStyles, ...restProps }
   }
 
-  const withRootProvider = (Component) => {
+  const withRootProvider = (Component, options) => {
     const WithRootProvider = (props) => {
       const [variantProps, otherProps] = svaFn.splitVariantProps(props)
       
       const slotStyles = isConfigRecipe ? svaFn(variantProps) : svaFn.raw(variantProps)
       slotStyles._classNameMap = svaFn.classNameMap
 
+      const mergedProps = options?.defaultProps 
+        ? { ...options.defaultProps, ...otherProps } 
+        : otherProps
+
       return createElement(StyleContext.Provider, {
         value: slotStyles,
-        children: createElement(Component, otherProps)
+        children: createElement(Component, mergedProps)
       })
     }
     

package/dist/patterns/grid.mjs

@@ -15,7 +15,7 @@ transform(props, { map, isCssUnit }) {
   };
 },
 defaultValues(props) {
-  return { gap: props.columnGap || props.rowGap ? void 0 : "10px" };
+  return { gap: props.columnGap || props.rowGap ? void 0 : "8px" };
 }}
 
 export const getGridStyle = (styles = {}) => {

package/dist/patterns/stack.mjs

@@ -13,7 +13,7 @@ transform(props) {
     ...rest
   };
 },
-defaultValues:{direction:'column',gap:'10px'}}
+defaultValues:{direction:'column',gap:'8px'}}
 
 export const getStackStyle = (styles = {}) => {
   const _styles = getPatternStyles(stackConfig, styles)

package/dist/patterns/wrap.mjs

@@ -3,7 +3,7 @@ import { css } from '../css/index.mjs';
 
 const wrapConfig = {
 transform(props) {
-  const { columnGap, rowGap, gap = columnGap || rowGap ? void 0 : "10px", align, justify, ...rest } = props;
+  const { columnGap, rowGap, gap = columnGap || rowGap ? void 0 : "8px", align, justify, ...rest } = props;
   return {
     display: "flex",
     flexWrap: "wrap",

package/dist/preset.d.mts

@@ -7,7 +7,7 @@ declare const compoundNode: _pandacss_types.RecipeConfig<_pandacss_types.RecipeV
 
 declare const edgeActionBtn: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
 
-declare const elementNodeIcon: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+declare const elementNodeData: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
 
 declare const elementShapeRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
 
@@ -17,29 +17,29 @@ declare const markdownBlock: _pandacss_types.RecipeConfig<_pandacss_types.Recipe
 
 declare const navigationPanelActionIcon: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
 
+declare const overlay: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+
 declare const recipes_actionBtn: typeof actionBtn;
 declare const recipes_compoundNode: typeof compoundNode;
 declare const recipes_edgeActionBtn: typeof edgeActionBtn;
-declare const recipes_elementNodeIcon: typeof elementNodeIcon;
+declare const recipes_elementNodeData: typeof elementNodeData;
 declare const recipes_elementShapeRecipe: typeof elementShapeRecipe;
 declare const recipes_likec4tag: typeof likec4tag;
 declare const recipes_markdownBlock: typeof markdownBlock;
 declare const recipes_navigationPanelActionIcon: typeof navigationPanelActionIcon;
+declare const recipes_overlay: typeof overlay;
 declare namespace recipes {
-  export { recipes_actionBtn as actionBtn, recipes_compoundNode as compoundNode, recipes_edgeActionBtn as edgeActionBtn, recipes_elementNodeIcon as elementNodeIcon, recipes_elementShapeRecipe as elementShapeRecipe, recipes_likec4tag as likec4tag, recipes_markdownBlock as markdownBlock, recipes_navigationPanelActionIcon as navigationPanelActionIcon };
+  export { recipes_actionBtn as actionBtn, recipes_compoundNode as compoundNode, recipes_edgeActionBtn as edgeActionBtn, recipes_elementNodeData as elementNodeData, recipes_elementShapeRecipe as elementShapeRecipe, recipes_likec4tag as likec4tag, recipes_markdownBlock as markdownBlock, recipes_navigationPanelActionIcon as navigationPanelActionIcon, recipes_overlay as overlay };
 }
 
 declare const edgeLabel: _pandacss_types.SlotRecipeConfig;
 
-declare const elementNodeData: _pandacss_types.SlotRecipeConfig;
-
 declare const navigationLink: _pandacss_types.SlotRecipeConfig;
 
 declare const slotRecipes_edgeLabel: typeof edgeLabel;
-declare const slotRecipes_elementNodeData: typeof elementNodeData;
 declare const slotRecipes_navigationLink: typeof navigationLink;
 declare namespace slotRecipes {
-  export { slotRecipes_edgeLabel as edgeLabel, slotRecipes_elementNodeData as elementNodeData, slotRecipes_navigationLink as navigationLink };
+  export { slotRecipes_edgeLabel as edgeLabel, slotRecipes_navigationLink as navigationLink };
 }
 
 declare const theme: {
@@ -1020,13 +1020,6 @@ declare const theme: {
                                 _dark: string;
                             };
                         };
-                        whenPanning: {
-                            description: string;
-                            value: {
-                                base: string;
-                                _dark: string;
-                            };
-                        };
                     };
                     border: {
                         description: string;
@@ -1083,6 +1076,27 @@ declare const theme: {
                         value: string;
                     };
                 };
+                overlay: {
+                    backdrop: {
+                        DEFAULT: {
+                            description: string;
+                            value: {
+                                base: string;
+                                _light: string;
+                            };
+                        };
+                    };
+                    body: {
+                        DEFAULT: {
+                            description: string;
+                            value: string;
+                        };
+                    };
+                    border: {
+                        description: string;
+                        value: string;
+                    };
+                };
             };
         };
     };