@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.
Files changed (66) hide show
  1. package/dist/all.d.ts +495 -106
  2. package/dist/index-common.d.ts +2 -1
  3. package/dist/plume/menu-button/menu-trigger.d.ts +1 -1
  4. package/dist/plume/select/index.d.ts +1 -0
  5. package/dist/plume/triggered-overlay/index.d.ts +1 -0
  6. package/dist/react-web.cjs.development.js +302 -127
  7. package/dist/react-web.cjs.development.js.map +1 -1
  8. package/dist/react-web.cjs.production.min.js +1 -1
  9. package/dist/react-web.cjs.production.min.js.map +1 -1
  10. package/dist/react-web.esm.js +300 -129
  11. package/dist/react-web.esm.js.map +1 -1
  12. package/dist/render/PlasmicHead.d.ts +35 -0
  13. package/dist/render/ssr.d.ts +2 -1
  14. package/dist/render/triggers.d.ts +4 -4
  15. package/dist/states/index.d.ts +3 -1
  16. package/dist/stories/UseDollarState.stories.d.ts +7 -0
  17. package/package.json +20 -19
  18. package/skinny/dist/collection-utils-3487dd27.js +238 -0
  19. package/skinny/dist/collection-utils-3487dd27.js.map +1 -0
  20. package/skinny/dist/collection-utils-57c273dc.js +238 -0
  21. package/skinny/dist/collection-utils-57c273dc.js.map +1 -0
  22. package/skinny/dist/common-182a0b0c.js +201 -0
  23. package/skinny/dist/common-182a0b0c.js.map +1 -0
  24. package/skinny/dist/index-common.d.ts +2 -1
  25. package/skinny/dist/index.js +65 -45
  26. package/skinny/dist/index.js.map +1 -1
  27. package/skinny/dist/plume/button/index.js +5 -5
  28. package/skinny/dist/plume/button/index.js.map +1 -1
  29. package/skinny/dist/plume/checkbox/index.js +7 -7
  30. package/skinny/dist/plume/checkbox/index.js.map +1 -1
  31. package/skinny/dist/plume/menu/index.js +12 -12
  32. package/skinny/dist/plume/menu/index.js.map +1 -1
  33. package/skinny/dist/plume/menu-button/index.js +7 -7
  34. package/skinny/dist/plume/menu-button/index.js.map +1 -1
  35. package/skinny/dist/plume/menu-button/menu-trigger.d.ts +1 -1
  36. package/skinny/dist/plume/select/index.d.ts +1 -0
  37. package/skinny/dist/plume/select/index.js +13 -13
  38. package/skinny/dist/plume/select/index.js.map +1 -1
  39. package/skinny/dist/plume/switch/index.js +7 -7
  40. package/skinny/dist/plume/switch/index.js.map +1 -1
  41. package/skinny/dist/plume/text-input/index.js +5 -5
  42. package/skinny/dist/plume/text-input/index.js.map +1 -1
  43. package/skinny/dist/plume/triggered-overlay/index.d.ts +1 -0
  44. package/skinny/dist/plume/triggered-overlay/index.js +8 -7
  45. package/skinny/dist/plume/triggered-overlay/index.js.map +1 -1
  46. package/skinny/dist/plume-utils-623b91cc.js +35 -0
  47. package/skinny/dist/plume-utils-623b91cc.js.map +1 -0
  48. package/skinny/dist/props-utils-b2ad4997.js +8 -0
  49. package/skinny/dist/props-utils-b2ad4997.js.map +1 -0
  50. package/skinny/dist/react-utils-35cb2a4e.js +201 -0
  51. package/skinny/dist/react-utils-35cb2a4e.js.map +1 -0
  52. package/skinny/dist/render/PlasmicHead.d.ts +35 -0
  53. package/skinny/dist/render/PlasmicImg/index.js +3 -3
  54. package/skinny/dist/render/PlasmicImg/index.js.map +1 -1
  55. package/skinny/dist/render/ssr.d.ts +2 -1
  56. package/skinny/dist/render/triggers.d.ts +4 -4
  57. package/skinny/dist/ssr-14264281.js +158 -0
  58. package/skinny/dist/ssr-14264281.js.map +1 -0
  59. package/skinny/dist/ssr-579df58f.js +158 -0
  60. package/skinny/dist/ssr-579df58f.js.map +1 -0
  61. package/skinny/dist/ssr-9ebd98ed.js +158 -0
  62. package/skinny/dist/ssr-9ebd98ed.js.map +1 -0
  63. package/skinny/dist/ssr-d2fd94f2.js +31 -0
  64. package/skinny/dist/ssr-d2fd94f2.js.map +1 -0
  65. package/skinny/dist/states/index.d.ts +3 -1
  66. package/skinny/dist/stories/UseDollarState.stories.d.ts +7 -0
