@firecms/core 3.0.0-canary.105 → 3.0.0-canary.106

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 (35) hide show
  1. package/dist/form/PropertyFieldBinding.d.ts +1 -1
  2. package/dist/form/field_bindings/MultiSelectBinding.d.ts +1 -1
  3. package/dist/form/field_bindings/SelectFieldBinding.d.ts +1 -1
  4. package/dist/form/field_bindings/TextFieldBinding.d.ts +1 -1
  5. package/dist/index.es.js +50 -38
  6. package/dist/index.es.js.map +1 -1
  7. package/dist/index.umd.js +50 -38
  8. package/dist/index.umd.js.map +1 -1
  9. package/dist/preview/PropertyPreviewProps.d.ts +1 -1
  10. package/dist/preview/components/EnumValuesChip.d.ts +1 -1
  11. package/dist/types/fields.d.ts +8 -0
  12. package/package.json +5 -5
  13. package/src/components/EntityCollectionTable/fields/TableReferenceField.tsx +1 -1
  14. package/src/components/EntityCollectionView/EntityCollectionView.tsx +1 -1
  15. package/src/components/EntityPreview.tsx +7 -7
  16. package/src/form/PropertyFieldBinding.tsx +11 -4
  17. package/src/form/field_bindings/MultiSelectBinding.tsx +2 -0
  18. package/src/form/field_bindings/ReferenceFieldBinding.tsx +3 -3
  19. package/src/form/field_bindings/SelectFieldBinding.tsx +5 -3
  20. package/src/form/field_bindings/SwitchFieldBinding.tsx +2 -2
  21. package/src/form/field_bindings/TextFieldBinding.tsx +3 -1
  22. package/src/preview/PropertyPreviewProps.tsx +1 -1
  23. package/src/preview/components/BooleanPreview.tsx +1 -1
  24. package/src/preview/components/EnumValuesChip.tsx +1 -1
  25. package/src/preview/components/ImagePreview.tsx +1 -1
  26. package/src/preview/components/UrlComponentPreview.tsx +1 -1
  27. package/src/preview/property_previews/ArrayOfReferencesPreview.tsx +1 -1
  28. package/src/preview/property_previews/ArrayOfStorageComponentsPreview.tsx +1 -1
  29. package/src/preview/property_previews/ArrayOneOfPreview.tsx +1 -1
  30. package/src/preview/property_previews/ArrayPropertyPreview.tsx +1 -1
  31. package/src/preview/property_previews/MapPropertyPreview.tsx +1 -1
  32. package/src/preview/property_previews/SkeletonPropertyComponent.tsx +2 -2
  33. package/src/preview/property_previews/StringPropertyPreview.tsx +2 -2
  34. package/src/preview/util.ts +2 -2
  35. package/src/types/fields.tsx +10 -0
package/dist/index.umd.js CHANGED
@@ -4519,7 +4519,7 @@
4519
4519
  const SMALL_THUMBNAIL = 100;
4520
4520
  const REGULAR_THUMBNAIL = 200;
