@chakra-ui/panda-preset 3.3.0

package/dist/esm/utilities.js

@@ -0,0 +1,83 @@
+"use strict";
+import { defineUtilities } from './def.js';
+
+const createFocusRing = (selector) => {
+  return {
+    values: ["outside", "inside", "mixed", "none"],
+    transform(value, { token }) {
+      const focusRingColor = token("colors.colorPalette.focusRing");
+      const styles = {
+        inside: {
+          "--focus-ring-color": focusRingColor,
+          [selector]: {
+            outlineOffset: "0px",
+            outlineWidth: "var(--focus-ring-width, 1px)",
+            outlineColor: "var(--focus-ring-color)",
+            outlineStyle: "var(--focus-ring-style, solid)",
+            borderColor: "var(--focus-ring-color)"
+          }
+        },
+        outside: {
+          "--focus-ring-color": focusRingColor,
+          [selector]: {
+            outlineWidth: "var(--focus-ring-width, 2px)",
+            outlineOffset: "var(--focus-ring-offset, 2px)",
+            outlineStyle: "var(--focus-ring-style, solid)",
+            outlineColor: "var(--focus-ring-color)"
+          }
+        },
+        mixed: {
+          "--focus-ring-color": focusRingColor,
+          [selector]: {
+            outlineWidth: "var(--focus-ring-width, 3px)",
+            outlineStyle: "var(--focus-ring-style, solid)",
+            outlineColor: "color-mix(in srgb, var(--focus-ring-color), transparent 60%)",
+            borderColor: "var(--focus-ring-color)"
+          }
+        },
+        none: {
+          "--focus-ring-color": focusRingColor,
+          [selector]: {
+            outline: "none"
+          }
+        }
+      };
+      return styles[value] ?? {};
+    }
+  };
+};
+const utilities = defineUtilities({
+  focusRing: createFocusRing("&:is(:focus, [data-focus])"),
+  focusVisibleRing: createFocusRing(
+    "&:is(:focus-visible, [data-focus-visible])"
+  ),
+  focusRingColor: {
+    values: "colors",
+    transform(value, { utils }) {
+      const prop = "--focus-ring-color";
+      const mix = utils.colorMix(value);
+      if (mix.invalid) return { [prop]: value };
+      const cssVar = "--mix-" + prop;
+      return {
+        [cssVar]: mix.value,
+        [prop]: `var(${cssVar}, ${mix.color})`
+      };
+    }
+  },
+  focusRingOffset: {
+    values: "spacing",
+    transform: (v) => ({ "--focus-ring-offset": v })
+  },
+  focusRingWidth: {
+    values: "borderWidths",
+    property: "outlineWidth",
+    transform: (v) => ({ "--focus-ring-width": v })
+  },
+  focusRingStyle: {
+    values: "borderStyles",
+    property: "outlineStyle",
+    transform: (v) => ({ "--focus-ring-style": v })
+  }
+});
+
+export { utilities };

package/dist/types/animation-styles.d.ts

@@ -0,0 +1 @@
+export declare const animationStyles: any;

package/dist/types/breakpoints.d.ts

@@ -0,0 +1,7 @@
+export declare const breakpoints: {
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+    "2xl": string;
+};

package/dist/types/def.d.ts

@@ -0,0 +1,18 @@
+import type { Config, GlobalStyleObject, Preset, RecipeConfig, SemanticTokens, SlotRecipeConfig, Tokens, UtilityConfig } from "@pandacss/types";
+export declare const defineConfig: (config: Config) => Config;
+export declare const defineRecipe: (recipes: RecipeConfig) => RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+export declare const defineSlotRecipe: (slotRecipes: SlotRecipeConfig) => SlotRecipeConfig;
+export declare const defineTextStyles: (textStyles: any) => any;
+export declare const defineLayerStyles: (layerStyles: any) => any;
+export declare const defineAnimationStyles: (animationStyles: any) => any;
+export declare const defineGlobalStyles: (globalStyles: GlobalStyleObject) => GlobalStyleObject;
+type ProxyValue<T> = {
+    <Value>(definition: Value extends T ? Value : T): Value;
+} & {
+    [K in keyof Required<T>]: <Value>(definition: Value extends T[K] ? Value : T[K]) => Value;
+};
+export declare const defineTokens: ProxyValue<Tokens>;
+export declare const defineSemanticTokens: ProxyValue<SemanticTokens>;
+export declare const definePreset: (preset: Preset) => Preset;
+export declare const defineUtilities: (utilities: UtilityConfig) => UtilityConfig;
+export {};

package/dist/types/global-css.d.ts

@@ -0,0 +1 @@
+export declare const globalCss: import("@pandacss/types").GlobalStyleObject;

package/dist/types/index.d.mts

@@ -0,0 +1,2 @@
+declare const _default: import("@pandacss/types").Preset;
+export default _default;

package/dist/types/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("@pandacss/types").Preset;
+export default _default;

package/dist/types/keyframes.d.ts

