@hartl-services/medusa-base 2.7.0 → 2.8.0

package/.medusa/server/src/admin/admin-components/features/plugin-features/components/PluginSettingsForm.js

@@ -6,7 +6,9 @@ import { InfoTooltip } from "../../../shared/ui/InfoTooltip";
 import { SwitchRow } from "../../../shared/ui/SwitchRow";
 import { invalidatedByLabels, invalidatesLabels, isGroupDimmed, settingInfoText, showsBoundsLine, showsSourceHint, } from "../lib/plugin-view";
 import { isHexColor, normalizeColorInput } from "../lib/settings-draft";
-import { buildSettingGroups } from "../lib/settings-layout";
+import { dateFromInputValue, inputValueFromDate } from "../../../shared/lib/date-input";
+import { AdminDatePicker } from "../../../shared/ui/AdminDatePicker";
+import { buildSettingGroups, isGroupVisible, } from "../lib/settings-layout";
 import { usePluginSettingsForm } from "../hooks/usePluginSettingsForm";
 import { ImageSettingInput } from "./ImageSettingInput";
 const fieldId = (pluginKey, key) => `plugin-setting-${pluginKey}-${key}`;
@@ -36,6 +38,7 @@ const ColorSettingInput = ({ id, hintId, label, value, invalid, required, disabl
 /** A non-boolean setting: label (with source hint), control and hints. */
 const SettingField = ({ pluginKey, setting, invalidatedBy, invalidates, value, invalid, disabled, onChange, }) => {
     const id = fieldId(pluginKey, setting.key);
+    const labelId = `${id}-label`;
     const hintId = `${id}-hint`;
     const clearPending = setting.type === "secret" && value === null;
     const bounds = setting.type === "number" ? boundsText(setting) : undefined;
@@ -51,22 +54,23 @@ const SettingField = ({ pluginKey, setting, invalidatedBy, invalidates, value, i
         invalid;
     const describedBy = hasHints ? hintId : undefined;
     const placeholder = setting.placeholder ?? undefined;
-    return (_jsxs("div", { className: "flex flex-col gap-y-2", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsxs("div", { className: "flex items-center gap-x-1", children: [_jsx(Label, { htmlFor: id, size: "small", weight: "plus", children: labelText(setting) }), info && (_jsx(InfoTooltip, { label: texts.info.label(setting.label), children: info }))] }), showsSourceHint(setting.source) && (_jsx(Text, { size: "xsmall", className: "text-ui-fg-muted shrink-0", children: texts.settings.source[setting.source] }))] }), setting.type === "secret" ? (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Input, { id: id, "aria-describedby": describedBy, "aria-required": required || undefined, className: "flex-1", type: "password", autoComplete: "new-password", placeholder: setting.is_set ? texts.settings.secretPlaceholder : placeholder, value: typeof value === "string" ? value : "", disabled: disabled || clearPending, onChange: (event) => onChange(event.target.value) }), setting.source === "stored" && (_jsx(Button, { type: "button", size: "small", variant: "secondary", disabled: disabled, "aria-label": clearPending
+    return (_jsxs("div", { className: "flex flex-col gap-y-2", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsxs("div", { className: "flex items-center gap-x-1", children: [_jsx(Label, { id: labelId, htmlFor: id, size: "small", weight: "plus", children: labelText(setting) }), info && (_jsx(InfoTooltip, { label: texts.info.label(setting.label), children: info }))] }), showsSourceHint(setting.source) && (_jsx(Text, { size: "xsmall", className: "text-ui-fg-muted shrink-0", children: texts.settings.source[setting.source] }))] }), setting.type === "secret" ? (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Input, { id: id, "aria-describedby": describedBy, "aria-required": required || undefined, className: "flex-1", type: "password", autoComplete: "new-password", placeholder: setting.is_set ? texts.settings.secretPlaceholder : placeholder, value: typeof value === "string" ? value : "", disabled: disabled || clearPending, onChange: (event) => onChange(event.target.value) }), setting.source === "stored" && (_jsx(Button, { type: "button", size: "small", variant: "secondary", disabled: disabled, "aria-label": clearPending
                             ? texts.settings.secretClearUndoLabel(setting.label)
                             : texts.settings.secretClearLabel(setting.label), onClick: () => onChange(clearPending ? "" : null), children: clearPending
                             ? texts.settings.secretClearUndo
-                            : texts.settings.secretClear }))] })) : setting.type === "select" ? (_jsxs(Select, { value: typeof value === "string" ? value : "", disabled: disabled, onValueChange: (next) => onChange(next), children: [_jsx(Select.Trigger, { id: id, "aria-describedby": describedBy, "aria-required": required || undefined, children: _jsx(Select.Value, { placeholder: texts.settings.selectPlaceholder }) }), _jsx(Select.Content, { children: setting.options.map((option) => (_jsx(Select.Item, { value: option.value, children: option.label }, option.value))) })] })) : setting.type === "image" ? (_jsx(ImageSettingInput, { id: id, describedBy: describedBy, label: setting.label, value: typeof value === "string" ? value : "", disabled: disabled, onChange: (url) => onChange(url) })) : setting.type === "color" ? (_jsx(ColorSettingInput, { id: id, hintId: describedBy, label: setting.label, value: typeof value === "string" ? value : "", invalid: invalid, required: required, disabled: disabled, onChange: (next) => onChange(next) })) : setting.type === "number" ? (_jsx(Input, { id: id, "aria-describedby": describedBy, "aria-invalid": invalid, "aria-required": required || undefined, type: "number", step: setting.integer ? 1 : "any", min: setting.min ?? undefined, max: setting.max ?? undefined, placeholder: placeholder, value: typeof value === "string" ? value : "", disabled: disabled, onChange: (event) => onChange(event.target.value, event.target.validity.badInput) })) : (_jsx(Input, { id: id, "aria-describedby": describedBy, "aria-invalid": invalid, "aria-required": required || undefined, type: setting.type === "url" ? "url" : "text", placeholder: placeholder, value: typeof value === "string" ? value : "", disabled: disabled, onChange: (event) => onChange(event.target.value) })), hasHints && (_jsxs("div", { id: hintId, className: "flex flex-col gap-y-1", children: [hint && (_jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: hint })), clearPending && (_jsx(Hint, { variant: "info", children: texts.settings.secretClearPending })), invalidatedBy.length > 0 && (_jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: texts.settings.invalidatedBy(invalidatedBy) })), invalidates.length > 0 && (_jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: texts.settings.invalidates(invalidates.join(", ")) })), showBounds && !invalid && (_jsx(Text, { size: "small", className: "text-ui-fg-muted", children: bounds })), invalid && (_jsx(Hint, { variant: "error", children: setting.type === "color"
+                            : texts.settings.secretClear }))] })) : setting.type === "select" ? (_jsxs(Select, { value: typeof value === "string" ? value : "", disabled: disabled, onValueChange: (next) => onChange(next), children: [_jsx(Select.Trigger, { id: id, "aria-describedby": describedBy, "aria-required": required || undefined, children: _jsx(Select.Value, { placeholder: texts.settings.selectPlaceholder }) }), _jsx(Select.Content, { children: setting.options.map((option) => (_jsx(Select.Item, { value: option.value, children: option.label }, option.value))) })] })) : setting.type === "image" ? (_jsx(ImageSettingInput, { id: id, describedBy: describedBy, label: setting.label, value: typeof value === "string" ? value : "", disabled: disabled, onChange: (url) => onChange(url) })) : setting.type === "color" ? (_jsx(ColorSettingInput, { id: id, hintId: describedBy, label: setting.label, value: typeof value === "string" ? value : "", invalid: invalid, required: required, disabled: disabled, onChange: (next) => onChange(next) })) : setting.type === "date" ? (_jsx(AdminDatePicker, { id: id, "aria-labelledby": labelId, "aria-describedby": describedBy, isDisabled: disabled, value: dateFromInputValue(typeof value === "string" ? value : ""), onChange: (date) => onChange(inputValueFromDate(date)) })) : setting.type === "number" ? (_jsx(Input, { id: id, "aria-describedby": describedBy, "aria-invalid": invalid, "aria-required": required || undefined, type: "number", step: setting.integer ? 1 : "any", min: setting.min ?? undefined, max: setting.max ?? undefined, placeholder: placeholder, value: typeof value === "string" ? value : "", disabled: disabled, onChange: (event) => onChange(event.target.value, event.target.validity.badInput) })) : (_jsx(Input, { id: id, "aria-describedby": describedBy, "aria-invalid": invalid, "aria-required": required || undefined, type: setting.type === "url" ? "url" : "text", placeholder: placeholder, value: typeof value === "string" ? value : "", disabled: disabled, onChange: (event) => onChange(event.target.value) })), hasHints && (_jsxs("div", { id: hintId, className: "flex flex-col gap-y-1", children: [hint && (_jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: hint })), clearPending && (_jsx(Hint, { variant: "info", children: texts.settings.secretClearPending })), invalidatedBy.length > 0 && (_jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: texts.settings.invalidatedBy(invalidatedBy) })), invalidates.length > 0 && (_jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: texts.settings.invalidates(invalidates.join(", ")) })), showBounds && !invalid && (_jsx(Text, { size: "small", className: "text-ui-fg-muted", children: bounds })), invalid && (_jsx(Hint, { variant: "error", children: setting.type === "color"
                             ? texts.settings.invalidColor
                             : (bounds ?? texts.settings.invalidNumber) }))] }))] }));
 };
 export const PluginSettingsForm = ({ plugin }) => {
     const form = usePluginSettingsForm(plugin);
     const pending = form.mutation.isPending;
-    const groups = buildSettingGroups(plugin.settings, plugin.setting_groups, texts.sections.settings);
+    const groups = buildSettingGroups(plugin.settings, plugin.setting_groups, texts.sections.settings).filter((group) => isGroupVisible(group, form.draft));
     const hasTextFields = plugin.settings.some((setting) => setting.type === "string" ||
         setting.type === "url" ||
         setting.type === "number" ||
-        setting.type === "color");
+        setting.type === "color" ||
+        setting.type === "date");
     const renderField = (setting) => (_jsx(SettingField, { pluginKey: plugin.plugin_key, setting: setting, invalidatedBy: setting.type === "secret"
             ? invalidatedByLabels(plugin.settings, setting.key)
             : [], invalidates: invalidatesLabels(plugin.settings, setting), value: form.draft[setting.key], invalid: form.invalid.includes(setting.key), disabled: pending, onChange: (value, badInput) => form.setValue(setting.key, value, badInput) }, setting.key));

