@gxpl/sdk 0.0.58 → 0.0.59
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.
|
@@ -6,7 +6,6 @@ const ItemState_schema_1 = require("./ItemState.schema");
|
|
|
6
6
|
const RichTextItem_schema_1 = require("./RichTextItem.schema");
|
|
7
7
|
const ItemBase_schema_1 = require("./ItemBase.schema");
|
|
8
8
|
const ArticleItemType_1 = require("../../types/article/ArticleItemType");
|
|
9
|
-
const ItemArea_1 = require("../../types/article/ItemArea");
|
|
10
9
|
const FillLayer_schema_1 = require("./FillLayer.schema");
|
|
11
10
|
const pointerEvents = zod_1.z.enum(['never', 'when_visible', 'always']).optional();
|
|
12
11
|
exports.FXControlSchema = zod_1.z.discriminatedUnion('type', [
|
|
@@ -154,7 +153,6 @@ const CodeEmbedItemSchema = ItemBase_schema_1.ItemBaseSchema.extend({
|
|
|
154
153
|
html: zod_1.z.string(),
|
|
155
154
|
scale: zod_1.z.boolean(),
|
|
156
155
|
iframe: zod_1.z.boolean(),
|
|
157
|
-
areaAnchor: zod_1.z.nativeEnum(ItemArea_1.AreaAnchor),
|
|
158
156
|
opacity: zod_1.z.number().nonnegative(),
|
|
159
157
|
blur: zod_1.z.number(),
|
|
160
158
|
isDraggable: zod_1.z.boolean().optional(),
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { RichTextBlock, RichTextStyle, TextAlign, TextTransform, VerticalAlign } from './RichText';
|
|
2
2
|
import { ArticleItemType } from './ArticleItemType';
|
|
3
|
-
import {
|
|
3
|
+
import { ItemArea } from './ItemArea';
|
|
4
4
|
import { ItemState } from './ItemState';
|
|
5
5
|
import { FXControlAny } from './FX';
|
|
6
6
|
import { CompoundSettings } from './CompoundSettings';
|
|
@@ -103,7 +103,6 @@ interface CodeEmbedParams extends ParamsBase {
|
|
|
103
103
|
html: string;
|
|
104
104
|
scale: boolean;
|
|
105
105
|
iframe: boolean;
|
|
106
|
-
areaAnchor: AreaAnchor;
|
|
107
106
|
opacity: number;
|
|
108
107
|
blur: number;
|
|
109
108
|
isDraggable?: boolean;
|
|
@@ -15,7 +15,7 @@ const getStyleFromItemStateAndParams_1 = require("../../../utils/getStyleFromIte
|
|
|
15
15
|
const getFill_1 = require("../../../utils/getFill");
|
|
16
16
|
const areFillsVisible_1 = require("../../../utils/areFillsVisible/areFillsVisible");
|
|
17
17
|
const RectangleItem = ({ item, sectionId, onResize, interactionCtrl, onVisibilityChange }) => {
|
|
18
|
-
var _a, _b, _c, _d, _e, _f, _g, _h
|
|
18
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
19
19
|
const id = (0, react_1.useId)();
|
|
20
20
|
const { fill: itemFill, radius: itemRadius, strokeWidth: itemStrokeWidth, strokeFill: itemStrokeFill, blur: itemBlur, backdropBlur: itemBackdropBlur } = (0, useRectangleItem_1.useRectangleItem)(item, sectionId);
|
|
21
21
|
const itemAngle = (0, useItemAngle_1.useItemAngle)(item, sectionId);
|
|
@@ -33,16 +33,16 @@ const RectangleItem = ({ item, sectionId, onResize, interactionCtrl, onVisibilit
|
|
|
33
33
|
const angle = (0, getStyleFromItemStateAndParams_1.getStyleFromItemStateAndParams)(styles === null || styles === void 0 ? void 0 : styles.angle, itemAngle);
|
|
34
34
|
const blur = (0, getStyleFromItemStateAndParams_1.getStyleFromItemStateAndParams)(styles === null || styles === void 0 ? void 0 : styles.blur, itemBlur);
|
|
35
35
|
const backdropFilterValue = backdropBlur ? `blur(${backdropBlur * 100}vw)` : undefined;
|
|
36
|
-
const isInteractive = (0, areFillsVisible_1.areFillsVisible)((_f = stateFillLayers !== null && stateFillLayers !== void 0 ? stateFillLayers : itemFill) !== null && _f !== void 0 ? _f : []) || (strokeWidth !== 0 && (0, areFillsVisible_1.areFillsVisible)(
|
|
36
|
+
const isInteractive = (0, areFillsVisible_1.areFillsVisible)((_f = stateFillLayers !== null && stateFillLayers !== void 0 ? stateFillLayers : itemFill) !== null && _f !== void 0 ? _f : []) || (strokeWidth !== 0 && (0, areFillsVisible_1.areFillsVisible)(strokeFill ? [strokeFill] : itemStrokeFill !== null && itemStrokeFill !== void 0 ? itemStrokeFill : []));
|
|
37
37
|
(0, react_1.useEffect)(() => {
|
|
38
38
|
onVisibilityChange === null || onVisibilityChange === void 0 ? void 0 : onVisibilityChange(isInteractive);
|
|
39
39
|
}, [isInteractive, onVisibilityChange]);
|
|
40
40
|
const stroke = strokeFill
|
|
41
|
-
? (
|
|
41
|
+
? (_g = (0, getFill_1.getFill)(strokeFill)) !== null && _g !== void 0 ? _g : 'transparent'
|
|
42
42
|
: 'transparent';
|
|
43
43
|
return ((0, jsx_runtime_1.jsx)(LinkWrapper_1.LinkWrapper, { link: item.link, children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: `rectangle-${item.id}`, ref: setRef, style: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (angle !== undefined ? { transform: `rotate(${angle}deg)` } : {})), (blur !== undefined ? { filter: `blur(${blur * 100}vw)` } : {})), { willChange: blur !== 0 && blur !== undefined ? 'transform' : 'unset' }), (backdropFilterValue !== undefined
|
|
44
44
|
? { backdropFilter: backdropFilterValue, WebkitBackdropFilter: backdropFilterValue }
|
|
45
|
-
: {})), { transition: (
|
|
45
|
+
: {})), { transition: (_h = stateParams === null || stateParams === void 0 ? void 0 : stateParams.transition) !== null && _h !== void 0 ? _h : 'none' }), children: itemFill && itemFill.map((fill, i) => {
|
|
46
46
|
var _a, _b;
|
|
47
47
|
const stateFillLayer = stateFillLayers === null || stateFillLayers === void 0 ? void 0 : stateFillLayers.find((layer) => layer.id === fill.id);
|
|
48
48
|
const value = stateFillLayer
|