@openameba/spindle-ui 3.2.5 → 3.2.7

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 (6) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/HeroCarousel/HeroCarousel.d.ts.map +1 -1
  3. package/HeroCarousel/HeroCarousel.js +2 -2
  4. package/HeroCarousel/HeroCarousel.js.map +1 -1
  5. package/HeroCarousel/HeroCarousel.mjs +2 -2
  6. package/package.json +14 -14
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # Change Log
2
2
 
3
+ ## 3.2.7
4
+
5
+ ### Patch Changes
6
+
7
+ - [#2157](https://github.com/openameba/spindle/pull/2157) [`711a604`](https://github.com/openameba/spindle/commit/711a604cbd88f212062da8b5415f1ddad1a13f21) Thanks [@yanagi0602](https://github.com/yanagi0602)! - Fix infinite re-render ("Maximum update depth exceeded") in `useAutoSlide` / `HeroCarousel` when `autoplay` is enabled. The timeout id is now held in a ref instead of state so the auto-slide callbacks stay stable and the mount effect no longer re-runs on every commit. Surfaced under React 19.
8
+
9
+ - Updated dependencies [[`711a604`](https://github.com/openameba/spindle/commit/711a604cbd88f212062da8b5415f1ddad1a13f21)]:
10
+ - @openameba/spindle-hooks@1.11.1
11
+
12
+ ## 3.2.6
13
+
14
+ ### Patch Changes
15
+
16
+ - [#2136](https://github.com/openameba/spindle/pull/2136) [`c1fe032`](https://github.com/openameba/spindle/commit/c1fe03200092d88f862e622e161f93c4f60e8917) Thanks [@yanagi0602](https://github.com/yanagi0602)! - Add `itemKeys` to `useCarousel` return value so consumers can render `itemsToRender` without React duplicate-key warnings caused by head/tail clones. `HeroCarousel` now uses these stable keys instead of `item.link`.
17
+
18
+ - Updated dependencies [[`c1fe032`](https://github.com/openameba/spindle/commit/c1fe03200092d88f862e622e161f93c4f60e8917)]:
19
+ - @openameba/spindle-hooks@1.11.0
20
+
3
21
  ## 3.2.5
4
22
 
5
23
  ### Patch Changes
package/HeroCarousel/HeroCarousel.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"HeroCarousel.d.ts","sourceRoot":"","sources":["../../src/HeroCarousel/HeroCarousel.tsx"],"names":[],"mappings":"AACA,OAAc,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAKvC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAGvD,KAAK,KAAK,GAAG;IACX,YAAY,EAAE,YAAY,EAAE,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAKF,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,KAAK,CA8FjC,CAAC"}
1
+ {"version":3,"file":"HeroCarousel.d.ts","sourceRoot":"","sources":["../../src/HeroCarousel/HeroCarousel.tsx"],"names":[],"mappings":"AACA,OAAc,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAKvC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAGvD,KAAK,KAAK,GAAG;IACX,YAAY,EAAE,YAAY,EAAE,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAKF,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,KAAK,CA+FjC,CAAC"}
package/HeroCarousel/HeroCarousel.js CHANGED
@@ -14,7 +14,7 @@ const HeroCarouselItem_1 = __importDefault(require("./HeroCarouselItem"));
14
14
  const BLOCK_NAME = 'spui-HeroCarousel';
15
15
  const ITEM_LINK_CLASS_NAME = 'js-auto-play-carousel-item-link';
16
16
  exports.HeroCarousel = react_1.default.memo(function HeroCarousel({ carouselList, autoplay = true, }) {
17
- const { handleSlideToPrev, handleSlideToNext, handleMouseEnter, handleMouseDown, handleMouseLeave, handleTouchStart, handleTransitionEnd, isAutoPlaying, isLinkClicked, itemsToRender, listRef, listStyles, toggleAutoPlay, handleFocus, handleBlur, } = (0, spindle_hooks_1.useCarousel)({
17
+ const { handleSlideToPrev, handleSlideToNext, handleMouseEnter, handleMouseDown, handleMouseLeave, handleTouchStart, handleTransitionEnd, isAutoPlaying, isLinkClicked, itemsToRender, itemKeys, listRef, listStyles, toggleAutoPlay, handleFocus, handleBlur, } = (0, spindle_hooks_1.useCarousel)({
18
18
  items: carouselList,
19
19
  itemLinkClassName: ITEM_LINK_CLASS_NAME,
20
20
  shouldAutoPlaying: autoplay,
@@ -24,7 +24,7 @@ exports.HeroCarousel = react_1.default.memo(function HeroCarousel({ carouselList
24
24
  }
25
25
  return (react_1.default.createElement("div", null,
26
26
  react_1.default.createElement("div", { role: "region", className: `${BLOCK_NAME}-container`, "aria-label": "\u30AB\u30EB\u30FC\u30BB\u30EB", onBlur: handleBlur, onFocus: handleFocus, onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onTouchStart: handleTouchStart, onTransitionEnd: handleTransitionEnd },
27
- react_1.default.createElement("ul", { "aria-roledescription": "\u30AB\u30EB\u30FC\u30BB\u30EB", className: `${BLOCK_NAME}-list`, ref: listRef, style: listStyles }, itemsToRender.map((item) => (react_1.default.createElement(HeroCarouselItem_1.default, { carouselItem: item, isLinkClicked: isLinkClicked, itemLinkClassName: ITEM_LINK_CLASS_NAME, key: item.link }))))),
27
+ react_1.default.createElement("ul", { "aria-roledescription": "\u30AB\u30EB\u30FC\u30BB\u30EB", className: `${BLOCK_NAME}-list`, ref: listRef, style: listStyles }, itemsToRender.map((item, index) => (react_1.default.createElement(HeroCarouselItem_1.default, { carouselItem: item, isLinkClicked: isLinkClicked, itemLinkClassName: ITEM_LINK_CLASS_NAME, key: itemKeys[index] }))))),
28
28
  react_1.default.createElement("div", { className: `${BLOCK_NAME}-controls` },
29
29
  react_1.default.createElement("button", { "aria-label": "1\u3064\u524D\u306E\u30A2\u30A4\u30C6\u30E0\u306B\u79FB\u52D5", className: `${BLOCK_NAME}-control ${BLOCK_NAME}-control--prev`, type: "button", onClick: handleSlideToPrev },
30
30
  react_1.default.createElement(ChevronLeftBold_1.default, { "aria-hidden": true })),
package/HeroCarousel/HeroCarousel.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"HeroCarousel.js","sourceRoot":"","sources":["../../src/HeroCarousel/HeroCarousel.tsx"],"names":[],"mappings":";;;;;;AAAA,4DAAuD;AACvD,kDAAuC;AACvC,8EAAsD;AACtD,gFAAwD;AACxD,0DAAkC;AAClC,gEAAwC;AAExC,0EAAkD;AAOlD,MAAM,UAAU,GAAG,mBAAmB,CAAC;AACvC,MAAM,oBAAoB,GAAG,iCAAiC,CAAC;AAElD,QAAA,YAAY,GAAc,eAAK,CAAC,IAAI,CAAC,SAAS,YAAY,CAAC,EACtE,YAAY,EACZ,QAAQ,GAAG,IAAI,GAChB;IACC,MAAM,EACJ,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,mBAAmB,EACnB,aAAa,EACb,aAAa,EACb,aAAa,EACb,OAAO,EACP,UAAU,EACV,cAAc,EACd,WAAW,EACX,UAAU,GACX,GAAG,IAAA,2BAAW,EAAC;QACd,KAAK,EAAE,YAAY;QACnB,iBAAiB,EAAE,oBAAoB;QACvC,iBAAiB,EAAE,QAAQ;KAC5B,CAAC,CAAC;IAEH,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC9B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL;QAEE,uCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,GAAG,UAAU,YAAY,gBACzB,gCAAO,EAClB,MAAM,EAAE,UAAU,EAClB,OAAO,EAAE,WAAW,EACpB,WAAW,EAAE,eAAe,EAC5B,YAAY,EAAE,gBAAgB,EAC9B,YAAY,EAAE,gBAAgB,EAC9B,YAAY,EAAE,gBAAgB,EAC9B,eAAe,EAAE,mBAAmB;YAEpC,8DACuB,gCAAO,EAC5B,SAAS,EAAE,GAAG,UAAU,OAAO,EAC/B,GAAG,EAAE,OAAO,EACZ,KAAK,EAAE,UAAU,IAEhB,aAAa,CAAC,GAAG,CAAC,CAAC,IAAkB,EAAE,EAAE,CAAC,CACzC,8BAAC,0BAAgB,IACf,YAAY,EAAE,IAAI,EAClB,aAAa,EAAE,aAAa,EAC5B,iBAAiB,EAAE,oBAAoB,EACvC,GAAG,EAAE,IAAI,CAAC,IAAI,GACd,CACH,CAAC,CACC,CACD;QAEN,uCAAK,SAAS,EAAE,GAAG,UAAU,WAAW;YACtC,wDACa,+DAAa,EACxB,SAAS,EAAE,GAAG,UAAU,YAAY,UAAU,gBAAgB,EAC9D,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,iBAAiB;gBAE1B,8BAAC,yBAAe,mBAAc,IAAI,GAAI,CAC/B;YACT,wDACc,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACjD,SAAS,EAAE,GAAG,UAAU,UAAU,EAClC,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,cAAc,IAEtB,aAAa,CAAC,CAAC,CAAC,CACf,8BAAC,eAAK,mBAAc,IAAI,GAAI,CAC7B,CAAC,CAAC,CAAC,CACF,8BAAC,kBAAQ,mBAAc,IAAI,GAAI,CAChC,CACM;YACT,wDACa,qEAAc,EACzB,SAAS,EAAE,GAAG,UAAU,YAAY,UAAU,gBAAgB,EAC9D,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,iBAAiB;gBAE1B,8BAAC,0BAAgB,mBAAc,IAAI,GAAI,CAChC,CACL,CACF,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}
1
+ {"version":3,"file":"HeroCarousel.js","sourceRoot":"","sources":["../../src/HeroCarousel/HeroCarousel.tsx"],"names":[],"mappings":";;;;;;AAAA,4DAAuD;AACvD,kDAAuC;AACvC,8EAAsD;AACtD,gFAAwD;AACxD,0DAAkC;AAClC,gEAAwC;AAExC,0EAAkD;AAOlD,MAAM,UAAU,GAAG,mBAAmB,CAAC;AACvC,MAAM,oBAAoB,GAAG,iCAAiC,CAAC;AAElD,QAAA,YAAY,GAAc,eAAK,CAAC,IAAI,CAAC,SAAS,YAAY,CAAC,EACtE,YAAY,EACZ,QAAQ,GAAG,IAAI,GAChB;IACC,MAAM,EACJ,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,mBAAmB,EACnB,aAAa,EACb,aAAa,EACb,aAAa,EACb,QAAQ,EACR,OAAO,EACP,UAAU,EACV,cAAc,EACd,WAAW,EACX,UAAU,GACX,GAAG,IAAA,2BAAW,EAAC;QACd,KAAK,EAAE,YAAY;QACnB,iBAAiB,EAAE,oBAAoB;QACvC,iBAAiB,EAAE,QAAQ;KAC5B,CAAC,CAAC;IAEH,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC9B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL;QAEE,uCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,GAAG,UAAU,YAAY,gBACzB,gCAAO,EAClB,MAAM,EAAE,UAAU,EAClB,OAAO,EAAE,WAAW,EACpB,WAAW,EAAE,eAAe,EAC5B,YAAY,EAAE,gBAAgB,EAC9B,YAAY,EAAE,gBAAgB,EAC9B,YAAY,EAAE,gBAAgB,EAC9B,eAAe,EAAE,mBAAmB;YAEpC,8DACuB,gCAAO,EAC5B,SAAS,EAAE,GAAG,UAAU,OAAO,EAC/B,GAAG,EAAE,OAAO,EACZ,KAAK,EAAE,UAAU,IAEhB,aAAa,CAAC,GAAG,CAAC,CAAC,IAAkB,EAAE,KAAa,EAAE,EAAE,CAAC,CACxD,8BAAC,0BAAgB,IACf,YAAY,EAAE,IAAI,EAClB,aAAa,EAAE,aAAa,EAC5B,iBAAiB,EAAE,oBAAoB,EACvC,GAAG,EAAE,QAAQ,CAAC,KAAK,CAAC,GACpB,CACH,CAAC,CACC,CACD;QAEN,uCAAK,SAAS,EAAE,GAAG,UAAU,WAAW;YACtC,wDACa,+DAAa,EACxB,SAAS,EAAE,GAAG,UAAU,YAAY,UAAU,gBAAgB,EAC9D,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,iBAAiB;gBAE1B,8BAAC,yBAAe,mBAAc,IAAI,GAAI,CAC/B;YACT,wDACc,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACjD,SAAS,EAAE,GAAG,UAAU,UAAU,EAClC,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,cAAc,IAEtB,aAAa,CAAC,CAAC,CAAC,CACf,8BAAC,eAAK,mBAAc,IAAI,GAAI,CAC7B,CAAC,CAAC,CAAC,CACF,8BAAC,kBAAQ,mBAAc,IAAI,GAAI,CAChC,CACM;YACT,wDACa,qEAAc,EACzB,SAAS,EAAE,GAAG,UAAU,YAAY,UAAU,gBAAgB,EAC9D,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,iBAAiB;gBAE1B,8BAAC,0BAAgB,mBAAc,IAAI,GAAI,CAChC,CACL,CACF,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}
package/HeroCarousel/HeroCarousel.mjs CHANGED
@@ -8,7 +8,7 @@ import HeroCarouselItem from "./HeroCarouselItem.mjs";
8
8
  const BLOCK_NAME = 'spui-HeroCarousel';
9
9
  const ITEM_LINK_CLASS_NAME = 'js-auto-play-carousel-item-link';
10
10
  export const HeroCarousel = React.memo(function HeroCarousel({ carouselList, autoplay = true, }) {
11
- const { handleSlideToPrev, handleSlideToNext, handleMouseEnter, handleMouseDown, handleMouseLeave, handleTouchStart, handleTransitionEnd, isAutoPlaying, isLinkClicked, itemsToRender, listRef, listStyles, toggleAutoPlay, handleFocus, handleBlur, } = useCarousel({
11
+ const { handleSlideToPrev, handleSlideToNext, handleMouseEnter, handleMouseDown, handleMouseLeave, handleTouchStart, handleTransitionEnd, isAutoPlaying, isLinkClicked, itemsToRender, itemKeys, listRef, listStyles, toggleAutoPlay, handleFocus, handleBlur, } = useCarousel({
12
12
  items: carouselList,
13
13
  itemLinkClassName: ITEM_LINK_CLASS_NAME,
14
14
  shouldAutoPlaying: autoplay,
@@ -18,7 +18,7 @@ export const HeroCarousel = React.memo(function HeroCarousel({ carouselList, aut
18
18
  }
19
19
  return (React.createElement("div", null,
20
20
  React.createElement("div", { role: "region", className: `${BLOCK_NAME}-container`, "aria-label": "\u30AB\u30EB\u30FC\u30BB\u30EB", onBlur: handleBlur, onFocus: handleFocus, onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onTouchStart: handleTouchStart, onTransitionEnd: handleTransitionEnd },
21
- React.createElement("ul", { "aria-roledescription": "\u30AB\u30EB\u30FC\u30BB\u30EB", className: `${BLOCK_NAME}-list`, ref: listRef, style: listStyles }, itemsToRender.map((item) => (React.createElement(HeroCarouselItem, { carouselItem: item, isLinkClicked: isLinkClicked, itemLinkClassName: ITEM_LINK_CLASS_NAME, key: item.link }))))),
21
+ React.createElement("ul", { "aria-roledescription": "\u30AB\u30EB\u30FC\u30BB\u30EB", className: `${BLOCK_NAME}-list`, ref: listRef, style: listStyles }, itemsToRender.map((item, index) => (React.createElement(HeroCarouselItem, { carouselItem: item, isLinkClicked: isLinkClicked, itemLinkClassName: ITEM_LINK_CLASS_NAME, key: itemKeys[index] }))))),
22
22
  React.createElement("div", { className: `${BLOCK_NAME}-controls` },
23
23
  React.createElement("button", { "aria-label": "1\u3064\u524D\u306E\u30A2\u30A4\u30C6\u30E0\u306B\u79FB\u52D5", className: `${BLOCK_NAME}-control ${BLOCK_NAME}-control--prev`, type: "button", onClick: handleSlideToPrev },
24
24
  React.createElement(ChevronLeftBold, { "aria-hidden": true })),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@openameba/spindle-ui",
3
- "version": "3.2.5",
3
+ "version": "3.2.7",
4
4
  "main": "./index.js",
5
5
  "module": "./index.mjs",
6
6
  "types": "./index.d.ts",
@@ -29,23 +29,23 @@
29
29
  "dependencies": {
30
30
  "ameba-color-palette.css": "^4.17.0",
31
31
  "use-callback-ref": "^1.3.3",
32
- "@openameba/spindle-hooks": "^1.10.2"
32
+ "@openameba/spindle-hooks": "^1.11.1"
33
33
  },
34
34
  "devDependencies": {
35
- "@figma/code-connect": "1.4.4",
36
- "@storybook/addon-a11y": "10.3.6",
37
- "@storybook/addon-docs": "10.3.6",
35
+ "@figma/code-connect": "1.4.7",
36
+ "@storybook/addon-a11y": "10.4.1",
37
+ "@storybook/addon-docs": "10.4.1",
38
38
  "@storybook/addon-mcp": "0.6.0",
39
39
  "@storybook/addon-webpack5-compiler-swc": "4.0.3",
40
- "@storybook/react": "10.3.6",
41
- "@storybook/react-webpack5": "10.3.6",
40
+ "@storybook/react": "10.4.1",
41
+ "@storybook/react-webpack5": "10.4.1",
42
42
  "@svgr/cli": "8.1.0",
43
43
  "@testing-library/dom": "10.4.1",
44
44
  "@testing-library/jest-dom": "6.9.1",
45
45
  "@testing-library/react": "16.3.2",
46
46
  "@testing-library/user-event": "14.6.1",
47
- "@types/react": "19.2.14",
48
- "@vitest/ui": "4.1.5",
47
+ "@types/react": "19.2.15",
48
+ "@vitest/ui": "4.1.7",
49
49
  "@vscode/web-custom-data": "0.6.3",
50
50
  "autoprefixer": "10.5.0",
51
51
  "bundlewatch": "0.4.2",
@@ -53,9 +53,9 @@
53
53
  "dialog-polyfill": "0.5.6",
54
54
  "dotenv": "17.4.2",
55
55
  "figma-api": "1.12.0",
56
- "firebase-tools": "15.17.0",
56
+ "firebase-tools": "15.19.1",
57
57
  "jsdom": "29.1.1",
58
- "postcss": "8.5.14",
58
+ "postcss": "8.5.15",
59
59
  "postcss-cli": "11.0.1",
60
60
  "postcss-import": "16.1.1",
61
61
  "react": "19.2.6",
@@ -65,13 +65,13 @@
65
65
  "reg-publish-gcs-plugin": "0.14.4",
66
66
  "reg-suit": "0.14.5",
67
67
  "scaffdog": "4.1.0",
68
- "storybook": "10.3.6",
68
+ "storybook": "10.4.1",
69
69
  "stylelint": "16.26.1",
70
70
  "stylelint-config-standard": "39.0.1",
71
71
  "stylelint-order": "8.1.1",
72
72
  "stylelint-selector-bem-pattern": "4.0.1",
73
- "tsx": "4.21.0",
74
- "vitest": "4.1.5"
73
+ "tsx": "4.22.4",
74
+ "vitest": "4.1.7"
75
75
  },
76
76
  "scripts": {
77
77
  "generate": "scaffdog generate",