@orion-studios/payload-studio 0.6.0-beta.26 → 0.6.0-beta.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/admin/client.js +232 -125
  2. package/dist/admin/client.mjs +232 -125
  3. package/dist/admin-app/styles.css +173 -0
  4. package/package.json +1 -1
package/dist/admin/client.js CHANGED
@@ -8337,6 +8337,24 @@ var blankStep = () => ({
8337
8337
  fields: [blankField()],
8338
8338
  title: "New step"
8339
8339
  });
8340
+ var getStepTitle = (step, stepIndex) => getNonEmptyText(step.title, `Step ${stepIndex + 1}`);
8341
+ var getFieldLabel = (field, fieldIndex) => getNonEmptyText(field.label, getNonEmptyText(field.name, `Field ${fieldIndex + 1}`));
8342
+ var formatFieldTypeLabel = (value) => getNonEmptyText(value, "text").replace(/-/g, " ").replace(/^./, (char) => char.toUpperCase());
8343
+ var getStepDestination = (stepIndex, stepCount) => {
8344
+ if (stepIndex < stepCount - 1) {
8345
+ return `Next: Step ${stepIndex + 2}`;
8346
+ }
8347
+ return "Then: Submit form";
8348
+ };
8349
+ var moveItem = (items, fromIndex, toIndex) => {
8350
+ if (toIndex < 0 || toIndex >= items.length) {
8351
+ return items;
8352
+ }
8353
+ const nextItems = [...items];
8354
+ const [item] = nextItems.splice(fromIndex, 1);
8355
+ nextItems.splice(toIndex, 0, item);
8356
+ return nextItems;
8357
+ };
8340
8358
  function getFormIDFromPathname(pathname) {
8341
8359
  const marker = "/forms/";
8342
8360
  const raw = getIDFromPathname(pathname, marker);
@@ -8513,6 +8531,25 @@ function AdminStudioFormDetailView(props) {
8513
8531
  };
8514
8532
  });
8515
8533
  };
8534
+ const moveStep = (stepIndex, direction) => {
8535
+ setEditorState(
8536
+ (current) => current ? {
8537
+ ...current,
8538
+ steps: moveItem(current.steps, stepIndex, stepIndex + direction)
8539
+ } : current
8540
+ );
8541
+ };
8542
+ const moveField = (stepIndex, fieldIndex, direction) => {
8543
+ setEditorState((current) => {
8544
+ if (!current) return current;
8545
+ return {
8546
+ ...current,
8547
+ steps: current.steps.map(
8548
+ (step, index) => index === stepIndex ? { ...step, fields: moveItem(getFields(step), fieldIndex, fieldIndex + direction) } : step
8549
+ )
8550
+ };
8551
+ });
8552
+ };
8516
8553
  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(StudioSectionLayout, { navProps: props, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
8517
8554
  AdminPage,
8518
8555
  {
@@ -8827,16 +8864,65 @@ function AdminStudioFormDetailView(props) {
8827
8864
  ] })
8828
8865
  ] })
8829
8866
  ] }),
8830
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-card", children: [
8831
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("strong", { children: "Form steps" }),
8832
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { children: "Edit the public workflow with plain labels and field settings." }),
8833
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { style: { display: "grid", gap: "1rem", marginTop: "1rem" }, children: [
8834
- editorState.steps.map((step, stepIndex) => {
8835
- const fields = getFields(step);
8836
- const title2 = getNonEmptyText(step.title, `Step ${stepIndex + 1}`);
8837
- return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-form", children: [
8838
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-inline-actions", style: { justifyContent: "space-between" }, children: [
8839
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("strong", { children: title2 }),
8867
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-card orion-admin-workflow-editor", children: [
8868
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-workflow-editor-header", children: [
8869
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { children: [
8870
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("strong", { children: "Form steps" }),
8871
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { children: "Build the visitor flow, then edit each step's fields below." })
8872
+ ] }),
8873
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8874
+ "button",
8875
+ {
8876
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
8877
+ onClick: () => setEditorState(
8878
+ (current) => current ? { ...current, steps: [...current.steps, blankStep()] } : current
8879
+ ),
8880
+ type: "button",
8881
+ children: "Add step"
8882
+ }
8883
+ )
8884
+ ] }),
8885
+ editorState.steps.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-empty-state", children: [
8886
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("strong", { children: "No steps configured" }),
8887
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { children: "Add a first step to start building the public form flow." })
8888
+ ] }) : null,
8889
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "orion-admin-step-editor-list", children: editorState.steps.map((step, stepIndex) => {
8890
+ const fields = getFields(step);
8891
+ const requiredCount = fields.filter((field) => field.required === true).length;
8892
+ return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("details", { className: "orion-admin-step-editor", open: true, children: [
8893
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("summary", { className: "orion-admin-step-editor-summary", children: [
8894
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "orion-admin-workflow-node-number", children: stepIndex + 1 }),
8895
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "orion-admin-step-editor-title", children: getStepTitle(step, stepIndex) }),
8896
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("span", { className: "orion-admin-step-editor-meta", children: [
8897
+ fields.length,
8898
+ " field",
8899
+ fields.length === 1 ? "" : "s",
8900
+ requiredCount > 0 ? ` \xB7 ${requiredCount} required` : ""
8901
+ ] }),
8902
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "orion-admin-workflow-node-destination", children: getStepDestination(stepIndex, editorState.steps.length) })
8903
+ ] }),
8904
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-step-editor-body", children: [
8905
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-step-editor-actions", children: [
8906
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8907
+ "button",
8908
+ {
8909
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
8910
+ disabled: stepIndex === 0,
8911
+ onClick: () => moveStep(stepIndex, -1),
8912
+ type: "button",
8913
+ children: "Move up"
8914
+ }
8915
+ ),
8916
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8917
+ "button",
8918
+ {
8919
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
8920
+ disabled: stepIndex === editorState.steps.length - 1,
8921
+ onClick: () => moveStep(stepIndex, 1),
8922
+ type: "button",
8923
+ children: "Move down"
8924
+ }
8925
+ ),
8840
8926
  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8841