package/.medusa/server/src/admin/admin-components/features/plugin-features/hooks/usePluginFeatureEnabled.d.ts

@@ -90,7 +90,7 @@ export declare const pluginFeatureEnabledQueryOptions: (pluginKey: string, featu
                 width: "full" | "half";
                 section: string | null;
             } | {
-                type: "string" | "boolean" | "color" | "image" | "url";
+                type: "string" | "boolean" | "color" | "image" | "url" | "date";
                 default: string | number | boolean | null;
                 value: string | number | boolean | null;
                 key: string;
@@ -130,6 +130,10 @@ export declare const pluginFeatureEnabledQueryOptions: (pluginKey: string, featu
                 description: string | null;
                 note: string | null;
                 requires_feature: string | null;
+                visible_when: {
+                    setting: string;
+                    equals: string | boolean;
+                } | null;
             }[];
         }[];
     }>;

package/.medusa/server/src/admin/admin-components/features/plugin-features/hooks/usePluginFeatures.d.ts

@@ -70,7 +70,7 @@ export declare function usePluginFeatures(): import("@tanstack/react-query").Use
             width: "full" | "half";
             section: string | null;
         } | {
-            type: "string" | "boolean" | "color" | "image" | "url";
+            type: "string" | "boolean" | "color" | "image" | "url" | "date";
             default: string | number | boolean | null;
             value: string | number | boolean | null;
             key: string;
@@ -110,6 +110,10 @@ export declare function usePluginFeatures(): import("@tanstack/react-query").Use
             description: string | null;
             note: string | null;
             requires_feature: string | null;
+            visible_when: {
+                setting: string;
+                equals: string | boolean;
+            } | null;
         }[];
     }[];
 }, Error>;
