@mekari/pixel3-theme 0.0.9-dev.0 → 0.0.9-dev.2

package/dist/index.mjs

@@ -2045,7 +2045,7 @@ var progressSlotRecipe = defineSlotRecipe10({
       top: "50%",
       left: "50%",
       transform: "translate(-50%, -50%)",
-      backgroundColor: "white",
+      backgroundColor: "var(--mp-progress-bg-color)",
       borderRadius: "full"
     }
   },
@@ -2189,7 +2189,8 @@ var inputTagSlotRecipe = defineSlotRecipe12({
     },
     input: {
       padding: "0 !important",
-      margin: "0 !important"
+      margin: "0 !important",
+      borderWidth: "0 !important"
     },
     content: {
       maxHeight: "300px",
@@ -2969,9 +2970,312 @@ var RTEStyleProviderRecipe = defineRecipe12({
   defaultVariants: {}
 });
 
+// src/recipes/date-picker.ts
+import { defineSlotRecipe as defineSlotRecipe20, defineRecipe as defineRecipe13 } from "@pandacss/dev";
+var datePickerSlotRecipe = defineSlotRecipe20({
+  className: "datepicker",
+  jsx: ["MpDatePicker", "mp-date-picker"],
+  slots: ["root", "popoverContent"],
+  base: {
+    "root": {
+      width: "100%",
+      position: "relative"
+    },
+    popoverContent: {
+      minWidth: "280px",
+      padding: 4
+    }
+  }
+});
+var calendarPanelRangeRecipe = defineRecipe13({
+  className: "calendarPanelRange",
+  base: {
+    display: "grid",
+    gridTemplateColumns: "repeat(2, 1fr)"
+  }
+});
+var tableDateSlotRecipe = defineSlotRecipe20({
+  className: "tableDate",
+  jsx: ["TableDate", "table-date"],
+  slots: ["headerRoot", "headerLabel", "dayWrapper", "dateItemRoot", "dateItemWrapper", "shortcutLabelWrapper"],
+  base: {
+    headerRoot: { display: "flex", justifyContent: "space-between", alignItems: "center" },
+    headerLabel: { cursor: "pointer", fontWeight: "semiBold" },
+    dayWrapper: { display: "flex", marginTop: 3 },
+    dateItemRoot: { display: "flex", flexDirection: "column", gap: 1, marginTop: "1.5" },
+    dateItemWrapper: { display: "flex" },
+    shortcutLabelWrapper: { display: "flex", justifyContent: "center", alignItems: "center", marginTop: 3 }
+  }
+});
+var tableMonthSlotRecipe = defineSlotRecipe20({
+  className: "tableMonth",
+  jsx: ["TableMonth", "table-month"],
+  slots: ["headerRoot", "headerLabel", "monthItemRoot", "monthItemWrapper", "shortcutLabelWrapper"],
+  base: {
+    headerRoot: { display: "flex", justifyContent: "space-between", alignItems: "center" },
+    headerLabel: { cursor: "pointer", fontWeight: "semiBold" },
+    monthItemRoot: { display: "flex", flexDirection: "column", gap: 1, marginTop: "3" },
+    monthItemWrapper: { display: "grid", gridTemplateColumns: "3" },
+    shortcutLabelWrapper: { display: "flex", justifyContent: "center", alignItems: "center", marginTop: 3 }
+  }
+});
+var tableYearSlotRecipe = defineSlotRecipe20({
+  className: "tableYear",
+  jsx: ["TableYear", "table-year"],
+  slots: ["headerRoot", "headerLabel", "yearItemRoot", "yearItemWrapper", "shortcutLabelWrapper"],
+  base: {
+    headerRoot: { display: "flex", justifyContent: "space-between", alignItems: "center" },
+    headerLabel: { fontWeight: "semiBold" },
+    yearItemRoot: { display: "flex", flexDirection: "column", gap: 1, marginTop: "3" },
+    yearItemWrapper: { display: "grid", gridTemplateColumns: "4" },
+    shortcutLabelWrapper: { display: "flex", justifyContent: "center", alignItems: "center", marginTop: 3 }
+  }
+});
+var dayItemRecipe = defineRecipe13({
+  className: "day",
+  jsx: ["Day", "day"],
+  base: {
+    width: "36px",
+    height: "36px",
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "center",
+    flexShrink: 0,
+    borderWidth: "1px",
+    borderColor: "transparent",
+    cursor: "pointer",
+    color: "gray.600",
+    fontSize: "sm",
+    textAlign: "center"
+  }
+});
+var dateItemRecipe = defineRecipe13({
+  className: "dateItem",
+  jsx: ["DateItem", "date-item", "Date", "date"],
+  base: {
+    position: "relative",
+    width: "36px",
+    height: "36px",
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "center",
+    flexShrink: 0,
+    borderWidth: "1px",
+    borderColor: "transparent",
+    cursor: "pointer",
+    fontSize: "md",
+    transition: "box-shadow 300ms",
+    _disabled: {
+      color: "gray.400",
+      cursor: "not-allowed",
+      borderColor: "transparent",
+      backgroundColor: "transparent"
+    }
+  },
+  variants: {
+    status: {
+      default: {
+        rounded: "sm",
+        _hover: {
+          borderColor: "gray.50",
+          background: "gray.50"
+        },
+        _focus: {
+          borderColor: "blue.400",
+          background: "transparent",
+          shadow: "outer"
+        }
+      },
+      selected: {
+        rounded: "sm",
+        borderColor: "blue.400",
+        backgroundColor: "blue.400",
+        color: "white"
+      },
+      range: {
+        borderColor: "ice.50",
+        backgroundColor: "ice.50"
+      },
+      today: {
+        rounded: "sm",
+        borderColor: "orange.50",
+        backgroundColor: "orange.50"
+      },
+      notThisMonth: {
+        color: "gray.600"
+      },
+      disabled: {},
+      // Week
+      weekHoveredStart: {
+        roundedLeft: "sm",
+        borderColor: "gray.50",
+        background: "gray.50"
+      },
+      weekHoveredMiddle: {
+        borderColor: "gray.50",
+        background: "gray.50"
+      },
+      weekHoveredEnd: {
+        roundedRight: "sm",
+        borderColor: "gray.50",
+        background: "gray.50"
+      },
+      weekSelectedStart: {
+        roundedLeft: "sm",
+        borderColor: "blue.400",
+        background: "blue.400",
+        color: "white"
+      },
+      weekSelectedMiddle: {
+        borderColor: "blue.400",
+        background: "blue.400",
+        color: "white"
+      },
+      weekSelectedEnd: {
+        roundedRight: "sm",
+        borderColor: "blue.400",
+        background: "blue.400",
+        color: "white"
+      }
+    }
+  },
+  staticCss: ["*"]
+});
+var pinbarSlotRecipe = defineSlotRecipe20({
+  className: "pinbar",
+  slots: ["root", "pinbar"],
+  base: {
+    root: {
+      position: "absolute",
+      bottom: 0,
+      height: 1,
+      display: "flex",
+      justifyContent: "center"
+    },
+    pinbar: {
+      width: 6,
+      height: 1,
+      borderRadius: "2px",
+      background: "orange.500"
+    }
+  }
+});
+var monthItemRecipe = defineRecipe13({
+  className: "monthItem",
+  jsx: ["MonthItem", "month-item"],
+  base: {
+    width: "full",
+    height: "36px",
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "center",
+    flexShrink: 0,
+    borderWidth: "1px",
+    borderColor: "transparent",
+    cursor: "pointer",
+    _disabled: {
+      color: "gray.400",
+      cursor: "not-allowed",
+      borderColor: "transparent",
+      backgroundColor: "transparent"
+    }
+  },
+  variants: {
+    status: {
+      disabled: {},
+      default: {
+        rounded: "sm",
+        _hover: {
+          borderColor: "gray.50",
+          background: "gray.50"
+        },
+        _focus: {
+          borderColor: "blue.400",
+          background: "transparent",
+          shadow: "outer"
+        }
+      },
+      selected: {
+        rounded: "sm",
+        borderColor: "blue.400",
+        backgroundColor: "blue.400",
+        color: "white"
+      },
+      range: {
+        borderColor: "ice.50",
+        backgroundColor: "ice.50"
+      },
+      today: {
+        rounded: "sm",
+        borderColor: "orange.50",
+        backgroundColor: "orange.50"
+      }
+    }
+  },
+  staticCss: ["*"]
+});
+var yearItemRecipe = defineRecipe13({
+  className: "yearItem",
+  jsx: ["YearItem", "year-item"],
+  base: {
+    width: "full",
+    height: "36px",
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "center",
+    flexShrink: 0,
+    borderWidth: "1px",
+    borderColor: "transparent",
+    cursor: "pointer",
+    _disabled: {
+      color: "gray.400",
+      cursor: "not-allowed",
+      borderColor: "transparent",
+      backgroundColor: "transparent"
+    }
+  },
+  variants: {
+    status: {
+      disabled: {},
+      default: {
+        rounded: "sm",
+        _hover: {
+          borderColor: "gray.50",
+          background: "gray.50"
+        },
+        _focus: {
+          borderColor: "blue.400",
+          background: "transparent",
+          shadow: "outer"
+        }
+      },
+      selected: {
+        rounded: "sm",
+        borderColor: "blue.400",
+        backgroundColor: "blue.400",
+        color: "white"
+      },
+      range: {
+        borderColor: "ice.50",
+        backgroundColor: "ice.50"
+      },
+      today: {
+        rounded: "sm",
+        borderColor: "orange.50",
+        backgroundColor: "orange.50"
+      }
+    }
+  },
+  staticCss: ["*"]
+});
+
 // src/recipes/carousel.ts
-import { defineSlotRecipe as defineSlotRecipe20 } from "@pandacss/dev";
-var carouselSlotRecipe = defineSlotRecipe20({
+import { defineSlotRecipe as defineSlotRecipe21 } from "@pandacss/dev";
+var carouselSlotRecipe = defineSlotRecipe21({
   className: "carousel",
   jsx: ["MpCarousel", "mp-carousel"],
   slots: [
@@ -3019,8 +3323,8 @@ var carouselSlotRecipe = defineSlotRecipe20({
 });
 
 // src/recipes/banner.ts
-import { defineRecipe as defineRecipe13, defineSlotRecipe as defineSlotRecipe21 } from "@pandacss/dev";
-var bannerSlotRecipe = defineSlotRecipe21({
+import { defineRecipe as defineRecipe14, defineSlotRecipe as defineSlotRecipe22 } from "@pandacss/dev";
+var bannerSlotRecipe = defineSlotRecipe22({
   className: "banner",
   jsx: ["MpBanner", "mp-banner"],
   slots: ["root", "body"],
@@ -3061,7 +3365,7 @@ var bannerSlotRecipe = defineSlotRecipe21({
     variant: "info"
   }
 });
-var bannerTitleRecipe = defineRecipe13({
+var bannerTitleRecipe = defineRecipe14({
   className: "banner-title",
   jsx: ["MpBannerTitle", "mp-banner-title"],
   base: {
@@ -3078,7 +3382,7 @@ var bannerTitleRecipe = defineRecipe13({
   compoundVariants: [],
   defaultVariants: {}
 });
-var bannerDescriptionRecipe = defineRecipe13({
+var bannerDescriptionRecipe = defineRecipe14({
   className: "banner-description",
   jsx: ["MpBannerDescription", "mp-banner-description"],
   base: {
@@ -3093,7 +3397,7 @@ var bannerDescriptionRecipe = defineRecipe13({
   compoundVariants: [],
   defaultVariants: {}
 });
-var bannerIconSlotRecipe = defineSlotRecipe21({
+var bannerIconSlotRecipe = defineSlotRecipe22({
   className: "banner-icon",
   jsx: ["MpBannerIcon", "mp-banner-icon"],
   slots: ["root", "custom"],
@@ -3116,7 +3420,7 @@ var bannerIconSlotRecipe = defineSlotRecipe21({
   compoundVariants: [],
   defaultVariants: {}
 });
-var bannerLinkRecipe = defineRecipe13({
+var bannerLinkRecipe = defineRecipe14({
   className: "banner-link",
   jsx: ["MpBannerLink", "mp-banner-link"],
   base: {
@@ -3129,7 +3433,7 @@ var bannerLinkRecipe = defineRecipe13({
   compoundVariants: [],
   defaultVariants: {}
 });
-var bannerCloseButtonRecipe = defineRecipe13({
+var bannerCloseButtonRecipe = defineRecipe14({
   className: "banner-close-button",
   jsx: ["MpBannerCloseButton", "mp-banner-close-button"],
   base: {
@@ -3171,7 +3475,12 @@ var recipes = {
   bannerDescriptionRecipe,
   bannerLinkRecipe,
   bannerCloseButtonRecipe,
-  RTEStyleProviderRecipe
+  RTEStyleProviderRecipe,
+  calendarPanelRangeRecipe,
+  dayItemRecipe,
+  dateItemRecipe,
+  monthItemRecipe,
+  yearItemRecipe
 };
 var slotRecipes = {
   accordion,
@@ -3199,6 +3508,11 @@ var slotRecipes = {
   toastSlotRecipe,
   broadcastSlotRecipe,
   richTextEditorSlotRecipe,
+  datePickerSlotRecipe,
+  tableDateSlotRecipe,
+  tableMonthSlotRecipe,
+  tableYearSlotRecipe,
+  pinbarSlotRecipe,
   carouselSlotRecipe
 };
 

package/dist/recipes/date-picker.d.mts

@@ -0,0 +1,14 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const datePickerSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const calendarPanelRangeRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const tableDateSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const tableMonthSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const tableYearSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const dayItemRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const dateItemRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const pinbarSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const monthItemRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const yearItemRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+
+export { calendarPanelRangeRecipe, dateItemRecipe, datePickerSlotRecipe, dayItemRecipe, monthItemRecipe, pinbarSlotRecipe, tableDateSlotRecipe, tableMonthSlotRecipe, tableYearSlotRecipe, yearItemRecipe };

package/dist/recipes/date-picker.d.ts

@@ -0,0 +1,14 @@
+import * as _pandacss_dev from '@pandacss/dev';
+
+declare const datePickerSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const calendarPanelRangeRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const tableDateSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const tableMonthSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const tableYearSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const dayItemRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const dateItemRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const pinbarSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const monthItemRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const yearItemRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+
+export { calendarPanelRangeRecipe, dateItemRecipe, datePickerSlotRecipe, dayItemRecipe, monthItemRecipe, pinbarSlotRecipe, tableDateSlotRecipe, tableMonthSlotRecipe, tableYearSlotRecipe, yearItemRecipe };

package/dist/recipes/index.d.mts

@@ -23,6 +23,11 @@ declare const recipes: {
     bannerLinkRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
     bannerCloseButtonRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
     RTEStyleProviderRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    calendarPanelRangeRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    dayItemRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    dateItemRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    monthItemRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    yearItemRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
 };
 declare const slotRecipes: {
     accordion: _pandacss_types.SlotRecipeConfig;
@@ -50,6 +55,11 @@ declare const slotRecipes: {
     toastSlotRecipe: _pandacss_types.SlotRecipeConfig;
     broadcastSlotRecipe: _pandacss_types.SlotRecipeConfig;
     richTextEditorSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    datePickerSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    tableDateSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    tableMonthSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    tableYearSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    pinbarSlotRecipe: _pandacss_types.SlotRecipeConfig;
     carouselSlotRecipe: _pandacss_types.SlotRecipeConfig;
 };
 

package/dist/recipes/index.d.ts

@@ -23,6 +23,11 @@ declare const recipes: {
     bannerLinkRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
     bannerCloseButtonRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
     RTEStyleProviderRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    calendarPanelRangeRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    dayItemRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    dateItemRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    monthItemRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
+    yearItemRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
 };
 declare const slotRecipes: {
     accordion: _pandacss_types.SlotRecipeConfig;
@@ -50,6 +55,11 @@ declare const slotRecipes: {
     toastSlotRecipe: _pandacss_types.SlotRecipeConfig;
     broadcastSlotRecipe: _pandacss_types.SlotRecipeConfig;
     richTextEditorSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    datePickerSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    tableDateSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    tableMonthSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    tableYearSlotRecipe: _pandacss_types.SlotRecipeConfig;
+    pinbarSlotRecipe: _pandacss_types.SlotRecipeConfig;
     carouselSlotRecipe: _pandacss_types.SlotRecipeConfig;
 };
 

package/package.json

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