@mekari/pixel3-theme 0.3.0-dev.3 → 0.3.0-dev.4

package/dist/index.js

@@ -25,7 +25,7 @@ __export(theme_exports, {
 module.exports = __toCommonJS(theme_exports);
 
 // src/index.ts
-var import_dev68 = require("@pandacss/dev");
+var import_dev69 = require("@pandacss/dev");
 
 // src/breakpoints.ts
 var breakpoints = {
@@ -6229,6 +6229,53 @@ var aireneInputSlotRecipe = (0, import_dev46.defineSlotRecipe)({
   defaultVariants: {}
 });
 
+// src/recipes/airene-chat-bubble.ts
+var import_dev47 = require("@pandacss/dev");
+var aireneBubbleSlotRecipe = (0, import_dev47.defineSlotRecipe)({
+  className: "airene-chat-bubble",
+  jsx: ["MpAireneChatBubble", "mp-airene-chat-bubble"],
+  slots: ["root", "header", "loading", "body", "text"],
+  base: {
+    root: {
+      position: "relative",
+      width: "full",
+      display: "flex",
+      flexDirection: "column",
+      gap: "xs",
+      py: "xs"
+    },
+    header: {
+      display: "flex",
+      alignItems: "center",
+      gap: "xs"
+    },
+    loading: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "2xs"
+    },
+    body: {
+      position: "relative",
+      display: "flex",
+      flexDirection: "column",
+      gap: "sm",
+      padding: "sm",
+      background: "lightPurple",
+      borderRadius: "lg",
+      borderWidth: "1px",
+      borderStyle: "solid",
+      borderColor: "background.neutral.subtle"
+    },
+    text: {
+      display: "flex",
+      gap: "xs"
+    }
+  },
+  variants: {},
+  compoundVariants: [],
+  defaultVariants: {}
+});
+
 // src/recipes/index.ts
 var recipes = {
   buttonRecipe,
@@ -6307,12 +6354,13 @@ var slotRecipes = {
   sliderSlotRecipe,
   tourSlotRecipe,
   aireneButtonSlotRecipe,
-  aireneInputSlotRecipe
+  aireneInputSlotRecipe,
+  aireneBubbleSlotRecipe
 };
 
 // src/text-styles.ts
-var import_dev47 = require("@pandacss/dev");
-var textStyles = (0, import_dev47.defineTextStyles)({
+var import_dev48 = require("@pandacss/dev");
+var textStyles = (0, import_dev48.defineTextStyles)({
   overline: {
     value: {
       fontFamily: "var(--font-inter)",
@@ -6355,11 +6403,11 @@ var textStyles = (0, import_dev47.defineTextStyles)({
 });
 
 // src/tokens/index.ts
-var import_dev58 = require("@pandacss/dev");
+var import_dev59 = require("@pandacss/dev");
 
 // src/tokens/borders.ts
-var import_dev48 = require("@pandacss/dev");
-var borderWidths = import_dev48.defineTokens.borderWidths({
+var import_dev49 = require("@pandacss/dev");
+var borderWidths = import_dev49.defineTokens.borderWidths({
   none: { value: "none" },
   sm: { value: "1px" },
   md: { value: "1.5px" },
@@ -6367,8 +6415,8 @@ var borderWidths = import_dev48.defineTokens.borderWidths({
 });
 
 // src/tokens/colors.ts
-var import_dev49 = require("@pandacss/dev");
-var colors = import_dev49.defineTokens.colors({
+var import_dev50 = require("@pandacss/dev");
+var colors = import_dev50.defineTokens.colors({
   debug: { value: "blue" },
   currentcolor: { value: "currentcolor" },
   dark: { value: "#232933" },
@@ -6510,16 +6558,16 @@ var colors = import_dev49.defineTokens.colors({
 });
 
 // src/tokens/durations.ts
-var import_dev50 = require("@pandacss/dev");
-var durations = import_dev50.defineTokens.durations({
+var import_dev51 = require("@pandacss/dev");
+var durations = import_dev51.defineTokens.durations({
   slow: { value: "100ms" },
   normal: { value: "250ms" },
   fast: { value: "300ms" }
 });
 
 // src/tokens/opacity.ts
-var import_dev51 = require("@pandacss/dev");
-var opacity = import_dev51.defineTokens.opacity({
+var import_dev52 = require("@pandacss/dev");
+var opacity = import_dev52.defineTokens.opacity({
   0: { value: 0 },
   40: { value: 0.4 },
   60: { value: 0.6 },
@@ -6527,8 +6575,8 @@ var opacity = import_dev51.defineTokens.opacity({
 });
 
 // src/tokens/radii.ts
-var import_dev52 = require("@pandacss/dev");
-var radii = import_dev52.defineTokens.radii({
+var import_dev53 = require("@pandacss/dev");
+var radii = import_dev53.defineTokens.radii({
   none: { value: "0" },
   xs: { value: "0.125rem", description: "2px" },
   sm: { value: "0.25rem", description: "4px" },
@@ -6539,8 +6587,8 @@ var radii = import_dev52.defineTokens.radii({
 });
 
 // src/tokens/shadows.ts
-var import_dev53 = require("@pandacss/dev");
-var shadows = import_dev53.defineTokens.shadows({
+var import_dev54 = require("@pandacss/dev");
+var shadows = import_dev54.defineTokens.shadows({
   xs: {
     value: ["0px 0px 2px 0px rgba(0, 0, 0, 0.12)", "0px 2px 4px 0px rgba(0, 0, 0, 0.14)"]
   },
@@ -6580,8 +6628,8 @@ var shadows = import_dev53.defineTokens.shadows({
 });
 
 // src/tokens/sizes.ts
-var import_dev54 = require("@pandacss/dev");
-var sizes = import_dev54.defineTokens.sizes({
+var import_dev55 = require("@pandacss/dev");
+var sizes = import_dev55.defineTokens.sizes({
   0: { value: "0" },
   0.25: { value: "0.0625rem" },
   0.5: { value: "0.125rem" },
@@ -6610,8 +6658,8 @@ var sizes = import_dev54.defineTokens.sizes({
 });
 
 // src/tokens/spacing.ts
-var import_dev55 = require("@pandacss/dev");
-var spacing = import_dev55.defineTokens.spacing({
+var import_dev56 = require("@pandacss/dev");
+var spacing = import_dev56.defineTokens.spacing({
   0: { value: "0" },
   0.5: { value: "0.125rem", description: "2px" },
   1: { value: "0.25rem", description: "4px" },
@@ -6632,8 +6680,8 @@ var spacing = import_dev55.defineTokens.spacing({
 });
 
 // src/tokens/z-index.ts
-var import_dev56 = require("@pandacss/dev");
-var zIndex = import_dev56.defineTokens.zIndex({
+var import_dev57 = require("@pandacss/dev");
+var zIndex = import_dev57.defineTokens.zIndex({
   hide: { value: -1 },
   base: { value: 0 },
   docked: { value: 10 },
@@ -6645,8 +6693,8 @@ var zIndex = import_dev56.defineTokens.zIndex({
 });
 
 // src/tokens/typography.ts
-var import_dev57 = require("@pandacss/dev");
-var fonts = import_dev57.defineTokens.fonts({
+var import_dev58 = require("@pandacss/dev");
+var fonts = import_dev58.defineTokens.fonts({
   body: {
     value: '"Inter", -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif, Segoe UI, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"'
   },
@@ -6654,7 +6702,7 @@ var fonts = import_dev57.defineTokens.fonts({
     value: 'SFMono-Regular, Menlo, Monaco,Consolas, "Liberation Mono", "Courier New", monospace'
   }
 });
-var fontSizes = import_dev57.defineTokens.fontSizes({
+var fontSizes = import_dev58.defineTokens.fontSizes({
   xs: { value: "0.625rem" },
   sm: { value: "0.75rem" },
   md: { value: "0.875rem" },
@@ -6662,12 +6710,12 @@ var fontSizes = import_dev57.defineTokens.fontSizes({
   xl: { value: "1.25rem" },
   "2xl": { value: "1.5rem" }
 });
-var fontWeights = import_dev57.defineTokens.fontWeights({
+var fontWeights = import_dev58.defineTokens.fontWeights({
   regular: { value: "400" },
   semiBold: { value: "600" },
   bold: { value: "800" }
 });
-var lineHeights = import_dev57.defineTokens.lineHeights({
+var lineHeights = import_dev58.defineTokens.lineHeights({
   xs: { value: 1.2 },
   sm: { value: 1.34 },
   md: { value: 1.43 },
@@ -6676,7 +6724,7 @@ var lineHeights = import_dev57.defineTokens.lineHeights({
   "2xl": { value: 1.67 },
   "3xl": { value: 1.71 }
 });
-var letterSpacings = import_dev57.defineTokens.letterSpacings({
+var letterSpacings = import_dev58.defineTokens.letterSpacings({
   tighter: { value: "-0.05em" },
   tight: { value: "-0.025em" },
   normal: { value: "0" },
@@ -6686,7 +6734,7 @@ var letterSpacings = import_dev57.defineTokens.letterSpacings({
 });
 
 // src/tokens/index.ts
-var tokens = (0, import_dev58.defineTokens)({
+var tokens = (0, import_dev59.defineTokens)({
   borderWidths,
   colors,
   durations,
@@ -6704,11 +6752,11 @@ var tokens = (0, import_dev58.defineTokens)({
 });
 
 // src/tokens-next/index.ts
-var import_dev64 = require("@pandacss/dev");
+var import_dev65 = require("@pandacss/dev");
 
 // src/tokens-next/borders.ts
-var import_dev59 = require("@pandacss/dev");
-var borderWidths2 = import_dev59.defineTokens.borderWidths({
+var import_dev60 = require("@pandacss/dev");
+var borderWidths2 = import_dev60.defineTokens.borderWidths({
   none: { value: "none" },
   sm: { value: "1px" },
   md: { value: "1.5px" },
@@ -6718,12 +6766,15 @@ var borderWidths2 = import_dev59.defineTokens.borderWidths({
 });
 
 // src/tokens-next/colors.ts
-var import_dev60 = require("@pandacss/dev");
-var colors2 = import_dev60.defineTokens.colors({
+var import_dev61 = require("@pandacss/dev");
+var colors2 = import_dev61.defineTokens.colors({
   debug: { value: "red" },
   currentcolor: { value: "currentcolor" },
   white: { value: "#FFFFFF" },
   vibrantPurple: { value: "linear-gradient(98deg, #F8F9FB 0%, #B5A2EC 50.01%, #4B61DD 100%)" },
+  lightPurple: {
+    value: "radial-gradient(108.28% 139.29% at 0% 0%, {colors.background.brand} 0%, {colors.background.highlight} 100%)"
+  },
   dark: {
     "-100": {
       value: "#101214"
@@ -6891,8 +6942,8 @@ var colors2 = import_dev60.defineTokens.colors({
 });
 
 // src/tokens-next/radii.ts
-var import_dev61 = require("@pandacss/dev");
-var radii2 = import_dev61.defineTokens.radii({
+var import_dev62 = require("@pandacss/dev");
+var radii2 = import_dev62.defineTokens.radii({
   none: { value: "0" },
   sm: { value: "0.25rem", description: "4px" },
   md: { value: "0.375rem", description: "6px" },
@@ -6902,8 +6953,8 @@ var radii2 = import_dev61.defineTokens.radii({
 });
 
 // src/tokens-next/spacing.ts
-var import_dev62 = require("@pandacss/dev");
-var spacing2 = import_dev62.defineTokens.spacing({
+var import_dev63 = require("@pandacss/dev");
+var spacing2 = import_dev63.defineTokens.spacing({
   0: { value: "0" },
   0.5: { value: "0.125rem", description: "2px" },
   1: { value: "0.25rem", description: "4px" },
@@ -6919,8 +6970,8 @@ var spacing2 = import_dev62.defineTokens.spacing({
 });
 
 // src/tokens-next/shadows.ts
-var import_dev63 = require("@pandacss/dev");
-var shadows2 = import_dev63.defineTokens.shadows({
+var import_dev64 = require("@pandacss/dev");
+var shadows2 = import_dev64.defineTokens.shadows({
   xs: {
     value: [
       "0px 2px 4px 0px {colors.background.shadow}",
@@ -6960,7 +7011,7 @@ var shadows2 = import_dev63.defineTokens.shadows({
 });
 
 // src/tokens-next/index.ts
-var tokensNext = (0, import_dev64.defineTokens)({
+var tokensNext = (0, import_dev65.defineTokens)({
   borderWidths: borderWidths2,
   colors: colors2,
   durations,
@@ -6978,11 +7029,11 @@ var tokensNext = (0, import_dev64.defineTokens)({
 });
 
 // src/semanticTokens/index.ts
-var import_dev67 = require("@pandacss/dev");
+var import_dev68 = require("@pandacss/dev");
 
 // src/semanticTokens/colors.ts
-var import_dev65 = require("@pandacss/dev");
-var colors3 = import_dev65.defineSemanticTokens.colors({
+var import_dev66 = require("@pandacss/dev");
+var colors3 = import_dev66.defineSemanticTokens.colors({
   background: {
     surface: {
       value: {
@@ -7908,8 +7959,8 @@ var colors3 = import_dev65.defineSemanticTokens.colors({
 });
 
 // src/semanticTokens/spacing.ts
-var import_dev66 = require("@pandacss/dev");
-var spacing3 = import_dev66.defineSemanticTokens.spacing({
+var import_dev67 = require("@pandacss/dev");
+var spacing3 = import_dev67.defineSemanticTokens.spacing({
   "4xs": {
     value: {
       base: "0.125rem"
@@ -7968,7 +8019,7 @@ var spacing3 = import_dev66.defineSemanticTokens.spacing({
 });
 
 // src/semanticTokens/index.ts
-var semanticTokens = (0, import_dev67.defineSemanticTokens)({
+var semanticTokens = (0, import_dev68.defineSemanticTokens)({
   colors: colors3,
   spacing: spacing3
 });
@@ -8016,7 +8067,7 @@ var globalFontface = {
 };
 
 // src/index.ts
-var preset = (0, import_dev68.definePreset)({
+var preset = (0, import_dev69.definePreset)({
   name: "@mekari/pixel3-theme",
   // Main Theme
   theme: {

package/dist/index.mjs

@@ -6203,6 +6203,53 @@ var aireneInputSlotRecipe = defineSlotRecipe32({
   defaultVariants: {}
 });
 
+// src/recipes/airene-chat-bubble.ts
+import { defineSlotRecipe as defineSlotRecipe33 } from "@pandacss/dev";
+var aireneBubbleSlotRecipe = defineSlotRecipe33({
+  className: "airene-chat-bubble",
+  jsx: ["MpAireneChatBubble", "mp-airene-chat-bubble"],
+  slots: ["root", "header", "loading", "body", "text"],
+  base: {
+    root: {
+      position: "relative",
+      width: "full",
+      display: "flex",
+      flexDirection: "column",
+      gap: "xs",
+      py: "xs"
+    },
+    header: {
+      display: "flex",
+      alignItems: "center",
+      gap: "xs"
+    },
+    loading: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "2xs"
+    },
+    body: {
+      position: "relative",
+      display: "flex",
+      flexDirection: "column",
+      gap: "sm",
+      padding: "sm",
+      background: "lightPurple",
+      borderRadius: "lg",
+      borderWidth: "1px",
+      borderStyle: "solid",
+      borderColor: "background.neutral.subtle"
+    },
+    text: {
+      display: "flex",
+      gap: "xs"
+    }
+  },
+  variants: {},
+  compoundVariants: [],
+  defaultVariants: {}
+});
+
 // src/recipes/index.ts
 var recipes = {
   buttonRecipe,
@@ -6281,7 +6328,8 @@ var slotRecipes = {
   sliderSlotRecipe,
   tourSlotRecipe,
   aireneButtonSlotRecipe,
-  aireneInputSlotRecipe
+  aireneInputSlotRecipe,
+  aireneBubbleSlotRecipe
 };
 
 // src/text-styles.ts
@@ -6698,6 +6746,9 @@ var colors2 = defineTokens13.colors({
   currentcolor: { value: "currentcolor" },
   white: { value: "#FFFFFF" },
   vibrantPurple: { value: "linear-gradient(98deg, #F8F9FB 0%, #B5A2EC 50.01%, #4B61DD 100%)" },
+  lightPurple: {
+    value: "radial-gradient(108.28% 139.29% at 0% 0%, {colors.background.brand} 0%, {colors.background.highlight} 100%)"
+  },
   dark: {
     "-100": {
       value: "#101214"

package/dist/recipes/airene-chat-bubble.d.mts

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

package/dist/recipes/airene-chat-bubble.d.ts

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

package/dist/recipes/index.d.mts

@@ -78,6 +78,7 @@ declare const slotRecipes: {
     tourSlotRecipe: _pandacss_types.SlotRecipeConfig;
     aireneButtonSlotRecipe: _pandacss_types.SlotRecipeConfig;
     aireneInputSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    aireneBubbleSlotRecipe: _pandacss_types.SlotRecipeConfig;
 };
 
 export { recipes, slotRecipes };

package/dist/recipes/index.d.ts

@@ -78,6 +78,7 @@ declare const slotRecipes: {
     tourSlotRecipe: _pandacss_types.SlotRecipeConfig;
     aireneButtonSlotRecipe: _pandacss_types.SlotRecipeConfig;
     aireneInputSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    aireneBubbleSlotRecipe: _pandacss_types.SlotRecipeConfig;
 };
 
 export { recipes, slotRecipes };

package/dist/tokens-next/colors.d.mts

@@ -11,6 +11,9 @@ declare const colors: {
     vibrantPurple: {
         value: string;
     };
+    lightPurple: {
+        value: string;
+    };
     dark: {
         '-100': {
             value: string;

package/dist/tokens-next/colors.d.ts

@@ -11,6 +11,9 @@ declare const colors: {
     vibrantPurple: {
         value: string;
     };
+    lightPurple: {
+        value: string;
+    };
     dark: {
         '-100': {
             value: string;

package/dist/tokens-next/index.d.mts

@@ -32,6 +32,9 @@ declare const tokensNext: {
         vibrantPurple: {
             value: string;
         };
+        lightPurple: {
+            value: string;
+        };
         dark: {
             '-100': {
                 value: string;

package/dist/tokens-next/index.d.ts

@@ -32,6 +32,9 @@ declare const tokensNext: {
         vibrantPurple: {
             value: string;
         };
+        lightPurple: {
+            value: string;
+        };
         dark: {
             '-100': {
                 value: string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mekari/pixel3-theme",
   "description": "Theme for mekari pixel 3",
-  "version": "0.3.0-dev.3",
+  "version": "0.3.0-dev.4",
   "main": "dist/index.js",
   "license": "MIT",
   "files": [

package/src/recipes/airene-chat-bubble.ts

@@ -0,0 +1,48 @@
+import { defineSlotRecipe } from '@pandacss/dev'
+
+const aireneBubbleSlotRecipe = defineSlotRecipe({
+  className: 'airene-chat-bubble',
+  jsx: ['MpAireneChatBubble', 'mp-airene-chat-bubble'],
+  slots: ['root', 'header', 'loading', 'body', 'text'],
+  base: {
+    root: {
+      position: 'relative',
+      width: 'full',
+      display: 'flex',
+      flexDirection: 'column',
+      gap: 'xs',
+      py: 'xs'
+    },
+    header: {
+      display: 'flex',
+      alignItems: 'center',
+      gap: 'xs'
+    },
+    loading: {
+      display: 'flex',
+      flexDirection: 'column',
+      gap: '2xs'
+    },
+    body: {
+      position: 'relative',
+      display: 'flex',
+      flexDirection: 'column',
+      gap: 'sm',
+      padding: 'sm',
+      background: 'lightPurple',
+      borderRadius: 'lg',
+      borderWidth: '1px',
+      borderStyle: 'solid',
+      borderColor: 'background.neutral.subtle'
+    },
+    text: {
+      display: 'flex',
+      gap: 'xs'
+    }
+  },
+  variants: {},
+  compoundVariants: [],
+  defaultVariants: {}
+})
+
+export { aireneBubbleSlotRecipe }

package/src/recipes/index.ts

@@ -68,6 +68,7 @@ import { textlinkRecipe } from './textlink'
 import { skeletonRecipe } from './skeleton'
 import { scrollbarRecipe } from './scrollbar'
 import { aireneInputSlotRecipe } from './airene-chat-input'
+import { aireneBubbleSlotRecipe } from './airene-chat-bubble'
 
 export const recipes = {
   buttonRecipe,
@@ -147,5 +148,6 @@ export const slotRecipes = {
   sliderSlotRecipe,
   tourSlotRecipe,
   aireneButtonSlotRecipe,
-  aireneInputSlotRecipe
+  aireneInputSlotRecipe,
+  aireneBubbleSlotRecipe
 }

package/src/tokens-next/colors.ts

@@ -5,6 +5,10 @@ export const colors = defineTokens.colors({
   currentcolor: { value: 'currentcolor' },
   white: { value: '#FFFFFF' },
   vibrantPurple: { value: 'linear-gradient(98deg, #F8F9FB 0%, #B5A2EC 50.01%, #4B61DD 100%)' },
+  lightPurple: {
+    value:
+      'radial-gradient(108.28% 139.29% at 0% 0%, {colors.background.brand} 0%, {colors.background.highlight} 100%)'
+  },
   dark: {
     '-100': {
       value: '#101214'