8927
  "button",
8842
8928
  {
@@ -8852,16 +8938,30 @@ function AdminStudioFormDetailView(props) {
8852
8938
  }
8853
8939
  )
8854
8940
  ] }),
8855
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { children: [
8856
- "Step title",
8857
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8858
- "input",
8859
- {
8860
- onChange: (event) => updateStep(stepIndex, { title: event.target.value }),
8861
- type: "text",
8862
- value: getNonEmptyText(step.title)
8863
- }
8864
- )
8941
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-step-settings-grid", children: [
8942
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { children: [
8943
+ "Step title",
8944
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8945
+ "input",
8946
+ {
8947
+ onChange: (event) => updateStep(stepIndex, { title: event.target.value }),
8948
+ type: "text",
8949
+ value: getNonEmptyText(step.title)
8950
+ }
8951
+ )
8952
+ ] }),
8953
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { children: [
8954
+ "Next button label",
8955
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8956
+ "input",
8957
+ {
8958
+ onChange: (event) => updateStep(stepIndex, { nextLabel: event.target.value }),
8959
+ placeholder: "Next",
8960
+ type: "text",
8961
+ value: getNonEmptyText(step.nextLabel)
8962
+ }
8963
+ )
8964
+ ] })
8865
8965
  ] }),
8866
8966
  /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { children: [
8867
8967
  "Step intro text",
@@ -8874,18 +8974,6 @@ function AdminStudioFormDetailView(props) {
8874
8974
  }
8875
8975
  )
8876
8976
  ] }),
8877
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { children: [
8878
- "Next button label",
8879
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8880
- "input",
8881
- {
8882
- onChange: (event) => updateStep(stepIndex, { nextLabel: event.target.value }),
8883
- placeholder: "Next",
8884
- type: "text",
8885
- value: getNonEmptyText(step.nextLabel)
8886
- }
8887
- )
8888
- ] }),
8889
8977
  /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { style: checkboxLabelStyle, children: [
8890
8978
  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8891
8979
  "input",
@@ -8897,62 +8985,116 @@ function AdminStudioFormDetailView(props) {
8897
8985
  ),
8898
8986
  "Allow visitors to skip this step"
8899
8987
  ] }),
8900
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { style: { display: "grid", gap: "0.85rem" }, children: [
8901
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("strong", { children: "Fields" }),
8902
- fields.map((field, fieldIndex) => {
8903
- const label = getNonEmptyText(field.label, `Field ${fieldIndex + 1}`);
8904
- const fieldType = getNonEmptyText(field.type, "text");
8905
- return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-card", children: [
8906
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
8907
- "div",
8908
- {
8909
- className: "orion-admin-inline-actions",
8910
- style: { justifyContent: "space-between" },
8911
- children: [
8912
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("strong", { children: label }),
8913
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8914
- "button",
8915
- {
8916
- className: "orion-admin-action-button orion-admin-action-button--ghost",
8917
- onClick: () => setEditorState((current) => {
8918
- if (!current) return current;
8919
- return {
8920
- ...current,
8921
- steps: current.steps.map(
8922
- (currentStep, index) => index === stepIndex ? {
8923
- ...currentStep,
8924
- fields: getFields(currentStep).filter(
8925
- (_, currentFieldIndex) => currentFieldIndex !== fieldIndex
8926
- )
8927
- } : currentStep
8928
- )
8929
- };
8930
- }),
8931
- type: "button",
8932
- children: "Remove field"
8933
- }
8934
- )
8935
- ]
8936
- }
8988
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-field-list-header", children: [
8989
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { children: [
8990
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("strong", { children: "Fields in this step" }),
8991
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { children: "These appear together before the visitor moves to the next step." })
8992
+ ] }),
8993
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8994
+ "button",
8995
+ {
8996
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
8997
+ onClick: () => setEditorState(
8998
+ (current) => current ? {
8999
+ ...current,
9000
+ steps: current.steps.map(
9001
+ (currentStep, index) => index === stepIndex ? { ...currentStep, fields: [...getFields(currentStep), blankField()] } : currentStep
9002
+ )
9003
+ } : current
8937
9004
  ),
8938
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { children: [
8939
- "Field label",
9005
+ type: "button",
9006
+ children: "Add field"
9007
+ }
9008
+ )
9009
+ ] }),
9010
+ fields.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "orion-admin-field-editor-list", children: fields.map((field, fieldIndex) => {
9011
+ const label = getFieldLabel(field, fieldIndex);
9012
+ const fieldType = getNonEmptyText(field.type, "text");
9013
+ return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("details", { className: "orion-admin-field-editor", children: [
9014
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("summary", { className: "orion-admin-field-editor-summary", children: [
9015
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "orion-admin-field-order", children: fieldIndex + 1 }),
9016
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "orion-admin-field-editor-title", children: label }),
9017
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("span", { className: "orion-admin-field-editor-meta", children: [
9018
+ formatFieldTypeLabel(fieldType),
9019
+ field.required === true ? " \xB7 Required" : ""
9020
+ ] })
9021
+ ] }),
9022
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-field-editor-body", children: [
9023
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-step-editor-actions", children: [
8940
9024
  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8941
- "input",
9025
+ "button",
8942
9026
  {
8943
- onChange: (event) => {
8944
- const nextLabel = event.target.value;
8945
- const currentName = getNonEmptyText(field.name);
8946
- updateField(stepIndex, fieldIndex, {
8947
- label: nextLabel,
8948
- name: currentName || slugifyFieldName(nextLabel)
8949
- });
8950
- },
8951
- type: "text",
8952
- value: label
9027
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
9028
+ disabled: fieldIndex === 0,
9029
+ onClick: () => moveField(stepIndex, fieldIndex, -1),
9030
+ type: "button",
9031
+ children: "Move up"
9032
+ }
9033
+ ),
9034
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
9035
+ "button",
9036
+ {
9037
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
9038
+ disabled: fieldIndex === fields.length - 1,
9039
+ onClick: () => moveField(stepIndex, fieldIndex, 1),
9040
+ type: "button",
9041
+ children: "Move down"
9042
+ }
9043
+ ),
9044
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
9045
+ "button",
9046
+ {
9047
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
9048
+ onClick: () => setEditorState((current) => {
9049
+ if (!current) return current;
9050
+ return {
9051
+ ...current,
9052
+ steps: current.steps.map(
9053
+ (currentStep, index) => index === stepIndex ? {
9054
+ ...currentStep,
9055
+ fields: getFields(currentStep).filter(
9056
+ (_, currentFieldIndex) => currentFieldIndex !== fieldIndex
9057
+ )
9058
+ } : currentStep
9059
+ )
9060
+ };
9061
+ }),
9062
+ type: "button",
9063
+ children: "Remove field"
8953
9064
  }