4521
4521
  function getThumbnailMeasure(size) {
4522
- if (size === "tiny")
4522
+ if (size === "smallest")
4523
4523
  return TINY_THUMBNAIL;
4524
4524
  else if (size === "small")
4525
4525
  return SMALL_THUMBNAIL;
@@ -4531,7 +4531,7 @@
4531
4531
  switch (size) {
4532
4532
  case "xs":
4533
4533
  case "s":
4534
- return "tiny";
4534
+ return "smallest";
4535
4535
  case "m":
4536
4536
  return "small";
4537
4537
  case "l":
@@ -4546,7 +4546,7 @@
4546
4546
  url
4547
4547
  }) {
4548
4548
  const imageSize = React.useMemo(() => getThumbnailMeasure(size), [size]);
4549
- if (size === "tiny") {
4549
+ if (size === "smallest") {
4550
4550
  return /* @__PURE__ */ jsxRuntime.jsx(
4551
4551
  "img",
4552
4552
  {
@@ -4714,7 +4714,7 @@
4714
4714
  interactive
4715
4715
  }) {
4716
4716
  const imageSize = React.useMemo(() => {
4717
- if (size === "tiny")
4717
+ if (size === "smallest")
4718
4718
  return "140px";
4719
4719
  else if (size === "small")
4720
4720
  return "240px";
@@ -4806,7 +4806,7 @@
4806
4806
  mapPropertyKeys = property.previewProperties || Object.keys(property.properties);
4807
4807
  if (size === "small")
4808
4808
  mapPropertyKeys = mapPropertyKeys.slice(0, 3);
4809
- else if (size === "tiny")
4809
+ else if (size === "smallest")
4810
4810
  mapPropertyKeys = mapPropertyKeys.slice(0, 1);
4811
4811
  }
4812
4812
  if (size !== "medium")
@@ -4911,7 +4911,7 @@
4911
4911
  );
4912
4912
  }
4913
4913
  function renderSkeletonImageThumbnail(size) {
4914
- const imageSize = size === "tiny" ? 40 : size === "small" ? 100 : 200;
4914
+ const imageSize = size === "smallest" ? 40 : size === "small" ? 100 : 200;
4915
4915
  return /* @__PURE__ */ jsxRuntime.jsx(
4916
4916
  ui.Skeleton,
4917
4917
  {
@@ -5076,10 +5076,10 @@
5076
5076
  } else {
5077
5077
  if (!value) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {});
5078
5078
  const lines = value.split("\n");
5079
- return value && value.includes("\n") ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: ui.cls("overflow-x-scroll", size === "tiny" ? "text-sm" : ""), children: lines.map((str, index) => /* @__PURE__ */ jsxRuntime.jsxs(React.Fragment, { children: [
5079
+ return value && value.includes("\n") ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: ui.cls("overflow-x-scroll", size === "smallest" ? "text-sm" : ""), children: lines.map((str, index) => /* @__PURE__ */ jsxRuntime.jsxs(React.Fragment, { children: [
5080
5080
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: str }),
5081
5081
  index !== lines.length - 1 && /* @__PURE__ */ jsxRuntime.jsx("br", {})
5082
- ] }, `string_preview_${index}`)) }) : size === "tiny" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: value }) : /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: value });
5082
+ ] }, `string_preview_${index}`)) }) : size === "smallest" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: value }) : /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: value });
5083
5083
  }
5084
5084
  }