@@ -192,7 +196,7 @@ export declare function usePluginFeature(pluginKey: string | undefined): import(
             width: "full" | "half";
             section: string | null;
         } | {
-            type: "string" | "boolean" | "color" | "image" | "url";
+            type: "string" | "boolean" | "color" | "image" | "url" | "date";
             default: string | number | boolean | null;
             value: string | number | boolean | null;
             key: string;
@@ -232,6 +236,10 @@ export declare function usePluginFeature(pluginKey: string | undefined): import(
             description: string | null;
             note: string | null;
             requires_feature: string | null;
+            visible_when: {
+                setting: string;
+                equals: string | boolean;
+            } | null;
         }[];
     };
 }, Error>;
@@ -308,7 +316,7 @@ export declare function useUpdatePluginFeatures(): import("@tanstack/react-query
             width: "full" | "half";
             section: string | null;
         } | {
-            type: "string" | "boolean" | "color" | "image" | "url";
+            type: "string" | "boolean" | "color" | "image" | "url" | "date";
             default: string | number | boolean | null;
             value: string | number | boolean | null;
             key: string;
@@ -348,6 +356,10 @@ export declare function useUpdatePluginFeatures(): import("@tanstack/react-query
             description: string | null;
             note: string | null;
             requires_feature: string | null;
+            visible_when: {
+                setting: string;
+                equals: string | boolean;
+            } | null;
         }[];
     };
 }, Error, {
@@ -428,7 +440,7 @@ export declare function useUpdatePluginSettings(pluginKey: string): import("@tan
             width: "full" | "half";
             section: string | null;
         } | {
-            type: "string" | "boolean" | "color" | "image" | "url";
+            type: "string" | "boolean" | "color" | "image" | "url" | "date";
             default: string | number | boolean | null;
             value: string | number | boolean | null;
             key: string;
@@ -468,6 +480,10 @@ export declare function useUpdatePluginSettings(pluginKey: string): import("@tan
             description: string | null;
             note: string | null;
             requires_feature: string | null;
+            visible_when: {
+                setting: string;
+                equals: string | boolean;
+            } | null;
         }[];
     };
 }, Error, {

package/.medusa/server/src/admin/admin-components/features/plugin-features/hooks/usePluginSettingsForm.d.ts

@@ -79,7 +79,7 @@ export declare function usePluginSettingsForm(plugin: AdminPluginFeatures): {
                 width: "full" | "half";
                 section: string | null;
             } | {
-                type: "string" | "boolean" | "color" | "image" | "url";
+                type: "string" | "boolean" | "color" | "image" | "url" | "date";
                 default: string | number | boolean | null;
                 value: string | number | boolean | null;
                 key: string;
@@ -119,6 +119,10 @@ export declare function usePluginSettingsForm(plugin: AdminPluginFeatures): {
                 description: string | null;
                 note: string | null;
                 requires_feature: string | null;
+                visible_when: {
+                    setting: string;
+                    equals: string | boolean;
+                } | null;
             }[];
         };
     }, Error, {

package/.medusa/server/src/admin/admin-components/features/plugin-features/lib/plugin-features-admin-client.d.ts

@@ -71,7 +71,7 @@ export declare const listPluginFeatures: () => Promise<{
             width: "full" | "half";
             section: string | null;
         } | {
-            type: "string" | "boolean" | "color" | "image" | "url";
+            type: "string" | "boolean" | "color" | "image" | "url" | "date";
             default: string | number | boolean | null;
             value: string | number | boolean | null;
             key: string;
@@ -111,6 +111,10 @@ export declare const listPluginFeatures: () => Promise<{
             description: string | null;
             note: string | null;
             requires_feature: string | null;
+            visible_when: {
+                setting: string;
+                equals: string | boolean;
+            } | null;
         }[];
     }[];
 }>;