8954
9065
  )
8955
9066
  ] }),
9067
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-step-settings-grid", children: [
9068
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { children: [
9069
+ "Field label",
9070
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
9071
+ "input",
9072
+ {
9073
+ onChange: (event) => {
9074
+ const nextLabel = event.target.value;
9075
+ const currentName = getNonEmptyText(field.name);
9076
+ updateField(stepIndex, fieldIndex, {
9077
+ label: nextLabel,
9078
+ name: currentName || slugifyFieldName(nextLabel)
9079
+ });
9080
+ },
9081
+ type: "text",
9082
+ value: label
9083
+ }
9084
+ )
9085
+ ] }),
9086
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { children: [
9087
+ "Field type",
9088
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
9089
+ "select",
9090
+ {
9091
+ onChange: (event) => updateField(stepIndex, fieldIndex, { type: event.target.value }),
9092
+ value: fieldType,
9093
+ children: fieldTypeOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("option", { value: option, children: formatFieldTypeLabel(option) }, option))
9094
+ }
9095
+ )
9096
+ ] })
9097
+ ] }),
8956
9098
  /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { children: [
8957
9099
  "Field key",
8958
9100
  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
@@ -8964,17 +9106,6 @@ function AdminStudioFormDetailView(props) {
8964
9106
  }
8965
9107
  )
8966
9108
  ] }),
8967
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { children: [
8968
- "Field type",
8969
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8970
- "select",
8971
- {
8972
- onChange: (event) => updateField(stepIndex, fieldIndex, { type: event.target.value }),
8973
- value: fieldType,
8974
- children: fieldTypeOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("option", { value: option, children: option }, option))
8975
- }
8976
- )
8977
- ] }),
8978
9109
  /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("label", { style: checkboxLabelStyle, children: [
8979
9110
  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8980
9111
  "input",
@@ -9011,39 +9142,15 @@ function AdminStudioFormDetailView(props) {
9011
9142
  }
9012
9143
  )
9013
9144
  ] }) : null
9014
- ] }, `edit-field-${stepIndex}-${fieldIndex}`);
9015
- }),
9016
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
9017
- "button",
9018
- {
9019
- className: "orion-admin-action-button orion-admin-action-button--ghost",
9020
- onClick: () => setEditorState(
9021
- (current) => current ? {
9022
- ...current,
9023
- steps: current.steps.map(
9024
- (currentStep, index) => index === stepIndex ? { ...currentStep, fields: [...getFields(currentStep), blankField()] } : currentStep
9025
- )
9026
- } : current
9027
- ),
9028
- type: "button",
9029
- children: "Add field"
9030
- }
9031
- )
9145
+ ] })
9146
+ ] }, `edit-field-${stepIndex}-${fieldIndex}`);
9147
+ }) }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "orion-admin-empty-state", children: [
9148
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("strong", { children: "No fields in this step" }),
9149
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { children: "Add a field so visitors have something to answer here." })
9032
9150
  ] })
9033
- ] }, `edit-step-${stepIndex}`);
9034
- }),
9035
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
9036
- "button",
9037
- {
9038
- className: "orion-admin-action-button orion-admin-action-button--ghost",
9039
- onClick: () => setEditorState(
9040
- (current) => current ? { ...current, steps: [...current.steps, blankStep()] } : current
9041
- ),
9042
- type: "button",
9043
- children: "Add step"
9044
- }
9045
- )
9046
- ] })
9151
+ ] })
9152
+ ] }, `edit-step-${stepIndex}`);
9153
+ }) })
9047
9154
  ] }),
9048
9155
  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("button", { disabled: saving, type: "submit", children: saving ? "Saving..." : "Save Form" })
9049
9156
  ] })
package/dist/admin/client.mjs CHANGED
@@ -6007,6 +6007,24 @@ var blankStep = () => ({
6007
6007
  fields: [blankField()],
6008
6008
  title: "New step"
6009
6009
  });
