@cieloazul310/digital-go-pandacss-preset 0.1.0-beta.5 → 0.1.0-beta.7

package/dist/index.js

@@ -34,7 +34,7 @@ __export(index_exports, {
   default: () => index_default
 });
 module.exports = __toCommonJS(index_exports);
-var import_dev34 = require("@pandacss/dev");
+var import_dev37 = require("@pandacss/dev");
 var import_digital_go_pandacss_plugin = __toESM(require("@cieloazul310/digital-go-pandacss-plugin"));
 var import_digital_go_pandacss_utils = require("@cieloazul310/digital-go-pandacss-utils");
 
@@ -43,8 +43,12 @@ var import_dev = require("@pandacss/dev");
 var import_accordion = require("@zag-js/accordion");
 var accordion_default = (0, import_dev.defineSlotRecipe)({
   className: "accordion",
+  description: "\u30A2\u30B3\u30FC\u30C7\u30A3\u30AA\u30F3\u306F\u3001\u30E6\u30FC\u30B6\u30FC\u304C\u30B3\u30F3\u30C6\u30F3\u30C4\u306E\u30BB\u30AF\u30B7\u30E7\u30F3\u3092\u5C55\u958B\u307E\u305F\u306F\u6298\u308A\u305F\u305F\u3080\u3053\u3068\u304C\u3067\u304D\u308B\u30E6\u30FC\u30B6\u30FC\u30A4\u30F3\u30BF\u30FC\u30D5\u30A7\u30FC\u30B9\u3067\u3059\u3002\u9805\u76EE\u3092\u30B3\u30F3\u30D1\u30AF\u30C8\u306B\u30EA\u30B9\u30C8\u8868\u793A\u3057\u3064\u3064\u30DA\u30FC\u30B8\u9077\u79FB\u305B\u305A\u95A2\u9023\u60C5\u5831\u3092\u8868\u793A\u3057\u305F\u3044\u3068\u3044\u3046\u8981\u6C42\u306B\u5BFE\u5FDC\u3057\u307E\u3059\u3002\u203B\u30BB\u30AF\u30B7\u30E7\u30F3\u5185\u306E\u4EFB\u610F\u306E\u7BC4\u56F2\u3067\u6298\u308A\u305F\u305F\u307F\u8868\u793A\u3092\u3059\u308B\u5834\u5408\u306F\u300C\u30C7\u30A3\u30B9\u30AF\u30ED\u30FC\u30B8\u30E3\u30FC\u300D\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u3092\u4F7F\u7528\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
   slots: import_accordion.anatomy.keys(),
   base: {
+    root: {
+      colorPalette: "keyColor"
+    },
     item: {
       /**
        * group/accordion border-b border-solid-gray-420
@@ -129,24 +133,21 @@ var accordion_default = (0, import_dev.defineSlotRecipe)({
        * bg-white text-blue-1000
        */
       bg: "white",
-      color: "keyColor.1000",
+      color: "colorPalette.primary.100",
       /**
        * border border-current rounded-full
-          group-hover/summary:outline group-hover/summary:outline-2 group-hover/summary:outline-current
-          group-open/accordion:rotate-180
+       * group-hover/summary:outline group-hover/summary:outline-2
+       * group-hover/summary:outline-current
+       * group-open/accordion:rotate-180
        */
       borderWidth: "1px",
       borderColor: "currentcolor",
       rounded: "full",
       outlineStyle: "solid",
       outlineWidth: { base: "0px", _groupHover: "2px" },
-      transformOrigin: "center",
-      transitionDuration: "normal",
-      transitionProperty: "transform",
-      transitionTimingFunction: "default",
-      _open: {
-        transform: "rotate(-180deg)"
-      }
+      outlineColor: { base: "transparent", _groupHover: "currentcolor" },
+      transition: "transform",
+      transform: { base: "rotate(0deg)", _open: "rotate(-180deg)" }
     },
     itemContent: {
       /**
@@ -170,26 +171,34 @@ var import_dev3 = require("@pandacss/dev");
 var import_anatomy = require("@zag-js/anatomy");
 var breadcrumbAnatomy = (0, import_anatomy.createAnatomy)("breadcrumb").parts(
   "root",
+  "label",
   "list",
   "item",
   "link",
   "separator"
 );
-var disclosureAnatomy = (0, import_anatomy.createAnatomy)("disclosure").parts(
+var cardAnatomy = (0, import_anatomy.createAnatomy)("card").parts(
   "root",
-  "summary",
-  "icon",
-  "content"
+  "main",
+  "image",
+  "sub",
+  "title"
 );
-var inputTextAnatomy = (0, import_anatomy.createAnatomy)("field").parts(
+var fieldAnatomy = (0, import_anatomy.createAnatomy)("field").parts(
   "root",
   "errorText",
-  "helperText",
+  "supportText",
   "input",
   "label",
   "select",
   "textarea",
-  "requiredIndicator"
+  "requirementBadge"
+);
+var fieldsetAnatomy = (0, import_anatomy.createAnatomy)("fieldset").parts(
+  "root",
+  "errorText",
+  "supportText",
+  "legend"
 );
 var menuListAnatomy = (0, import_anatomy.createAnatomy)("menu-list").parts(
   "root",
@@ -204,18 +213,13 @@ var menuListAnatomy = (0, import_anatomy.createAnatomy)("menu-list").parts(
 );
 var notificationBannerAnatomy = (0, import_anatomy.createAnatomy)(
   "notification-banner"
-).parts("root", "icon", "close", "header", "heading", "body");
+).parts("root", "icon", "close", "header", "heading", "body", "actions");
 var resourceListAnatomy = (0, import_anatomy.createAnatomy)("resource-list").parts(
   "root",
-  "contentsContainer",
-  "functionButton",
-  "frontIcon",
-  "form",
+  "main",
+  "action",
   "content",
-  "label",
-  "title",
-  "supportText",
-  "subLabel"
+  "title"
 );
 var tableAnatomy = (0, import_anatomy.createAnatomy)("table").parts(
   "root",
@@ -240,11 +244,12 @@ var link_default = (0, import_dev2.defineRecipe)({
      * text-blue-1000 visited:text-magenta-900 hover:text-blue-1000
      * focus-visible:text-blue-1000 active:text-orange-700
      */
+    colorPalette: "blue",
     color: {
-      base: "keyColor.1000",
+      base: "colorPalette.primary.100",
       _visited: "magenta.900",
-      _hover: "keyColor.1000",
-      _focusVisible: "keyColor.1000",
+      _hover: "colorPalette.primary.100",
+      _focusVisible: "colorPalette.primary.100",
       _active: "orange.700"
     },
     /**
@@ -282,10 +287,10 @@ var link_default = (0, import_dev2.defineRecipe)({
     /**
      * with icon
      */
-    display: "inline-flex",
-    alignItems: "center",
-    gap: 1,
-    "& svg": {
+    "& > svg": {
+      display: "inline",
+      ml: 1,
+      mb: 1,
       width: "1em",
       height: "1em"
     }
@@ -304,6 +309,10 @@ var breadcrumb_default = (0, import_dev3.defineSlotRecipe)({
        */
       "--icon-size": "16px"
     },
+    label: {
+      srOnly: true,
+      textStyle: "oln-16N-100"
+    },
     list: {
       /**
        * inline
@@ -344,7 +353,10 @@ var breadcrumb_default = (0, import_dev3.defineSlotRecipe)({
        * mx-2 inline
        */
       mx: 2,
-      display: "inline"
+      display: "inline",
+      width: "12px",
+      height: "12px",
+      fill: "none"
     }
   }
 });
@@ -355,6 +367,7 @@ var button_default = (0, import_dev4.defineRecipe)({
   className: "button",
   description: "\u30DC\u30BF\u30F3\u306F\u3001\u4E3B\u306B\u30A2\u30AF\u30B7\u30E7\u30F3\u5B9F\u884C\u307E\u305F\u306F\u30DA\u30FC\u30B8\u9077\u79FB\u306E\u305F\u3081\u306E\u30C8\u30EA\u30AC\u30FC\u3068\u3057\u3066\u4F7F\u7528\u3057\u307E\u3059\u3002\u753B\u9762\u5185\u306B\u304A\u3051\u308B\u30DC\u30BF\u30F3\u306E\u91CD\u8981\u5EA6\u306B\u5FDC\u3058\u3066\u4F7F\u3044\u5206\u3051\u53EF\u80FD\u306A\u8907\u6570\u306E\u30B9\u30BF\u30A4\u30EB\u304C\u3042\u308A\u307E\u3059\u3002",
   base: {
+    colorPalette: "keyColor",
     /**
      * underline-offset-[calc(3/16*1rem)]
      */
@@ -394,9 +407,9 @@ var button_default = (0, import_dev4.defineRecipe)({
          * bg-blue-900 hover:bg-blue-1000 active:bg-blue-1200 aria-disabled:bg-solid-gray-300
          */
         bg: {
-          base: "keyColor.900",
-          _hover: "keyColor.1000",
-          _active: "keyColor.1200",
+          base: "colorPalette.primary",
+          _hover: "colorPalette.primary.100",
+          _active: "colorPalette.primary.300",
           _disabled: "solid-gray.300"
         },
         color: { base: "white", _disabled: "solid-gray.50" },
@@ -421,14 +434,14 @@ var button_default = (0, import_dev4.defineRecipe)({
          */
         bg: {
           base: "white",
-          _hover: "keyColor.200",
-          _active: "keyColor.300",
+          _hover: "colorPalette.200",
+          _active: "colorPalette.300",
           _disabled: "white"
         },
         color: {
-          base: "keyColor.900",
-          _hover: "keyColor.1000",
-          _active: "keyColor.1200",
+          base: "colorPalette.primary",
+          _hover: "colorPalette.primary.100",
+          _active: "colorPalette.primary.300",
           _disabled: "solid-gray.300"
         },
         /**
@@ -452,15 +465,15 @@ var button_default = (0, import_dev4.defineRecipe)({
          */
         bg: {
           base: "transparent",
-          _hover: "keyColor.50",
-          _active: "keyColor.100",
+          _hover: "colorPalette.bg",
+          _active: "colorPalette.100",
           _focusVisible: { base: "yellow.300", _hover: "yellow.300" },
           _disabled: "transparent"
         },
         color: {
-          base: "keyColor.900",
-          _hover: "keyColor.1000",
-          _active: "keyColor.1200",
+          base: "colorPalette.primary",
+          _hover: "colorPalette.primary.100",
+          _active: "colorPalette.primary.300",
           _disabled: "solid-gray.300"
         },
         /**
@@ -537,34 +550,181 @@ var button_default = (0, import_dev4.defineRecipe)({
   }
 });
 
-// src/recipes/checkbox.ts
+// src/recipes/card.ts
 var import_dev5 = require("@pandacss/dev");
+var card_default = (0, import_dev5.defineSlotRecipe)({
+  className: "card",
+  description: "\u5358\u4E00\u306E\u4E3B\u984C\u306B\u95A2\u3059\u308B\u30B3\u30F3\u30C6\u30F3\u30C4\u3092\u307E\u3068\u3081\u3066\u8868\u793A\u3059\u308B\u30B3\u30F3\u30C6\u30CA\u3068\u306A\u308B\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u3067\u3059\u3002\u3055\u307E\u3056\u307E\u306A\u30BF\u30A4\u30D7\u3068\u30B5\u30A4\u30BA\u306E\u8981\u7D20\u3084\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u3092\u67D4\u8EDF\u306B\u683C\u7D0D\u3067\u304D\u307E\u3059\u3002\u672C\u6765\u30AB\u30FC\u30C9\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u306F\u3001\u3042\u3089\u3086\u308B\u30B3\u30F3\u30C6\u30F3\u30C4\uFF08\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u3084\u8981\u7D20\uFF09\u3092\u5185\u5305\u3059\u308B\u3053\u3068\u304C\u3067\u304D\u3001\u975E\u5E38\u306B\u81EA\u7531\u5EA6\u306E\u9AD8\u3044\u30B3\u30F3\u30C6\u30CA\u3068\u306A\u308A\u307E\u3059\u3002\u672C\u30C7\u30B6\u30A4\u30F3\u30B7\u30B9\u30C6\u30E0\u3067\u306F\u3001\u60C5\u5831\u8A2D\u8A08\u3092\u3057\u3084\u3059\u3044\u30AB\u30FC\u30C9\u3092\u63D0\u4F9B\u3059\u308B\u305F\u3081\u3001\u81EA\u7531\u5EA6\u306B\u5236\u7D04\u3092\u8A2D\u3051\u305F\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u4ED5\u69D8\u3068\u3057\u3066\u7B56\u5B9A\u3057\u3066\u3044\u307E\u3059\u3002",
+  slots: cardAnatomy.keys(),
+  base: {
+    root: {
+      display: "grid",
+      gridTemplateAreas: `
+        "image"
+        "main"
+        "sub"
+      `,
+      bg: { base: "white", "&:has(input:checked)": "colorPalette.bg" },
+      color: "solid-gray.800",
+      textStyle: "std-16N-170",
+      borderColor: "solid-gray.420",
+      borderWidth: "1px",
+      rounded: 16,
+      overflow: "hidden",
+      colorPalette: "keyColor"
+    },
+    main: {
+      gridArea: "main",
+      py: 4,
+      px: { base: 4, md: 6 },
+      display: "flex",
+      flexDirection: "column",
+      gap: 4,
+      _focusVisible: {
+        outlineStyle: "solid",
+        outlineWidth: "4px",
+        outlineColor: "black",
+        outlineOffset: "calc(2 / 16 * 1rem)",
+        focusRing: "calc(2 / 16 * 1rem)"
+      }
+    },
+    image: {
+      gridArea: "image",
+      position: "relative",
+      overflow: "hidden",
+      "& > img": {
+        objectFit: "cover",
+        width: "full",
+        height: "full"
+      }
+    },
+    sub: {
+      gridArea: "sub",
+      py: 4,
+      px: { base: 4, md: 6 }
+    },
+    title: {
+      textStyle: "std-20B-150"
+    }
+  },
+  variants: {
+    orientation: {
+      vertical: {
+        root: {
+          gridTemplateAreas: `
+            "image"
+            "main"
+            "sub"
+          `,
+          gridTemplateColumns: "1fr"
+        }
+      },
+      horizontal: {
+        root: {
+          gridTemplateAreas: `
+            "image main"
+            "image sub"
+          `,
+          gridTemplateColumns: "minmax(auto, 320px) 1fr"
+        }
+      }
+    },
+    asLink: {
+      true: {
+        root: {
+          position: "relative",
+          bg: {
+            _hover: "solid-gray.50"
+          }
+        },
+        image: {
+          "& > img": {
+            transition: "transform",
+            _groupHover: {
+              transform: "scale(1.05)"
+            }
+          }
+        },
+        sub: {
+          "& > *": {
+            zIndex: 1
+          }
+        },
+        title: {
+          _before: {
+            content: '""',
+            position: "absolute",
+            top: 0,
+            left: 0,
+            width: "full",
+            height: "full",
+            zIndex: 0,
+            cursor: "inherit"
+          }
+        }
+      }
+    }
+  },
+  defaultVariants: {
+    orientation: "vertical",
+    asLink: false
+  }
+});
+
+// src/recipes/checkbox.ts
+var import_dev6 = require("@pandacss/dev");
 var import_checkbox = require("@zag-js/checkbox");
-var checkbox_default = (0, import_dev5.defineSlotRecipe)({
+var checkbox_default = (0, import_dev6.defineSlotRecipe)({
   className: "checkbox",
+  description: "\u30C1\u30A7\u30C3\u30AF\u30DC\u30C3\u30AF\u30B9\u306F\u3001\u8907\u6570\u306E\u9805\u76EE\u306E\u4E2D\u304B\u3089\u8907\u6570\u306E\u9078\u629E\u80A2\u3092\u9078\u3076\u3053\u3068\u3092\u53EF\u80FD\u306B\u3057\u307E\u3059\u3002\u307E\u305F\u3001\u3072\u3068\u3064\u306E\u9078\u629E\u80A2\u306E\u30AA\u30F3\u30FB\u30AA\u30D5\u306E\u5207\u308A\u66FF\u3048\u306B\u3082\u7528\u3044\u308B\u3053\u3068\u304C\u3067\u304D\u307E\u3059\u3002",
   slots: import_checkbox.anatomy.extendWith("group").keys(),
   base: {
     root: {
-      /**
-       * flex w-fit items-start py-2
-       */
       display: "flex",
-      alignItems: "flex-start",
+      alignItems: "center",
       width: "fit-content",
-      py: 2
+      py: 2,
+      colorPalette: "keyColor"
     },
     control: {
       /**
        * flex items-center justify-center shrink-0 rounded-[calc(1/8*100%)]
        * has-[input:hover:not(:focus):not([aria-disabled="true"])]:bg-solid-gray-420
        */
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
       flexShrink: 0,
-      rounded: "calc(1 / 8 * 100%)",
+      rounded: "calc(2 / 18 * 100%)",
+      borderWidth: "2px",
+      borderColor: {
+        base: "solid-gray.420",
+        _checked: "colorPalette.primary",
+        _invalid: { base: "error.1", _disabled: "solid-gray.420" },
+        _groupHover: { base: "black", _disabled: "solid-gray.420" }
+      },
       _disabled: {
-        bg: "solid-gray.420"
+        bg: "solid-gray.50"
+      },
+      _groupHover: {
+        outlineStyle: { base: "solid", _disabled: "hidden" },
+        outlineColor: "solid-gray.420",
+        _focus: {
+          outlineStyle: "solid",
+          outlineWidth: "4px",
+          outlineColor: "black",
+          outlineOffset: "calc(2 / 16 * 1rem)",
+          focusRing: "calc(2 / 16 * 1rem)"
+        }
+      },
+      /**
+       * focus:outline focus:outline-4 focus:outline-black
+       * focus:outline-offset-[calc(2/16*1rem)]
+       * focus:ring-[calc(2/16*1rem)] focus:ring-yellow-300
+       */
+      _focus: {
+        outlineStyle: "solid",
+        outlineWidth: "4px",
+        outlineColor: "black",
+        outlineOffset: "calc(2 / 16 * 1rem)",
+        focusRing: "calc(2 / 16 * 1rem)"
       }
     },
     indicator: {
@@ -572,51 +732,9 @@ var checkbox_default = (0, import_dev5.defineSlotRecipe)({
        * appearance-none size-3/4 rounded-[calc(2/18*100%)]
        */
       appearance: "none",
-      width: "3/4",
-      height: "3/4",
-      rounded: "calc(2 / 18 * 100%)",
-      borderColor: {
-        /**
-         * border-solid-gray-600 hover:border-black
-         * forced-colors:!border-[ButtonText]
-         */
-        base: "solid-gray.600",
-        _hover: "black",
-        _highContrast: "ButtonText",
-        _checked: {
-          /**
-           * checked:border-blue-900 checked:hover:border-blue-1100
-           * forced-colors:checked:!border-[Highlight]
-           */
-          base: "keyColor.900",
-          _hover: "keyColor.1100",
-          _highContrast: "Highlight"
-        },
-        _indeterminate: {
-          /**
-           * indeterminate:border-blue-900 indeterminate:hover:border-blue-1100
-           * forced-colors:indeterminate:!border-[Highlight]
-           */
-          base: "keyColor.900",
-          _hover: "keyColor.1100",
-          _highContrast: "Highlight"
-        },
-        _invalid: {
-          /**
-           * data-[error]:border-error-1 data-[error]:hover:border-red-1000
-           */
-          base: "error.1",
-          _hover: "red.1000"
-        },
-        _disabled: {
-          /**
-           * aria-disabled:!border-solid-gray-300
-           * forced-colors:aria-disabled:!border-[GrayText]
-           */
-          base: "solid-gray.300",
-          _highContrast: "GrayText"
-        }
-      },
+      width: "full",
+      height: "full",
+      zIndex: 1,
       bg: {
         /**
          * bg-white
@@ -627,8 +745,8 @@ var checkbox_default = (0, import_dev5.defineSlotRecipe)({
          * forced-colors:checked:!bg-[Highlight]
          */
         _checked: {
-          base: "keyColor.900",
-          _hover: "keyColor.1100",
+          base: "colorPalette.primary",
+          _hover: "colorPalette.primary.200",
           _highContrast: "Highlight"
         },
         _indeterminate: {
@@ -636,8 +754,8 @@ var checkbox_default = (0, import_dev5.defineSlotRecipe)({
            * indeterminate:bg-blue-900 indeterminate:hover:bg-blue-1100
            * forced-colors:indeterminate:!bg-[Highlight]
            */
-          base: "keyColor.900",
-          _hover: "keyColor.1100",
+          base: "colorPalette.primary",
+          _hover: "colorPalette.primary.200",
           _highContrast: "Highlight"
         },
         /**
@@ -648,11 +766,13 @@ var checkbox_default = (0, import_dev5.defineSlotRecipe)({
         _invalid: {
           _indeterminate: {
             base: "error.1",
-            _hover: "red.1000"
+            _hover: "red.1000",
+            _disabled: "solid-gray.300"
           },
           _checked: {
             base: "error.1",
-            _hover: "red.1000"
+            _hover: "red.1000",
+            _disabled: "solid-gray.300"
           }
         },
         /**
@@ -704,27 +824,9 @@ var checkbox_default = (0, import_dev5.defineSlotRecipe)({
           display: "block",
           clipPath: "path('M3.25,7.75H10.75V6.25H3.25V7.75Z')"
         }
-      },
-      /**
-       * focus:outline focus:outline-4 focus:outline-black
-       * focus:outline-offset-[calc(2/16*1rem)]
-       * focus:ring-[calc(2/16*1rem)] focus:ring-yellow-300
-       */
-      _focus: {
-        outlineStyle: "solid",
-        outlineWidth: "4px",
-        outlineColor: "black",
-        outlineOffset: "calc(2 / 16 * 1rem)",
-        focusRing: "calc(2 / 16 * 1rem)"
       }
     },
     label: {
-      /**
-       * text-solid-gray-800
-       * data-[size=sm]:pt-px data-[size=sm]:text-dns-16N-130
-       * data-[size=md]:pt-1 data-[size=md]:text-dns-16N-130
-       * data-[size=lg]:pt-2.5 data-[size=lg]:text-dns-17N-130
-       */
       color: "solid-gray.800"
     }
   },
@@ -732,97 +834,60 @@ var checkbox_default = (0, import_dev5.defineSlotRecipe)({
     size: {
       sm: {
         root: {
-          /**
-           * data-[size=sm]:gap-1
-           */
-          gap: 1
+          gap: 1.5
         },
         control: {
-          /**
-           * data-[size=sm]:size-6
-           */
-          width: 6,
-          height: 6
-        },
-        indicator: {
-          /**
-           * data-[size=sm]:border-[calc(2/16*1rem)]
-           */
-          borderWidth: "calc(2 / 16 * 1rem)"
+          width: "calc({spacing.9} / 2)",
+          height: "calc({spacing.9} / 2)",
+          _groupHover: {
+            outlineWidth: "2px",
+            _focus: { outlineWidth: "4px" }
+          }
         },
         label: {
-          /**
-           * data-[size=sm]:pt-px data-[size=sm]:text-dns-16N-130
-           */
-          pt: "1px",
           textStyle: "dns-16N-130"
         }
       },
       md: {
         root: {
-          /**
-           * data-[size=md]:gap-2
-           */
-          gap: 2
+          gap: 2.5
         },
         control: {
-          /**
-           * data-[size=md]:size-8
-           */
-          width: 8,
-          height: 8
+          width: 6,
+          height: 6,
+          _groupHover: {
+            outlineWidth: "4px"
+          }
         },
         indicator: {
-          /**
-           * data-[size=md]:border-[calc(2/16*1rem)]
-           * data-[size=md]:before:origin-top-left
-           * data-[size=md]:before:scale-[calc(20/14)]
-           */
-          borderWidth: "calc(2 / 16 * 1rem)",
           _before: {
             transformOrigin: "top left",
             scale: "calc(20 / 14)"
           }
         },
         label: {
-          /**
-           * data-[size=md]:pt-1 data-[size=md]:text-dns-16N-130
-           */
-          pt: 1,
           textStyle: "dns-16N-130"
         }
       },
       lg: {
         root: {
-          /**
-           * data-[size=lg]:gap-2
-           */
-          gap: 2
+          gap: 2.5
         },
         control: {
-          /**
-           * data-[size=lg]:size-11
-           */
-          width: 11,
-          height: 11
+          width: 8,
+          height: 8,
+          _groupHover: {
+            outlineWidth: "6px",
+            _focus: { outlineWidth: "4px" }
+          }
         },
         indicator: {
-          /**
-           * data-[size=lg]:border-[calc(3/16*1rem)]
-           * data-[size=lg]:before:origin-top-left
-           * data-[size=lg]:before:scale-[calc(27/14)]
-           */
-          borderWidth: "calc(3 / 16 * 1rem)",
           _before: {
             transformOrigin: "top left",
             scale: "calc(27 / 14)"
           }
         },
         label: {
-          /**
-           * data-[size=lg]:pt-2.5 data-[size=lg]:text-dns-17N-130
-           */
-          pt: 2.5,
           textStyle: "dns-17N-130"
         }
       }
@@ -833,18 +898,67 @@ var checkbox_default = (0, import_dev5.defineSlotRecipe)({
   }
 });
 
+// src/recipes/chip-label.ts
+var import_dev7 = require("@pandacss/dev");
+var chip_label_default = (0, import_dev7.defineRecipe)({
+  className: "chip-label",
+  description: "\u72B6\u614B\u3084\u72B6\u6CC1\u3092\u793A\u3059\u30AD\u30FC\u30EF\u30FC\u30C9\u3092\u8868\u793A\u3057\u3066\u3001\u60C5\u5831\u306E\u5206\u985E\u30FB\u6574\u7406\u306E\u52B9\u7387\u3092\u5411\u4E0A\u3055\u305B\u308B\u30B0\u30E9\u30D5\u30A3\u30C3\u30AF\u8981\u7D20\u3067\u3059\u3002\u60C5\u5831\u30EA\u30B9\u30C8\u3084\u30C6\u30FC\u30D6\u30EB\u306E\u5404\u884C\u306A\u3069\u306E\u30B9\u30C6\u30FC\u30BF\u30B9\u3092\u5206\u304B\u308A\u3084\u3059\u304F\u8868\u793A\u3057\u305F\u3044\u5834\u5408\u306B\u6709\u52B9\u3067\u3059\u3002",
+  base: {
+    display: "inline-flex",
+    alignItems: "center",
+    gap: 1,
+    px: 2,
+    py: 1,
+    minHeight: "32px",
+    borderWidth: "1px",
+    colorPalette: "keyColor",
+    rounded: 8,
+    flexShrink: 0,
+    whiteSpace: "nowrap",
+    textStyle: "oln-16N-100"
+  },
+  variants: {
+    variant: {
+      text: {
+        color: "colorPalette.primary",
+        borderColor: "transparent"
+      },
+      outlined: {
+        color: "colorPalette.primary",
+        borderColor: "currentcolor"
+      },
+      ghost: {
+        color: "colorPalette.primary",
+        bg: "colorPalette.bg",
+        borderColor: "currentColor"
+      },
+      "solid-fill": {
+        bg: "colorPalette.primary",
+        color: "white",
+        borderColor: "transparent"
+      }
+    }
+  },
+  defaultVariants: {
+    variant: "text"
+  }
+});
+
 // src/recipes/disclosure.ts
-var import_dev6 = require("@pandacss/dev");
-var disclosure_default = (0, import_dev6.defineSlotRecipe)({
+var import_dev8 = require("@pandacss/dev");
+var import_collapsible = require("@zag-js/collapsible");
+var disclosure_default = (0, import_dev8.defineSlotRecipe)({
   className: "disclosure",
-  slots: disclosureAnatomy.keys(),
+  description: "\u30C7\u30A3\u30B9\u30AF\u30ED\u30FC\u30B8\u30E3\u30FC\u306F\u3001\u30B3\u30F3\u30C6\u30F3\u30C4\u306E\u30BB\u30AF\u30B7\u30E7\u30F3\u5185\u306E\u4EFB\u610F\u306E\u7BC4\u56F2\u3092\u6298\u308A\u305F\u305F\u3080\u3053\u3068\u304C\u3067\u304D\u308B\u30E6\u30FC\u30B6\u30FC\u30A4\u30F3\u30BF\u30FC\u30D5\u30A7\u30FC\u30B9\u3067\u3059\u3002\u203B\u30BB\u30AF\u30B7\u30E7\u30F3\u5358\u4F4D\u3067\u6298\u308A\u305F\u305F\u307F\u8868\u793A\u3092\u3059\u308B\u5834\u5408\u306F\u300C\u30A2\u30B3\u30FC\u30C7\u30A3\u30AA\u30F3\u300D\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u3092\u4F7F\u7528\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
+  slots: import_collapsible.anatomy.extendWith("indicator").keys(),
   base: {
     root: {
       /**
        * group/disclosure
        */
+      colorPalette: "keyColor"
     },
-    summary: {
+    trigger: {
       /**
        * group/summary
        * [&::-webkit-details-marker]:hidden
@@ -886,41 +1000,26 @@ var disclosure_default = (0, import_dev6.defineSlotRecipe)({
         focusRing: "calc(2 / 16 * 1rem)"
       }
     },
-    icon: {
-      /**
-       * flex-none text-blue-1000 mt-[calc((1lh-24px)/2)]
-       * group-open/disclosure:rotate-180
-       * forced-colors:text-inherit
-       */
+    indicator: {
       flex: "none",
-      color: { base: "keyColor.1000", _highContrast: "inherit" },
+      bg: { base: "colorPalette.primary.100", _groupHover: "white" },
+      color: {
+        base: "white",
+        _groupHover: "colorPalette.primary.100",
+        _highContrast: "inherit"
+      },
       mt: "calc((1lh - 24px) / 2)",
-      /**
-       * svg
-       */
       width: "24px",
       height: "24px",
       rounded: "full",
-      bg: { base: "white", _groupHover: "currentColor" },
       outlineStyle: "solid",
       outlineWidth: "3px",
       outlineOffset: "-3px",
+      outlineColor: "colorPalette.primary.100",
+      transition: "transform",
       transform: {
         base: "rotate(-180deg)",
-        "[data-state=open]>&": "rotate(0deg)"
-      },
-      transition: "transform",
-      _before: {
-        content: '""',
-        bg: { base: "currentColor", _groupHover: "white" },
-        width: "full",
-        height: "full",
-        rounded: "full",
-        outlineStyle: "solid",
-        outlineWidth: "3px",
-        outlineOffset: "-3px",
-        display: "block",
-        clipPath: "path('M12 15.525L16.925 10.625H7.07502L12 15.525ZM12 22.85C10.4834 22.85 9.06677 22.566 7.75027 21.998C6.43394 21.4298 5.28886 20.6588 4.31502 19.685C3.34119 18.7112 2.57019 17.5661 2.00202 16.2498C1.43402 14.9333 1.15002 13.5167 1.15002 12C1.15002 10.4833 1.43402 9.06675 2.00202 7.75025C2.57019 6.43392 3.34119 5.28883 4.31502 4.315C5.28886 3.34117 6.43394 2.57017 7.75027 2.002C9.06677 1.434 10.4834 1.15 12 1.15C13.5167 1.15 14.9333 1.434 16.2498 2.002C17.5661 2.57017 18.7112 3.34117 19.685 4.315C20.6589 5.28883 21.4299 6.43392 21.998 7.75025C22.566 9.06675 22.85 10.4833 22.85 12C22.85 13.5167 22.566 14.9333 21.998 16.2498C21.4299 17.5661 20.6589 18.7112 19.685 19.685C18.7112 20.6588 17.5661 21.4298 16.2498 21.998C14.9333 22.566 13.5167 22.85 12 22.85Z')"
+        _open: "rotate(0deg)"
       }
     },
     content: {}
@@ -928,8 +1027,8 @@ var disclosure_default = (0, import_dev6.defineSlotRecipe)({
 });
 
 // src/recipes/divider.ts
-var import_dev7 = require("@pandacss/dev");
-var divider_default = (0, import_dev7.defineRecipe)({
+var import_dev9 = require("@pandacss/dev");
+var divider_default = (0, import_dev9.defineRecipe)({
   className: "divider",
   description: "\u30C7\u30A3\u30D0\u30A4\u30C0\u30FC\u306F\u3001\u7570\u306A\u308B\u30BB\u30AF\u30B7\u30E7\u30F3\u3001\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u3001\u307E\u305F\u306F\u30B3\u30F3\u30C6\u30F3\u30C4\u306E\u30B0\u30EB\u30FC\u30D7\u9593\u306B\u8A2D\u3051\u3089\u308C\u308B\u8996\u899A\u7684\u306A\u533A\u5207\u308A\u3067\u3001HTML\u306Ehr\u8981\u7D20\u306B\u76F8\u5F53\u3057\u307E\u3059\u3002\u8981\u7D20\u9593\u306B\u660E\u78BA\u306A\u533A\u5207\u308A\u3092\u8A2D\u3051\u308B\u3053\u3068\u3067\u3001\u8AAD\u307F\u3084\u3059\u3055\u3092\u5411\u4E0A\u3055\u305B\u308B\u5F79\u5272\u3092\u679C\u305F\u3057\u307E\u3059\u3002",
   variants: {
@@ -946,10 +1045,11 @@ var divider_default = (0, import_dev7.defineRecipe)({
 
 // src/recipes/drawer.ts
 var import_dialog = require("@zag-js/dialog");
-var import_dev8 = require("@pandacss/dev");
+var import_dev10 = require("@pandacss/dev");
 var anatomy = import_dialog.anatomy.extendWith("header", "body", "footer");
-var drawer_default = (0, import_dev8.defineSlotRecipe)({
+var drawer_default = (0, import_dev10.defineSlotRecipe)({
   className: "drawer",
+  description: "\u30D6\u30E9\u30A6\u30B6\u753B\u9762\u306E\u56DB\u8FBA(\u4E0A\u4E0B\u5DE6\u53F3\u7AEF)\u304B\u3089\u5C55\u958B\u3057\u3001\u30E2\u30D0\u30A4\u30EB\u30E1\u30CB\u30E5\u30FC\u306A\u3069\u306E\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u3092\u683C\u7D0D\u53EF\u80FD\u306A\u30B3\u30F3\u30C6\u30CA\u3067\u3059\u3002",
   slots: anatomy.keys(),
   base: {
     backdrop: {
@@ -957,7 +1057,7 @@ var drawer_default = (0, import_dev8.defineSlotRecipe)({
        * backdrop:bg-opacity-gray-100 forced-colors:backdrop:bg-[#000b]
        */
       backdropFilter: "blur(4px)",
-      background: "gray.100/90",
+      background: "solid-gray.100/90",
       height: "100vh",
       position: "fixed",
       top: 0,
@@ -1066,8 +1166,8 @@ var drawer_default = (0, import_dev8.defineSlotRecipe)({
 });
 
 // src/recipes/error-text.ts
-var import_dev9 = require("@pandacss/dev");
-var error_text_default = (0, import_dev9.defineRecipe)({
+var import_dev11 = require("@pandacss/dev");
+var error_text_default = (0, import_dev11.defineRecipe)({
   className: "error-text",
   base: {
     /**
@@ -1078,52 +1178,12 @@ var error_text_default = (0, import_dev9.defineRecipe)({
   }
 });
 
-// src/recipes/hamburger-menu-button.ts
-var import_dev10 = require("@pandacss/dev");
-var hamburger_menu_button_default = (0, import_dev10.defineRecipe)({
-  className: "hamburger-menu-button",
-  base: {
-    /**
-     * flex w-fit items-center text-oln-16N-100 rounded-4 touch-manipulation
-     */
-    display: "flex",
-    width: "fit-content",
-    alignItems: "center",
-    textStyle: "oln-16N-100",
-    rounded: 4,
-    touchAction: "manipulation",
-    gap: 1.5,
-    /**
-     * hover:bg-solid-gray-50 hover:underline hover:underline-offset-[calc(3/16*1rem)]
-     */
-    _hover: {
-      bg: "solid-gray.50",
-      textDecoration: "underline",
-      textUnderlineOffset: "calc(3 / 16 * 1rem)"
-    },
-    /**
-     * focus-visible:outline focus-visible:outline-4 focus-visible:outline-black
-     * focus-visible:outline-offset-[calc(2/16*1rem)] focus-visible:bg-yellow-300
-     * focus-visible:ring-[calc(2/16*1rem)] focus-visible:ring-yellow-300
-     */
-    _focusVisible: {
-      bg: "yellow.300",
-      outlineStyle: "solid",
-      outlineWidth: "4px",
-      outlineColor: "black",
-      outlineOffset: "calc(2 / 16 * 1rem)",
-      focusRing: "calc(2 / 16 * 1rem)"
-    },
-    /**
-     * override reset
-     */
-    cursor: "pointer"
-  }
-});
+// src/recipes/field.ts
+var import_dev18 = require("@pandacss/dev");
 
 // src/recipes/input.ts
-var import_dev11 = require("@pandacss/dev");
-var input_default = (0, import_dev11.defineRecipe)({
+var import_dev12 = require("@pandacss/dev");
+var input_default = (0, import_dev12.defineRecipe)({
   className: "input",
   description: "\u30A4\u30F3\u30D7\u30C3\u30C8\u30C6\u30AD\u30B9\u30C8\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u306F\u3001\u540D\u524D\u3084\u96FB\u8A71\u756A\u53F7\u306A\u3069\u30011\u884C\u4EE5\u5185\u306E\u30C6\u30AD\u30B9\u30C8\u3092\u5165\u529B\u3059\u308B\u5834\u5408\u306B\u4F7F\u7528\u3057\u307E\u3059\u3002",
   base: {
@@ -1139,12 +1199,14 @@ var input_default = (0, import_dev11.defineRecipe)({
      * border border-solid-gray-600 hover:border-black
      * aria-disabled:border-solid-gray-300
      * aria-disabled:forced-colors:border-[GrayText]
+     * aria-[invalid=true]:border-error-1 aria-[invalid=true]:hover:border-red-1000
      */
     borderWidth: "1px",
     borderColor: {
       base: "solid-gray.600",
       _hover: "black",
-      _disabled: { base: "solid-gray.300", _highContrast: "GrayText" }
+      _disabled: { base: "solid-gray.300", _highContrast: "GrayText" },
+      _invalid: { base: "error.1", _hover: "red.1000" }
     },
     /**
      * bg-white text-oln-16N-100 text-solid-gray-800
@@ -1160,7 +1222,8 @@ var input_default = (0, import_dev11.defineRecipe)({
     textStyle: "oln-16N-100",
     /**
      * focus:outline focus:outline-4 focus:outline-black
-     * focus:outline-offset-[calc(2/16*1rem)] focus:ring-[calc(2/16*1rem)] focus:ring-yellow-300
+     * focus:outline-offset-[calc(2/16*1rem)]
+     * focus:ring-[calc(2/16*1rem)] focus:ring-yellow-300
      */
     _focus: {
       outlineStyle: "solid",
@@ -1182,28 +1245,16 @@ var input_default = (0, import_dev11.defineRecipe)({
       sm: { height: 10 },
       md: { height: 12 },
       lg: { height: 14 }
-    },
-    invalid: {
-      true: {
-        /**
-         * aria-[invalid=true]:border-error-1 aria-[invalid=true]:hover:border-red-1000
-         */
-        borderColor: { base: "error.1", _hover: "red.1000" }
-      }
     }
   },
   defaultVariants: {
-    size: "lg",
-    invalid: false
+    size: "lg"
   }
 });
 
-// src/recipes/input-text.ts
-var import_dev16 = require("@pandacss/dev");
-
 // src/recipes/label.ts
-var import_dev12 = require("@pandacss/dev");
-var label_default = (0, import_dev12.defineRecipe)({
+var import_dev13 = require("@pandacss/dev");
+var label_default = (0, import_dev13.defineRecipe)({
   className: "label",
   base: {
     /**
@@ -1230,9 +1281,22 @@ var label_default = (0, import_dev12.defineRecipe)({
   }
 });
 
+// src/recipes/requirement-badge.ts
+var import_dev14 = require("@pandacss/dev");
+var requirement_badge_default = (0, import_dev14.defineRecipe)({
+  className: "requirement-badge",
+  base: {
+    /**
+     * text-oln-16N-100 text-red-800
+     */
+    textStyle: "oln-16N-100",
+    color: "red.800"
+  }
+});
+
 // src/recipes/select-box.ts
-var import_dev13 = require("@pandacss/dev");
-var select_box_default = (0, import_dev13.defineRecipe)({
+var import_dev15 = require("@pandacss/dev");
+var select_box_default = (0, import_dev15.defineRecipe)({
   className: "select-box",
   description: "\u30BB\u30EC\u30AF\u30C8\u30DC\u30C3\u30AF\u30B9\u306F\u3001\u8907\u6570\u306E\u9078\u629E\u80A2\u3092\u63D0\u4F9B\u3059\u308B\u30D5\u30A9\u30FC\u30E0\u30B3\u30F3\u30C8\u30ED\u30FC\u30EB\u3067\u3059\u3002",
   base: {
@@ -1260,11 +1324,13 @@ var select_box_default = (0, import_dev13.defineRecipe)({
      * border border-solid-gray-600 hover:border-black
      * aria-disabled:border-solid-gray-300 aria-disabled:bg-solid-gray-50
      * aria-disabled:forced-colors:border-[GrayText]
+     * aria-[invalid=true]:border-error-1aria-[invalid=true]:hover:border-red-1000
      */
     borderWidth: "1px",
     borderColor: {
       base: "solid-gray.900",
-      _disabled: "solid-gray.300"
+      _disabled: "solid-gray.300",
+      _invalid: { base: "error.1", _hover: "red.1000" }
     },
     /**
      * remove button style
@@ -1295,34 +1361,26 @@ var select_box_default = (0, import_dev13.defineRecipe)({
       lg: {
         height: 14
       }
-    },
-    invalid: {
-      /**
-       * aria-[invalid=true]:border-error-1aria-[invalid=true]:hover:border-red-1000
-       */
-      true: {
-        borderColor: { base: "error.1", _hover: "red.1000" }
-      }
     }
   }
 });
 
 // src/recipes/support-text.ts
-var import_dev14 = require("@pandacss/dev");
-var support_text_default = (0, import_dev14.defineRecipe)({
+var import_dev16 = require("@pandacss/dev");
+var support_text_default = (0, import_dev16.defineRecipe)({
   className: "support-text",
   base: {
     /**
      * text-std-16N-170 text-solid-gray-700
      */
-    textStyle: "dns-16N-170",
+    textStyle: "std-16N-170",
     color: "solid-gray.700"
   }
 });
 
 // src/recipes/textarea.ts
-var import_dev15 = require("@pandacss/dev");
-var textarea_default = (0, import_dev15.defineRecipe)({
+var import_dev17 = require("@pandacss/dev");
+var textarea_default = (0, import_dev17.defineRecipe)({
   className: "textarea",
   description: "\u30C6\u30AD\u30B9\u30C8\u30A8\u30EA\u30A2\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u306F\u30011\u884C\u4EE5\u4E0A\u306E\u30C6\u30AD\u30B9\u30C8\u3092\u5165\u529B\u3059\u308B\u5834\u5408\u306B\u4F7F\u7528\u3057\u307E\u3059\u3002",
   base: {
@@ -1345,15 +1403,18 @@ var textarea_default = (0, import_dev15.defineRecipe)({
     /**
      * border border-solid-gray-600 hover:border-black
      * aria-disabled:border-solid-gray-300 aria-disabled:forced-colors:border-[GrayText]
+     * aria-[invalid=true]:border-error-1 aria-[invalid=true]:hover:border-red-1000
      */
     borderWidth: "1px",
     borderColor: {
       base: "solid-gray.600",
       _hover: "black",
-      _disabled: { base: "solid-gray.300", _hover: "GrayText" }
+      _disabled: { base: "solid-gray.300", _hover: "GrayText" },
+      _invalid: { base: "error.1", _hover: "red.1000" }
     },
     /**
-     * focus:outline focus:outline-4 focus:outline-black focus:outline-offset-[calc(2/16*1rem)]
+     * focus:outline focus:outline-4 focus:outline-black
+     * focus:outline-offset-[calc(2/16*1rem)]
      * focus:ring-[calc(2/16*1rem)] focus:ring-yellow-300
      */
     _focus: {
@@ -1363,27 +1424,13 @@ var textarea_default = (0, import_dev15.defineRecipe)({
       outlineOffset: "calc(2 / 16 * 1rem)",
       focusRing: "calc(2 / 16 * 1rem)"
     }
-  },
-  variants: {
-    invalid: {
-      true: {
-        /**
-         * aria-[invalid=true]:border-error-1 aria-[invalid=true]:hover:border-red-1000
-         */
-        borderColor: { base: "error.1", _hover: "red.1000" }
-      }
-    }
-  },
-  defaultVariants: {
-    invalid: false
   }
 });
 
-// src/recipes/input-text.ts
-var inputText = (0, import_dev16.defineSlotRecipe)({
-  className: "input-text",
-  description: "\u30A4\u30F3\u30D7\u30C3\u30C8\u30C6\u30AD\u30B9\u30C8\u30B3\u30F3\u30DD\u30FC\u30CD\u30F3\u30C8\u306F\u3001\u540D\u524D\u3084\u96FB\u8A71\u756A\u53F7\u306A\u3069\u30011\u884C\u4EE5\u5185\u306E\u30C6\u30AD\u30B9\u30C8\u3092\u5165\u529B\u3059\u308B\u5834\u5408\u306B\u4F7F\u7528\u3057\u307E\u3059\u3002",
-  slots: inputTextAnatomy.keys(),
+// src/recipes/field.ts
+var field = (0, import_dev18.defineSlotRecipe)({
+  className: "field",
+  slots: fieldAnatomy.keys(),
   base: {
     root: {
       display: "flex",
@@ -1405,8 +1452,11 @@ var inputText = (0, import_dev16.defineSlotRecipe)({
     errorText: {
       ...error_text_default.base
     },
-    helperText: {
+    supportText: {
       ...support_text_default.base
+    },
+    requirementBadge: {
+      ...requirement_badge_default.base
     }
   },
   variants: {
@@ -1426,25 +1476,100 @@ var inputText = (0, import_dev16.defineSlotRecipe)({
         input: { ...input_default.variants?.size?.sm },
         select: { ...select_box_default.variants?.size?.sm }
       }
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var field_default = field;
+
+// src/recipes/fieldset.ts
+var import_dev19 = require("@pandacss/dev");
+var fieldset_default = (0, import_dev19.defineSlotRecipe)({
+  className: "fieldset",
+  slots: fieldsetAnatomy.keys(),
+  base: {
+    legend: {
+      ...label_default.base
     },
-    invalid: {
-      true: {
-        input: { ...input_default.variants?.invalid?.true },
-        select: { ...select_box_default.variants?.invalid?.true },
-        textarea: { ...textarea_default.variants?.invalid?.true }
+    supportText: {
+      ...support_text_default.base
+    },
+    errorText: {
+      ...error_text_default.base
+    }
+  },
+  variants: {
+    size: {
+      lg: {
+        legend: { ...label_default.variants?.size?.lg }
+      },
+      md: {
+        legend: { ...label_default.variants?.size?.md }
+      },
+      sm: {
+        legend: { ...label_default.variants?.size?.sm }
       }
     }
   },
   defaultVariants: {
-    size: "lg",
-    invalid: false
+    size: "md"
+  }
+});
+
+// src/recipes/hamburger-menu-button.ts
+var import_dev20 = require("@pandacss/dev");
+var hamburger_menu_button_default = (0, import_dev20.defineRecipe)({
+  className: "hamburger-menu-button",
+  base: {
+    /**
+     * flex w-fit items-center text-oln-16N-100 rounded-6 touch-manipulation
+     */
+    display: "flex",
+    width: "fit-content",
+    alignItems: "center",
+    textStyle: "oln-16N-100",
+    rounded: 6,
+    /**
+     * gap-x-1 px-3 pb-1.5 pt-1
+     */
+    px: 3,
+    pb: 1.5,
+    pt: 1,
+    touchAction: "manipulation",
+    columnGap: 1.5,
+    /**
+     * hover:bg-solid-gray-50 hover:underline hover:underline-offset-[calc(3/16*1rem)]
+     */
+    _hover: {
+      bg: "solid-gray.50",
+      textDecoration: "underline",
+      textUnderlineOffset: "calc(3 / 16 * 1rem)"
+    },
+    /**
+     * focus-visible:outline focus-visible:outline-4 focus-visible:outline-black
+     * focus-visible:outline-offset-[calc(2/16*1rem)] focus-visible:bg-yellow-300
+     * focus-visible:ring-[calc(2/16*1rem)] focus-visible:ring-yellow-300
+     */
+    _focusVisible: {
+      bg: "yellow.300",
+      outlineStyle: "solid",
+      outlineWidth: "4px",
+      outlineColor: "black",
+      outlineOffset: "calc(2 / 16 * 1rem)",
+      focusRing: "calc(2 / 16 * 1rem)"
+    },
+    /**
+     * override reset
+     */
+    cursor: "pointer"
   }
 });
-var input_text_default = inputText;
 
 // src/recipes/legend.ts
-var import_dev17 = require("@pandacss/dev");
-var legend_default = (0, import_dev17.defineRecipe)({
+var import_dev21 = require("@pandacss/dev");
+var legend_default = (0, import_dev21.defineRecipe)({
   className: "legend",
   base: {
     /**
@@ -1484,8 +1609,8 @@ var legend_default = (0, import_dev17.defineRecipe)({
 });
 
 // src/recipes/list.ts
-var import_dev18 = require("@pandacss/dev");
-var list_default = (0, import_dev18.defineRecipe)({
+var import_dev22 = require("@pandacss/dev");
+var list_default = (0, import_dev22.defineRecipe)({
   className: "list",
   base: {
     /**
@@ -1496,16 +1621,17 @@ var list_default = (0, import_dev18.defineRecipe)({
 });
 
 // src/recipes/menu.ts
-var import_dev20 = require("@pandacss/dev");
+var import_dev24 = require("@pandacss/dev");
 var import_menu = require("@zag-js/menu");
 
 // src/recipes/menu-item.ts
-var import_dev19 = require("@pandacss/dev");
-var menu_item_default = (0, import_dev19.defineRecipe)({
+var import_dev23 = require("@pandacss/dev");
+var menu_item_default = (0, import_dev23.defineRecipe)({
   className: "menu-item",
   base: {
     /**
-     * flex relative items-center bg-white hover:bg-solid-gray-50 text-nowrap
+     * flex relative items-center text-nowrap
+     * bg-white hover:bg-solid-gray-50 focus-visible:bg-yellow-300
      * text-oln-16N-100 text-solid-gray-800
      * ${isCurrent ? '!text-blue-1000 !bg-blue-100 font-bold' : ''}
      */
@@ -1513,27 +1639,30 @@ var menu_item_default = (0, import_dev19.defineRecipe)({
     position: "relative",
     alignItems: "center",
     textStyle: "dns-16N-130",
+    colorPalette: "keyColor",
     bg: {
       base: "transparent",
       _hover: "solid-gray.50",
+      _focusVisible: "yellow.300",
+      _highlighted: "yellow.300",
       _selected: {
-        base: "keyColor.100",
-        _hover: "keyColor.100"
+        base: "colorPalette.100",
+        _hover: "colorPalette.100"
       },
       _checked: {
-        base: "keyColor.100",
-        _hover: "keyColor.100"
+        base: "colorPalette.100",
+        _hover: "colorPalette.100"
       },
       _open: {
-        base: "keyColor.50",
-        _hover: "keyColor.50"
+        base: "colorPalette.bg",
+        _hover: "colorPalette.bg"
       }
     },
     color: {
       base: "solid-gray.800",
-      _selected: "keyColor.1000",
-      _checked: "keyColor.1000",
-      _open: "keyColor.1000"
+      _selected: "colorPalette.primary.100",
+      _checked: "colorPalette.primary.100",
+      _open: "colorPalette.primary.100"
     },
     fontWeight: { base: "normal", _selected: "bold", _checked: "bold" },
     /**
@@ -1552,17 +1681,27 @@ var menu_item_default = (0, import_dev19.defineRecipe)({
     columnGap: 2,
     /**
      * focus-visible:outline focus-visible:outline-4 focus-visible:outline-black
-     * focus-visible:-outline-offset-4 focus-visible:bg-yellow-300
+     * focus-visible:-outline-offset-4
      * focus-visible:ring-[calc(6/16*1rem)] focus-visible:ring-inset
      * focus-visible:ring-yellow-300
      */
     _focusVisible: {
-      // rounded: 4,
+      rounded: 4,
+      outlineStyle: "solid",
+      outlineWidth: "4px",
+      outlineColor: "black",
+      outlineOffset: "calc(2 / 16 * 1rem)",
+      focusRing: "calc(6 / 16 * 1rem)",
+      zIndex: 1
+    },
+    _highlighted: {
+      rounded: 4,
       outlineStyle: "solid",
       outlineWidth: "4px",
       outlineColor: "black",
       outlineOffset: "calc(2 / 16 * 1rem)",
-      focusRing: "calc(6 / 16 * 1rem)"
+      focusRing: "calc(6 / 16 * 1rem)",
+      zIndex: 1
     }
   },
   variants: {
@@ -1599,7 +1738,7 @@ var menu_item_default = (0, import_dev19.defineRecipe)({
 var itemStyle = {
   ...menu_item_default.base
 };
-var menu_default = (0, import_dev20.defineSlotRecipe)({
+var menu_default = (0, import_dev24.defineSlotRecipe)({
   className: "menu",
   slots: import_menu.anatomy.keys(),
   base: {
@@ -1611,7 +1750,7 @@ var menu_default = (0, import_dev20.defineSlotRecipe)({
       borderWidth: "1px",
       borderColor: "solid-gray.420",
       bg: "white",
-      rounded: "lg",
+      rounded: 8,
       boxShadow: 1
       /**
       * min-w-fit w-auto py-2 border border-solid-grey-420 bg-white shadow-1 rounded-lg
@@ -1634,8 +1773,8 @@ var menu_default = (0, import_dev20.defineSlotRecipe)({
       },
       textUnderlineOffset: "calc(3 / 16 * 1rem)",
       _checked: {
-        bg: "keyColor.100",
-        color: "keyColor.1000",
+        bg: "colorPalette.100",
+        color: "colorPalette.primary.100",
         fontWeight: "bold"
       },
       _focusVisible: {
@@ -1689,8 +1828,8 @@ var menu_default = (0, import_dev20.defineSlotRecipe)({
 });
 
 // src/recipes/menu-list.ts
-var import_dev21 = require("@pandacss/dev");
-var menu_list_default = (0, import_dev21.defineSlotRecipe)({
+var import_dev25 = require("@pandacss/dev");
+var menu_list_default = (0, import_dev25.defineSlotRecipe)({
   className: "menu-list",
   slots: menuListAnatomy.keys(),
   base: {
@@ -1755,9 +1894,10 @@ var menu_list_default = (0, import_dev21.defineSlotRecipe)({
 });
 
 // src/recipes/notification-banner.ts
-var import_dev22 = require("@pandacss/dev");
-var notification_banner_default = (0, import_dev22.defineSlotRecipe)({
+var import_dev26 = require("@pandacss/dev");
+var notification_banner_default = (0, import_dev26.defineSlotRecipe)({
   className: "notification-banner",
+  description: "\u30B5\u30A4\u30C8/\u30B5\u30FC\u30D3\u30B9\u5168\u4F53\u306B\u95A2\u308F\u308B\u3001\u307E\u305F\u306F\u30DA\u30FC\u30B8\u3084\u8981\u7D20\u5358\u4F4D\u306B\u304A\u3051\u308B\u91CD\u8981\u5EA6\u306E\u9AD8\u3044\u60C5\u5831\u3092\u3001\u30E6\u30FC\u30B6\u30FC\u306E\u64CD\u4F5C\u306B\u95A2\u308F\u3089\u305A\u3001\u30B5\u30A4\u30C8/\u30B5\u30FC\u30D3\u30B9\u5074\u304B\u3089\u30E6\u30FC\u30B6\u30FC\u3078\u63D0\u793A\u3059\u308B\u5834\u5408\u306B\u7528\u3044\u308B\u901A\u77E5\u30D0\u30CA\u30FC\u3067\u3059\u3002\u901A\u77E5\u306B\u5BFE\u3059\u308B\u30E6\u30FC\u30B6\u30FC\u30A2\u30AF\u30B7\u30E7\u30F3\u3092\u8981\u6C42\u3059\u308B\u3053\u3068\u304C\u53EF\u80FD\u3067\u3059\u3002\u30E1\u30F3\u30C6\u30CA\u30F3\u30B9\u3092\u901A\u77E5\u3057\u305F\u3044\u3001\u30E6\u30FC\u30B6\u30FC\u306E\u5BFE\u5FDC\u304C\u5FC5\u8981\u306A\u60C5\u5831\u3092\u901A\u77E5\u3057\u3066\u30A2\u30AF\u30B7\u30E7\u30F3\u3055\u305B\u305F\u3044\u3001\u3068\u3044\u3063\u305F\u8981\u6C42\u306B\u5BFE\u5FDC\u3059\u308B\u3053\u3068\u304C\u3067\u304D\u307E\u3059\u3002",
   slots: notificationBannerAnatomy.keys(),
   base: {
     root: {
@@ -1820,49 +1960,26 @@ var notification_banner_default = (0, import_dev22.defineSlotRecipe)({
         bg: "currentColor",
         width: "36px",
         height: "36px",
-        transformOrigin: "left center",
-        transform: "scale(var(--icon-scale))"
-      }
-    },
-    close: {
-      /**
-       * inline-flex items-center gap-0.5
-       * -mt-2 -mr-3 desktop:mt-0 desktop:mr-0 desktop:px-2 desktop:py-0.5
-       */
-      display: "inline-flex",
-      alignItems: "center",
-      gap: 0.5,
-      mt: { base: -2, md: 0 },
-      mr: { base: -3, md: 0 },
-      px: { base: 0, md: 2 },
-      py: { base: 0, md: 0.5 },
-      /**
-       * text-solid-gray-900
-       */
-      color: "solid-gray.900",
-      /**
-       * border border-transparent  hover:border-solid-gray-900 rounded-8 focus-visible:border-transparent
-       */
-      borderWidth: "1px",
-      borderColor: {
-        base: "transparent",
-        _hover: "solid-gray.900",
-        _focusVisible: "transparent"
-      },
-      rounded: 8,
-      /**
-       * focus-visible:outline focus-visible:outline-4 focus-visible:outline-black focus-visible:outline-offset-[calc(2/16*1rem)]
-       * focus-visible:ring-[calc(2/16*1rem)] focus-visible:ring-yellow-300 focus-visible:bg-yellow-300
-       *
-       */
-      _focusVisible: {
-        outlineStyle: "solid",
-        outlineWidth: "4px",
-        outlineColor: "black",
-        outlineOffset: "calc(2 / 16 * 1rem)",
-        focusRing: "calc(2 / 16 * 1rem)"
+        transformOrigin: "left center",
+        transform: "scale(var(--icon-scale))"
       }
     },
+    close: {
+      _before: {
+        content: '""',
+        display: "block",
+        mt: 0.5,
+        width: 6,
+        height: 6,
+        bg: "currentColor",
+        clipPath: "path('m6.4 18.6-1-1 5.5-5.6-5.6-5.6 1.1-1 5.6 5.5 5.6-5.6 1 1.1L13 12l5.6 5.6-1 1L12 13l-5.6 5.6Z')"
+      },
+      ...hamburger_menu_button_default.base,
+      display: "inline-flex",
+      gap: 1,
+      mr: -3,
+      color: "solid-gray.900"
+    },
     heading: {
       /**
        * text-solid-gray-900 col-start-1 desktop:mt-0.5
@@ -1884,6 +2001,28 @@ var notification_banner_default = (0, import_dev22.defineSlotRecipe)({
       gridColumnEnd: -1,
       textStyle: "std-16N-170",
       color: "solid-gray.800"
+    },
+    actions: {
+      /**
+       * margin-bottom: calc(-8 / 16 * 1rem);
+       * display: grid;
+       * gap: calc(8 / 16 * 1rem);
+       * grid-column: 1 / 4;
+       * @media (min-width: 48rem) {
+       *  .dads-notification-banner__actions {
+       *    grid-auto-flow: column;
+       *    gap: calc(16 / 16 * 1rem);
+       *    grid-column: 2 / 4;
+       *    justify-content: end;
+       *  }
+       * }
+       */
+      mb: "calc(-8 / 16 * 1rem)",
+      display: "grid",
+      gap: { base: "calc(8 / 16 * 1rem)", md: "calc(16 / 16 * 1rem)" },
+      gridColumn: { base: "1 / 4", md: "2 / 4" },
+      gridAutoFlow: { md: "column" },
+      justifyContent: { md: "end" }
     }
   },
   variants: {
@@ -1898,7 +2037,12 @@ var notification_banner_default = (0, import_dev22.defineSlotRecipe)({
         },
         icon: {
           _before: {
-            clipPath: "path('M18 0C8.064 0 0 8.064 0 18C0 27.936 8.064 36 18 36C27.936 36 36 27.936 36 18C36 8.064 27.936 0 18 0ZM14.4 27L5.4 18L7.938 15.462L14.4 21.906L28.062 8.244L30.6 10.8L14.4 27Z')"
+            clipPath: "path('M18 0C8.064 0 0 8.064 0 18C0 27.936 8.064 36 18 36C27.936 36 36 27.936 36 18C36 8.064 27.936 0 18 0Z M14.4 27L5.4 18L7.938 15.462L14.4 21.906L28.062 8.244L30.6 10.8L14.4 27Z')"
+          }
+        },
+        actions: {
+          "& button": {
+            colorPalette: "green"
           }
         }
       },
@@ -1912,7 +2056,12 @@ var notification_banner_default = (0, import_dev22.defineSlotRecipe)({
         },
         icon: {
           _before: {
-            clipPath: "path('M24.2525 33H11.7475L3 24.2525V11.7475L11.7475 3H24.2525L33 11.7475V24.2525L24.2525 33Z')"
+            clipPath: "path('M10.82 35.3.74 25.22v-14.4L10.82.74h14.4L35.3 10.82v14.4L25.22 35.3h-14.4Zm7.2-14.592 5.472 5.472 2.688-2.688-5.472-5.472 5.472-5.472-2.688-2.688-5.472 5.472-5.472-5.472-2.688 2.688 5.472 5.472-5.472 5.472 2.688 2.688 5.472-5.472Z')"
+          }
+        },
+        actions: {
+          "& button": {
+            colorPalette: "red"
           }
         }
       },
@@ -1928,6 +2077,11 @@ var notification_banner_default = (0, import_dev22.defineSlotRecipe)({
           _before: {
             clipPath: "path('M0 34.0909H36L18 3L0 34.0909ZM19.6364 29.1818H16.3636V25.9091H19.6364V29.1818ZM19.6364 22.6364H16.3636V16.0909H19.6364V22.6364Z')"
           }
+        },
+        actions: {
+          "& button": {
+            colorPalette: "yellow"
+          }
         }
       },
       info1: {
@@ -1942,6 +2096,11 @@ var notification_banner_default = (0, import_dev22.defineSlotRecipe)({
           _before: {
             clipPath: "path('M18 0C8.064 0 0 8.064 0 18C0 27.936 8.064 36 18 36C27.936 36 36 27.936 36 18C36 8.064 27.936 0 18 0ZM19.8 27H16.2V16.2H19.8V27ZM19.8 12.6H16.2V9H19.8V12.6Z')"
           }
+        },
+        actions: {
+          "& button": {
+            colorPalette: "blue"
+          }
         }
       },
       info2: {
@@ -1956,6 +2115,11 @@ var notification_banner_default = (0, import_dev22.defineSlotRecipe)({
           _before: {
             clipPath: "path('M18 0C8.064 0 0 8.064 0 18C0 27.936 8.064 36 18 36C27.936 36 36 27.936 36 18C36 8.064 27.936 0 18 0ZM19.8 27H16.2V16.2H19.8V27ZM19.8 12.6H16.2V9H19.8V12.6Z')"
           }
+        },
+        actions: {
+          "& button": {
+            colorPalette: "solid-gray"
+          }
         }
       }
     },
@@ -1990,8 +2154,8 @@ var notification_banner_default = (0, import_dev22.defineSlotRecipe)({
 });
 
 // src/recipes/ordered-list.ts
-var import_dev23 = require("@pandacss/dev");
-var ordered_list_default = (0, import_dev23.defineRecipe)({
+var import_dev27 = require("@pandacss/dev");
+var ordered_list_default = (0, import_dev27.defineRecipe)({
   className: "ordered-list",
   base: {
     /**
@@ -2009,12 +2173,119 @@ var ordered_list_default = (0, import_dev23.defineRecipe)({
   }
 });
 
-// src/recipes/radio.ts
-var import_dev24 = require("@pandacss/dev");
-var radio_default = (0, import_dev24.defineSlotRecipe)({
-  className: "radio",
-  slots: ["item", "itemControl", "itemText"],
+// src/recipes/progress.ts
+var import_dev28 = require("@pandacss/dev");
+var import_progress = require("@zag-js/progress");
+var progress_default = (0, import_dev28.defineSlotRecipe)({
+  className: "progress",
+  description: "\u30D7\u30ED\u30B0\u30EC\u30B9\u30A4\u30F3\u30B8\u30B1\u30FC\u30BF\u30FC\u306F\u3001\u30E6\u30FC\u30B6\u30FC\u306E\u30A2\u30AF\u30B7\u30E7\u30F3\u306B\u5BFE\u3057\u3066\u51E6\u7406\u9032\u884C\u4E2D\u3067\u3042\u308B\u3053\u3068\u3092\u901A\u77E5\u3057\u307E\u3059\u3002\u30C7\u30FC\u30BF\u53D6\u5F97\u30EA\u30AF\u30A8\u30B9\u30C8\u306E\u5FDC\u7B54\u3092\u5F85\u3063\u3066\u3044\u308B\u3053\u3068\u3092\u30E6\u30FC\u30B6\u30FC\u306B\u4F1D\u3048\u305F\u3044\u3068\u3044\u3063\u305F\u8981\u6C42\u306B\u5BFE\u5FDC\u3057\u307E\u3059\u3002",
+  slots: import_progress.anatomy.keys(),
+  base: {
+    root: {
+      display: "flex",
+      alignItems: "center",
+      colorPalette: "keyColor"
+    },
+    track: {
+      height: "4px",
+      bg: "colorPalette.500",
+      rounded: "full",
+      overflow: "hidden",
+      position: "relative"
+    },
+    range: {
+      bg: "colorPalette.1200",
+      height: "full",
+      outlineStyle: "solid",
+      outlineWidth: "1px",
+      outlineColor: "white",
+      rounded: "full",
+      transition: "width 0.2s ease-in-out",
+      "--translate-x": "-100%",
+      _indeterminate: {
+        "--animate-from-x": "-40%",
+        "--animate-to-x": "100%",
+        position: "absolute",
+        willChange: "left",
+        minWidth: "50%",
+        animation: "position 1s ease infinite normal none running",
+        backgroundImage: `linear-gradient(to right, transparent 0%, var(--track-color) 50%, transparent 100%)`
+      }
+    },
+    circle: {
+      _indeterminate: {
+        animation: "spin 2s linear infinite"
+      }
+    },
+    circleTrack: {
+      stroke: "colorPalette.500"
+    },
+    circleRange: {
+      stroke: "colorPalette.1200",
+      strokeLinecap: "round",
+      transitionProperty: "stroke-dashoffset, stroke-dasharray",
+      transitionDuration: "0.6s",
+      _indeterminate: {
+        animation: "circular-progress 1.5s linear infinite"
+      }
+    },
+    label: {
+      textStyle: "std-16N-170"
+    }
+  },
+  variants: {
+    layout: {
+      vertical: {
+        root: {
+          flexDirection: "column",
+          gap: 4,
+          "--size": "48px",
+          "--thickness": "4px"
+        },
+        track: {
+          width: "240px"
+        }
+      },
+      horizontal: {
+        root: {
+          flexDirection: "row",
+          gap: 2,
+          "--size": "24px",
+          "--thickness": "2px"
+        },
+        track: {
+          width: "80px"
+        }
+      }
+    }
+  },
+  defaultVariants: {
+    layout: "vertical"
+  }
+});
+
+// src/recipes/radio-group.ts
+var import_dev29 = require("@pandacss/dev");
+var import_radio_group = require("@zag-js/radio-group");
+var radio_group_default = (0, import_dev29.defineSlotRecipe)({
+  className: "radio-group",
+  slots: import_radio_group.anatomy.keys(),
   base: {
+    root: {
+      display: "flex",
+      colorPalette: "keyColor",
+      _vertical: {
+        flexDirection: "column",
+        gap: 0
+      },
+      _horizonal: {
+        flexDirection: "row",
+        gap: 4
+      }
+    },
+    label: {
+      ...legend_default.base
+    },
     item: {
       /**
        * flex w-fit items-start py-2
@@ -2061,15 +2332,19 @@ var radio_default = (0, import_dev24.defineSlotRecipe)({
         _hover: "black",
         _highContrast: { base: "ButtonText" },
         _checked: {
-          base: "keyColor.900",
-          _hover: "keyColor.1100",
-          _disabled: "solid-gray.300",
+          base: "colorPalette.primary",
+          _hover: "colorPalette.primary.200",
+          _disabled: { base: "solid-gray.300", _highContrast: "GrayText" },
           _highContrast: "Highlight"
         },
         /**
          * data-[error]:border-error-1 data-[error]:hover:border-red-1000
          */
-        _invalid: { base: "error.1", _hover: "red.1000" },
+        _invalid: {
+          base: "error.1",
+          _hover: "red.1000",
+          _disabled: "solid-gray.300"
+        },
         /**
          * aria-disabled:!border-solid-gray-300
          * forced-colors:aria-disabled:!border-[GrayText]
@@ -2080,10 +2355,17 @@ var radio_default = (0, import_dev24.defineSlotRecipe)({
        * outline on hover
        * has-[input:hover:not(:focus):not([aria-disabled="true"])]:bg-solid-gray-420
        */
-      '&:is(:hover, [data-hover]):not(:focus):not([aria-disabled="true"])': {
+      '&:is(:hover, [data-hover]):not([aria-disabled="true"])': {
         outlineStyle: "solid",
         outlineWidth: "calc(var(--radio-size) / 12)",
-        outlineColor: "solid-gray.420"
+        outlineColor: "solid-gray.420",
+        _focus: {
+          outlineStyle: "solid",
+          outlineWidth: "4px",
+          outlineColor: "black",
+          outlineOffset: "calc(2 / 16 * 1rem)",
+          focusRing: "calc(2 / 16 * 1rem)"
+        }
       },
       /**
        * focus:outline focus:outline-4 focus:outline-black
@@ -2123,18 +2405,33 @@ var radio_default = (0, import_dev24.defineSlotRecipe)({
          */
         _before: {
           display: "block",
-          bg: "keyColor.900",
-          _hover: "keyColor.1100",
-          _invalid: {
-            base: "error.1",
-            _hover: "red.1000"
-          },
-          _highContrast: "Highlight"
+          bg: {
+            base: "colorPalette.primary",
+            _hover: "colorPalette.primary.200",
+            _highContrast: "Highlight"
+          }
+        },
+        _invalid: {
+          _before: {
+            bg: {
+              base: "error.1",
+              _hover: "red.1000"
+            }
+          }
         },
         _disabled: {
           _before: {
-            base: "solid-gray.300",
-            _highContrast: "GrayText"
+            bg: {
+              base: "solid-gray.300",
+              _highContrast: "GrayText"
+            }
+          },
+          _invalid: {
+            _before: {
+              bg: {
+                base: "solid-gray.300"
+              }
+            }
           }
         }
       }
@@ -2149,6 +2446,9 @@ var radio_default = (0, import_dev24.defineSlotRecipe)({
   variants: {
     size: {
       sm: {
+        label: {
+          ...legend_default.variants?.size?.sm
+        },
         item: {
           /**
            * data-[size=sm]:gap-1
@@ -2175,6 +2475,9 @@ var radio_default = (0, import_dev24.defineSlotRecipe)({
         }
       },
       md: {
+        label: {
+          ...legend_default.variants?.size?.md
+        },
         item: {
           /**
            * data-[size=md]:gap-2
@@ -2201,6 +2504,9 @@ var radio_default = (0, import_dev24.defineSlotRecipe)({
         }
       },
       lg: {
+        label: {
+          ...legend_default.variants?.size?.lg
+        },
         item: {
           /**
            * data-[size=lg]:gap-3
@@ -2233,123 +2539,31 @@ var radio_default = (0, import_dev24.defineSlotRecipe)({
   }
 });
 
-// src/recipes/radio-group.ts
-var import_dev25 = require("@pandacss/dev");
-var import_radio_group = require("@zag-js/radio-group");
-var radio_group_default = (0, import_dev25.defineSlotRecipe)({
-  className: "radio-group",
-  slots: import_radio_group.anatomy.keys(),
-  base: {
-    root: {
-      display: "flex",
-      _vertical: {
-        flexDirection: "column",
-        gap: 0
-      },
-      _horizonal: {
-        flexDirection: "row",
-        gap: 4
-      }
-    },
-    item: {
-      ...radio_default.base?.item
-    },
-    itemControl: {
-      ...radio_default.base?.itemControl
-    },
-    itemText: {
-      ...radio_default.base?.itemText
-    }
-  },
-  variants: {
-    size: {
-      sm: {
-        item: {
-          ...radio_default.variants?.size?.sm?.item
-        },
-        itemControl: {
-          ...radio_default.variants?.size?.sm?.itemControl
-        },
-        itemText: {
-          ...radio_default.variants?.size?.sm?.itemText
-        }
-      },
-      md: {
-        item: {
-          ...radio_default.variants?.size?.md?.item
-        },
-        itemControl: {
-          ...radio_default.variants?.size?.md?.itemControl
-        },
-        itemText: {
-          ...radio_default.variants?.size?.md?.itemText
-        }
-      },
-      lg: {
-        item: {
-          ...radio_default.variants?.size?.lg?.item
-        },
-        itemControl: {
-          ...radio_default.variants?.size?.lg?.itemControl
-        },
-        itemText: {
-          ...radio_default.variants?.size?.lg?.itemText
-        }
-      }
-    }
-  },
-  defaultVariants: {
-    size: "sm"
-  }
-});
-
-// src/recipes/requirement-badge.ts
-var import_dev26 = require("@pandacss/dev");
-var requirement_badge_default = (0, import_dev26.defineRecipe)({
-  className: "requirement-badge",
-  base: {
-    /**
-     * text-oln-16N-100 text-red-800
-     */
-    textStyle: "oln-16N-100",
-    color: "red.800"
-  },
-  variants: {
-    isOptional: {
-      true: {
-        /**
-         * data-[is-optional]:text-solid-gray-800
-         */
-        color: "solid-gray.800"
-      }
-    }
-  },
-  defaultVariants: {
-    isOptional: false
-  }
-});
-
 // src/recipes/resource-list.ts
-var import_dev27 = require("@pandacss/dev");
-var resource_list_default = (0, import_dev27.defineSlotRecipe)({
+var import_dev30 = require("@pandacss/dev");
+var resource_list_default = (0, import_dev30.defineSlotRecipe)({
   className: "resource-list",
   slots: resourceListAnatomy.keys(),
   base: {
     root: {
       display: "flex",
       borderColor: "solid-gray.420",
+      overflow: "hidden",
+      colorPalette: "keyColor",
       bg: {
-        "&:has(input:checked)": "keyColor.50",
-        _selected: "keyColor.50"
+        "&:has(input:checked)": "colorPalette.bg",
+        _selected: "colorPalette.bg"
       }
     },
-    contentsContainer: {
+    main: {
       display: "flex",
       flexGrow: 1,
       flexDirection: "row",
       alignItems: "center",
       justifyContent: "start",
       gap: { base: 4, md: 6 },
+      color: "solid-gray.800",
+      textStyle: "dns-16N-130",
       /**
        * p-4 md:px-6 md:py-4
        */
@@ -2364,15 +2578,12 @@ var resource_list_default = (0, import_dev27.defineSlotRecipe)({
         focusRing: "calc(2 / 16 * 1rem)"
       }
     },
-    functionButton: {
+    action: {
       p: 4,
       display: "flex",
       alignItems: "center",
       justifyContent: "center"
     },
-    frontIcon: {
-      // px: 2,
-    },
     content: {
       height: "full",
       flexGrow: 1,
@@ -2385,19 +2596,6 @@ var resource_list_default = (0, import_dev27.defineSlotRecipe)({
        */
       textStyle: "std-20B-150",
       width: "fit-content"
-    },
-    label: {
-      zIndex: 1,
-      width: "fit-content",
-      textStyle: "oln-17N-100",
-      color: "solid-gray.800"
-    },
-    supportText: {
-      color: "solid-gray.800"
-    },
-    subLabel: {
-      zIndex: 1,
-      color: "solid-gray.800"
     }
   },
   variants: {
@@ -2411,24 +2609,12 @@ var resource_list_default = (0, import_dev27.defineSlotRecipe)({
         root: {
           rounded: 16,
           borderWidth: "1px"
-        },
-        contentsContainer: {
-          borderTopLeftRadius: 16,
-          borderBottomLeftRadius: 16,
-          _only: {
-            borderTopRightRadius: 16,
-            borderBottomRightRadius: 16
-          }
-        },
-        functionButton: {
-          borderTopRightRadius: 16,
-          borderBottomRightRadius: 16
         }
       }
     },
     asLink: {
       true: {
-        contentsContainer: {
+        main: {
           position: "relative"
         },
         title: {
@@ -2442,19 +2628,20 @@ var resource_list_default = (0, import_dev27.defineSlotRecipe)({
             zIndex: 0,
             cursor: "inherit"
           }
-        },
-        supportText: {
-          textDecoration: { base: "none", _groupHover: "underline" }
         }
       }
     }
+  },
+  defaultVariants: {
+    variant: "list",
+    asLink: false
   }
 });
 
 // src/recipes/select.ts
-var import_dev28 = require("@pandacss/dev");
+var import_dev31 = require("@pandacss/dev");
 var import_select = require("@zag-js/select");
-var select_default = (0, import_dev28.defineSlotRecipe)({
+var select_default = (0, import_dev31.defineSlotRecipe)({
   className: "select",
   description: "\u30BB\u30EC\u30AF\u30C8\u30DC\u30C3\u30AF\u30B9\u306F\u3001\u8907\u6570\u306E\u9078\u629E\u80A2\u3092\u63D0\u4F9B\u3059\u308B\u30D5\u30A9\u30FC\u30E0\u30B3\u30F3\u30C8\u30ED\u30FC\u30EB\u3067\u3059\u3002",
   slots: import_select.anatomy.keys(),
@@ -2546,24 +2733,16 @@ var select_default = (0, import_dev28.defineSlotRecipe)({
         },
         label: { ...label_default.variants?.size?.sm }
       }
-    },
-    invalid: {
-      true: {
-        trigger: {
-          ...select_box_default.variants?.invalid?.true
-        }
-      }
     }
   },
   defaultVariants: {
-    size: "lg",
-    invalid: false
+    size: "lg"
   }
 });
 
 // src/recipes/table.ts
-var import_dev29 = require("@pandacss/dev");
-var table_default = (0, import_dev29.defineSlotRecipe)({
+var import_dev32 = require("@pandacss/dev");
+var table_default = (0, import_dev32.defineSlotRecipe)({
   className: "table",
   slots: tableAnatomy.keys(),
   base: {
@@ -2571,7 +2750,8 @@ var table_default = (0, import_dev29.defineSlotRecipe)({
       /**
        * w-full text-std-16N-170
        */
-      maxWidth: "full"
+      maxWidth: "full",
+      colorPalette: "keyColor"
     },
     head: {
       "& tr": {
@@ -2593,7 +2773,7 @@ var table_default = (0, import_dev29.defineSlotRecipe)({
          */
         /*
         "&:has(input:checked)": {
-          bg: "keyColor.100",
+          bg: "colorPalette.100",
         },
         */
       }
@@ -2604,7 +2784,7 @@ var table_default = (0, import_dev29.defineSlotRecipe)({
        * border-b
        */
       borderBottomWidth: "1px",
-      "tbody > &:has(input:checked)": { bg: "keyColor.100" }
+      "tbody > &:has(input:checked)": { bg: "colorPalette.100" }
     },
     header: {
       /**
@@ -2668,7 +2848,9 @@ var table_default = (0, import_dev29.defineSlotRecipe)({
         body: {
           "& tr": {
             _even: {
-              "&:not(:has(input:checked))": { bg: "{colors.keyColor.50}/25" }
+              "&:not(:has(input:checked))": {
+                bg: "{colors.colorPalette.bg}/25"
+              }
             }
           }
         }
@@ -2679,11 +2861,11 @@ var table_default = (0, import_dev29.defineSlotRecipe)({
         body: {
           "& tr": {
             _hover: {
-              bg: "keyColor.50"
+              bg: "colorPalette.bg"
             },
             _even: {
               "&:not(:has(input:checked))": {
-                _hover: { bg: "{colors.keyColor.50}" }
+                _hover: { bg: "{colors.colorPalette.bg}" }
               }
             }
           }
@@ -2699,15 +2881,14 @@ var table_default = (0, import_dev29.defineSlotRecipe)({
 });
 
 // src/recipes/tabs.ts
-var import_dev30 = require("@pandacss/dev");
+var import_dev33 = require("@pandacss/dev");
 var import_tabs = require("@zag-js/tabs");
-var tabs_default = (0, import_dev30.defineSlotRecipe)({
+var tabs_default = (0, import_dev33.defineSlotRecipe)({
   className: "tabs",
   slots: import_tabs.anatomy.keys(),
   base: {
     root: {
-      p: 1.5,
-      mx: -1.5
+      colorPalette: "keyColor"
     },
     list: {
       /**
@@ -2741,6 +2922,7 @@ var tabs_default = (0, import_dev30.defineSlotRecipe)({
        */
       px: { base: 4, md: 8 },
       py: 6,
+      cursor: "pointer",
       bg: {
         base: "transparent",
         _hover: "solid-gray.50",
@@ -2773,7 +2955,7 @@ var tabs_default = (0, import_dev30.defineSlotRecipe)({
          * after:border-current
          * aria-[current=page]:cursor-default
          */
-        color: "keyColor.900",
+        color: "colorPalette.primary",
         cursor: "default",
         _after: {
           content: '""',
@@ -2790,9 +2972,9 @@ var tabs_default = (0, import_dev30.defineSlotRecipe)({
 });
 
 // src/recipes/tree-view.ts
-var import_dev31 = require("@pandacss/dev");
+var import_dev34 = require("@pandacss/dev");
 var import_tree_view = require("@zag-js/tree-view");
-var tree_view_default = (0, import_dev31.defineSlotRecipe)({
+var tree_view_default = (0, import_dev34.defineSlotRecipe)({
   className: "tree-view",
   slots: import_tree_view.anatomy.keys(),
   base: {
@@ -2810,8 +2992,21 @@ var tree_view_default = (0, import_dev31.defineSlotRecipe)({
       ...menu_item_default.base
     },
     itemIndicator: {
-      transition: "transform",
-      transform: { base: "rotate(0deg)", _open: "rotate(90deg)" }
+      _empty: {
+        _before: {
+          content: '""',
+          display: "block",
+          width: "24px",
+          height: "24px",
+          bg: "black",
+          clipPath: "path('M12 19L5 12L12 5L19 12L12 19Z')"
+        },
+        _selected: {
+          _before: {
+            clipPath: "path('M12 19L5 12L12 5L19 12L12 19ZM12 16.15L16.15 12L12 7.85L7.85 12L12 16.15Z')"
+          }
+        }
+      }
     },
     itemText: {
       flexGrow: 1
@@ -2824,10 +3019,26 @@ var tree_view_default = (0, import_dev31.defineSlotRecipe)({
       pl: 8
     },
     branchIndicator: {
-      position: "absolute",
-      right: 4,
-      transition: "transform",
-      transform: { base: "rotate(0deg)", _open: "rotate(90deg)" }
+      _empty: {
+        _before: {
+          content: '""',
+          display: "block",
+          width: "24px",
+          height: "24px",
+          bg: "black",
+          clipPath: "path('M12 19L5 12L12 5L19 12L12 19Z')"
+        },
+        _selected: {
+          _before: {
+            clipPath: "path('M12 19L5 12L12 5L19 12L12 19ZM12 16.15L16.15 12L12 7.85L7.85 12L12 16.15Z')"
+          }
+        },
+        _open: {
+          _before: {
+            clipPath: "path('M12 19L5 12L12 5L19 12L12 19ZM12 16.15L16.15 12L12 7.85L7.85 12L12 16.15Z')"
+          }
+        }
+      }
     },
     branchText: {
       flexGrow: 1
@@ -2879,8 +3090,8 @@ var tree_view_default = (0, import_dev31.defineSlotRecipe)({
 });
 
 // src/recipes/unordered-list.ts
-var import_dev32 = require("@pandacss/dev");
-var unordered_list_default = (0, import_dev32.defineRecipe)({
+var import_dev35 = require("@pandacss/dev");
+var unordered_list_default = (0, import_dev35.defineRecipe)({
   className: "unordered-list",
   base: {
     /**
@@ -2899,11 +3110,12 @@ var unordered_list_default = (0, import_dev32.defineRecipe)({
 });
 
 // src/recipes/utility-link.ts
-var import_dev33 = require("@pandacss/dev");
-var utility_link_default = (0, import_dev33.defineRecipe)({
+var import_dev36 = require("@pandacss/dev");
+var utility_link_default = (0, import_dev36.defineRecipe)({
   className: "utility-link",
   description: "\u30E6\u30FC\u30C6\u30A3\u30EA\u30C6\u30A3\u30EA\u30F3\u30AF\u306F\u3075\u3064\u3046\u306E\u6A2A\u4E26\u3073\u30EA\u30F3\u30AF\u30EA\u30B9\u30C8\u306B\u8FD1\u3044\u304C\u3001\u305D\u308C\u3088\u308A\u3082\u30B3\u30F3\u30D1\u30AF\u30C8\u306B\u4F5C\u3089\u308C\u3066\u3044\u307E\u3059\u3002",
   base: {
+    colorPalette: "keyColor",
     /**
      * !text-solid-gray-800 text-dns-16N-130
      * focus-visible:bg-yellow-300 focus-visible:text-blue-1000
@@ -2911,7 +3123,7 @@ var utility_link_default = (0, import_dev33.defineRecipe)({
     textStyle: "dns-16N-130",
     color: {
       base: "solid-gray.800",
-      _focusVisible: "keyColor.1000"
+      _focusVisible: "colorPalette.primary.100"
     },
     bg: { base: "transparent", _focusVisible: "yellow.300" },
     /**
@@ -2956,14 +3168,17 @@ var recipes = {
   accordion: accordion_default,
   breadcrumb: breadcrumb_default,
   button: button_default,
+  card: card_default,
   checkbox: checkbox_default,
+  chipLabel: chip_label_default,
   drawer: drawer_default,
   disclosure: disclosure_default,
   digitalGoDivider: divider_default,
   errorText: error_text_default,
+  field: field_default,
+  fieldset: fieldset_default,
   hamburgerMenuButton: hamburger_menu_button_default,
   input: input_default,
-  inputText: input_text_default,
   label: label_default,
   legend: legend_default,
   link: link_default,
@@ -2973,12 +3188,11 @@ var recipes = {
   menuList: menu_list_default,
   notificationBanner: notification_banner_default,
   orderedList: ordered_list_default,
-  radio: radio_default,
+  progress: progress_default,
   radioGroup: radio_group_default,
   requirementBadge: requirement_badge_default,
   resourceList: resource_list_default,
   select: select_default,
-  selectBox: select_box_default,
   supportText: support_text_default,
   table: table_default,
   tabs: tabs_default,
@@ -2989,16 +3203,45 @@ var recipes = {
 };
 var recipes_default = recipes;
 
+// src/keyframes.ts
+var keyframes = {
+  "circular-progress": {
+    "0%": {
+      strokeDasharray: "1, 400",
+      strokeDashoffset: "0"
+    },
+    "50%": {
+      strokeDasharray: "400, 400",
+      strokeDashoffset: "-100%"
+    },
+    "100%": {
+      strokeDasharray: "400, 400",
+      strokeDashoffset: "-260%"
+    }
+  },
+  position: {
+    from: {
+      insetInlineStart: "var(--animate-from-x)",
+      insetBlockStart: "var(--animate-from-y)"
+    },
+    to: {
+      insetInlineStart: "var(--animate-to-x)",
+      insetBlockStart: "var(--animate-to-y)"
+    }
+  }
+};
+
 // src/index.ts
 var base = {
   name: "digital-go-pandacss-preset",
   presets: [import_digital_go_pandacss_plugin.default],
   theme: {
+    keyframes,
     recipes: recipes_default
   }
 };
-var index_default = (0, import_dev34.definePreset)(base);
-var createPreset = (keyColor) => (0, import_dev34.definePreset)({
+var index_default = (0, import_dev37.definePreset)(base);
+var createPreset = (keyColor) => (0, import_dev37.definePreset)({
   ...base,
   theme: {
     ...base.theme,