@@ -186,7 +190,7 @@ export declare const retrievePluginFeatures: (pluginKey: string) => Promise<{
             width: "full" | "half";
             section: string | null;
         } | {
-            type: "string" | "boolean" | "color" | "image" | "url";
+            type: "string" | "boolean" | "color" | "image" | "url" | "date";
             default: string | number | boolean | null;
             value: string | number | boolean | null;
             key: string;
@@ -226,6 +230,10 @@ export declare const retrievePluginFeatures: (pluginKey: string) => Promise<{
             description: string | null;
             note: string | null;
             requires_feature: string | null;
+            visible_when: {
+                setting: string;
+                equals: string | boolean;
+            } | null;
         }[];
     };
 }>;
@@ -301,7 +309,7 @@ export declare const updatePluginFeatures: (payload: UpdatePluginFeaturesPayload
             width: "full" | "half";
             section: string | null;
         } | {
-            type: "string" | "boolean" | "color" | "image" | "url";
+            type: "string" | "boolean" | "color" | "image" | "url" | "date";
             default: string | number | boolean | null;
             value: string | number | boolean | null;
             key: string;
@@ -341,6 +349,10 @@ export declare const updatePluginFeatures: (payload: UpdatePluginFeaturesPayload
             description: string | null;
             note: string | null;
             requires_feature: string | null;
+            visible_when: {
+                setting: string;
+                equals: string | boolean;
+            } | null;
         }[];
     };
 }>;
@@ -416,7 +428,7 @@ export declare const updatePluginSettings: (pluginKey: string, payload: UpdatePl
             width: "full" | "half";
             section: string | null;
         } | {
-            type: "string" | "boolean" | "color" | "image" | "url";
+            type: "string" | "boolean" | "color" | "image" | "url" | "date";
             default: string | number | boolean | null;
             value: string | number | boolean | null;
             key: string;
@@ -456,6 +468,10 @@ export declare const updatePluginSettings: (pluginKey: string, payload: UpdatePl
             description: string | null;
             note: string | null;
             requires_feature: string | null;
+            visible_when: {
+                setting: string;
+                equals: string | boolean;
+            } | null;
         }[];
     };
 }>;

package/.medusa/server/src/admin/admin-components/features/plugin-features/lib/settings-layout.d.ts

@@ -30,6 +30,8 @@ export type SettingGroupView = {
     description: string | null;
     note: string | null;
     requiresFeature: string | null;
+    /** The group applies only while this setting's draft value equals `equals`. */
+    visibleWhen: AdminPluginSettingGroup["visible_when"];
     settings: AdminPluginSetting[];
     blocks: SettingBlock[];
 };
@@ -41,3 +43,5 @@ export declare const buildSettingBlocks: (settings: readonly AdminPluginSetting[
  * `groups` supplies the description, note and required feature per group.
  */
 export declare const buildSettingGroups: (settings: readonly AdminPluginSetting[], groups: readonly AdminPluginSettingGroup[], ungroupedTitle: string) => SettingGroupView[];
+/** Whether a group's `visible_when` holds for the current form values. */
+export declare const isGroupVisible: (group: Pick<SettingGroupView, "visibleWhen">, draft: Readonly<Record<string, string | boolean | null>>) => boolean;

package/.medusa/server/src/admin/admin-components/features/plugin-features/lib/settings-layout.js

@@ -59,8 +59,12 @@ export const buildSettingGroups = (settings, groups, ungroupedTitle) => {
             description: meta?.description ?? null,
             note: meta?.note ?? null,
             requiresFeature: meta?.requires_feature ?? null,
+            visibleWhen: meta?.visible_when ?? null,
             settings: groupSettings,
             blocks: buildSettingBlocks(groupSettings),
         };
     });
 };