@@ -0,0 +1,255 @@
+export declare const keyframes: {
+    spin: {
+        "0%": {
+            transform: string;
+        };
+        "100%": {
+            transform: string;
+        };
+    };
+    pulse: {
+        "50%": {
+            opacity: string;
+        };
+    };
+    ping: {
+        "75%, 100%": {
+            transform: string;
+            opacity: string;
+        };
+    };
+    bounce: {
+        "0%, 100%": {
+            transform: string;
+            animationTimingFunction: string;
+        };
+        "50%": {
+            transform: string;
+            animationTimingFunction: string;
+        };
+    };
+    "bg-position": {
+        from: {
+            backgroundPosition: string;
+        };
+        to: {
+            backgroundPosition: string;
+        };
+    };
+    position: {
+        from: {
+            insetInlineStart: string;
+            insetBlockStart: string;
+        };
+        to: {
+            insetInlineStart: string;
+            insetBlockStart: string;
+        };
+    };
+    "circular-progress": {
+        "0%": {
+            strokeDasharray: string;
+            strokeDashoffset: string;
+        };
+        "50%": {
+            strokeDasharray: string;
+            strokeDashoffset: string;
+        };
+        "100%": {
+            strokeDasharray: string;
+            strokeDashoffset: string;
+        };
+    };
+    "expand-height": {
+        from: {
+            height: string;
+        };
+        to: {
+            height: string;
+        };
+    };
+    "collapse-height": {
+        from: {
+            height: string;
+        };
+        to: {
+            height: string;
+        };
+    };
+    "expand-width": {
+        from: {
+            width: string;
+        };
+        to: {
+            width: string;
+        };
+    };
+    "collapse-width": {
+        from: {
+            height: string;
+        };
+        to: {
+            height: string;
+        };
+    };
+    "fade-in": {
+        from: {
+            opacity: number;
+        };
+        to: {
+            opacity: number;
+        };
+    };
+    "fade-out": {
+        from: {
+            opacity: number;
+        };
+        to: {
+            opacity: number;
+        };
+    };
+    "slide-from-left-full": {
+        from: {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-from-right-full": {
+        from: {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-from-top-full": {
+        from: {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-from-bottom-full": {
+        from: {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-to-left-full": {
+        from: {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-to-right-full": {
+        from: {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-to-top-full": {
+        from: {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-to-bottom-full": {
+        from: {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-from-top": {
+        "0%": {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-from-bottom": {
+        "0%": {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-from-left": {
+        "0%": {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-from-right": {
+        "0%": {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-to-top": {
+        "0%": {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-to-bottom": {
+        "0%": {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-to-left": {
+        "0%": {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "slide-to-right": {
+        "0%": {
+            translate: string;
+        };
+        to: {
+            translate: string;
+        };
+    };
+    "scale-in": {
+        from: {
+            scale: string;
+        };
+        to: {
+            scale: string;
+        };
+    };
+    "scale-out": {
+        from: {
+            scale: string;
+        };
+        to: {
+            scale: string;
+        };
+    };
+};

package/dist/types/layer-styles.d.ts

@@ -0,0 +1 @@
+export declare const layerStyles: any;

package/dist/types/recipes/badge.d.ts

@@ -0,0 +1 @@
+export declare const badgeRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/button.d.ts

@@ -0,0 +1 @@
+export declare const buttonRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/checkmark.d.ts

@@ -0,0 +1 @@
+export declare const checkmarkRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/code.d.ts

@@ -0,0 +1 @@
+export declare const codeRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/color-swatch.d.ts

@@ -0,0 +1 @@
+export declare const colorSwatchRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/container.d.ts

@@ -0,0 +1 @@
+export declare const containerRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/heading.d.ts

@@ -0,0 +1 @@
+export declare const headingRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/icon.d.ts

@@ -0,0 +1 @@
+export declare const iconRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/index.d.ts

@@ -0,0 +1,21 @@
+export declare const recipes: {
+    badge: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    button: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    code: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    container: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    heading: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    input: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    inputAddon: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    kbd: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    link: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    mark: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    separator: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    skeleton: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    skipNavLink: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    spinner: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    textarea: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    icon: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    checkmark: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    radiomark: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+    colorSwatch: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;
+};

package/dist/types/recipes/input-addon.d.ts

@@ -0,0 +1 @@
+export declare const inputAddonRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/input.d.ts

@@ -0,0 +1 @@
+export declare const inputRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/kbd.d.ts

@@ -0,0 +1 @@
+export declare const kbdRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/link.d.ts

@@ -0,0 +1 @@
+export declare const linkRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/mark.d.ts

@@ -0,0 +1 @@
+export declare const markRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/radiomark.d.ts

@@ -0,0 +1 @@
+export declare const radiomarkRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/separator.d.ts

@@ -0,0 +1 @@
+export declare const separatorRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/skeleton.d.ts

@@ -0,0 +1 @@
+export declare const skeletonRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/skip-nav-link.d.ts

@@ -0,0 +1 @@
+export declare const skipNavLinkRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/spinner.d.ts

@@ -0,0 +1 @@
+export declare const spinnerRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;

package/dist/types/recipes/textarea.d.ts

@@ -0,0 +1 @@
+export declare const textareaRecipe: import("@pandacss/types").RecipeConfig<import("@pandacss/types").RecipeVariantRecord>;