@plasmicapp/react-web 0.2.103 → 0.2.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.
- package/dist/all.d.ts +495 -106
- package/dist/index-common.d.ts +2 -1
- package/dist/plume/menu-button/menu-trigger.d.ts +1 -1
- package/dist/plume/select/index.d.ts +1 -0
- package/dist/plume/triggered-overlay/index.d.ts +1 -0
- package/dist/react-web.cjs.development.js +302 -127
- package/dist/react-web.cjs.development.js.map +1 -1
- package/dist/react-web.cjs.production.min.js +1 -1
- package/dist/react-web.cjs.production.min.js.map +1 -1
- package/dist/react-web.esm.js +300 -129
- package/dist/react-web.esm.js.map +1 -1
- package/dist/render/PlasmicHead.d.ts +35 -0
- package/dist/render/ssr.d.ts +2 -1
- package/dist/render/triggers.d.ts +4 -4
- package/dist/states/index.d.ts +3 -1
- package/dist/stories/UseDollarState.stories.d.ts +7 -0
- package/package.json +20 -19
- package/skinny/dist/collection-utils-3487dd27.js +238 -0
- package/skinny/dist/collection-utils-3487dd27.js.map +1 -0
- package/skinny/dist/collection-utils-57c273dc.js +238 -0
- package/skinny/dist/collection-utils-57c273dc.js.map +1 -0
- package/skinny/dist/common-182a0b0c.js +201 -0
- package/skinny/dist/common-182a0b0c.js.map +1 -0
- package/skinny/dist/index-common.d.ts +2 -1
- package/skinny/dist/index.js +65 -45
- package/skinny/dist/index.js.map +1 -1
- package/skinny/dist/plume/button/index.js +5 -5
- package/skinny/dist/plume/button/index.js.map +1 -1
- package/skinny/dist/plume/checkbox/index.js +7 -7
- package/skinny/dist/plume/checkbox/index.js.map +1 -1
- package/skinny/dist/plume/menu/index.js +12 -12
- package/skinny/dist/plume/menu/index.js.map +1 -1
- package/skinny/dist/plume/menu-button/index.js +7 -7
- package/skinny/dist/plume/menu-button/index.js.map +1 -1
- package/skinny/dist/plume/menu-button/menu-trigger.d.ts +1 -1
- package/skinny/dist/plume/select/index.d.ts +1 -0
- package/skinny/dist/plume/select/index.js +13 -13
- package/skinny/dist/plume/select/index.js.map +1 -1
- package/skinny/dist/plume/switch/index.js +7 -7
- package/skinny/dist/plume/switch/index.js.map +1 -1
- package/skinny/dist/plume/text-input/index.js +5 -5
- package/skinny/dist/plume/text-input/index.js.map +1 -1
- package/skinny/dist/plume/triggered-overlay/index.d.ts +1 -0
- package/skinny/dist/plume/triggered-overlay/index.js +8 -7
- package/skinny/dist/plume/triggered-overlay/index.js.map +1 -1
- package/skinny/dist/plume-utils-623b91cc.js +35 -0
- package/skinny/dist/plume-utils-623b91cc.js.map +1 -0
- package/skinny/dist/props-utils-b2ad4997.js +8 -0
- package/skinny/dist/props-utils-b2ad4997.js.map +1 -0
- package/skinny/dist/react-utils-35cb2a4e.js +201 -0
- package/skinny/dist/react-utils-35cb2a4e.js.map +1 -0
- package/skinny/dist/render/PlasmicHead.d.ts +35 -0
- package/skinny/dist/render/PlasmicImg/index.js +3 -3
- package/skinny/dist/render/PlasmicImg/index.js.map +1 -1
- package/skinny/dist/render/ssr.d.ts +2 -1
- package/skinny/dist/render/triggers.d.ts +4 -4
- package/skinny/dist/ssr-14264281.js +158 -0
- package/skinny/dist/ssr-14264281.js.map +1 -0
- package/skinny/dist/ssr-579df58f.js +158 -0
- package/skinny/dist/ssr-579df58f.js.map +1 -0
- package/skinny/dist/ssr-9ebd98ed.js +158 -0
- package/skinny/dist/ssr-9ebd98ed.js.map +1 -0
- package/skinny/dist/ssr-d2fd94f2.js +31 -0
- package/skinny/dist/ssr-d2fd94f2.js.map +1 -0
- package/skinny/dist/states/index.d.ts +3 -1
- package/skinny/dist/stories/UseDollarState.stories.d.ts +7 -0
package/dist/react-web.esm.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import classNames$1 from 'classnames';
|
|
2
2
|
import * as React from 'react';
|
|
3
|
-
import React__default, { forwardRef, createElement, Fragment, isValidElement,
|
|
3
|
+
import React__default, { forwardRef, createElement, Fragment, isValidElement, useContext, createContext, useState, useRef, useMemo, useImperativeHandle, useCallback, cloneElement } from 'react';
|
|
4
4
|
import ReactDOM__default, { createPortal } from 'react-dom';
|
|
5
5
|
import { SSRProvider, useIsSSR as useIsSSR$1 } from '@react-aria/ssr';
|
|
6
6
|
import { useFocusRing, useFocusable, FocusScope } from '@react-aria/focus';
|
|
@@ -804,6 +804,83 @@ function ensureGlobalVariants(globalVariantValues) {
|
|
|
804
804
|
return globalVariantValues;
|
|
805
805
|
}
|
|
806
806
|
|
|
807
|
+
var PlasmicHeadContext = /*#__PURE__*/createContext(undefined);
|
|
808
|
+
function PlasmicHead(props) {
|
|
809
|
+
var Head = useContext(PlasmicHeadContext);
|
|
810
|
+
|
|
811
|
+
if (!Head) {
|
|
812
|
+
console.warn("Plasmic: Head meta tags are being ignored. To make them work, pass a Head component into PlasmicRootProvider."); // TODO: Link to doc about Head.
|
|
813
|
+
|
|
814
|
+
return null;
|
|
815
|
+
}
|
|
816
|
+
|
|
817
|
+
return createElement(Head, null, props.image ? createElement(Fragment, null, createElement("meta", {
|
|
818
|
+
name: "twitter:card",
|
|
819
|
+
content: "summary_large_image"
|
|
820
|
+
}), createElement("meta", {
|
|
821
|
+
key: "og:image",
|
|
822
|
+
property: "og:image",
|
|
823
|
+
content: props.image
|
|
824
|
+
}), createElement("meta", {
|
|
825
|
+
key: "twitter:image",
|
|
826
|
+
name: "twitter:image",
|
|
827
|
+
content: props.image
|
|
828
|
+
})) : createElement("meta", {
|
|
829
|
+
name: "twitter:card",
|
|
830
|
+
content: "summary"
|
|
831
|
+
}), props.title && createElement(Fragment, null, createElement("title", {
|
|
832
|
+
key: "title"
|
|
833
|
+
}, props.title), createElement("meta", {
|
|
834
|
+
key: "og:title",
|
|
835
|
+
property: "og:title",
|
|
836
|
+
content: props.title
|
|
837
|
+
}), createElement("meta", {
|
|
838
|
+
key: "twitter:title",
|
|
839
|
+
property: "twitter:title",
|
|
840
|
+
content: props.title
|
|
841
|
+
})), props.description && createElement(Fragment, null, createElement("meta", {
|
|
842
|
+
key: "description",
|
|
843
|
+
name: "description",
|
|
844
|
+
content: props.description
|
|
845
|
+
}), createElement("meta", {
|
|
846
|
+
key: "og:description",
|
|
847
|
+
property: "og:description",
|
|
848
|
+
content: props.description
|
|
849
|
+
}), createElement("meta", {
|
|
850
|
+
key: "twitter:description",
|
|
851
|
+
name: "twitter:description",
|
|
852
|
+
content: props.description
|
|
853
|
+
})), props.canonical && createElement("link", {
|
|
854
|
+
ref: "canonical",
|
|
855
|
+
href: props.canonical
|
|
856
|
+
}));
|
|
857
|
+
}
|
|
858
|
+
var plasmicHeadMeta = {
|
|
859
|
+
name: "hostless-plasmic-head",
|
|
860
|
+
displayName: "Head",
|
|
861
|
+
description: "Used to add page metadata to HEAD tag",
|
|
862
|
+
importName: "PlasmicHead",
|
|
863
|
+
importPath: "@plasmicapp/react-web",
|
|
864
|
+
props: {
|
|
865
|
+
title: {
|
|
866
|
+
type: "string",
|
|
867
|
+
displayName: "Title"
|
|
868
|
+
},
|
|
869
|
+
description: {
|
|
870
|
+
type: "string",
|
|
871
|
+
displayName: "Description"
|
|
872
|
+
},
|
|
873
|
+
image: {
|
|
874
|
+
type: "imageUrl",
|
|
875
|
+
displayName: "Image"
|
|
876
|
+
},
|
|
877
|
+
canonical: {
|
|
878
|
+
type: "string",
|
|
879
|
+
displayName: "Canonical URL"
|
|
880
|
+
}
|
|
881
|
+
}
|
|
882
|
+
};
|
|
883
|
+
|
|
807
884
|
function PlasmicIcon(props) {
|
|
808
885
|
var PlasmicIconType = props.PlasmicIconType,
|
|
809
886
|
rest = _objectWithoutPropertiesLoose(props, ["PlasmicIconType"]);
|
|
@@ -1457,7 +1534,9 @@ function PlasmicRootProvider(props) {
|
|
|
1457
1534
|
value: context
|
|
1458
1535
|
}, createElement(SSRProvider, null, createElement(PlasmicTranslatorContext.Provider, {
|
|
1459
1536
|
value: props.translator
|
|
1460
|
-
},
|
|
1537
|
+
}, createElement(PlasmicHeadContext.Provider, {
|
|
1538
|
+
value: props.Head
|
|
1539
|
+
}, children))));
|
|
1461
1540
|
}
|
|
1462
1541
|
var useIsSSR = useIsSSR$1;
|
|
1463
1542
|
function useHasPlasmicRoot() {
|
|
@@ -3167,8 +3246,8 @@ function mkProxy(specs, maybeHandlers) {
|
|
|
3167
3246
|
};
|
|
3168
3247
|
};
|
|
3169
3248
|
|
|
3170
|
-
var
|
|
3171
|
-
|
|
3249
|
+
var getNextParts = function getNextParts(currPath) {
|
|
3250
|
+
return Object.fromEntries(Object.values(specs).filter(function (spec) {
|
|
3172
3251
|
return shallowEqual(currPath.map(function (p) {
|
|
3173
3252
|
return isNum(p) ? "[]" : p;
|
|
3174
3253
|
}), spec.path.slice(0, currPath.length));
|
|
@@ -3178,16 +3257,74 @@ function mkProxy(specs, maybeHandlers) {
|
|
|
3178
3257
|
if (spec.path.length === currPath.length + 1) {
|
|
3179
3258
|
return [nextPart, {
|
|
3180
3259
|
isLast: true,
|
|
3181
|
-
|
|
3260
|
+
specKey: spec.pathStr
|
|
3182
3261
|
}];
|
|
3183
3262
|
} else {
|
|
3184
3263
|
return [nextPart, {
|
|
3185
3264
|
isLast: false,
|
|
3186
|
-
|
|
3265
|
+
specKey: spec.pathStr
|
|
3187
3266
|
}];
|
|
3188
3267
|
}
|
|
3189
3268
|
}));
|
|
3269
|
+
};
|
|
3270
|
+
/**
|
|
3271
|
+
* We use this function when we're setting a value in the middle of the state path.
|
|
3272
|
+
* We can't just set the value, because we need to keep the proxy properties, so
|
|
3273
|
+
* we use the specs to walk through the object and just set the value in the end of the path
|
|
3274
|
+
**/
|
|
3275
|
+
|
|
3276
|
+
|
|
3277
|
+
var cloneValue = function cloneValue(target, currPath, value) {
|
|
3278
|
+
if (typeof value !== "object") {
|
|
3279
|
+
return;
|
|
3280
|
+
}
|
|
3281
|
+
|
|
3282
|
+
var nextParts = getNextParts(currPath);
|
|
3283
|
+
|
|
3284
|
+
for (var _i = 0, _Object$entries = Object.entries(nextParts); _i < _Object$entries.length; _i++) {
|
|
3285
|
+
var _Object$entries$_i = _Object$entries[_i],
|
|
3286
|
+
nextPart = _Object$entries$_i[0],
|
|
3287
|
+
_Object$entries$_i$ = _Object$entries$_i[1],
|
|
3288
|
+
isLast = _Object$entries$_i$.isLast,
|
|
3289
|
+
specKey = _Object$entries$_i$.specKey;
|
|
3290
|
+
|
|
3291
|
+
if (nextPart === "[]" && Array.isArray(value)) {
|
|
3292
|
+
for (var i = 0; i < value.length; i++) {
|
|
3293
|
+
cloneValue(target[i], [].concat(currPath, [i]), value[i]);
|
|
3294
|
+
}
|
|
3295
|
+
} else if (nextPart in value) {
|
|
3296
|
+
if (isLast) {
|
|
3297
|
+
var _handlers$set, _handlers;
|
|
3298
|
+
|
|
3299
|
+
handlers == null ? void 0 : (_handlers$set = (_handlers = handlers({
|
|
3300
|
+
specKey: specKey,
|
|
3301
|
+
path: [].concat(currPath, [nextPart])
|
|
3302
|
+
})).set) == null ? void 0 : _handlers$set.call(_handlers, target, nextPart, value[nextPart], undefined);
|
|
3303
|
+
} else {
|
|
3304
|
+
cloneValue(target[nextPart], [].concat(currPath, [nextPart]), value[nextPart]);
|
|
3305
|
+
}
|
|
3306
|
+
}
|
|
3307
|
+
}
|
|
3308
|
+
};
|
|
3309
|
+
|
|
3310
|
+
var rec = function rec(currPath) {
|
|
3311
|
+
var nextParts = getNextParts(currPath);
|
|
3190
3312
|
return new Proxy("[]" in nextParts ? [] : {}, {
|
|
3313
|
+
deleteProperty: function deleteProperty(target, property) {
|
|
3314
|
+
if ("[]" in nextParts && isNum(property)) {
|
|
3315
|
+
var _handlers$deletePrope, _handlers2;
|
|
3316
|
+
|
|
3317
|
+
delete target[property];
|
|
3318
|
+
handlers == null ? void 0 : (_handlers$deletePrope = (_handlers2 = handlers({
|
|
3319
|
+
path: [].concat(currPath, [+property]),
|
|
3320
|
+
specKey: nextParts["[]"].specKey
|
|
3321
|
+
})).deleteProperty) == null ? void 0 : _handlers$deletePrope.call(_handlers2, target, property);
|
|
3322
|
+
} else {
|
|
3323
|
+
throw new Error("You can't delete a non-repeated property in the middle of the path");
|
|
3324
|
+
}
|
|
3325
|
+
|
|
3326
|
+
return true;
|
|
3327
|
+
},
|
|
3191
3328
|
get: function get(target, property, receiver) {
|
|
3192
3329
|
if ("[]" in nextParts && isNum(property)) {
|
|
3193
3330
|
if (!(property in target)) {
|
|
@@ -3195,12 +3332,12 @@ function mkProxy(specs, maybeHandlers) {
|
|
|
3195
3332
|
}
|
|
3196
3333
|
} else if (property in nextParts) {
|
|
3197
3334
|
if (nextParts[property].isLast) {
|
|
3198
|
-
var _handlers$get,
|
|
3335
|
+
var _handlers$get, _handlers3;
|
|
3199
3336
|
|
|
3200
|
-
return handlers == null ? void 0 : (_handlers$get = (
|
|
3337
|
+
return target[property] = handlers == null ? void 0 : (_handlers$get = (_handlers3 = handlers({
|
|
3201
3338
|
path: [].concat(currPath, [property]),
|
|
3202
|
-
|
|
3203
|
-
})).get) == null ? void 0 : _handlers$get.call(
|
|
3339
|
+
specKey: nextParts[property].specKey
|
|
3340
|
+
})).get) == null ? void 0 : _handlers$get.call(_handlers3, target, property, receiver);
|
|
3204
3341
|
} else if (!(property in target)) {
|
|
3205
3342
|
target[property] = rec([].concat(currPath, [property]));
|
|
3206
3343
|
}
|
|
@@ -3209,21 +3346,29 @@ function mkProxy(specs, maybeHandlers) {
|
|
|
3209
3346
|
return target[property];
|
|
3210
3347
|
},
|
|
3211
3348
|
set: function set(target, property, value, receiver) {
|
|
3212
|
-
if (
|
|
3349
|
+
if ("[]" in nextParts && isNum(property)) {
|
|
3350
|
+
if (!(property in target)) {
|
|
3351
|
+
target[property] = rec([].concat(currPath, [+property]));
|
|
3352
|
+
}
|
|
3353
|
+
} else if (property in nextParts) {
|
|
3213
3354
|
if (nextParts[property].isLast) {
|
|
3214
|
-
var _handlers$
|
|
3355
|
+
var _handlers$set2, _handlers$set3, _handlers4;
|
|
3215
3356
|
|
|
3216
|
-
|
|
3357
|
+
target[property] = value;
|
|
3358
|
+
return (_handlers$set2 = (_handlers$set3 = (_handlers4 = handlers({
|
|
3217
3359
|
path: [].concat(currPath, [property]),
|
|
3218
|
-
|
|
3219
|
-
})).set) == null ? void 0 : _handlers$
|
|
3220
|
-
} else {
|
|
3221
|
-
throw new Error("You can't set a value in the middle of the path");
|
|
3360
|
+
specKey: nextParts[property].specKey
|
|
3361
|
+
})).set) == null ? void 0 : _handlers$set3.call(_handlers4, target, property, value, receiver)) != null ? _handlers$set2 : false;
|
|
3222
3362
|
}
|
|
3223
|
-
}
|
|
3363
|
+
}
|
|
3364
|
+
|
|
3365
|
+
if (property === "registerInitFunc") {
|
|
3224
3366
|
target[property] = value;
|
|
3225
|
-
|
|
3367
|
+
} else if (typeof value === "object") {
|
|
3368
|
+
cloneValue(target[property], [].concat(currPath, [isNum(property) ? +property : property]), value);
|
|
3226
3369
|
}
|
|
3370
|
+
|
|
3371
|
+
return true;
|
|
3227
3372
|
}
|
|
3228
3373
|
});
|
|
3229
3374
|
};
|
|
@@ -3259,133 +3404,141 @@ var transformPathStringToObj = function transformPathStringToObj(str) {
|
|
|
3259
3404
|
};
|
|
3260
3405
|
|
|
3261
3406
|
function useVanillaDollarState(_specs, props) {
|
|
3262
|
-
var
|
|
3263
|
-
|
|
3264
|
-
|
|
3265
|
-
|
|
3266
|
-
|
|
3267
|
-
|
|
3268
|
-
|
|
3269
|
-
|
|
3270
|
-
|
|
3271
|
-
|
|
3272
|
-
|
|
3273
|
-
|
|
3274
|
-
|
|
3275
|
-
|
|
3276
|
-
var stateValues = mkProxy(specs);
|
|
3277
|
-
var initStates = {};
|
|
3278
|
-
|
|
3279
|
-
for (var _iterator = _createForOfIteratorHelperLoose(specs), _step; !(_step = _iterator()).done;) {
|
|
3280
|
-
var spec = _step.value;
|
|
3281
|
-
|
|
3282
|
-
if (spec.valueProp || spec.isRepeated) {
|
|
3283
|
-
continue;
|
|
3284
|
-
} else if (spec.initFunc) {
|
|
3285
|
-
dset(stateValues, spec.path, UNINITIALIZED);
|
|
3286
|
-
} else {
|
|
3287
|
-
var _spec$initVal;
|
|
3288
|
-
|
|
3289
|
-
dset(stateValues, spec.path, (_spec$initVal = spec.initVal) != null ? _spec$initVal : undefined);
|
|
3290
|
-
}
|
|
3291
|
-
|
|
3292
|
-
saveState({
|
|
3293
|
-
path: spec.path,
|
|
3294
|
-
spec: spec
|
|
3295
|
-
}, initStates);
|
|
3296
|
-
}
|
|
3297
|
-
|
|
3298
|
-
var deps = fillUninitializedStateValues(specs, props, stateValues, initStates);
|
|
3407
|
+
var forceRender = React__default.useState(0)[1];
|
|
3408
|
+
var $$state = React__default.useMemo(function () {
|
|
3409
|
+
var specs = Object.fromEntries(_specs.map(function (_ref2) {
|
|
3410
|
+
var pathStr = _ref2.path,
|
|
3411
|
+
spec = _objectWithoutPropertiesLoose(_ref2, ["path"]);
|
|
3412
|
+
|
|
3413
|
+
return [pathStr, _extends({}, spec, {
|
|
3414
|
+
pathStr: pathStr,
|
|
3415
|
+
path: transformPathStringToObj(pathStr),
|
|
3416
|
+
isRepeated: pathStr.split(".").some(function (part) {
|
|
3417
|
+
return part.endsWith("[]");
|
|
3418
|
+
})
|
|
3419
|
+
})];
|
|
3420
|
+
}));
|
|
3299
3421
|
return {
|
|
3300
|
-
stateValues:
|
|
3301
|
-
initStateDeps:
|
|
3302
|
-
initStateValues:
|
|
3303
|
-
states:
|
|
3422
|
+
stateValues: mkProxy(specs),
|
|
3423
|
+
initStateDeps: {},
|
|
3424
|
+
initStateValues: mkProxy(specs),
|
|
3425
|
+
states: {},
|
|
3426
|
+
specs: specs
|
|
3304
3427
|
};
|
|
3305
|
-
})
|
|
3306
|
-
|
|
3307
|
-
set$$State = _React$useState[1];
|
|
3308
|
-
|
|
3309
|
-
var $state = mkProxy(specs, function (state) {
|
|
3428
|
+
}, []);
|
|
3429
|
+
var $state = Object.assign(mkProxy($$state.specs, function (state) {
|
|
3310
3430
|
return {
|
|
3431
|
+
deleteProperty: function deleteProperty(_target, _property) {
|
|
3432
|
+
var prefixPath = state.path;
|
|
3433
|
+
|
|
3434
|
+
for (var _i2 = 0, _Object$entries2 = Object.entries($$state.states); _i2 < _Object$entries2.length; _i2++) {
|
|
3435
|
+
var _Object$entries2$_i = _Object$entries2[_i2],
|
|
3436
|
+
key = _Object$entries2$_i[0],
|
|
3437
|
+
existingState = _Object$entries2$_i[1];
|
|
3438
|
+
|
|
3439
|
+
if (existingState.path.length >= prefixPath.length && shallowEqual(existingState.path.slice(0, prefixPath.length), prefixPath)) {
|
|
3440
|
+
delete $$state.states[key];
|
|
3441
|
+
}
|
|
3442
|
+
}
|
|
3443
|
+
|
|
3444
|
+
forceRender(function (r) {
|
|
3445
|
+
return r + 1;
|
|
3446
|
+
});
|
|
3447
|
+
return true;
|
|
3448
|
+
},
|
|
3311
3449
|
get: function get(_target, _property) {
|
|
3312
|
-
|
|
3313
|
-
|
|
3314
|
-
|
|
3450
|
+
var spec = $$state.specs[state.specKey];
|
|
3451
|
+
|
|
3452
|
+
if (spec.valueProp) {
|
|
3453
|
+
if (!spec.isRepeated) {
|
|
3454
|
+
return props[spec.valueProp];
|
|
3315
3455
|
} else {
|
|
3316
|
-
return _get(props[
|
|
3456
|
+
return _get(props[spec.valueProp], state.path.slice(1));
|
|
3317
3457
|
}
|
|
3318
3458
|
}
|
|
3319
3459
|
|
|
3320
3460
|
if (!hasState(state, $$state.states)) {
|
|
3321
|
-
var
|
|
3461
|
+
var _spec$initVal;
|
|
3322
3462
|
|
|
3323
3463
|
saveState(state, $$state.states);
|
|
3324
3464
|
|
|
3325
|
-
dset($$state.stateValues, state.path,
|
|
3465
|
+
dset($$state.stateValues, state.path, spec.initFunc ? UNINITIALIZED : (_spec$initVal = spec.initVal) != null ? _spec$initVal : undefined);
|
|
3326
3466
|
|
|
3327
|
-
var deps =
|
|
3467
|
+
var deps = spec.initFunc ? fillUninitializedStateValues($$state.specs, props, $$state.stateValues, $$state.states) : {};
|
|
3328
3468
|
|
|
3329
3469
|
dset($$state.initStateValues, state.path, _get($$state.stateValues, state.path));
|
|
3330
3470
|
|
|
3331
|
-
|
|
3332
|
-
|
|
3333
|
-
|
|
3334
|
-
stateValues: cloneProxy(specs, prev.states, prev.initStateValues),
|
|
3335
|
-
initStateDeps: _extends({}, prev.initStateDeps, deps),
|
|
3336
|
-
states: _extends({}, prev.states)
|
|
3337
|
-
};
|
|
3471
|
+
$$state.initStateDeps = _extends({}, $$state.initStateDeps, deps);
|
|
3472
|
+
forceRender(function (r) {
|
|
3473
|
+
return r + 1;
|
|
3338
3474
|
});
|
|
3475
|
+
return spec.initFunc ? spec.initFunc(props, $state) : spec.initVal;
|
|
3339
3476
|
}
|
|
3340
3477
|
|
|
3341
3478
|
return _get($$state.stateValues, state.path);
|
|
3342
3479
|
},
|
|
3343
3480
|
set: function set(_target, _property, newValue) {
|
|
3344
|
-
saveState(state, $$state.states);
|
|
3345
|
-
|
|
3346
3481
|
if (newValue !== _get($$state.stateValues, state.path)) {
|
|
3482
|
+
saveState(state, $$state.states);
|
|
3483
|
+
|
|
3347
3484
|
dset($$state.stateValues, state.path, newValue);
|
|
3348
3485
|
|
|
3349
|
-
for (var
|
|
3350
|
-
var _Object$
|
|
3351
|
-
key = _Object$
|
|
3352
|
-
deps = _Object$
|
|
3486
|
+
for (var _i3 = 0, _Object$entries3 = Object.entries($$state.initStateDeps); _i3 < _Object$entries3.length; _i3++) {
|
|
3487
|
+
var _Object$entries3$_i = _Object$entries3[_i3],
|
|
3488
|
+
key = _Object$entries3$_i[0],
|
|
3489
|
+
deps = _Object$entries3$_i[1];
|
|
3353
3490
|
|
|
3354
3491
|
if (deps.includes(JSON.stringify(state.path))) {
|
|
3355
3492
|
dset($$state.stateValues, JSON.parse(key), UNINITIALIZED);
|
|
3356
3493
|
}
|
|
3357
3494
|
}
|
|
3358
3495
|
|
|
3359
|
-
var newDeps = fillUninitializedStateValues(specs, props, $$state.stateValues, $$state.states);
|
|
3360
|
-
|
|
3361
|
-
|
|
3362
|
-
|
|
3363
|
-
stateValues: cloneProxy(specs, prev.states, prev.stateValues),
|
|
3364
|
-
initStateDeps: _extends({}, prev.initStateDeps, newDeps),
|
|
3365
|
-
states: _extends({}, prev.states)
|
|
3366
|
-
};
|
|
3496
|
+
var newDeps = fillUninitializedStateValues($$state.specs, props, $$state.stateValues, $$state.states);
|
|
3497
|
+
$$state.initStateDeps = _extends({}, $$state.initStateDeps, newDeps);
|
|
3498
|
+
forceRender(function (r) {
|
|
3499
|
+
return r + 1;
|
|
3367
3500
|
});
|
|
3501
|
+
}
|
|
3368
3502
|
|
|
3369
|
-
|
|
3370
|
-
var _props$state$spec$onC;
|
|
3503
|
+
var spec = $$state.specs[state.specKey];
|
|
3371
3504
|
|
|
3372
|
-
|
|
3373
|
-
|
|
3505
|
+
if (spec.onChangeProp) {
|
|
3506
|
+
var _props$spec$onChangeP;
|
|
3507
|
+
|
|
3508
|
+
(_props$spec$onChangeP = props[spec.onChangeProp]) == null ? void 0 : _props$spec$onChangeP.call(props, newValue, state.path);
|
|
3374
3509
|
}
|
|
3375
3510
|
|
|
3376
3511
|
return true;
|
|
3377
3512
|
}
|
|
3378
3513
|
};
|
|
3514
|
+
}), {
|
|
3515
|
+
registerInitFunc: function registerInitFunc(pathStr, f) {
|
|
3516
|
+
if (Object.values($$state.states).filter(function (_ref3) {
|
|
3517
|
+
var specKey = _ref3.specKey;
|
|
3518
|
+
return specKey === pathStr;
|
|
3519
|
+
}).some(function (_ref4) {
|
|
3520
|
+
var path = _ref4.path;
|
|
3521
|
+
return _get($$state.stateValues, path) !== f(props, $state);
|
|
3522
|
+
})) {
|
|
3523
|
+
$$state.specs[pathStr] = _extends({}, $$state.specs[pathStr], {
|
|
3524
|
+
initFunc: f
|
|
3525
|
+
});
|
|
3526
|
+
forceRender(function (r) {
|
|
3527
|
+
return r + 1;
|
|
3528
|
+
});
|
|
3529
|
+
}
|
|
3530
|
+
}
|
|
3379
3531
|
}); // For each spec with an initFunc, evaluate it and see if
|
|
3380
3532
|
// the init value has changed. If so, reset its state.
|
|
3381
3533
|
|
|
3382
3534
|
var newStateValues = undefined;
|
|
3383
3535
|
var resetSpecs = [];
|
|
3384
3536
|
|
|
3385
|
-
for (var
|
|
3386
|
-
var _Object$values$_i = _Object$values[
|
|
3537
|
+
for (var _i4 = 0, _Object$values = Object.values($$state.states); _i4 < _Object$values.length; _i4++) {
|
|
3538
|
+
var _Object$values$_i = _Object$values[_i4],
|
|
3387
3539
|
path = _Object$values$_i.path,
|
|
3388
|
-
|
|
3540
|
+
specKey = _Object$values$_i.specKey;
|
|
3541
|
+
var spec = $$state.specs[specKey];
|
|
3389
3542
|
|
|
3390
3543
|
if (spec.initFunc) {
|
|
3391
3544
|
var newInit = spec.initFunc(props, $state);
|
|
@@ -3394,11 +3547,11 @@ function useVanillaDollarState(_specs, props) {
|
|
|
3394
3547
|
console.log("init changed for " + JSON.stringify(path) + " from " + _get($$state.initStateValues, path) + " to " + newInit + "; resetting state");
|
|
3395
3548
|
resetSpecs.push({
|
|
3396
3549
|
path: path,
|
|
3397
|
-
|
|
3550
|
+
specKey: specKey
|
|
3398
3551
|
});
|
|
3399
3552
|
|
|
3400
3553
|
if (!newStateValues) {
|
|
3401
|
-
newStateValues = cloneProxy(specs, $$state.states, $$state.stateValues);
|
|
3554
|
+
newStateValues = cloneProxy($$state.specs, $$state.states, $$state.stateValues);
|
|
3402
3555
|
}
|
|
3403
3556
|
|
|
3404
3557
|
dset(newStateValues, path, UNINITIALIZED);
|
|
@@ -3408,26 +3561,25 @@ function useVanillaDollarState(_specs, props) {
|
|
|
3408
3561
|
|
|
3409
3562
|
React__default.useLayoutEffect(function () {
|
|
3410
3563
|
if (newStateValues !== undefined) {
|
|
3411
|
-
var newDeps = fillUninitializedStateValues(specs, props, newStateValues, $$state.states);
|
|
3412
|
-
|
|
3413
|
-
|
|
3414
|
-
|
|
3415
|
-
var path = _ref3.path;
|
|
3564
|
+
var newDeps = fillUninitializedStateValues($$state.specs, props, newStateValues, $$state.states);
|
|
3565
|
+
var initStateValues = cloneProxy($$state.specs, $$state.states, $$state.initStateValues);
|
|
3566
|
+
resetSpecs.forEach(function (_ref5) {
|
|
3567
|
+
var path = _ref5.path;
|
|
3416
3568
|
|
|
3417
|
-
|
|
3418
|
-
|
|
3419
|
-
|
|
3420
|
-
|
|
3421
|
-
|
|
3422
|
-
|
|
3423
|
-
|
|
3424
|
-
};
|
|
3569
|
+
dset(initStateValues, path, _get(newStateValues, path));
|
|
3570
|
+
});
|
|
3571
|
+
$$state.stateValues = cloneProxy($$state.specs, $$state.states, newStateValues);
|
|
3572
|
+
$$state.initStateValues = initStateValues;
|
|
3573
|
+
$$state.initStateDeps = _extends({}, $$state.initStateDeps, newDeps);
|
|
3574
|
+
forceRender(function (r) {
|
|
3575
|
+
return r + 1;
|
|
3425
3576
|
});
|
|
3426
3577
|
|
|
3427
|
-
for (var
|
|
3428
|
-
var
|
|
3429
|
-
_path =
|
|
3430
|
-
|
|
3578
|
+
for (var _iterator = _createForOfIteratorHelperLoose(resetSpecs), _step; !(_step = _iterator()).done;) {
|
|
3579
|
+
var _step$value = _step.value,
|
|
3580
|
+
_path = _step$value.path,
|
|
3581
|
+
_specKey = _step$value.specKey;
|
|
3582
|
+
var _spec = $$state.specs[_specKey];
|
|
3431
3583
|
|
|
3432
3584
|
if (_spec.onChangeProp) {
|
|
3433
3585
|
var _props$_spec$onChange;
|
|
@@ -3437,21 +3589,38 @@ function useVanillaDollarState(_specs, props) {
|
|
|
3437
3589
|
}
|
|
3438
3590
|
}
|
|
3439
3591
|
}
|
|
3440
|
-
}, [newStateValues, props, resetSpecs, specs]);
|
|
3592
|
+
}, [newStateValues, props, resetSpecs, $$state.specs]);
|
|
3593
|
+
/* *
|
|
3594
|
+
* Initialize all known states. (we need to do it for repeated states
|
|
3595
|
+
* because they're created only after the first get/set operation)
|
|
3596
|
+
* If we don't initialize them, we won't be able to consume the repeated states properly.
|
|
3597
|
+
* For example, let's say the consumer is just mapping the repeated states. The first operation
|
|
3598
|
+
* is to get the length of the array which will always be 0 because the existing states
|
|
3599
|
+
* weren't allocated yet -- they're only stored in internal state)
|
|
3600
|
+
* */
|
|
3601
|
+
|
|
3602
|
+
for (var _i5 = 0, _Object$values2 = Object.values($$state.states); _i5 < _Object$values2.length; _i5++) {
|
|
3603
|
+
var _path2 = _Object$values2[_i5].path;
|
|
3604
|
+
|
|
3605
|
+
_get($state, _path2);
|
|
3606
|
+
}
|
|
3607
|
+
|
|
3441
3608
|
return $state;
|
|
3442
3609
|
}
|
|
3443
3610
|
|
|
3444
3611
|
function fillUninitializedStateValues(specs, props, stateValues, states) {
|
|
3445
3612
|
var stateAccessStack = [new Set()];
|
|
3446
3613
|
var initFuncDeps = {};
|
|
3447
|
-
var $state = mkProxy(specs, function (state) {
|
|
3614
|
+
var $state = Object.assign(mkProxy(specs, function (state) {
|
|
3448
3615
|
return {
|
|
3449
3616
|
get: function get(_target, _property) {
|
|
3450
|
-
|
|
3451
|
-
|
|
3452
|
-
|
|
3617
|
+
var spec = specs[state.specKey];
|
|
3618
|
+
|
|
3619
|
+
if (spec.valueProp) {
|
|
3620
|
+
if (!spec.isRepeated) {
|
|
3621
|
+
return props[spec.valueProp];
|
|
3453
3622
|
} else {
|
|
3454
|
-
return _get(props[
|
|
3623
|
+
return _get(props[spec.valueProp], state.path.slice(1));
|
|
3455
3624
|
}
|
|
3456
3625
|
}
|
|
3457
3626
|
|
|
@@ -3474,18 +3643,20 @@ function fillUninitializedStateValues(specs, props, stateValues, states) {
|
|
|
3474
3643
|
throw new Error("Cannot update state values during initialization");
|
|
3475
3644
|
}
|
|
3476
3645
|
};
|
|
3646
|
+
}), {
|
|
3647
|
+
registerInitFunc: function registerInitFunc() {}
|
|
3477
3648
|
});
|
|
3478
3649
|
|
|
3479
3650
|
function tracked(state) {
|
|
3480
3651
|
stateAccessStack.push(new Set());
|
|
3481
|
-
var res = state.
|
|
3652
|
+
var res = specs[state.specKey].initFunc(props, $state);
|
|
3482
3653
|
var deps = stateAccessStack.pop();
|
|
3483
3654
|
initFuncDeps[JSON.stringify(state.path)] = [].concat(deps.values());
|
|
3484
3655
|
return res;
|
|
3485
3656
|
}
|
|
3486
3657
|
|
|
3487
|
-
for (var
|
|
3488
|
-
var path = _Object$
|
|
3658
|
+
for (var _i6 = 0, _Object$values3 = Object.values(states); _i6 < _Object$values3.length; _i6++) {
|
|
3659
|
+
var path = _Object$values3[_i6].path;
|
|
3489
3660
|
|
|
3490
3661
|
if (_get(stateValues, path) === UNINITIALIZED) {
|
|
3491
3662
|
_get($state, path);
|
|
@@ -3495,5 +3666,5 @@ function fillUninitializedStateValues(specs, props, stateValues, states) {
|
|
|
3495
3666
|
return initFuncDeps;
|
|
3496
3667
|
}
|
|
3497
3668
|
|
|
3498
|
-
export { DropdownMenu, PlasmicIcon, PlasmicImg, PlasmicLink, PlasmicRootProvider, PlasmicSlot, Stack, Trans, classNames, createPlasmicElementProxy, createUseScreenVariants, deriveRenderOpts, ensureGlobalVariants, genTranslatableString, generateStateOnChangeProp, generateStateValueProp, getDataProps, hasVariant, makeFragment, omit, pick, renderPlasmicSlot, setPlumeStrictMode, useButton, useCheckbox, useVanillaDollarState as useDollarState, useIsSSR, useMenu, useMenuButton, useMenuGroup, useMenuItem, useSelect, useSelectOption, useSelectOptionGroup, useSwitch, useTextInput, useTrigger, useTriggeredOverlay, wrapWithClassName };
|
|
3669
|
+
export { DropdownMenu, PlasmicHead, PlasmicIcon, PlasmicImg, PlasmicLink, PlasmicRootProvider, PlasmicSlot, SelectContext, Stack, Trans, TriggeredOverlayContext, classNames, createPlasmicElementProxy, createUseScreenVariants, deriveRenderOpts, ensureGlobalVariants, genTranslatableString, generateStateOnChangeProp, generateStateValueProp, getDataProps, hasVariant, makeFragment, omit, pick, plasmicHeadMeta, renderPlasmicSlot, setPlumeStrictMode, useButton, useCheckbox, useVanillaDollarState as useDollarState, useIsSSR, useMenu, useMenuButton, useMenuGroup, useMenuItem, useSelect, useSelectOption, useSelectOptionGroup, useSwitch, useTextInput, useTrigger, useTriggeredOverlay, wrapWithClassName };
|
|
3499
3670
|
//# sourceMappingURL=react-web.esm.js.map
|