@mekari/pixel3-theme 0.0.1-alpha.0 → 0.0.2

package/dist/recipes/banner.d.mts

@@ -0,0 +1,10 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const bannerSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const bannerTitleRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const bannerDescriptionRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const bannerIconSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const bannerLinkRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const bannerCloseButtonRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+
+export { bannerCloseButtonRecipe, bannerDescriptionRecipe, bannerIconSlotRecipe, bannerLinkRecipe, bannerSlotRecipe, bannerTitleRecipe };

package/dist/recipes/banner.d.ts

@@ -0,0 +1,10 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const bannerSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const bannerTitleRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const bannerDescriptionRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const bannerIconSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const bannerLinkRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const bannerCloseButtonRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+
+export { bannerCloseButtonRecipe, bannerDescriptionRecipe, bannerIconSlotRecipe, bannerLinkRecipe, bannerSlotRecipe, bannerTitleRecipe };

package/dist/recipes/divider.d.mts

@@ -0,0 +1,5 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const dividerRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+
+export { dividerRecipe };

package/dist/recipes/divider.d.ts

@@ -0,0 +1,5 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const dividerRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+
+export { dividerRecipe };

package/dist/recipes/dropzone.d.mts

@@ -0,0 +1,5 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const dropzoneSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+
+export { dropzoneSlotRecipe };

package/dist/recipes/dropzone.d.ts

@@ -0,0 +1,5 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const dropzoneSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+
+export { dropzoneSlotRecipe };

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

@@ -0,0 +1,5 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const formControlSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+
+export { formControlSlotRecipe };

package/dist/recipes/form-control.d.ts

@@ -0,0 +1,5 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const formControlSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+
+export { formControlSlotRecipe };

package/dist/recipes/index.d.mts