@@ -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, useState, useRef, useMemo, createContext, useContext, useImperativeHandle, useCallback, cloneElement } from 'react';
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
- }, children)));
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 rec = function rec(currPath) {
3171
- var nextParts = Object.fromEntries(specs.filter(function (spec) {
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
- spec: spec
3260
+ specKey: spec.pathStr
3182
3261
  }];
3183
3262
  } else {
3184
3263
  return [nextPart, {
3185
3264
  isLast: false,
3186
- spec: spec
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, _handlers;
3335
+ var _handlers$get, _handlers3;
3199
3336
 
3200
- return handlers == null ? void 0 : (_handlers$get = (_handlers = handlers({
3337
+ return target[property] = handlers == null ? void 0 : (_handlers$get = (_handlers3 = handlers({
3201
3338
  path: [].concat(currPath, [property]),
3202
- spec: nextParts[property].spec
3203
- })).get) == null ? void 0 : _handlers$get.call(_handlers, target, property, receiver);
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 (!(property in target) && property in nextParts) {
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$set, _handlers$set2, _handlers2;
3355
+ var _handlers$set2, _handlers$set3, _handlers4;
3215
3356
 
3216
- return (_handlers$set = (_handlers$set2 = (_handlers2 = handlers({
3357
+ target[property] = value;
3358
+ return (_handlers$set2 = (_handlers$set3 = (_handlers4 = handlers({
3217
3359
  path: [].concat(currPath, [property]),
3218
- spec: nextParts[property].spec
3219
- })).set) == null ? void 0 : _handlers$set2.call(_handlers2, target, property, value, receiver)) != null ? _handlers$set : false;
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
- } else {
3363
+ }
3364
+
3365
+ if (property === "registerInitFunc") {
3224
3366
  target[property] = value;
3225
- return true;
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 specs = _specs.map(function (_ref2) {
3263
- var pathStr = _ref2.path,
3264
- spec = _objectWithoutPropertiesLoose(_ref2, ["path"]);
3265
-
3266
- return _extends({}, spec, {
3267
- pathStr: pathStr,
3268
- path: transformPathStringToObj(pathStr),
3269
- isRepeated: pathStr.split(".").some(function (part) {
3270
- return part.endsWith("[]");
3271
- })
3272
- });
3273
- });
3274
-
3275
- var _React$useState = React__default.useState(function () {
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: stateValues,
3301
- initStateDeps: deps,
3302
- initStateValues: cloneProxy(specs, initStates, stateValues),
3303
- states: initStates
3422
+ stateValues: mkProxy(specs),
3423
+ initStateDeps: {},
3424
+ initStateValues: mkProxy(specs),
3425
+ states: {},
3426
+ specs: specs
3304
3427
  };
3305
- }),
3306
- $$state = _React$useState[0],
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
- if (state.spec.valueProp) {
3313
- if (!state.spec.isRepeated) {
3314
- return props[state.spec.valueProp];
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[state.spec.valueProp], state.path.slice(1));
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 _state$spec$initVal;
3461
+ var _spec$initVal;
3322
3462
 
3323
3463
  saveState(state, $$state.states);
3324
3464
 
3325
- dset($$state.stateValues, state.path, state.spec.initFunc ? UNINITIALIZED : (_state$spec$initVal = state.spec.initVal) != null ? _state$spec$initVal : undefined);
3465
+ dset($$state.stateValues, state.path, spec.initFunc ? UNINITIALIZED : (_spec$initVal = spec.initVal) != null ? _spec$initVal : undefined);
3326
3466
 
3327
- var deps = state.spec.initFunc ? fillUninitializedStateValues(specs, props, $$state.stateValues, $$state.states) : {};
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
- set$$State(function (prev) {
3332
- return {
3333
- initStateValues: cloneProxy(specs, prev.states, prev.stateValues),
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 _i = 0, _Object$entries = Object.entries($$state.initStateDeps); _i < _Object$entries.length; _i++) {
3350
- var _Object$entries$_i = _Object$entries[_i],
3351
- key = _Object$entries$_i[0],
3352
- deps = _Object$entries$_i[1];
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
- set$$State(function (prev) {
3361
- return {
3362
- initStateValues: _extends({}, prev.initStateValues),
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
- if (state.spec.onChangeProp) {
3370
- var _props$state$spec$onC;
3503
+ var spec = $$state.specs[state.specKey];
3371
3504
 
3372
- (_props$state$spec$onC = props[state.spec.onChangeProp]) == null ? void 0 : _props$state$spec$onC.call(props, newValue, state.path);
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 _i2 = 0, _Object$values = Object.values($$state.states); _i2 < _Object$values.length; _i2++) {
3386
- var _Object$values$_i = _Object$values[_i2],
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
- spec = _Object$values$_i.spec;
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
- spec: spec
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
- set$$State(function (prev) {
3413
- var initStateValues = cloneProxy(specs, prev.states, prev.initStateValues);
3414
- resetSpecs.forEach(function (_ref3) {
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
- dset(initStateValues, path, _get(newStateValues, path));
3418
- });
3419
- return {
3420
- stateValues: cloneProxy(specs, prev.states, newStateValues),
3421
- initStateDeps: _extends({}, prev.initStateDeps, newDeps),
3422
- initStateValues: initStateValues,
3423
- states: _extends({}, prev.states)
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 _iterator2 = _createForOfIteratorHelperLoose(resetSpecs), _step2; !(_step2 = _iterator2()).done;) {
3428
- var _step2$value = _step2.value,
3429
- _path = _step2$value.path,
3430
- _spec = _step2$value.spec;
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
- if (state.spec.valueProp) {
3451
- if (!state.spec.isRepeated) {
3452
- return props[state.spec.valueProp];
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[state.spec.valueProp], state.path.slice(1));
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.spec.initFunc(props, $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 _i3 = 0, _Object$values2 = Object.values(states); _i3 < _Object$values2.length; _i3++) {
3488
- var path = _Object$values2[_i3].path;
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