@cntrl-site/sdk-nextjs 0.15.5-1 → 0.15.5-2

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 (5) hide show
  1. package/cntrl-site-sdk-nextjs-0.15.5-1.tgz +0 -0
  2. package/cntrl-site-sdk-nextjs-0.15.5-2.tgz +0 -0
  3. package/lib/components/Item.js +4 -2
  4. package/package.json +1 -1
  5. package/src/components/Item.tsx +16 -11
package/cntrl-site-sdk-nextjs-0.15.5-1.tgz CHANGED
Binary file
package/lib/components/Item.js CHANGED
@@ -79,7 +79,7 @@ const Item = ({ item, sectionId }) => {
79
79
  ? { transformOrigin: 'top left', transform: 'scale(var(--layout-deviation))' }
80
80
  : {};
81
81
  const styles = Object.assign(Object.assign({}, scaleIfRichText), { top: stickyTop });
82
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `item-wrapper-${item.id}`, style: isInitialRef.current ? {} : Object.assign({ top, left }, (wrapperHeight ? { height: `${wrapperHeight * 100}vw` } : {})) }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ suppressHydrationWarning: true, className: `item-${item.id}`, style: isInitialRef.current ? {} : styles }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ style: {
82
+ return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `item-wrapper-${item.id}`, style: isInitialRef.current ? {} : Object.assign({ top, left }, (wrapperHeight ? { height: `${wrapperHeight * 100}vw` } : {})) }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ suppressHydrationWarning: true, className: `item-${item.id}`, style: isInitialRef.current ? {} : styles }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `item-${item.id}-inner`, style: {
83
83
  width: `${sizingAxis.x === sdk_1.ArticleItemSizingType.Manual
84
84
  ? isRichText
85
85
  ? `${width * exemplary}px`
@@ -103,6 +103,8 @@ const Item = ({ item, sectionId }) => {
103
103
  --webkit-backface-visibility: hidden;
104
104
  cursor: ${hoverParams ? 'pointer' : 'default'};
105
105
  visibility: ${hidden ? 'hidden' : 'visible'};
106
+ }
107
+ .item-${item.id}-inner {
106
108
  transition: ${(0, HoverStyles_1.getTransitions)(['width', 'height', 'scale'], hoverParams)};
107
109
  }
108
110
  .item-wrapper-${item.id} {
@@ -116,7 +118,7 @@ const Item = ({ item, sectionId }) => {
116
118
  height: ${sticky ? `${getStickyItemWrapperHeight(sticky, area.height) * 100}vw` : 'unset'};
117
119
  transition: ${(0, HoverStyles_1.getTransitions)(['left', 'top'], hoverParams)};
118
120
  }
119
- .item-${item.id}:hover {
121
+ .item-${item.id}-inner:hover {
120
122
  ${(0, HoverStyles_1.getHoverStyles)(['width', 'height', 'scale'], hoverParams)}
121
123
  }
122
124
  .item-wrapper-${item.id}:hover {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cntrl-site/sdk-nextjs",
3
- "version": "0.15.5-1",
3
+ "version": "0.15.5-2",
4
4
  "description": "SDK for Next.js",
5
5
  "main": "lib/index.js",
6
6
  "types": "src/index.ts",
package/src/components/Item.tsx CHANGED
@@ -107,16 +107,19 @@ export const Item: FC<ItemProps<TArticleItemAny>> = ({ item, sectionId}) => {
107
107
  className={`item-${item.id}`}
108
108
  style={isInitialRef.current ? {} : styles }
109
109
  >
110
- <div style={{
111
- width: `${sizingAxis.x === SizingType.Manual
112
- ? isRichText
113
- ? `${width * exemplary}px`
114
- : `${width * 100}vw`
115
- : 'max-content'}`,
116
- height: `${sizingAxis.y === SizingType.Manual ? `${height * 100}vw` : 'unset'}`,
117
- transform: `scale(${scale})`,
118
- transformOrigin: ScaleAnchorMap[scaleAnchor]
119
- }}>
110
+ <div
111
+ className={`item-${item.id}-inner`}
112
+ style={{
113
+ width: `${sizingAxis.x === SizingType.Manual
114
+ ? isRichText
115
+ ? `${width * exemplary}px`
116
+ : `${width * 100}vw`
117
+ : 'max-content'}`,
118
+ height: `${sizingAxis.y === SizingType.Manual ? `${height * 100}vw` : 'unset'}`,
119
+ transform: `scale(${scale})`,
120
+ transformOrigin: ScaleAnchorMap[scaleAnchor]
121
+ }}
122
+ >
120
123
  <ItemComponent item={item} sectionId={sectionId} onResize={handleItemResize} />
121
124
  </div>
122
125
  </div>
@@ -135,6 +138,8 @@ export const Item: FC<ItemProps<TArticleItemAny>> = ({ item, sectionId}) => {
135
138
  --webkit-backface-visibility: hidden;
136
139
  cursor: ${hoverParams ? 'pointer' : 'default'};
137
140
  visibility: ${hidden ? 'hidden' : 'visible'};
141
+ }
142
+ .item-${item.id}-inner {
138
143
  transition: ${getTransitions(['width', 'height', 'scale'], hoverParams)};
139
144
  }
140
145
  .item-wrapper-${item.id} {
@@ -148,7 +153,7 @@ export const Item: FC<ItemProps<TArticleItemAny>> = ({ item, sectionId}) => {
148
153
  height: ${sticky ? `${getStickyItemWrapperHeight(sticky, area.height) * 100}vw` : 'unset'};
149
154
  transition: ${getTransitions(['left', 'top'], hoverParams)};
150
155
  }
151
- .item-${item.id}:hover {
156
+ .item-${item.id}-inner:hover {
152
157
  ${getHoverStyles(['width', 'height', 'scale'], hoverParams)}
153
158
  }
154
159
  .item-wrapper-${item.id}:hover {