@propeller-commerce/propeller-v2-react-ui 0.8.0 → 0.9.0

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.
package/CHANGELOG.md CHANGED
@@ -8,6 +8,20 @@ once it reaches 1.0. Until then (the `0.x` line) the public API may change
8
8
  between minor versions; breaking changes are called out below and in
9
9
  [MIGRATION.md](./MIGRATION.md).
10
10
 
11
+ ## [0.9.0] - 2026-07-29
12
+
13
+ ### Changed
14
+
15
+ - **Align with `@propeller-commerce/propeller-sdk-v2` 0.14.0**, which removed the
16
+ entire deprecated schema surface. Category reads move to the plural localized
17
+ arrays — `Breadcrumbs` (`category.names` / `slugs`), `CategoryDescription`
18
+ (`descriptions`), `CategoryShortDescription` (`shortDescriptions`) — and the
19
+ hand-written menu query in `useMenu` now selects `names(language:)` /
20
+ `slugs(language:)`. `useClusterConfigurator` / `useProductInfo` read
21
+ `ClusterConfigSetting.attributeName` and `uuid` (were `name` / `id`); the
22
+ public `ConfiguredSetting.id` is now a `string`. Bumped the SDK dev dependency
23
+ to `^0.14.0` and `propeller-v2-core-ui` to `^0.4.0`; the runtime peer stays `*`.
24
+
11
25
  ## [0.8.0] - 2026-07-28
12
26
 
13
27
  ### Added
package/dist/index.cjs CHANGED
@@ -1127,7 +1127,7 @@ function useClusterConfigurator(options) {
1127
1127
  const previousSelections = {};
1128
1128
  for (let i = 0; i < settingIndex; i++) {
1129
1129
  const prev = sortedSettings[i];
1130
- if (selections[prev.name]) previousSelections[prev.name] = selections[prev.name];
1130
+ if (selections[prev.attributeName]) previousSelections[prev.attributeName] = selections[prev.attributeName];
1131
1131
  }
1132
1132
  const matching = propellerV2CoreUi.filterProductsBySelections(products, previousSelections);
1133
1133
  return propellerV2CoreUi.collectAttributeValues(matching, attributeName);
@@ -1136,43 +1136,43 @@ function useClusterConfigurator(options) {
1136
1136
  const sortedSettings = getSortedSettings();
1137
1137
  const sel = selectedAttributes;
1138
1138
  return sortedSettings.map((setting, index) => {
1139
- const availableValues = getAvailableValuesForIndexWithSelections(setting.name, index, sel);
1140
- const selectedValue = sel[setting.name] || "";
1141
- const isPreviousMissing = index > 0 && sortedSettings.slice(0, index).some((prev) => !sel[prev.name]);
1139
+ const availableValues = getAvailableValuesForIndexWithSelections(setting.attributeName, index, sel);
1140
+ const selectedValue = sel[setting.attributeName] || "";
1141
+ const isPreviousMissing = index > 0 && sortedSettings.slice(0, index).some((prev) => !sel[prev.attributeName]);
1142
1142
  const isDisabled = availableValues.length === 0 || isPreviousMissing;
1143
- let displayName = setting.name;
1143
+ let displayName = setting.attributeName;
1144
1144
  let attributeType;
1145
1145
  for (const product of products) {
1146
1146
  const items = product.attributes?.items;
1147
1147
  if (!items) continue;
1148
- const match = items.find((a) => propellerV2CoreUi.attributeNameMatches(a, setting.name));
1148
+ const match = items.find((a) => propellerV2CoreUi.attributeNameMatches(a, setting.attributeName));
1149
1149
  if (!match) continue;
1150
- displayName = propellerV2CoreUi.getAttributeDisplayName(match, language) || setting.name;
1150
+ displayName = propellerV2CoreUi.getAttributeDisplayName(match, language) || setting.attributeName;
1151
1151
  attributeType = match.attributeDescription?.type ?? void 0;
1152
1152
  break;
1153
1153
  }
1154
- return { id: setting.id, name: setting.name, displayType: setting.displayType, attributeType, priority: setting.priority, displayName, availableValues, selectedValue, disabled: isDisabled };
1154
+ return { id: setting.uuid, name: setting.attributeName, displayType: setting.displayType, attributeType, priority: setting.priority, displayName, availableValues, selectedValue, disabled: isDisabled };
1155
1155
  });
1156
1156
  }, [products, config, selectedAttributes, language]);