6010
+ var getStepTitle = (step, stepIndex) => getNonEmptyText(step.title, `Step ${stepIndex + 1}`);
6011
+ var getFieldLabel = (field, fieldIndex) => getNonEmptyText(field.label, getNonEmptyText(field.name, `Field ${fieldIndex + 1}`));
6012
+ var formatFieldTypeLabel = (value) => getNonEmptyText(value, "text").replace(/-/g, " ").replace(/^./, (char) => char.toUpperCase());
6013
+ var getStepDestination = (stepIndex, stepCount) => {
6014
+ if (stepIndex < stepCount - 1) {
6015
+ return `Next: Step ${stepIndex + 2}`;
6016
+ }
6017
+ return "Then: Submit form";
6018
+ };
6019
+ var moveItem = (items, fromIndex, toIndex) => {
6020
+ if (toIndex < 0 || toIndex >= items.length) {
6021
+ return items;
6022
+ }
6023
+ const nextItems = [...items];
6024
+ const [item] = nextItems.splice(fromIndex, 1);
6025
+ nextItems.splice(toIndex, 0, item);
6026
+ return nextItems;
6027
+ };
6010
6028
  function getFormIDFromPathname(pathname) {
6011
6029
  const marker = "/forms/";
6012
6030
  const raw = getIDFromPathname(pathname, marker);
@@ -6183,6 +6201,25 @@ function AdminStudioFormDetailView(props) {
6183
6201
  };
6184
6202
  });
6185
6203
  };
6204
+ const moveStep = (stepIndex, direction) => {
6205
+ setEditorState(
6206
+ (current) => current ? {
6207
+ ...current,
6208
+ steps: moveItem(current.steps, stepIndex, stepIndex + direction)
6209
+ } : current
6210
+ );
6211
+ };
6212
+ const moveField = (stepIndex, fieldIndex, direction) => {
6213
+ setEditorState((current) => {
6214
+ if (!current) return current;
6215
+ return {
6216
+ ...current,
6217
+ steps: current.steps.map(
6218
+ (step, index) => index === stepIndex ? { ...step, fields: moveItem(getFields(step), fieldIndex, fieldIndex + direction) } : step
6219
+ )
6220
+ };
6221
+ });
6222
+ };
6186
6223
  return /* @__PURE__ */ jsx30(StudioSectionLayout, { navProps: props, children: /* @__PURE__ */ jsxs27(
6187
6224
  AdminPage,
6188
6225
  {
@@ -6497,16 +6534,65 @@ function AdminStudioFormDetailView(props) {
6497
6534
  ] })
6498
6535
  ] })
6499
6536
  ] }),