@@ -17,6 +17,11 @@ declare const recipes: {
     selectedBorderRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
     tableRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
     tableContainerRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    dividerRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    bannerTitleRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    bannerDescriptionRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    bannerLinkRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    bannerCloseButtonRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
 };
 declare const slotRecipes: {
     accordion: _pandacss_types.SlotRecipeConfig;
@@ -32,6 +37,14 @@ declare const slotRecipes: {
     avatarSlotRecipe: _pandacss_types.SlotRecipeConfig;
     avatarGroupSlotRecipe: _pandacss_types.SlotRecipeConfig;
     selectSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    formControlSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    inputTagSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    modalSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    uploadSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    uploadListSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    dropzoneSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    bannerSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    bannerIconSlotRecipe: _pandacss_types.SlotRecipeConfig;
 };
 
 export { recipes, slotRecipes };

package/dist/recipes/index.d.ts

@@ -17,6 +17,11 @@ declare const recipes: {
     selectedBorderRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
     tableRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
     tableContainerRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    dividerRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    bannerTitleRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    bannerDescriptionRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    bannerLinkRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    bannerCloseButtonRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
 };
 declare const slotRecipes: {
     accordion: _pandacss_types.SlotRecipeConfig;
@@ -32,6 +37,14 @@ declare const slotRecipes: {
     avatarSlotRecipe: _pandacss_types.SlotRecipeConfig;
     avatarGroupSlotRecipe: _pandacss_types.SlotRecipeConfig;
     selectSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    formControlSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    inputTagSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    modalSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    uploadSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    uploadListSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    dropzoneSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    bannerSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    bannerIconSlotRecipe: _pandacss_types.SlotRecipeConfig;
 };
 
 export { recipes, slotRecipes };

package/dist/recipes/input-tag.d.mts

@@ -0,0 +1,5 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const inputTagSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+
+export { inputTagSlotRecipe };

package/dist/recipes/input-tag.d.ts

@@ -0,0 +1,5 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const inputTagSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+
+export { inputTagSlotRecipe };

package/dist/recipes/modal.d.mts

@@ -0,0 +1,5 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const modalSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+
+export { modalSlotRecipe };

package/dist/recipes/modal.d.ts

@@ -0,0 +1,5 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const modalSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+
+export { modalSlotRecipe };

package/dist/recipes/upload.d.mts

@@ -0,0 +1,6 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const uploadSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const uploadListSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+
+export { uploadListSlotRecipe, uploadSlotRecipe };

package/dist/recipes/upload.d.ts

@@ -0,0 +1,6 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const uploadSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const uploadListSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+
+export { uploadListSlotRecipe, uploadSlotRecipe };

package/dist/tokens/colors.d.mts

@@ -61,6 +61,70 @@ declare const colors: {
             description: string;
         };
     };
+    whiteAlpha: {
+        50: {
+            value: string;
+        };
+        100: {
+            value: string;
+        };
+        200: {
+            value: string;
+        };
+        300: {
+            value: string;
+        };
+        400: {
+            value: string;
+        };
+        500: {
+            value: string;
+        };
+        600: {
+            value: string;
+        };
+        700: {
+            value: string;
+        };
+        800: {
+            value: string;
+        };
+        900: {
+            value: string;
+        };
+    };
+    blackAplpha: {
+        50: {
+            value: string;
+        };
+        100: {
+            value: string;
+        };
+        200: {
+            value: string;
+        };
+        300: {
+            value: string;
+        };
+        400: {
+            value: string;
+        };
+        500: {
+            value: string;
+        };
+        600: {
+            value: string;
+        };
+        700: {
+            value: string;
+        };
+        800: {
+            value: string;
+        };
+        900: {
+            value: string;
+        };
+    };
     gray: {
         25: {
             value: string;

package/dist/tokens/colors.d.ts

@@ -61,6 +61,70 @@ declare const colors: {
             description: string;
         };
     };
+    whiteAlpha: {
+        50: {
+            value: string;
+        };
+        100: {
+            value: string;
+        };
+        200: {
+            value: string;
+        };
+        300: {
+            value: string;
+        };
+        400: {
+            value: string;
+        };
+        500: {
+            value: string;
+        };
+        600: {
+            value: string;
+        };
+        700: {
+            value: string;
+        };
+        800: {
+            value: string;
+        };
+        900: {
+            value: string;
+        };
+    };
+    blackAplpha: {
+        50: {
+            value: string;
+        };
+        100: {
+            value: string;
+        };
+        200: {
+            value: string;
+        };
+        300: {
+            value: string;
+        };
+        400: {
+            value: string;
+        };
+        500: {
+            value: string;
+        };
+        600: {
+            value: string;
+        };
+        700: {
+            value: string;
+        };
+        800: {
+            value: string;
+        };
+        900: {
+            value: string;
+        };
+    };
     gray: {
         25: {
             value: string;

package/dist/tokens/index.d.mts

@@ -76,6 +76,70 @@ declare const tokens: {
                 description: string;
             };
         };
+        whiteAlpha: {
+            50: {
+                value: string;
+            };
+            100: {
+                value: string;
+            };
+            200: {
+                value: string;
+            };
+            300: {
+                value: string;
+            };
+            400: {
+                value: string;
+            };
+            500: {
+                value: string;
+            };
+            600: {
+                value: string;
+            };
+            700: {
+                value: string;
+            };
+            800: {
+                value: string;
+            };
+            900: {
+                value: string;
+            };
+        };
+        blackAplpha: {
+            50: {
+                value: string;
+            };
+            100: {
+                value: string;
+            };
+            200: {
+                value: string;
+            };
+            300: {
+                value: string;
+            };
+            400: {
+                value: string;
+            };
+            500: {
+                value: string;
+            };
+            600: {
+                value: string;
+            };
+            700: {
+                value: string;
+            };
+            800: {
+                value: string;
+            };
+            900: {
+                value: string;
+            };
+        };
         gray: {
             25: {
                 value: string;
@@ -538,6 +602,10 @@ declare const tokens: {
             value: string;
             description: string;
         };
+        56: {
+            value: string;
+            description: string;
+        };
         65: {
             value: string;
             description: string;
@@ -545,6 +613,9 @@ declare const tokens: {
         full: {
             value: string;
         };
+        sm: {
+            value: string;
+        };
     };
     spacing: {
         0: {

package/dist/tokens/index.d.ts

@@ -76,6 +76,70 @@ declare const tokens: {
                 description: string;
             };
         };
+        whiteAlpha: {
+            50: {
+                value: string;
+            };
+            100: {
+                value: string;
+            };
+            200: {
+                value: string;
+            };
+            300: {
+                value: string;
+            };
+            400: {
+                value: string;
+            };
+            500: {
+                value: string;
+            };
+            600: {
+                value: string;
+            };
+            700: {
+                value: string;
+            };
+            800: {
+                value: string;
+            };
+            900: {
+                value: string;
+            };
+        };
+        blackAplpha: {
+            50: {
+                value: string;
+            };
+            100: {
+                value: string;
+            };
+            200: {
+                value: string;
+            };
+            300: {
+                value: string;
+            };
+            400: {
+                value: string;
+            };
+            500: {
+                value: string;
+            };
+            600: {
+                value: string;
+            };
+            700: {
+                value: string;
+            };
+            800: {
+                value: string;
+            };
+            900: {
+                value: string;
+            };
+        };
         gray: {
             25: {
                 value: string;
@@ -538,6 +602,10 @@ declare const tokens: {
             value: string;
             description: string;
         };
+        56: {
+            value: string;
+            description: string;
+        };
         65: {
             value: string;
             description: string;
@@ -545,6 +613,9 @@ declare const tokens: {
         full: {
             value: string;
         };
+        sm: {
+            value: string;
+        };
     };
     spacing: {
         0: {

package/dist/tokens/sizes.d.mts

@@ -83,6 +83,10 @@ declare const sizes: {
         value: string;
         description: string;
     };
+    56: {
+        value: string;
+        description: string;
+    };
     65: {
         value: string;
         description: string;
@@ -90,6 +94,9 @@ declare const sizes: {
     full: {
         value: string;
     };
+    sm: {
+        value: string;
+    };
 };
 
 export { sizes };

package/dist/tokens/sizes.d.ts

@@ -83,6 +83,10 @@ declare const sizes: {
         value: string;
         description: string;
     };
+    56: {
+        value: string;
+        description: string;
+    };
     65: {
         value: string;
         description: string;
@@ -90,6 +94,9 @@ declare const sizes: {
     full: {
         value: string;
     };
+    sm: {
+        value: string;
+    };
 };
 
 export { sizes };

package/package.json

@@ -1,20 +1,21 @@
 {
   "name": "@mekari/pixel3-theme",
   "description": "Theme for mekari pixel 3",
-  "version": "0.0.1-alpha.0",
+  "version": "0.0.2",
   "main": "dist/index.js",
   "license": "MIT",
   "files": [
-    "dist"
+    "dist",
+    "src"
   ],
   "dependencies": {
-    "@pandacss/dev": "0.20.1"
+    "@pandacss/dev": "0.22.1"
   },
   "peerDependencies": {
     "vue": "^3.3.7"
   },
   "devDependencies": {
-    "@pandacss/types": "0.20.1",
+    "@pandacss/types": "0.22.1",
     "vue": "^3.3.7"
   },
   "publishConfig": {

package/src/breakpoints.ts

@@ -0,0 +1,6 @@
+export const breakpoints = {
+  sm: '22.5em',
+  md: '48em',
+  lg: '64em',
+  xl: '80em'
+}

package/src/conditions.ts

@@ -0,0 +1,22 @@
+export const conditions = {
+  extend: {
+    disabled: '&:is(:disabled, [disabled], [aria-disabled=true], [data-disabled])',
+    invalid: '&:is(:invalid, [aria-invalid=true], [data-invalid])',
+    checked: '&:is(:checked, [data-checked], [aria-checked=true], [data-state=checked])',
+    indeterminate:
+      '&:is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state=indeterminate])',
+    closed: '&:is([data-state=closed])',
+    open: '&:is([open], [data-state=open])',
+    hidden: '&:is([hidden])',
+    collapsed: '&:is([aria-collapsed=true], [data-collapsed], [data-state="collapsed"])',
+    loading: '& > [data-loading=true], &:is([data-loading], [aria-busy=true])',
+    hasIcon: '&[data-has-icon=true]',
+    active: '&[data-active=true], [data-active]',
+    highlight: '&[data-highlight=true], [data-highlight]',
+    hasBorder: '&[data-has-border=true]',
+    hasBackground: '&[data-has-background=true]',
+    isFullWidth: '&[data-is-full-width=true]',
+    placementLeft: '&[data-placement=left]',
+    placementRight: '&[data-placement=right]'
+  }
+}

package/src/global-css.ts

@@ -0,0 +1,23 @@
+import { defineGlobalStyles } from '@pandacss/dev'
+
+export const globalCss = defineGlobalStyles({
+  html: {
+    MozOsxFontSmoothing: 'grayscale',
+    textRendering: 'optimizeLegibility',
+    WebkitFontSmoothing: 'antialiased',
+    WebkitTextSizeAdjust: '100%'
+  },
+  body: {
+    background: 'var(--mp-colors-white)',
+    color: 'var(--mp-colors-dark)',
+    fontFamily: 'var(--mp-fonts-body)',
+    fontSize: '14px',
+    _dark: {
+      colorScheme: 'dark'
+    }
+  },
+  '*, *::before, *::after': {
+    borderStyle: 'solid',
+    boxSizing: 'border-box'
+  }
+})

package/src/index.ts

@@ -0,0 +1,26 @@
+import { definePreset } from '@pandacss/dev'
+import type { Preset } from '@pandacss/types'
+import { breakpoints } from './breakpoints'
+import { conditions } from './conditions'
+import { globalCss } from './global-css'
+import { keyframes } from './keyframes'
+import { recipes, slotRecipes } from './recipes'
+import { textStyles } from './text-styles'
+import { tokens } from './tokens'
+
+const preset: Preset = definePreset({
+  theme: {
+    extend: {
+      breakpoints,
+      keyframes,
+      textStyles,
+      tokens,
+      recipes,
+      slotRecipes
+    }
+  },
+  conditions,
+  globalCss
+})
+
+export default preset

package/src/keyframes.ts

@@ -0,0 +1,15 @@
+import { defineKeyframes } from '@pandacss/dev'
+
+export const keyframes = defineKeyframes({
+  'fade-in': {
+    from: { opacity: '0' },
+    to: { opacity: '1' }
+  },
+  'fade-out': {
+    from: { opacity: '1' },
+    to: { opacity: '0' }
+  },
+  spin: {
+    '100%': { transform: 'rotate(1turn)' }
+  }
+})