1157
1157
  const handleAttributeSelect = React6.useCallback(
1158
1158
  (settingName, value) => {
1159
1159
  const sortedSettings = getSortedSettings();
1160
- const changedIndex = sortedSettings.findIndex((s) => s.name === settingName);
1160
+ const changedIndex = sortedSettings.findIndex((s) => s.attributeName === settingName);
1161
1161
  if (changedIndex < 0) return;
1162
1162
  const newSelections = { ...selectedAttributes };
1163
1163
  newSelections[settingName] = value;
1164
- for (let i = changedIndex + 1; i < sortedSettings.length; i++) delete newSelections[sortedSettings[i].name];
1164
+ for (let i = changedIndex + 1; i < sortedSettings.length; i++) delete newSelections[sortedSettings[i].attributeName];
1165
1165
  for (let i = changedIndex + 1; i < sortedSettings.length; i++) {
1166
1166
  const next = sortedSettings[i];
1167
- const available = getAvailableValuesForIndexWithSelections(next.name, i, newSelections);
1167
+ const available = getAvailableValuesForIndexWithSelections(next.attributeName, i, newSelections);
1168
1168
  if (available.length > 0) {
1169
- newSelections[next.name] = available[0];
1169
+ newSelections[next.attributeName] = available[0];
1170
1170
  } else {
1171
1171
  break;
1172
1172
  }
1173
1173
  }
1174
1174
  setSelectedAttributes(newSelections);
1175
- const allSelected = sortedSettings.every((s) => !!newSelections[s.name]);
1175
+ const allSelected = sortedSettings.every((s) => !!newSelections[s.attributeName]);
1176
1176
  if (allSelected) {
1177
1177
  const matching = propellerV2CoreUi.filterProductsBySelections(products, newSelections);
1178
1178
  if (matching.length > 0 && onConfigurationChange) onConfigurationChange(matching[0]);
@@ -1188,15 +1188,15 @@ function useClusterConfigurator(options) {
1188
1188
  if (!attrItems) return;
1189
1189
  const initial = {};
1190
1190
  for (const setting of sortedSettings) {
1191
- const match = attrItems.find((a) => propellerV2CoreUi.attributeNameMatches(a, setting.name));
1191
+ const match = attrItems.find((a) => propellerV2CoreUi.attributeNameMatches(a, setting.attributeName));
1192
1192
  if (match) {
1193
1193
  const values = propellerV2CoreUi.extractAttributeValues(match);
1194
- if (values.length) initial[setting.name] = values[0];
1194
+ if (values.length) initial[setting.attributeName] = values[0];
1195
1195
  }
1196
1196
  }
1197
1197
  if (!Object.keys(initial).length) return;
1198
1198
  setSelectedAttributes(initial);
1199
- const allSelected = sortedSettings.every((s) => !!initial[s.name]);
1199
+ const allSelected = sortedSettings.every((s) => !!initial[s.attributeName]);
1200
1200
  if (allSelected && onConfigurationChange) {
1201
1201
  const matching = propellerV2CoreUi.filterProductsBySelections(products, initial);
1202
1202
  if (matching.length > 0) onConfigurationChange(matching[0]);
@@ -1532,15 +1532,15 @@ function buildCategoriesQuery(depth) {
1532
1532
  categories {
1533
1533
  categoryId
1534
1534
  hidden
1535
- name(language: $language) { value language }
1536
- slug(language: $language) { value }
1535
+ names(language: $language) { value language }
1536
+ slugs(language: $language) { value }
1537
1537
  ${buildCategoriesQuery(depth - 1)}
1538
1538
  }
1539
1539
  `;
1540
1540
  }
1541
1541
  function mapCategory(raw, language) {
1542
- const nameEntry = raw.name?.find((n) => n.language === language) ?? raw.name?.[0];
1543
- const slugEntry = raw.slug?.[0];
1542
+ const nameEntry = raw.names?.find((n) => n.language === language) ?? raw.names?.[0];
1543
+ const slugEntry = raw.slugs?.[0];
1544
1544
  return {
1545
1545
  categoryId: raw.categoryId,
1546
1546
  name: nameEntry?.value ?? "",
@@ -1620,8 +1620,8 @@ function useMenu(options) {
1620
1620
  category(categoryId: $categoryId) {
1621
1621
  categoryId
1622
1622
  hidden
1623
- name(language: $language) { value language }
1624
- slug(language: $language) { value }
1623
+ names(language: $language) { value language }
1624
+ slugs(language: $language) { value }
1625
1625
  ${buildCategoriesQuery(depth)}
1626
1626
  }
1627
1627
  }
@@ -2080,7 +2080,7 @@ function useProductInfo(options) {
2080
2080
  const service = propellerV2CoreUi.createServices(graphqlClient).cluster;
2081
2081
  const clusterConfig = await service.getClusterConfig(clusterId);
2082
2082
  const attributeNames = (clusterConfig?.config?.settings ?? []).map(
2083
- (setting) => setting.name
2083
+ (setting) => setting.attributeName
2084
2084
  );
2085
2085
  const variables = {
2086
2086
  clusterId,
@@ -6175,8 +6175,8 @@ function Breadcrumbs(props) {
6175
6175
  }
6176
6176
  const displayItems = props.showCurrent === false && items.length > 0 ? items.slice(0, items.length - 1) : items;
6177
6177
  function getCategoryName(cat) {
6178
- const match = cat.name?.find((n) => n.language === lang);
6179
- return match?.value || cat.name?.[0]?.value || "";
6178
+ const match = cat.names?.find((n) => n.language === lang);
6179
+ return match?.value || cat.names?.[0]?.value || "";
6180
6180
  }
6181
6181
  function getCategoryUrl(cat, index) {
6182
6182
  if (props.getUrl) return props.getUrl(cat, index);
@@ -6184,7 +6184,7 @@ function Breadcrumbs(props) {
6184
6184
  if (urls && typeof urls.getCategoryUrl === "function") {
6185
6185
  return urls.getCategoryUrl(cat, props.language);
6186
6186
  }
6187
- const slug = cat.slug?.find((s) => s.language === lang)?.value || cat.slug?.[0]?.value || "";
6187
+ const slug = cat.slugs?.find((s) => s.language === lang)?.value || cat.slugs?.[0]?.value || "";
6188
6188
  return `/category/${cat.categoryId}/${slug}`;
6189
6189
  }
6190
6190
  function isCurrentItem(index) {
@@ -7874,7 +7874,7 @@ function CartSummary(rawProps) {
7874
7874
  var CartSummary_default = CartSummary;
7875
7875
  function CategoryDescription(props) {
7876
7876
  const [expanded, setExpanded] = React6.useState(false);
7877
- const match = props.category?.description?.find(
7877
+ const match = props.category?.descriptions?.find(
7878
7878
  (d) => d.language === props.language
7879
7879
  );
7880
7880
  const html = match?.value || "";
@@ -7915,7 +7915,7 @@ function CategoryDescription(props) {
7915
7915
  }
7916
7916
  var CategoryDescription_default = CategoryDescription;
7917
7917
  function CategoryShortDescription(props) {
7918
- const match = props.category?.shortDescription?.find(
7918
+ const match = props.category?.shortDescriptions?.find(
7919
7919
  (d) => d.language === props.language
7920
7920
  );
7921
7921
  const html = match?.value || "";
@@ -12808,7 +12808,7 @@ function Menu(rawProps) {
12808
12808
  const lang = props.language || "NL";
12809
12809
  const category = {
12810
12810
  categoryId: cat.categoryId,
12811
- slug: [{ value: cat.slug, language: lang }]
12811
+ slugs: [{ value: cat.slug, language: lang }]
12812
12812
  };
12813
12813
  if (props.getUrl) return props.getUrl(category);
12814
12814
  return props.configuration.urls.getCategoryUrl(category, lang);
@@ -12822,8 +12822,8 @@ function Menu(rawProps) {
12822
12822
  const lang = props.language || "NL";
12823
12823
  props.onMenuItemClick({
12824
12824
  categoryId: cat.categoryId,
12825
- name: [{ value: cat.name, language: lang }],
12826
- slug: [{ value: cat.slug, language: lang }]
12825
+ names: [{ value: cat.name, language: lang }],
12826
+ slugs: [{ value: cat.slug, language: lang }]
12827
12827
  });
12828
12828
  }
12829
12829
  }