@mekari/pixel3-styled-system 0.1.2 → 0.1.3-dev.1

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @mekari/pixel3-styled-system
 
+## 0.1.3-dev.1
+
+### Patch Changes
+
+- 6e300fa: Generate new styled
+
+## 0.1.3-dev.0
+
+### Patch Changes
+
+- 28f1adb: - Update divider recipe.
+- 7b100db: Fix visual disabled state
+
 ## 0.1.2
 
 ### Patch Changes

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mekari/pixel3-styled-system",
   "description": "This package is auto-generated by Panda CSS",
-  "version": "0.1.2",
+  "version": "0.1.3-dev.1",
   "type": "module",
   "publishConfig": {
     "access": "public"

package/recipes/button-recipe.mjs

@@ -66,13 +66,17 @@ const buttonRecipeFn = /* @__PURE__ */ createRecipe('button', {
           "background": "gray.50",
           "borderColor": "gray.50",
           "_hasIcon": {
-            "background": "transparent",
-            "borderColor": "transparent"
+            "&:not([data-has-label=true])": {
+              "background": "transparent",
+              "borderColor": "transparent"
+            }
           }
         },
         "_hasIcon": {
-          "background": "transparent",
-          "borderColor": "transparent"
+          "&:not([data-has-label=true])": {
+            "background": "transparent",
+            "borderColor": "transparent"
+          }
         },
         "_nextTheme": {
           "color": "text.disabled",
@@ -82,13 +86,17 @@ const buttonRecipeFn = /* @__PURE__ */ createRecipe('button', {
             "background": "background.disabled",
             "borderColor": "background.disabled",
             "_hasIcon": {
-              "background": "transparent",
-              "borderColor": "transparent"
+              "&:not([data-has-label=true])": {
+                "background": "transparent",
+                "borderColor": "transparent"
+              }
             }
           },
           "_hasIcon": {
-            "background": "transparent",
-            "borderColor": "transparent"
+            "&:not([data-has-label=true])": {
+              "background": "transparent",
+              "borderColor": "transparent"
+            }
           }
         }
       }

package/recipes/index.d.ts

@@ -26,6 +26,7 @@ export * from './month-item-recipe';
 export * from './year-item-recipe';
 export * from './time-item-recipe';
 export * from './textlink-recipe';
+export * from './skeleton-recipe';
 export * from './accordion-slot-recipe';
 export * from './checkbox-slot-recipe';
 export * from './divider-slot-recipe';

package/recipes/index.mjs

@@ -25,6 +25,7 @@ export * from './month-item-recipe.mjs';
 export * from './year-item-recipe.mjs';
 export * from './time-item-recipe.mjs';
 export * from './textlink-recipe.mjs';
+export * from './skeleton-recipe.mjs';
 export * from './accordion-slot-recipe.mjs';
 export * from './checkbox-slot-recipe.mjs';
 export * from './divider-slot-recipe.mjs';

package/recipes/skeleton-recipe.d.ts

@@ -0,0 +1,31 @@
+/* eslint-disable */
+import type { ConditionalValue } from '../types/index';
+import type { DistributiveOmit, Pretty } from '../types/system-types';
+
+interface SkeletonRecipeVariant {
+  /**
+ * @default "gray"
+ */
+color: "gray" | "blue" | "purple"
+}
+
+type SkeletonRecipeVariantMap = {
+  [key in keyof SkeletonRecipeVariant]: Array<SkeletonRecipeVariant[key]>
+}
+
+export type SkeletonRecipeVariantProps = {
+  [key in keyof SkeletonRecipeVariant]?: SkeletonRecipeVariant[key] | undefined
+}
+
+export interface SkeletonRecipeRecipe {
+  __type: SkeletonRecipeVariantProps
+  (props?: SkeletonRecipeVariantProps): string
+  raw: (props?: SkeletonRecipeVariantProps) => SkeletonRecipeVariantProps
+  variantMap: SkeletonRecipeVariantMap
+  variantKeys: Array<keyof SkeletonRecipeVariant>
+  splitVariantProps<Props extends SkeletonRecipeVariantProps>(props: Props): [SkeletonRecipeVariantProps, Pretty<DistributiveOmit<Props, keyof SkeletonRecipeVariantProps>>]
+  getVariantProps: (props?: SkeletonRecipeVariantProps) => SkeletonRecipeVariantProps
+}
+
+
+export declare const skeletonRecipe: SkeletonRecipeRecipe

package/recipes/skeleton-recipe.mjs

@@ -0,0 +1,52 @@
+import { memo, splitProps } from '../helpers.mjs';
+import { createRecipe, mergeRecipes } from './create-recipe.mjs';
+
+const skeletonRecipeFn = /* @__PURE__ */ createRecipe('skeleton', {
+  "color": "gray"
+}, [
+  {
+    "color": [
+      "gray",
+      "blue",
+      "purple"
+    ],
+    "css": {
+      "&:is([data-has-children=true])": {
+        "&:is([data-loading=false])": {
+          "background": "unset",
+          "pointerEvents": "auto",
+          "userSelect": "auto",
+          "& *": {
+            "visibility": "visible"
+          }
+        }
+      }
+    }
+  }
+])
+
+const skeletonRecipeVariantMap = {
+  "color": [
+    "gray",
+    "blue",
+    "purple"
+  ]
+}
+
+const skeletonRecipeVariantKeys = Object.keys(skeletonRecipeVariantMap)
+
+export const skeletonRecipe = /* @__PURE__ */ Object.assign(memo(skeletonRecipeFn.recipeFn), {
+  __recipe__: true,
+  __name__: 'skeletonRecipe',
+  __getCompoundVariantCss__: skeletonRecipeFn.__getCompoundVariantCss__,
+  raw: (props) => props,
+  variantKeys: skeletonRecipeVariantKeys,
+  variantMap: skeletonRecipeVariantMap,
+  merge(recipe) {
+    return mergeRecipes(this, recipe)
+  },
+  splitVariantProps(props) {
+    return splitProps(props, skeletonRecipeVariantKeys)
+  },
+  getVariantProps: skeletonRecipeFn.getVariantProps,
+})

package/types/prop-type.d.ts

@@ -143,7 +143,7 @@ export interface UtilityValues {
 	transitionDelay: Tokens["durations"];
 	transitionDuration: Tokens["durations"];
 	transition: "all" | "common" | "background" | "colors" | "opacity" | "shadow" | "transform";
-	animationName: "fade-in" | "fade-out" | "spin" | "border-shine";
+	animationName: "fade-in" | "fade-out" | "spin" | "border-shine" | "shimmer";
 	animationDuration: Tokens["durations"];
 	animationDelay: Tokens["durations"];
 	rotate: "auto" | "auto-3d" | CssProperties["rotate"];