5085
5085
  function ArrayPropertyPreview({
@@ -5102,7 +5102,7 @@
5102
5102
  throw Error("Picked wrong preview component ArrayPreview");
5103
5103
  const values = value;
5104
5104
  if (!values) return null;
5105
- const childSize = size === "medium" ? "small" : "tiny";
5105
+ const childSize = size === "medium" ? "small" : "smallest";
5106
5106
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: values && values.map(
5107
5107
  (value2, index) => {
5108
5108
  const of = property.resolvedProperties[index] ?? (property.resolvedProperties[index] ?? (Array.isArray(property.of) ? property.of[index] : property.of));
@@ -5165,17 +5165,17 @@
5165
5165
  hover: disabled ? void 0 : hover,
5166
5166
  size,
5167
5167
  children: [
5168
- imageProperty && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ui.cls("w-10 h-10 mr-2 shrink-0 grow-0", size === "tiny" ? "my-0.5" : "m-2 self-start"), children: /* @__PURE__ */ jsxRuntime.jsx(
5168
+ imageProperty && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ui.cls("w-10 h-10 mr-2 shrink-0 grow-0", size === "smallest" ? "my-0.5" : "m-2 self-start"), children: /* @__PURE__ */ jsxRuntime.jsx(
5169
5169
  PropertyPreview,
5170
5170
  {
5171
5171
  property: imageProperty,
5172
5172
  propertyKey: imagePropertyKey,
5173
- size: "tiny",
5173
+ size: "smallest",
5174
5174
  value: getValueInPath(entity.values, imagePropertyKey)
5175
5175
  }
5176
5176
  ) }),
5177
5177
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col flex-grow w-full m-1", children: [
5178
- size !== "tiny" && includeId && (entity ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${size !== "medium" ? "block whitespace-nowrap overflow-hidden truncate" : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx(
5178
+ size !== "smallest" && includeId && (entity ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${size !== "medium" ? "block whitespace-nowrap overflow-hidden truncate" : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx(
5179
5179
  ui.Typography,
5180
5180
  {
5181
5181
  variant: "caption",
@@ -5212,13 +5212,13 @@
5212
5212
  propertyKey: key,
5213
5213
  value: getValueInPath(entity.values, key),
5214
5214
  property: childProperty,
5215
- size: "tiny"
5215
+ size: "smallest"
5216
5216
  }
5217
5217
  ) : /* @__PURE__ */ jsxRuntime.jsx(
5218
5218
  SkeletonPropertyComponent,
5219
5219
  {
5220
5220
  property: childProperty,
5221
- size: "tiny"
5221
+ size: "smallest"
5222
5222
  }
5223
5223
  )
5224
5224
  },
@@ -5230,7 +5230,7 @@
5230
5230
  ui.Tooltip,
5231
5231
  {
5232
5232
  title: `See details for ${entity.id}`,
5233
- className: size !== "tiny" ? "self-start" : "",
5233
+ className: size !== "smallest" ? "self-start" : "",
5234
5234
  children: /* @__PURE__ */ jsxRuntime.jsx(
5235
5235
  ui.IconButton,
5236
5236
  {
@@ -5284,7 +5284,7 @@
5284
5284
  fullwidth ? "w-full" : "",
5285
5285
  "items-center",
5286
5286
  hover ? "hover:bg-slate-50 dark:hover:bg-gray-800 group-hover:bg-slate-50 dark:group-hover:bg-gray-800" : "",
5287
- size === "tiny" ? "p-1" : "p-2",
5287
+ size === "smallest" ? "p-1" : "p-2",
5288
5288
  "flex border rounded-lg",
5289
5289
  onClick ? "cursor-pointer" : "",
5290
5290
  ui.defaultBorderMixin,
@@ -5465,7 +5465,7 @@
5465
5465
  }
5466
5466
  if (property?.dataType !== "array" || !property.of || property.of.dataType !== "reference")
5467
5467
  throw Error("Picked wrong preview component ArrayOfReferencesPreview");
5468
- const childSize = size === "medium" ? "small" : "tiny";
5468
+ const childSize = size === "medium" ? "small" : "smallest";
5469
5469
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col w-full", children: value && value.map(
5470
5470
  (reference, index) => {
5471
5471
  const ofProperty = property.of;
@@ -5508,7 +5508,7 @@
5508
5508
  }
5509
5509
  if (property.dataType !== "array" || !property.of || property.of.dataType !== "string")
5510
5510
  throw Error("Picked wrong preview component ArrayOfStorageComponentsPreview");
5511
- const childSize = size === "medium" ? "small" : "tiny";
5511
+ const childSize = size === "medium" ? "small" : "smallest";
5512
5512
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: value && value.map(
5513
5513
  (v, index) => /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary, { children: /* @__PURE__ */ jsxRuntime.jsx(
5514
5514
  PropertyPreview,
@@ -5622,7 +5622,7 @@
5622
5622
  }
5623
5623
  const values = value;
5624
5624
  if (!values) return null;
5625
- const childSize = size === "medium" ? "small" : "tiny";
5625
+ const childSize = size === "medium" ? "small" : "smallest";
5626
5626
  const typeField = property.oneOf.typeField ?? DEFAULT_ONE_OF_TYPE;
5627
5627
  const valueField = property.oneOf.valueField ?? DEFAULT_ONE_OF_VALUE;
5628
5628
  const properties = property.oneOf.properties;
@@ -5660,7 +5660,7 @@
5660
5660
  }
5661
5661
  if (!value) return null;
5662
5662
  const mapPropertyKeys = Object.keys(mapProperty.properties);
5663
- if (size === "tiny")
5663
+ if (size === "smallest")
5664
5664
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full flex flex-col space-y-1 md:space-y-2", children: mapPropertyKeys.map((key, index) => /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(
5665
5665
  ErrorBoundary,
5666
5666
  {
@@ -5820,7 +5820,7 @@
5820
5820
  property.name && /* @__PURE__ */ jsxRuntime.jsx(
5821
5821
  "span",
5822
5822
  {
5823
- className: ui.cls("text-text-secondary dark:text-text-secondary-dark", size === "tiny" ? "text-sm" : ""),
5823
+ className: ui.cls("text-text-secondary dark:text-text-secondary-dark", size === "smallest" ? "text-sm" : ""),
5824
5824
  children: property.name
5825
5825
  }
5826
5826
  )
@@ -7217,7 +7217,7 @@
7217
7217
  ReferencePreview,
7218
7218
  {
7219
7219
  onClick: disabled ? void 0 : handleOpen,
7220
- size: "tiny",
7220
+ size: "smallest",
7221
7221
  reference,
7222
7222
  hover: !disabled,
7223
7223
  disabled: !path,
@@ -12449,7 +12449,7 @@
12449
12449
  ReferencePreview,
12450
12450
  {
12451
12451
  reference,
12452
- size: "tiny"
12452
+ size: "smallest"
12453
12453
  },
12454
12454
  reference.path + "/" + reference.id
12455
12455
  );
@@ -13770,7 +13770,8 @@
13770
13770
  autoFocus,
13771
13771
  touched,
13772
13772
  property,
13773
- includeDescription
13773
+ includeDescription,
13774
+ size = "medium"
13774
13775
  }) {
13775
13776
  const enumValues = property.enumValues;
13776
13777
  useClearRestoreValue({
@@ -13787,6 +13788,7 @@
13787
13788
  /* @__PURE__ */ jsxRuntime.jsx(
13788
13789
  ui.Select,
13789
13790
  {
13791
+ size: size === "medium" ? "medium" : "small",
13790
13792
  value: value !== void 0 && value != null ? value.toString() : "",
13791
13793
  disabled,
13792
13794
  position: "item-aligned",
@@ -13817,7 +13819,7 @@
13817
13819
  {
13818
13820
  enumKey,
13819
13821
  enumValues,
13820
- size: "medium"
13822
+ size
13821
13823
  }
13822
13824
  );
13823
13825
  },
@@ -13831,7 +13833,7 @@
13831
13833
  {
13832
13834
  enumKey: String(option.id),
13833
13835
  enumValues,
13834
- size: "medium"
13836
+ size
13835
13837
  }
13836
13838
  )
13837
13839
  },
@@ -13861,6 +13863,7 @@
13861
13863
  disabled,
13862
13864
  property,
13863
13865
  includeDescription,
13866
+ size = "medium",
13864
13867
  autoFocus
13865
13868
  }) {
13866
13869
  const of = property.of;
@@ -13919,6 +13922,7 @@
13919
13922
  /* @__PURE__ */ jsxRuntime.jsx(
13920
13923
  ui.MultiSelect,
13921
13924
  {
13925
+ size: size === "medium" ? "medium" : "small",
13922
13926
  value: validValue ? value.map((v) => v.toString()) : [],
13923
13927
  disabled,
13924
13928
  label: /* @__PURE__ */ jsxRuntime.jsx(
@@ -14528,7 +14532,8 @@
14528
14532
  disabled,
14529
14533
  autoFocus,
14530
14534
  property,
14531
- includeDescription
14535
+ includeDescription,
14536
+ size = "medium"
14532
14537
  }) {
14533
14538
  let multiline;
14534
14539
  let url;
@@ -14566,6 +14571,7 @@
14566
14571
  /* @__PURE__ */ jsxRuntime.jsx(
14567
14572
  ui.TextField,
14568
14573
  {
14574
+ size,
14569
14575
  value,
14570
14576
  onChange,
14571
14577
  autoFocus,
@@ -14611,7 +14617,7 @@
14611
14617
  {
14612
14618
  value,
14613
14619
  property,
14614
- size: "medium"
14620
+ size
14615
14621
  }
14616
14622
  )
14617
14623
  }
@@ -14626,7 +14632,7 @@
14626
14632
  showError,
14627
14633
  autoFocus,
14628
14634
  disabled,
14629
- touched,
14635
+ size = "medium",
14630
14636
  property,
14631
14637
  includeDescription
14632
14638
  }, ref) {
@@ -14652,7 +14658,7 @@
14652
14658
  ),
14653
14659
  disabled,
14654
14660
  autoFocus,
14655
- size: "large"
14661
+ size
14656
14662
  }
14657
14663
  ),
14658
14664
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -14786,7 +14792,7 @@
14786
14792
  autoFocus,
14787
14793
  property,
14788
14794
  includeDescription,
14789
- context
14795
+ size = "medium"
14790
14796
  }) {
14791
14797
  if (!property.path) {
14792
14798
  throw new Error("Property path is required for ReferenceFieldBinding");
@@ -14844,7 +14850,7 @@
14844
14850
  disabled: !property.path,
14845
14851
  previewProperties: property.previewProperties,
14846
14852
  hover: !disabled,
14847
- size: "medium",
14853
+ size,
14848
14854
  onClick: disabled || isSubmitting ? void 0 : onEntryClick,
14849
14855
  reference: value,
14850
14856
  includeEntityLink: property.includeEntityLink,
@@ -14855,7 +14861,7 @@
14855
14861
  EntityPreviewContainer,
14856
14862
  {
14857
14863
  className: ui.cls(
14858
- "p-6 text-sm font-medium flex items-center gap-6",
14864
+ "px-6 h-16 text-sm font-medium flex items-center gap-6",
14859
14865
  disabled || isSubmitting ? "text-slate-500" : "cursor-pointer text-slate-700 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-gray-800 group-hover:bg-slate-50 dark:group-hover:bg-gray-800"
14860
14866
  ),
14861
14867
  onClick: onEntryClick,
@@ -14886,6 +14892,9 @@
14886
14892
  if (a.index !== b.index) {
14887
14893
  return false;
14888
14894
  }
14895
+ if (a.size !== b.size) {
14896
+ return false;
14897
+ }
14889
14898
  const aIsBuilder = isPropertyBuilder(a.property) || a.property.fromBuilder;
14890
14899
  const bIsBuilder = isPropertyBuilder(b.property) || b.property.fromBuilder;
14891
14900
  const baseCheck = (aIsBuilder === bIsBuilder || equal(a.property, b.property)) && a.disabled === b.disabled;
@@ -14907,7 +14916,8 @@
14907
14916
  partOfArray,
14908
14917
  minimalistView,
14909
14918
  autoFocus,
14910
- index
14919
+ index,
14920
+ size
14911
14921
  }) {
14912
14922
  const customizationController = useCustomizationController();
14913
14923
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -14969,7 +14979,8 @@
14969
14979
  disabled,
14970
14980
  partOfArray,
14971
14981
  minimalistView,
14972
- autoFocus
14982
+ autoFocus,
14983
+ size
14973
14984
  };
14974
14985
  return /* @__PURE__ */ jsxRuntime.jsx(
14975
14986
  FieldInternal,
@@ -14995,7 +15006,8 @@
14995
15006
  minimalistView,
14996
15007
  autoFocus,
14997
15008
  context,
14998
- disabled
15009
+ disabled,
15010
+ size
14999
15011
  },
15000
15012
  fieldProps
15001
15013
  }) {
@@ -15026,7 +15038,6 @@
15026
15038
  const cmsFieldProps = {
15027
15039
  propertyKey,
15028
15040
  value,
15029
- // initialValue,
15030
15041
  setValue,
15031
15042
  setFieldValue,
15032
15043
  error,
@@ -15041,7 +15052,8 @@
15041
15052
  minimalistView: minimalistView ?? false,
15042
15053
  autoFocus: autoFocus ?? false,
15043
15054
  customProps: customFieldProps,
15044
- context
15055
+ context,
15056
+ size
15045
15057
  };
15046
15058
  return /* @__PURE__ */ jsxRuntime.jsxs(ErrorBoundary, { children: [
15047
15059
  /* @__PURE__ */ jsxRuntime.jsx(UsedComponent, { ...cmsFieldProps }),