6500
- /* @__PURE__ */ jsxs27("div", { className: "orion-admin-card", children: [
6501
- /* @__PURE__ */ jsx30("strong", { children: "Form steps" }),
6502
- /* @__PURE__ */ jsx30("span", { children: "Edit the public workflow with plain labels and field settings." }),
6503
- /* @__PURE__ */ jsxs27("div", { style: { display: "grid", gap: "1rem", marginTop: "1rem" }, children: [
6504
- editorState.steps.map((step, stepIndex) => {
6505
- const fields = getFields(step);
6506
- const title2 = getNonEmptyText(step.title, `Step ${stepIndex + 1}`);
6507
- return /* @__PURE__ */ jsxs27("div", { className: "orion-admin-form", children: [
6508
- /* @__PURE__ */ jsxs27("div", { className: "orion-admin-inline-actions", style: { justifyContent: "space-between" }, children: [
6509
- /* @__PURE__ */ jsx30("strong", { children: title2 }),
6537
+ /* @__PURE__ */ jsxs27("div", { className: "orion-admin-card orion-admin-workflow-editor", children: [
6538
+ /* @__PURE__ */ jsxs27("div", { className: "orion-admin-workflow-editor-header", children: [
6539
+ /* @__PURE__ */ jsxs27("div", { children: [
6540
+ /* @__PURE__ */ jsx30("strong", { children: "Form steps" }),
6541
+ /* @__PURE__ */ jsx30("span", { children: "Build the visitor flow, then edit each step's fields below." })
6542
+ ] }),
6543
+ /* @__PURE__ */ jsx30(
6544
+ "button",
6545
+ {
6546
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
6547
+ onClick: () => setEditorState(
6548
+ (current) => current ? { ...current, steps: [...current.steps, blankStep()] } : current
6549
+ ),
6550
+ type: "button",
6551
+ children: "Add step"
6552
+ }
6553
+ )
6554
+ ] }),
6555
+ editorState.steps.length === 0 ? /* @__PURE__ */ jsxs27("div", { className: "orion-admin-empty-state", children: [
6556
+ /* @__PURE__ */ jsx30("strong", { children: "No steps configured" }),
6557
+ /* @__PURE__ */ jsx30("span", { children: "Add a first step to start building the public form flow." })
6558
+ ] }) : null,
6559
+ /* @__PURE__ */ jsx30("div", { className: "orion-admin-step-editor-list", children: editorState.steps.map((step, stepIndex) => {
6560
+ const fields = getFields(step);
6561
+ const requiredCount = fields.filter((field) => field.required === true).length;
6562
+ return /* @__PURE__ */ jsxs27("details", { className: "orion-admin-step-editor", open: true, children: [
6563
+ /* @__PURE__ */ jsxs27("summary", { className: "orion-admin-step-editor-summary", children: [
6564
+ /* @__PURE__ */ jsx30("span", { className: "orion-admin-workflow-node-number", children: stepIndex + 1 }),
6565
+ /* @__PURE__ */ jsx30("span", { className: "orion-admin-step-editor-title", children: getStepTitle(step, stepIndex) }),
6566
+ /* @__PURE__ */ jsxs27("span", { className: "orion-admin-step-editor-meta", children: [
6567
+ fields.length,
6568
+ " field",
6569
+ fields.length === 1 ? "" : "s",
6570
+ requiredCount > 0 ? ` \xB7 ${requiredCount} required` : ""
6571
+ ] }),
6572
+ /* @__PURE__ */ jsx30("span", { className: "orion-admin-workflow-node-destination", children: getStepDestination(stepIndex, editorState.steps.length) })
6573
+ ] }),
6574
+ /* @__PURE__ */ jsxs27("div", { className: "orion-admin-step-editor-body", children: [
6575
+ /* @__PURE__ */ jsxs27("div", { className: "orion-admin-step-editor-actions", children: [
6576
+ /* @__PURE__ */ jsx30(
6577
+ "button",
6578
+ {
6579
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
6580
+ disabled: stepIndex === 0,
6581
+ onClick: () => moveStep(stepIndex, -1),
6582
+ type: "button",
6583
+ children: "Move up"
6584
+ }
6585
+ ),
6586
+ /* @__PURE__ */ jsx30(
6587
+ "button",
6588
+ {
6589
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
6590
+ disabled: stepIndex === editorState.steps.length - 1,
6591
+ onClick: () => moveStep(stepIndex, 1),
6592
+ type: "button",
6593
+ children: "Move down"
6594
+ }
6595
+ ),
6510
6596
  /* @__PURE__ */ jsx30(
6511
6597
  "button",
6512
6598
  {
@@ -6522,16 +6608,30 @@ function AdminStudioFormDetailView(props) {
6522
6608
  }
6523
6609
  )
6524
6610
  ] }),
6525
- /* @__PURE__ */ jsxs27("label", { children: [
6526
- "Step title",
6527
- /* @__PURE__ */ jsx30(
6528
- "input",
6529
- {
6530
- onChange: (event) => updateStep(stepIndex, { title: event.target.value }),
6531
- type: "text",
6532
- value: getNonEmptyText(step.title)
6533
- }
6534
- )
6611
+ /* @__PURE__ */ jsxs27("div", { className: "orion-admin-step-settings-grid", children: [
6612
+ /* @__PURE__ */ jsxs27("label", { children: [
6613
+ "Step title",
6614
+ /* @__PURE__ */ jsx30(
6615
+ "input",
6616
+ {
6617
+ onChange: (event) => updateStep(stepIndex, { title: event.target.value }),
6618
+ type: "text",
6619
+ value: getNonEmptyText(step.title)
6620
+ }
6621
+ )
6622
+ ] }),
6623
+ /* @__PURE__ */ jsxs27("label", { children: [
6624
+ "Next button label",
6625
+ /* @__PURE__ */ jsx30(
6626
+ "input",
6627
+ {
6628
+ onChange: (event) => updateStep(stepIndex, { nextLabel: event.target.value }),
6629
+ placeholder: "Next",
6630
+ type: "text",
6631
+ value: getNonEmptyText(step.nextLabel)
6632
+ }
6633
+ )
6634
+ ] })
6535
6635
  ] }),
6536
6636
  /* @__PURE__ */ jsxs27("label", { children: [
6537
6637
  "Step intro text",
@@ -6544,18 +6644,6 @@ function AdminStudioFormDetailView(props) {
6544
6644
  }
6545
6645
  )
6546
6646
  ] }),
6547
- /* @__PURE__ */ jsxs27("label", { children: [
6548
- "Next button label",
6549
- /* @__PURE__ */ jsx30(
6550
- "input",
6551
- {
6552
- onChange: (event) => updateStep(stepIndex, { nextLabel: event.target.value }),
6553
- placeholder: "Next",
6554
- type: "text",
6555
- value: getNonEmptyText(step.nextLabel)
6556
- }
6557
- )
6558
- ] }),
6559
6647
  /* @__PURE__ */ jsxs27("label", { style: checkboxLabelStyle, children: [
6560
6648
  /* @__PURE__ */ jsx30(
6561
6649
  "input",
@@ -6567,62 +6655,116 @@ function AdminStudioFormDetailView(props) {
6567
6655
  ),
6568
6656
  "Allow visitors to skip this step"
6569
6657
  ] }),
6570
- /* @__PURE__ */ jsxs27("div", { style: { display: "grid", gap: "0.85rem" }, children: [
6571
- /* @__PURE__ */ jsx30("strong", { children: "Fields" }),
6572
- fields.map((field, fieldIndex) => {
6573
- const label = getNonEmptyText(field.label, `Field ${fieldIndex + 1}`);
6574
- const fieldType = getNonEmptyText(field.type, "text");
6575
- return /* @__PURE__ */ jsxs27("div", { className: "orion-admin-card", children: [
6576
- /* @__PURE__ */ jsxs27(
6577
- "div",
6578
- {
6579
- className: "orion-admin-inline-actions",
6580
- style: { justifyContent: "space-between" },
6581
- children: [
6582
- /* @__PURE__ */ jsx30("strong", { children: label }),
6583
- /* @__PURE__ */ jsx30(
6584
- "button",
6585
- {
6586
- className: "orion-admin-action-button orion-admin-action-button--ghost",
6587
- onClick: () => setEditorState((current) => {
6588
- if (!current) return current;
6589
- return {
6590
- ...current,
6591
- steps: current.steps.map(
6592
- (currentStep, index) => index === stepIndex ? {
6593
- ...currentStep,
6594
- fields: getFields(currentStep).filter(
6595
- (_, currentFieldIndex) => currentFieldIndex !== fieldIndex
6596
- )
6597
- } : currentStep
6598
- )
6599
- };
6600
- }),
6601
- type: "button",
6602
- children: "Remove field"
6603
- }
6604
- )
6605
- ]
6606
- }
6658
+ /* @__PURE__ */ jsxs27("div", { className: "orion-admin-field-list-header", children: [
6659
+ /* @__PURE__ */ jsxs27("div", { children: [
6660
+ /* @__PURE__ */ jsx30("strong", { children: "Fields in this step" }),
6661
+ /* @__PURE__ */ jsx30("span", { children: "These appear together before the visitor moves to the next step." })
6662
+ ] }),
6663
+ /* @__PURE__ */ jsx30(
6664
+ "button",
6665
+ {
6666
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
6667
+ onClick: () => setEditorState(
6668
+ (current) => current ? {
6669
+ ...current,
6670
+ steps: current.steps.map(
6671
+ (currentStep, index) => index === stepIndex ? { ...currentStep, fields: [...getFields(currentStep), blankField()] } : currentStep
6672
+ )
6673
+ } : current
6607
6674
  ),
6608
- /* @__PURE__ */ jsxs27("label", { children: [
6609
- "Field label",
6675
+ type: "button",
6676
+ children: "Add field"
6677
+ }
6678
+ )
6679
+ ] }),
6680
+ fields.length > 0 ? /* @__PURE__ */ jsx30("div", { className: "orion-admin-field-editor-list", children: fields.map((field, fieldIndex) => {
6681
+ const label = getFieldLabel(field, fieldIndex);
6682
+ const fieldType = getNonEmptyText(field.type, "text");
6683
+ return /* @__PURE__ */ jsxs27("details", { className: "orion-admin-field-editor", children: [
6684
+ /* @__PURE__ */ jsxs27("summary", { className: "orion-admin-field-editor-summary", children: [
6685
+ /* @__PURE__ */ jsx30("span", { className: "orion-admin-field-order", children: fieldIndex + 1 }),
6686
+ /* @__PURE__ */ jsx30("span", { className: "orion-admin-field-editor-title", children: label }),
6687
+ /* @__PURE__ */ jsxs27("span", { className: "orion-admin-field-editor-meta", children: [
6688
+ formatFieldTypeLabel(fieldType),
6689
+ field.required === true ? " \xB7 Required" : ""
6690
+ ] })
6691
+ ] }),
6692
+ /* @__PURE__ */ jsxs27("div", { className: "orion-admin-field-editor-body", children: [
6693
+ /* @__PURE__ */ jsxs27("div", { className: "orion-admin-step-editor-actions", children: [
6610
6694
  /* @__PURE__ */ jsx30(
6611
- "input",
6695
+ "button",
6612
6696
  {
6613
- onChange: (event) => {
6614
- const nextLabel = event.target.value;
6615
- const currentName = getNonEmptyText(field.name);
6616
- updateField(stepIndex, fieldIndex, {
6617
- label: nextLabel,
6618
- name: currentName || slugifyFieldName(nextLabel)
6619
- });
6620
- },
6621
- type: "text",
6622
- value: label
6697
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
6698
+ disabled: fieldIndex === 0,
6699
+ onClick: () => moveField(stepIndex, fieldIndex, -1),
6700
+ type: "button",
6701
+ children: "Move up"
6702
+ }
6703
+ ),
6704
+ /* @__PURE__ */ jsx30(
6705
+ "button",
6706
+ {
6707
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
6708
+ disabled: fieldIndex === fields.length - 1,
6709
+ onClick: () => moveField(stepIndex, fieldIndex, 1),
6710
+ type: "button",
6711
+ children: "Move down"
6712
+ }
6713
+ ),
6714
+ /* @__PURE__ */ jsx30(
6715
+ "button",
6716
+ {
6717
+ className: "orion-admin-action-button orion-admin-action-button--ghost",
6718
+ onClick: () => setEditorState((current) => {
6719
+ if (!current) return current;
6720
+ return {
6721
+ ...current,
6722
+ steps: current.steps.map(
6723
+ (currentStep, index) => index === stepIndex ? {
6724
+ ...currentStep,
6725
+ fields: getFields(currentStep).filter(
6726
+ (_, currentFieldIndex) => currentFieldIndex !== fieldIndex
6727
+ )
6728
+ } : currentStep
6729
+ )
6730
+ };
6731
+ }),
6732
+ type: "button",
6733
+ children: "Remove field"
6623
6734
  }
6624
6735
  )
6625
6736
  ] }),
6737
+ /* @__PURE__ */ jsxs27("div", { className: "orion-admin-step-settings-grid", children: [
6738
+ /* @__PURE__ */ jsxs27("label", { children: [
6739
+ "Field label",
6740
+ /* @__PURE__ */ jsx30(
6741
+ "input",
6742
+ {
6743
+ onChange: (event) => {
6744
+ const nextLabel = event.target.value;
6745
+ const currentName = getNonEmptyText(field.name);
6746
+ updateField(stepIndex, fieldIndex, {
6747
+ label: nextLabel,
6748
+ name: currentName || slugifyFieldName(nextLabel)
6749
+ });
6750
+ },
6751
+ type: "text",
6752
+ value: label
6753
+ }
6754
+ )
6755
+ ] }),
6756
+ /* @__PURE__ */ jsxs27("label", { children: [
6757
+ "Field type",
6758
+ /* @__PURE__ */ jsx30(
6759
+ "select",
6760
+ {
6761
+ onChange: (event) => updateField(stepIndex, fieldIndex, { type: event.target.value }),
6762
+ value: fieldType,
6763
+ children: fieldTypeOptions.map((option) => /* @__PURE__ */ jsx30("option", { value: option, children: formatFieldTypeLabel(option) }, option))
6764
+ }
6765
+ )
6766
+ ] })
6767
+ ] }),
6626
6768
  /* @__PURE__ */ jsxs27("label", { children: [
6627
6769
  "Field key",
6628
6770
  /* @__PURE__ */ jsx30(
@@ -6634,17 +6776,6 @@ function AdminStudioFormDetailView(props) {
6634
6776
  }
6635
6777
  )
6636
6778
  ] }),
6637
- /* @__PURE__ */ jsxs27("label", { children: [
6638
- "Field type",
6639
- /* @__PURE__ */ jsx30(
6640
- "select",
6641
- {
6642
- onChange: (event) => updateField(stepIndex, fieldIndex, { type: event.target.value }),
6643
- value: fieldType,
6644
- children: fieldTypeOptions.map((option) => /* @__PURE__ */ jsx30("option", { value: option, children: option }, option))
6645
- }
6646
- )
6647
- ] }),
6648
6779
  /* @__PURE__ */ jsxs27("label", { style: checkboxLabelStyle, children: [
6649
6780
  /* @__PURE__ */ jsx30(
6650
6781
  "input",
@@ -6681,39 +6812,15 @@ function AdminStudioFormDetailView(props) {
6681
6812
  }
6682
6813
  )
6683
6814
  ] }) : null
6684
- ] }, `edit-field-${stepIndex}-${fieldIndex}`);
6685
- }),
6686
- /* @__PURE__ */ jsx30(
6687
- "button",
6688
- {
6689
- className: "orion-admin-action-button orion-admin-action-button--ghost",
6690
- onClick: () => setEditorState(
6691
- (current) => current ? {
6692
- ...current,
6693
- steps: current.steps.map(
6694
- (currentStep, index) => index === stepIndex ? { ...currentStep, fields: [...getFields(currentStep), blankField()] } : currentStep
6695
- )
6696
- } : current
6697
- ),
6698
- type: "button",
6699
- children: "Add field"
6700
- }
6701
- )
6815
+ ] })
6816
+ ] }, `edit-field-${stepIndex}-${fieldIndex}`);
6817
+ }) }) : /* @__PURE__ */ jsxs27("div", { className: "orion-admin-empty-state", children: [
6818
+ /* @__PURE__ */ jsx30("strong", { children: "No fields in this step" }),
6819
+ /* @__PURE__ */ jsx30("span", { children: "Add a field so visitors have something to answer here." })
6702
6820
  ] })
6703
- ] }, `edit-step-${stepIndex}`);
6704
- }),
6705
- /* @__PURE__ */ jsx30(
6706
- "button",
6707
- {
6708
- className: "orion-admin-action-button orion-admin-action-button--ghost",
6709
- onClick: () => setEditorState(
6710
- (current) => current ? { ...current, steps: [...current.steps, blankStep()] } : current
6711
- ),
6712
- type: "button",
6713
- children: "Add step"
6714
- }
6715
- )
6716
- ] })
6821
+ ] })
6822
+ ] }, `edit-step-${stepIndex}`);
6823
+ }) })
6717
6824
  ] }),
6718
6825
  /* @__PURE__ */ jsx30("button", { disabled: saving, type: "submit", children: saving ? "Saving..." : "Save Form" })
6719
6826
  ] })
package/dist/admin-app/styles.css CHANGED
@@ -1627,6 +1627,179 @@
1627
1627
  gap: 0.75rem;
1628
1628
  }
1629
1629
 
1630
+ .orion-admin-workflow-editor {
1631
+ gap: 1rem;
1632
+ }
1633
+
1634
+ .orion-admin-workflow-editor-header,
1635
+ .orion-admin-field-list-header {
1636
+ align-items: flex-start;
1637
+ display: flex;
1638
+ flex-wrap: wrap;
1639
+ gap: 0.8rem;
1640
+ justify-content: space-between;
1641
+ }
1642
+
1643
+ .orion-admin-workflow-node {
1644
+ align-items: center;
1645
+ background:
1646
+ linear-gradient(180deg, color-mix(in srgb, var(--orion-admin-card-bg) 88%, white), var(--orion-admin-card-bg));
1647
+ border: 1px solid color-mix(in srgb, var(--orion-admin-card-border) 80%, transparent);
1648
+ border-radius: var(--orion-admin-radius-md);
1649
+ display: grid;
1650
+ gap: 0.75rem;
1651
+ grid-template-columns: auto minmax(0, 1fr) auto;
1652
+ padding: 0.85rem;
1653
+ position: relative;
1654
+ }
1655
+
1656
+ .orion-admin-step-editor:not(:last-child)::after {
1657
+ background: color-mix(in srgb, var(--orion-admin-accent) 34%, var(--orion-admin-card-border));
1658
+ bottom: -0.85rem;
1659
+ content: '';
1660
+ height: 0.85rem;
1661
+ left: 1.42rem;
1662
+ position: absolute;
1663
+ width: 2px;
1664
+ }
1665
+
1666
+ .orion-admin-workflow-node-number,
1667
+ .orion-admin-step-editor-index,
1668
+ .orion-admin-field-order {
1669
+ align-items: center;
1670
+ background: var(--orion-admin-accent-subtle);
1671
+ border: 1px solid var(--orion-admin-accent-border);
1672
+ border-radius: var(--orion-admin-radius-pill);
1673
+ color: var(--orion-admin-accent);
1674
+ display: inline-flex;
1675
+ flex: 0 0 auto;
1676
+ font-size: 0.78rem;
1677
+ font-weight: 900;
1678
+ justify-content: center;
1679
+ }
1680
+
1681
+ .orion-admin-workflow-node-number {
1682
+ height: 2rem;
1683
+ width: 2rem;
1684
+ }
1685
+
1686
+ .orion-admin-workflow-node-body {
1687
+ display: grid;
1688
+ gap: 0.18rem;
1689
+ min-width: 0;
1690
+ }
1691
+
1692
+ .orion-admin-workflow-node-body strong,
1693
+ .orion-admin-step-editor-title,
1694
+ .orion-admin-field-editor-title {
1695
+ color: var(--orion-admin-text);
1696
+ overflow-wrap: anywhere;
1697
+ }
1698
+
1699
+ .orion-admin-workflow-node-body span,
1700
+ .orion-admin-workflow-node-destination,
1701
+ .orion-admin-step-editor-meta,
1702
+ .orion-admin-field-editor-meta,
1703
+ .orion-admin-field-list-header span {
1704
+ color: var(--orion-admin-muted);
1705
+ font-size: 0.86rem;
1706
+ }
1707
+
1708
+ .orion-admin-workflow-node-destination {
1709
+ background: color-mix(in srgb, var(--orion-admin-card-bg) 78%, white);
1710
+ border: 1px solid color-mix(in srgb, var(--orion-admin-card-border) 72%, transparent);
1711
+ border-radius: var(--orion-admin-radius-pill);
1712
+ font-weight: 800;
1713
+ padding: 0.35rem 0.65rem;
1714
+ white-space: nowrap;
1715
+ }
1716
+
1717
+ .orion-admin-step-editor-list,
1718
+ .orion-admin-field-editor-list {
1719
+ display: grid;
1720
+ gap: 0.85rem;
1721
+ }
1722
+
1723
+ .orion-admin-step-editor,
1724
+ .orion-admin-field-editor {
1725
+ background: color-mix(in srgb, var(--orion-admin-card-bg) 92%, white);
1726
+ border: 1px solid color-mix(in srgb, var(--orion-admin-card-border) 84%, transparent);
1727
+ border-radius: var(--orion-admin-radius-md);
1728
+ overflow: hidden;
1729
+ position: relative;
1730
+ }
1731
+
1732
+ .orion-admin-step-editor-summary,
1733
+ .orion-admin-field-editor-summary {
1734
+ align-items: center;
1735
+ cursor: pointer;
1736
+ display: grid;
1737
+ gap: 0.65rem;
1738
+ grid-template-columns: auto minmax(0, 1fr) minmax(96px, auto) auto auto;
1739
+ list-style: none;
1740
+ min-height: 52px;
1741
+ padding: 0.75rem 0.9rem;
1742
+ }
1743
+
1744
+ .orion-admin-step-editor-summary::-webkit-details-marker,
1745
+ .orion-admin-field-editor-summary::-webkit-details-marker {
1746
+ display: none;
1747
+ }
1748
+
1749
+ .orion-admin-step-editor-summary::after,
1750
+ .orion-admin-field-editor-summary::after {
1751
+ color: var(--orion-admin-muted);
1752
+ content: 'Edit';
1753
+ font-size: 0.78rem;
1754
+ font-weight: 900;
1755
+ justify-self: end;
1756
+ text-transform: uppercase;
1757
+ }
1758
+
1759
+ .orion-admin-step-editor[open] > .orion-admin-step-editor-summary::after,
1760
+ .orion-admin-field-editor[open] > .orion-admin-field-editor-summary::after {
1761
+ content: 'Hide';
1762
+ }
1763
+
1764
+ .orion-admin-step-editor-index {
1765
+ min-height: 1.8rem;
1766
+ padding: 0 0.58rem;
1767
+ }
1768
+
1769
+ .orion-admin-field-order {
1770
+ height: 1.75rem;
1771
+ width: 1.75rem;
1772
+ }
1773
+
1774
+ .orion-admin-step-editor-body,
1775
+ .orion-admin-field-editor-body {
1776
+ border-top: 1px solid color-mix(in srgb, var(--orion-admin-card-border) 72%, transparent);
1777
+ display: grid;
1778
+ gap: 0.85rem;
1779
+ padding: 0.95rem;
1780
+ }
1781
+
1782
+ .orion-admin-step-editor-actions {
1783
+ display: flex;
1784
+ flex-wrap: wrap;
1785
+ gap: 0.55rem;
1786
+ }
1787
+
1788
+ .orion-admin-step-settings-grid {
1789
+ display: grid;
1790
+ gap: 0.75rem;
1791
+ grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
1792
+ }
1793
+
1794
+ .orion-admin-field-editor {
1795
+ border-radius: var(--orion-admin-radius-sm);
1796
+ }
1797
+
1798
+ .orion-admin-field-editor-summary {
1799
+ grid-template-columns: auto minmax(0, 1fr) minmax(96px, auto) auto;
1800
+ padding: 0.68rem 0.75rem;
1801
+ }
1802
+
1630
1803
  .orion-admin-response-stack.is-scrollable {
1631
1804
  mask-image: linear-gradient(180deg, #000 0%, #000 92%, transparent 100%);
1632
1805
  max-height: 34rem;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@orion-studios/payload-studio",
3
- "version": "0.6.0-beta.26",
3
+ "version": "0.6.0-beta.28",
4
4
  "description": "Base CMS, builder, and custom admin toolkit for Orion Studios websites",
5
5
  "types": "./dist/index.d.ts",
6
6
  "main": "./dist/index.js",