+/** Whether a group's `visible_when` holds for the current form values. */
+export const isGroupVisible = (group, draft) => group.visibleWhen === null ||
+    draft[group.visibleWhen.setting] === group.visibleWhen.equals;

package/.medusa/server/src/admin/index.js

@@ -963,6 +963,35 @@ const changedSettingValues = (settings, draft, unparsable = []) => {
   }
   return values;
 };
+const DATE_PATTERN = /^(\d{4})-(\d{2})-(\d{2})$/;
+const DATE_TIME_PATTERN = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2})$/;
+const pad = (value, length = 2) => String(value).padStart(length, "0");
+const build = ([year, month, day, hour = 0, minute = 0]) => {
+  const date = new Date(year, month - 1, day, hour, minute);
+  const matches = date.getFullYear() === year && date.getMonth() === month - 1 && date.getDate() === day && date.getHours() === hour && date.getMinutes() === minute;
+  return matches ? date : null;
+};
+const dateFromInputValue = (value) => {
+  const match = value ? DATE_PATTERN.exec(value) : null;
+  return match ? build(match.slice(1).map(Number)) : null;
+};
+const inputValueFromDate = (date) => {
+  if (!date || Number.isNaN(date.getTime())) {
+    return "";
+  }
+  return `${pad(date.getFullYear(), 4)}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;
+};
+const dateTimeFromInputValue = (value) => {
+  const match = value ? DATE_TIME_PATTERN.exec(value) : null;
+  return match ? build(match.slice(1).map(Number)) : null;
+};
+const inputValueFromDateTime = (date) => {
+  if (!date || Number.isNaN(date.getTime())) {
+    return "";
+  }
+  return `${inputValueFromDate(date)}T${pad(date.getHours())}:${pad(date.getMinutes())}`;
+};
+const AdminDatePicker = (props) => /* @__PURE__ */ jsxRuntime.jsx(ui.I18nProvider, { locale: ADMIN_LOCALE, children: /* @__PURE__ */ jsxRuntime.jsx(ui.DatePicker, { ...props }) });
 const buildSettingBlocks = (settings) => {
   const blocks = [];
   let previousSection = null;
@@ -1014,11 +1043,13 @@ const buildSettingGroups = (settings, groups, ungroupedTitle) => {
       description: meta?.description ?? null,
       note: meta?.note ?? null,
       requiresFeature: meta?.requires_feature ?? null,
+      visibleWhen: meta?.visible_when ?? null,
       settings: groupSettings,
       blocks: buildSettingBlocks(groupSettings)
     };
   });
 };
+const isGroupVisible = (group, draft) => group.visibleWhen === null || draft[group.visibleWhen.setting] === group.visibleWhen.equals;
 function usePluginSettingsForm(plugin2) {
   const mutation = useUpdatePluginSettings(plugin2.plugin_key);
   const [draft, setDraft] = react.useState(
@@ -1319,6 +1350,7 @@ const SettingField = ({
   onChange
 }) => {
   const id = fieldId(pluginKey, setting.key);
+  const labelId = `${id}-label`;
   const hintId = `${id}-hint`;
   const clearPending = setting.type === "secret" && value === null;
   const bounds = setting.type === "number" ? boundsText(setting) : void 0;
@@ -1332,7 +1364,7 @@ const SettingField = ({
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-2", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-3", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-1", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: id, size: "small", weight: "plus", children: labelText(setting) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { id: labelId, htmlFor: id, size: "small", weight: "plus", children: labelText(setting) }),
         info && /* @__PURE__ */ jsxRuntime.jsx(InfoTooltip, { label: texts.info.label(setting.label), children: info })
       ] }),
       showsSourceHint(setting.source) && /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "xsmall", className: "text-ui-fg-muted shrink-0", children: texts.settings.source[setting.source] })
@@ -1406,6 +1438,16 @@ const SettingField = ({
         disabled,
         onChange: (next) => onChange(next)
       }
+    ) : setting.type === "date" ? /* @__PURE__ */ jsxRuntime.jsx(
+      AdminDatePicker,
+      {
+        id,
+        "aria-labelledby": labelId,
+        "aria-describedby": describedBy,
+        isDisabled: disabled,
+        value: dateFromInputValue(typeof value === "string" ? value : ""),
+        onChange: (date) => onChange(inputValueFromDate(date))
+      }
     ) : setting.type === "number" ? /* @__PURE__ */ jsxRuntime.jsx(
       ui.Input,
       {
@@ -1453,9 +1495,9 @@ const PluginSettingsForm = ({ plugin: plugin2 }) => {
     plugin2.settings,
     plugin2.setting_groups,
     texts.sections.settings
-  );
+  ).filter((group) => isGroupVisible(group, form.draft));
   const hasTextFields = plugin2.settings.some(
-    (setting) => setting.type === "string" || setting.type === "url" || setting.type === "number" || setting.type === "color"
+    (setting) => setting.type === "string" || setting.type === "url" || setting.type === "number" || setting.type === "color" || setting.type === "date"
   );
   const renderField = (setting) => /* @__PURE__ */ jsxRuntime.jsx(
     SettingField,
@@ -1641,29 +1683,6 @@ const PluginFeatureDisabledNotice = ({
     ]
   }
 );
-const DATE_TIME_PATTERN = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2})$/;
-const pad = (value, length = 2) => String(value).padStart(length, "0");
-const build = ([year, month, day, hour = 0, minute = 0]) => {
-  const date = new Date(year, month - 1, day, hour, minute);
-  const matches = date.getFullYear() === year && date.getMonth() === month - 1 && date.getDate() === day && date.getHours() === hour && date.getMinutes() === minute;
-  return matches ? date : null;
-};
-const inputValueFromDate = (date) => {
-  if (!date || Number.isNaN(date.getTime())) {
-    return "";
-  }
-  return `${pad(date.getFullYear(), 4)}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;
-};
-const dateTimeFromInputValue = (value) => {
-  const match = value ? DATE_TIME_PATTERN.exec(value) : null;
-  return match ? build(match.slice(1).map(Number)) : null;
-};
-const inputValueFromDateTime = (date) => {
-  if (!date || Number.isNaN(date.getTime())) {
-    return "";
-  }
-  return `${inputValueFromDate(date)}T${pad(date.getHours())}:${pad(date.getMinutes())}`;
-};
 const fetchPdfObjectUrl = async (path) => {
   const response = await sdk.client.fetch(path, {
     headers: { accept: "application/pdf" }
@@ -1751,7 +1770,6 @@ const useDebouncedValue = (value, delayMs) => {
   }, [value, delayMs]);
   return debounced;
 };
-const AdminDatePicker = (props) => /* @__PURE__ */ jsxRuntime.jsx(ui.I18nProvider, { locale: ADMIN_LOCALE, children: /* @__PURE__ */ jsxRuntime.jsx(ui.DatePicker, { ...props }) });
 const FocusModalShell = ({
   open,
   onOpenChange,
@@ -4619,17 +4637,17 @@ const handle$5 = {
   breadcrumb: () => "Protokoll"
 };
 const EmailLogRoute = () => /* @__PURE__ */ jsxRuntime.jsx(PluginFeatureRoute, { pluginKey: "email", children: /* @__PURE__ */ jsxRuntime.jsx(EmailLogPage, {}) });
-const handle$4 = {
-  breadcrumb: () => EMAIL_TEMPLATE_GROUPS.order.label
-};
-const EmailOrderMailsRoute = () => /* @__PURE__ */ jsxRuntime.jsx(PluginFeatureRoute, { pluginKey: "email", children: /* @__PURE__ */ jsxRuntime.jsx(EmailTemplateGroupPage, { group: "order" }) });
 const PluginDetailPage = () => {
   const { plugin_key: pluginKey = "" } = reactRouterDom.useParams();
   return /* @__PURE__ */ jsxRuntime.jsx(PluginPageShell, { pluginKey, variant: "header", children: /* @__PURE__ */ jsxRuntime.jsx(PluginFeatureSections, { pluginKey }) });
 };
-const handle$3 = {
+const handle$4 = {
   breadcrumb: (match) => /* @__PURE__ */ jsxRuntime.jsx(PluginLabelCrumb, { pluginKey: match.params.plugin_key ?? "" })
 };
+const handle$3 = {
+  breadcrumb: () => EMAIL_TEMPLATE_GROUPS.order.label
+};
+const EmailOrderMailsRoute = () => /* @__PURE__ */ jsxRuntime.jsx(PluginFeatureRoute, { pluginKey: "email", children: /* @__PURE__ */ jsxRuntime.jsx(EmailTemplateGroupPage, { group: "order" }) });
 const STATUS_BADGES = {
   current: { label: "aktuell", color: "green" },
   planned: { label: "geplant", color: "blue" },
@@ -6715,13 +6733,13 @@ const routeModule = {
       handle: handle$5
     },
     {
-      Component: EmailOrderMailsRoute,
-      path: "/settings/hartl-services/email/order",
+      Component: PluginDetailPage,
+      path: "/settings/hartl-services/plugin/:plugin_key",
       handle: handle$4
     },
     {
-      Component: PluginDetailPage,
-      path: "/settings/hartl-services/plugin/:plugin_key",
+      Component: EmailOrderMailsRoute,
+      path: "/settings/hartl-services/email/order",
       handle: handle$3
     },
     {

package/.medusa/server/src/admin/index.mjs

@@ -1,6 +1,6 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { defineWidgetConfig, defineRouteConfig } from "@medusajs/admin-sdk";
-import { Container, IconBadge, Heading, Text, Tooltip, IconButton, toast, StatusBadge, Button, clx, usePrompt, Label, Switch, Hint, Input, Select, Alert, I18nProvider, DatePicker, FocusModal, DropdownMenu, Badge, Table, Prompt } from "@medusajs/ui";
+import { Container, IconBadge, Heading, Text, Tooltip, IconButton, toast, StatusBadge, Button, clx, usePrompt, Label, Switch, I18nProvider, DatePicker, Hint, Input, Select, Alert, FocusModal, DropdownMenu, Badge, Table, Prompt } from "@medusajs/ui";
 import { useQuery, useQueryClient, useMutation, keepPreviousData, skipToken } from "@tanstack/react-query";
 import { emailAdminPaths } from "@hartl-services/medusa-food-supplements-contracts/paths/email";
 import Medusa from "@medusajs/js-sdk";
@@ -957,6 +957,35 @@ const changedSettingValues = (settings, draft, unparsable = []) => {
   }
   return values;
 };
+const DATE_PATTERN = /^(\d{4})-(\d{2})-(\d{2})$/;
+const DATE_TIME_PATTERN = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2})$/;
+const pad = (value, length = 2) => String(value).padStart(length, "0");
+const build = ([year, month, day, hour = 0, minute = 0]) => {
+  const date = new Date(year, month - 1, day, hour, minute);
+  const matches = date.getFullYear() === year && date.getMonth() === month - 1 && date.getDate() === day && date.getHours() === hour && date.getMinutes() === minute;
+  return matches ? date : null;
+};
+const dateFromInputValue = (value) => {
+  const match = value ? DATE_PATTERN.exec(value) : null;
+  return match ? build(match.slice(1).map(Number)) : null;
+};
+const inputValueFromDate = (date) => {
+  if (!date || Number.isNaN(date.getTime())) {
+    return "";
+  }
+  return `${pad(date.getFullYear(), 4)}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;
+};
+const dateTimeFromInputValue = (value) => {
+  const match = value ? DATE_TIME_PATTERN.exec(value) : null;
+  return match ? build(match.slice(1).map(Number)) : null;
+};
+const inputValueFromDateTime = (date) => {
+  if (!date || Number.isNaN(date.getTime())) {
+    return "";
+  }
+  return `${inputValueFromDate(date)}T${pad(date.getHours())}:${pad(date.getMinutes())}`;
+};
+const AdminDatePicker = (props) => /* @__PURE__ */ jsx(I18nProvider, { locale: ADMIN_LOCALE, children: /* @__PURE__ */ jsx(DatePicker, { ...props }) });
 const buildSettingBlocks = (settings) => {
   const blocks = [];
   let previousSection = null;
@@ -1008,11 +1037,13 @@ const buildSettingGroups = (settings, groups, ungroupedTitle) => {
       description: meta?.description ?? null,
       note: meta?.note ?? null,
       requiresFeature: meta?.requires_feature ?? null,
+      visibleWhen: meta?.visible_when ?? null,
       settings: groupSettings,
       blocks: buildSettingBlocks(groupSettings)
     };
   });
 };
+const isGroupVisible = (group, draft) => group.visibleWhen === null || draft[group.visibleWhen.setting] === group.visibleWhen.equals;
 function usePluginSettingsForm(plugin2) {
   const mutation = useUpdatePluginSettings(plugin2.plugin_key);
   const [draft, setDraft] = useState(
@@ -1313,6 +1344,7 @@ const SettingField = ({
   onChange
 }) => {
   const id = fieldId(pluginKey, setting.key);
+  const labelId = `${id}-label`;
   const hintId = `${id}-hint`;
   const clearPending = setting.type === "secret" && value === null;
   const bounds = setting.type === "number" ? boundsText(setting) : void 0;
@@ -1326,7 +1358,7 @@ const SettingField = ({
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-2", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1", children: [
-        /* @__PURE__ */ jsx(Label, { htmlFor: id, size: "small", weight: "plus", children: labelText(setting) }),
+        /* @__PURE__ */ jsx(Label, { id: labelId, htmlFor: id, size: "small", weight: "plus", children: labelText(setting) }),
         info && /* @__PURE__ */ jsx(InfoTooltip, { label: texts.info.label(setting.label), children: info })
       ] }),
       showsSourceHint(setting.source) && /* @__PURE__ */ jsx(Text, { size: "xsmall", className: "text-ui-fg-muted shrink-0", children: texts.settings.source[setting.source] })
@@ -1400,6 +1432,16 @@ const SettingField = ({
         disabled,
         onChange: (next) => onChange(next)
       }
+    ) : setting.type === "date" ? /* @__PURE__ */ jsx(
+      AdminDatePicker,
+      {
+        id,
+        "aria-labelledby": labelId,
+        "aria-describedby": describedBy,
+        isDisabled: disabled,
+        value: dateFromInputValue(typeof value === "string" ? value : ""),
+        onChange: (date) => onChange(inputValueFromDate(date))
+      }
     ) : setting.type === "number" ? /* @__PURE__ */ jsx(
       Input,
       {
@@ -1447,9 +1489,9 @@ const PluginSettingsForm = ({ plugin: plugin2 }) => {
     plugin2.settings,
     plugin2.setting_groups,
     texts.sections.settings
-  );
+  ).filter((group) => isGroupVisible(group, form.draft));
   const hasTextFields = plugin2.settings.some(
-    (setting) => setting.type === "string" || setting.type === "url" || setting.type === "number" || setting.type === "color"
+    (setting) => setting.type === "string" || setting.type === "url" || setting.type === "number" || setting.type === "color" || setting.type === "date"
   );
   const renderField = (setting) => /* @__PURE__ */ jsx(
     SettingField,
@@ -1635,29 +1677,6 @@ const PluginFeatureDisabledNotice = ({
     ]
   }
 );
-const DATE_TIME_PATTERN = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2})$/;
-const pad = (value, length = 2) => String(value).padStart(length, "0");
-const build = ([year, month, day, hour = 0, minute = 0]) => {
-  const date = new Date(year, month - 1, day, hour, minute);
-  const matches = date.getFullYear() === year && date.getMonth() === month - 1 && date.getDate() === day && date.getHours() === hour && date.getMinutes() === minute;
-  return matches ? date : null;
-};
-const inputValueFromDate = (date) => {
-  if (!date || Number.isNaN(date.getTime())) {
-    return "";
-  }
-  return `${pad(date.getFullYear(), 4)}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;
-};
-const dateTimeFromInputValue = (value) => {
-  const match = value ? DATE_TIME_PATTERN.exec(value) : null;
-  return match ? build(match.slice(1).map(Number)) : null;
-};
-const inputValueFromDateTime = (date) => {
-  if (!date || Number.isNaN(date.getTime())) {
-    return "";
-  }
-  return `${inputValueFromDate(date)}T${pad(date.getHours())}:${pad(date.getMinutes())}`;
-};
 const fetchPdfObjectUrl = async (path) => {
   const response = await sdk.client.fetch(path, {
     headers: { accept: "application/pdf" }
@@ -1745,7 +1764,6 @@ const useDebouncedValue = (value, delayMs) => {
   }, [value, delayMs]);
   return debounced;
 };
-const AdminDatePicker = (props) => /* @__PURE__ */ jsx(I18nProvider, { locale: ADMIN_LOCALE, children: /* @__PURE__ */ jsx(DatePicker, { ...props }) });
 const FocusModalShell = ({
   open,
   onOpenChange,
@@ -4613,17 +4631,17 @@ const handle$5 = {
   breadcrumb: () => "Protokoll"
 };
 const EmailLogRoute = () => /* @__PURE__ */ jsx(PluginFeatureRoute, { pluginKey: "email", children: /* @__PURE__ */ jsx(EmailLogPage, {}) });
-const handle$4 = {
-  breadcrumb: () => EMAIL_TEMPLATE_GROUPS.order.label
-};
-const EmailOrderMailsRoute = () => /* @__PURE__ */ jsx(PluginFeatureRoute, { pluginKey: "email", children: /* @__PURE__ */ jsx(EmailTemplateGroupPage, { group: "order" }) });
 const PluginDetailPage = () => {
   const { plugin_key: pluginKey = "" } = useParams();
   return /* @__PURE__ */ jsx(PluginPageShell, { pluginKey, variant: "header", children: /* @__PURE__ */ jsx(PluginFeatureSections, { pluginKey }) });
 };
-const handle$3 = {
+const handle$4 = {
   breadcrumb: (match) => /* @__PURE__ */ jsx(PluginLabelCrumb, { pluginKey: match.params.plugin_key ?? "" })
 };
+const handle$3 = {
+  breadcrumb: () => EMAIL_TEMPLATE_GROUPS.order.label
+};
+const EmailOrderMailsRoute = () => /* @__PURE__ */ jsx(PluginFeatureRoute, { pluginKey: "email", children: /* @__PURE__ */ jsx(EmailTemplateGroupPage, { group: "order" }) });
 const STATUS_BADGES = {
   current: { label: "aktuell", color: "green" },
   planned: { label: "geplant", color: "blue" },
@@ -6709,13 +6727,13 @@ const routeModule = {
       handle: handle$5
     },
     {
-      Component: EmailOrderMailsRoute,
-      path: "/settings/hartl-services/email/order",
+      Component: PluginDetailPage,
+      path: "/settings/hartl-services/plugin/:plugin_key",
       handle: handle$4
     },
     {
-      Component: PluginDetailPage,
-      path: "/settings/hartl-services/plugin/:plugin_key",
+      Component: EmailOrderMailsRoute,
+      path: "/settings/hartl-services/email/order",
       handle: handle$3
     },
     {