@plasmicapp/host - npm Package Compare versions

Comparing version 1.0.112 to 1.0.113

dist/exports.d.ts

@@ -6,3 +6,3 @@ export { PlasmicCanvasContext, PlasmicCanvasHost, usePlasmicCanvasContext, } from "./canvas-host";
 export * from "./global-actions";
-export { Action, ActionProps, ComponentMeta, ComponentRegistration, ComponentTemplates, ContextDependentConfig, default as registerComponent, DefaultValueOrExpr, PrimitiveType, PropType, PropTypeBase, } from "./registerComponent";
+export { Action, ActionProps, ComponentMeta, ComponentRegistration, ComponentTemplates, ContextDependentConfig, default as registerComponent, DefaultValueOrExpr, PrimitiveType, PropType, PropTypeBase, StateHelpers, StateSpec, } from "./registerComponent";
 export { default as registerGlobalContext, GlobalContextMeta, GlobalContextRegistration, PropType as GlobalContextPropType, } from "./registerGlobalContext";
@@ -9,0 +9,0 @@ export { default as registerToken, TokenRegistration, TokenType, } from "./registerToken";

dist/host.cjs.development.js

@@ -529,3 +529,3 @@ 'use client';'use strict';
 
-var hostVersion = "1.0.112";
+var hostVersion = "1.0.113";
 
@@ -532,0 +532,0 @@ var root$7 = globalThis;

dist/host.cjs.production.min.js

@@ -1,2 +0,2 @@
-'use client';"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("@plasmicapp/query"),r=require("react"),n=(e=r)&&"object"==typeof e&&"default"in e?e.default:e,a=require("react-dom");function o(){return(o=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}function i(e,t){return(i=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e})(e,t)}function s(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}var l=globalThis;null==l.__PlasmicHostVersion&&(l.__PlasmicHostVersion="2");var u=[],c=new function(e){var t=this;this.value=null,this.set=function(e){t.value=e,u.forEach((function(e){return e()}))},this.get=function(){return t.value}}(null);function m(){return new URLSearchParams(location.hash.replace(/^#/,"?"))}function p(){return function(e,t){if(void 0===t&&(t=""),null==e)throw t=(function(e){return"string"==typeof e}(t)?t:t())||"",new Error("Value must not be undefined or null"+(t?"- "+t:""));return e}(m().get("origin"),"Missing information from Plasmic window.")}var d=0;function f(e){d++,c.set(e)}var v=r.createContext(!1),h=function(){return r.useContext(v)};function g(){var e,t,n,o=!!window.parent,i=!(null==(e=location.hash)||!e.match(/\bcanvas=true\b/)),s=!(null==(t=location.hash)||!t.match(/\blive=true\b/))||!o,l=o&&!document.querySelector("#plasmic-studio-tag")&&!i&&!s,f=new URLSearchParams(location.hash),h=r.useState((function(){var e;return JSON.parse(null!=(e=f.get("globalVariants"))?e:"{}")})),g=h[0],b=h[1],y=(n=r.useState(0)[1],r.useCallback((function(){n((function(e){return e+1}))}),[]));if(r.useLayoutEffect((function(){return u.push(y),function(){var e=u.indexOf(y);e>=0&&u.splice(e,1)}}),[y]),r.useEffect((function(){var e,t,r,n;l&&o&&window.parent!==window&&(t=document.createElement("script"),r=p(),n=(e=m()).has("studioHash")?e.get("studioHash"):new URL(location.href).searchParams.get("studio-hash"),t.src=r+"/static/js/studio"+(n?"."+n+".js":".js"),document.body.appendChild(t))}),[l,o]),r.useEffect((function(){if(!l&&!document.querySelector("#getlibs")&&s){var e=document.createElement("script");e.id="getlibs",e.src=p()+"/static/js/getlibs.js",e.async=!1,e.onload=function(){null==window.__GetlibsReadyResolver||window.__GetlibsReadyResolver()},document.head.append(e)}}),[l]),r.useEffect((function(){var e=function(e){try{var t=JSON.parse(e.data);"canvas-frame"===t.source&&b(t.activeGlobalVariants)}catch(e){}};return window.addEventListener("message",e),function(){return window.removeEventListener("message",e)}}),[]),!o)return null;if(i||s){var _=document.querySelector("#plasmic-app.__wab_user-body");_||((_=document.createElement("div")).id="plasmic-app",_.classList.add("__wab_user-body"),document.body.appendChild(_));var P=!!i&&{componentName:f.get("componentName"),globalVariants:g,interactive:!!f.get("interactive")};return a.createPortal(r.createElement(x,{key:""+d},r.createElement(v.Provider,{value:P},c.get())),_,"plasmic-app")}return l&&window.parent===window?r.createElement("iframe",{src:"https://docs.plasmic.app/app-content/app-host-ready#appHostUrl="+encodeURIComponent(location.href),style:{width:"100vw",height:"100vh",border:"none",position:"fixed",top:0,left:0,zIndex:99999999}}):null}var b=function(e){var t=e.enableWebpackHmr,n=r.useState(null),a=n[0],o=n[1];return r.useEffect((function(){o(r.createElement(g,null))}),[]),r.createElement(r.Fragment,null,!t&&r.createElement(P,null),a)},y=[];function _(e){return y.push(e),function(){var t=y.indexOf(e);t>=0&&y.splice(t,1)}}var x=function(e){var t,n;function a(t){var r;return(r=e.call(this,t)||this).state={},r}n=e,(t=a).prototype=Object.create(n.prototype),t.prototype.constructor=t,i(t,n),a.getDerivedStateFromError=function(e){return{error:e}};var o=a.prototype;return o.componentDidCatch=function(e){y.forEach((function(t){return t(e)}))},o.render=function(){return this.state.error?r.createElement("div",null,"Error: ",""+this.state.error.message):r.createElement(r.Fragment,null,this.props.children)},a}(r.Component);function P(){return null}var E=r.createContext(void 0);function C(e){return"__plasmic_meta_"+e}function R(e){return e}function w(e,t){if(t){for(var r,n=e,a=function(e,t){var r="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(r)return(r=r.call(e)).next.bind(r);if(Array.isArray(e)||(r=function(e,t){if(e){if("string"==typeof e)return s(e,void 0);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?s(e,void 0):void 0}}(e))){r&&(e=r);var n=0;return function(){return n>=e.length?{done:!0}:{done:!1,value:e[n++]}}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}(t.split("."));!(r=a()).done;){var o;n=null==(o=n)?void 0:o[r.value]}return n}}function S(e){return w(j(),e)}function O(e){void 0===e&&(e={});var t=j();return Object.fromEntries(Object.entries(e).filter((function(e){return!!e[0]&&!!e[1]})).map((function(e){return function(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];return t}(e[0],w(t,e[1]))})))}function j(){return r.useContext(E)}function T(e){var t,r,a=e.name,i=e.data,s=e.hidden,l=e.label,u=e.children,c=null!=(t=j())?t:{};return a?n.createElement(E.Provider,{value:o({},c,(r={},r[a]=i,r[C(a)]={hidden:s,label:l},r))},u):n.createElement(n.Fragment,null,u)}function A(e){var t=e.children,r=e.params,a=void 0===r?{}:r,i=e.query,s=void 0===i?{}:i,l=j()||{};return n.createElement(T,{name:"params",data:o({},l.params,a),label:"Page URL path params"},n.createElement(T,{name:"query",data:o({},l.query,s),label:"Page URL query params"},t))}function k(e){return(0,e.children)(j())}var q=globalThis;function D(e,t){q.__PlasmicFetcherRegistry.push({fetcher:e,meta:t})}q.__PlasmicFetcherRegistry=[];var F=n.createContext(void 0);function G(e){var t=e.contextName,r=e.children,a=e.actions,o=n.useMemo((function(){return Object.fromEntries(Object.entries(a).map((function(e){return[t+"."+e[0],e[1]]})))}),[t,a]);return n.createElement(F.Provider,{value:o},r)}function L(){var e;return null!=(e=n.useContext(F))?e:{}}var M=globalThis;function V(e,t){M.__PlasmicComponentRegistry.some((function(r){return r.component===e&&r.meta.name===t.name}))||M.__PlasmicComponentRegistry.push({component:e,meta:t})}null==M.__PlasmicComponentRegistry&&(M.__PlasmicComponentRegistry=[]);var N=globalThis;function U(e,t){N.__PlasmicContextRegistry.some((function(r){return r.component===e&&r.meta.name===t.name}))||N.__PlasmicContextRegistry.push({component:e,meta:t})}null==N.__PlasmicContextRegistry&&(N.__PlasmicContextRegistry=[]);var H=globalThis;function I(e){H.__PlasmicTokenRegistry.push(e)}null==H.__PlasmicTokenRegistry&&(H.__PlasmicTokenRegistry=[]);var J,z,Q=globalThis;function W(e,t){Q.__PlasmicTraitRegistry.push({trait:e,meta:t})}function $(e,t){return B(e,t)}null==Q.__PlasmicTraitRegistry&&(Q.__PlasmicTraitRegistry=[]);var B=function(e,t){return Array.isArray(t)?t.map((function(t){return B(e,t)})):t&&r.isValidElement(t)&&"string"!=typeof t?r.cloneElement(t):t},K=globalThis,X=null!=(J=null==K||null==(z=K.__Sub)?void 0:z.setRepeatedElementFn)?J:function(e){B=e},Y={__proto__:null,PlasmicCanvasContext:v,PlasmicCanvasHost:b,usePlasmicCanvasContext:h,unstable_registerFetcher:D,registerComponent:V,registerGlobalContext:U,registerToken:I,registerTrait:W,repeatedElement:$,DataContext:E,mkMetaName:C,mkMetaValue:R,applySelector:w,useSelector:S,useSelectors:O,useDataEnv:j,DataProvider:T,PageParamsProvider:A,DataCtxReader:k,GlobalActionsContext:F,GlobalActionsProvider:G,useGlobalActions:L},Z=globalThis;null==Z.__Sub&&(Z.__Sub=o({React:r,ReactDOM:a,PlasmicQuery:t,hostModule:Y,hostVersion:"1.0.112",hostUtils:{setPlasmicRootNode:f,registerRenderErrorListener:_,setRepeatedElementFn:X},setPlasmicRootNode:f,registerRenderErrorListener:_,setRepeatedElementFn:X},Y)),exports.DataContext=E,exports.DataCtxReader=k,exports.DataProvider=T,exports.GlobalActionsContext=F,exports.GlobalActionsProvider=G,exports.PageParamsProvider=A,exports.PlasmicCanvasContext=v,exports.PlasmicCanvasHost=b,exports.applySelector=w,exports.mkMetaName=C,exports.mkMetaValue=R,exports.registerComponent=V,exports.registerGlobalContext=U,exports.registerToken=I,exports.registerTrait=W,exports.repeatedElement=$,exports.unstable_registerFetcher=D,exports.useDataEnv=j,exports.useGlobalActions=L,exports.usePlasmicCanvasContext=h,exports.useSelector=S,exports.useSelectors=O;
+'use client';"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("@plasmicapp/query"),r=require("react"),n=(e=r)&&"object"==typeof e&&"default"in e?e.default:e,a=require("react-dom");function o(){return(o=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}function i(e,t){return(i=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e})(e,t)}function s(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}var l=globalThis;null==l.__PlasmicHostVersion&&(l.__PlasmicHostVersion="2");var u=[],c=new function(e){var t=this;this.value=null,this.set=function(e){t.value=e,u.forEach((function(e){return e()}))},this.get=function(){return t.value}}(null);function m(){return new URLSearchParams(location.hash.replace(/^#/,"?"))}function p(){return function(e,t){if(void 0===t&&(t=""),null==e)throw t=(function(e){return"string"==typeof e}(t)?t:t())||"",new Error("Value must not be undefined or null"+(t?"- "+t:""));return e}(m().get("origin"),"Missing information from Plasmic window.")}var d=0;function f(e){d++,c.set(e)}var v=r.createContext(!1),h=function(){return r.useContext(v)};function g(){var e,t,n,o=!!window.parent,i=!(null==(e=location.hash)||!e.match(/\bcanvas=true\b/)),s=!(null==(t=location.hash)||!t.match(/\blive=true\b/))||!o,l=o&&!document.querySelector("#plasmic-studio-tag")&&!i&&!s,f=new URLSearchParams(location.hash),h=r.useState((function(){var e;return JSON.parse(null!=(e=f.get("globalVariants"))?e:"{}")})),g=h[0],b=h[1],y=(n=r.useState(0)[1],r.useCallback((function(){n((function(e){return e+1}))}),[]));if(r.useLayoutEffect((function(){return u.push(y),function(){var e=u.indexOf(y);e>=0&&u.splice(e,1)}}),[y]),r.useEffect((function(){var e,t,r,n;l&&o&&window.parent!==window&&(t=document.createElement("script"),r=p(),n=(e=m()).has("studioHash")?e.get("studioHash"):new URL(location.href).searchParams.get("studio-hash"),t.src=r+"/static/js/studio"+(n?"."+n+".js":".js"),document.body.appendChild(t))}),[l,o]),r.useEffect((function(){if(!l&&!document.querySelector("#getlibs")&&s){var e=document.createElement("script");e.id="getlibs",e.src=p()+"/static/js/getlibs.js",e.async=!1,e.onload=function(){null==window.__GetlibsReadyResolver||window.__GetlibsReadyResolver()},document.head.append(e)}}),[l]),r.useEffect((function(){var e=function(e){try{var t=JSON.parse(e.data);"canvas-frame"===t.source&&b(t.activeGlobalVariants)}catch(e){}};return window.addEventListener("message",e),function(){return window.removeEventListener("message",e)}}),[]),!o)return null;if(i||s){var _=document.querySelector("#plasmic-app.__wab_user-body");_||((_=document.createElement("div")).id="plasmic-app",_.classList.add("__wab_user-body"),document.body.appendChild(_));var P=!!i&&{componentName:f.get("componentName"),globalVariants:g,interactive:!!f.get("interactive")};return a.createPortal(r.createElement(x,{key:""+d},r.createElement(v.Provider,{value:P},c.get())),_,"plasmic-app")}return l&&window.parent===window?r.createElement("iframe",{src:"https://docs.plasmic.app/app-content/app-host-ready#appHostUrl="+encodeURIComponent(location.href),style:{width:"100vw",height:"100vh",border:"none",position:"fixed",top:0,left:0,zIndex:99999999}}):null}var b=function(e){var t=e.enableWebpackHmr,n=r.useState(null),a=n[0],o=n[1];return r.useEffect((function(){o(r.createElement(g,null))}),[]),r.createElement(r.Fragment,null,!t&&r.createElement(P,null),a)},y=[];function _(e){return y.push(e),function(){var t=y.indexOf(e);t>=0&&y.splice(t,1)}}var x=function(e){var t,n;function a(t){var r;return(r=e.call(this,t)||this).state={},r}n=e,(t=a).prototype=Object.create(n.prototype),t.prototype.constructor=t,i(t,n),a.getDerivedStateFromError=function(e){return{error:e}};var o=a.prototype;return o.componentDidCatch=function(e){y.forEach((function(t){return t(e)}))},o.render=function(){return this.state.error?r.createElement("div",null,"Error: ",""+this.state.error.message):r.createElement(r.Fragment,null,this.props.children)},a}(r.Component);function P(){return null}var E=r.createContext(void 0);function C(e){return"__plasmic_meta_"+e}function R(e){return e}function w(e,t){if(t){for(var r,n=e,a=function(e,t){var r="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(r)return(r=r.call(e)).next.bind(r);if(Array.isArray(e)||(r=function(e,t){if(e){if("string"==typeof e)return s(e,void 0);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?s(e,void 0):void 0}}(e))){r&&(e=r);var n=0;return function(){return n>=e.length?{done:!0}:{done:!1,value:e[n++]}}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}(t.split("."));!(r=a()).done;){var o;n=null==(o=n)?void 0:o[r.value]}return n}}function S(e){return w(j(),e)}function O(e){void 0===e&&(e={});var t=j();return Object.fromEntries(Object.entries(e).filter((function(e){return!!e[0]&&!!e[1]})).map((function(e){return function(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];return t}(e[0],w(t,e[1]))})))}function j(){return r.useContext(E)}function T(e){var t,r,a=e.name,i=e.data,s=e.hidden,l=e.label,u=e.children,c=null!=(t=j())?t:{};return a?n.createElement(E.Provider,{value:o({},c,(r={},r[a]=i,r[C(a)]={hidden:s,label:l},r))},u):n.createElement(n.Fragment,null,u)}function A(e){var t=e.children,r=e.params,a=void 0===r?{}:r,i=e.query,s=void 0===i?{}:i,l=j()||{};return n.createElement(T,{name:"params",data:o({},l.params,a),label:"Page URL path params"},n.createElement(T,{name:"query",data:o({},l.query,s),label:"Page URL query params"},t))}function k(e){return(0,e.children)(j())}var q=globalThis;function D(e,t){q.__PlasmicFetcherRegistry.push({fetcher:e,meta:t})}q.__PlasmicFetcherRegistry=[];var F=n.createContext(void 0);function G(e){var t=e.contextName,r=e.children,a=e.actions,o=n.useMemo((function(){return Object.fromEntries(Object.entries(a).map((function(e){return[t+"."+e[0],e[1]]})))}),[t,a]);return n.createElement(F.Provider,{value:o},r)}function L(){var e;return null!=(e=n.useContext(F))?e:{}}var M=globalThis;function V(e,t){M.__PlasmicComponentRegistry.some((function(r){return r.component===e&&r.meta.name===t.name}))||M.__PlasmicComponentRegistry.push({component:e,meta:t})}null==M.__PlasmicComponentRegistry&&(M.__PlasmicComponentRegistry=[]);var N=globalThis;function U(e,t){N.__PlasmicContextRegistry.some((function(r){return r.component===e&&r.meta.name===t.name}))||N.__PlasmicContextRegistry.push({component:e,meta:t})}null==N.__PlasmicContextRegistry&&(N.__PlasmicContextRegistry=[]);var H=globalThis;function I(e){H.__PlasmicTokenRegistry.push(e)}null==H.__PlasmicTokenRegistry&&(H.__PlasmicTokenRegistry=[]);var J,z,Q=globalThis;function W(e,t){Q.__PlasmicTraitRegistry.push({trait:e,meta:t})}function $(e,t){return B(e,t)}null==Q.__PlasmicTraitRegistry&&(Q.__PlasmicTraitRegistry=[]);var B=function(e,t){return Array.isArray(t)?t.map((function(t){return B(e,t)})):t&&r.isValidElement(t)&&"string"!=typeof t?r.cloneElement(t):t},K=globalThis,X=null!=(J=null==K||null==(z=K.__Sub)?void 0:z.setRepeatedElementFn)?J:function(e){B=e},Y={__proto__:null,PlasmicCanvasContext:v,PlasmicCanvasHost:b,usePlasmicCanvasContext:h,unstable_registerFetcher:D,registerComponent:V,registerGlobalContext:U,registerToken:I,registerTrait:W,repeatedElement:$,DataContext:E,mkMetaName:C,mkMetaValue:R,applySelector:w,useSelector:S,useSelectors:O,useDataEnv:j,DataProvider:T,PageParamsProvider:A,DataCtxReader:k,GlobalActionsContext:F,GlobalActionsProvider:G,useGlobalActions:L},Z=globalThis;null==Z.__Sub&&(Z.__Sub=o({React:r,ReactDOM:a,PlasmicQuery:t,hostModule:Y,hostVersion:"1.0.113",hostUtils:{setPlasmicRootNode:f,registerRenderErrorListener:_,setRepeatedElementFn:X},setPlasmicRootNode:f,registerRenderErrorListener:_,setRepeatedElementFn:X},Y)),exports.DataContext=E,exports.DataCtxReader=k,exports.DataProvider=T,exports.GlobalActionsContext=F,exports.GlobalActionsProvider=G,exports.PageParamsProvider=A,exports.PlasmicCanvasContext=v,exports.PlasmicCanvasHost=b,exports.applySelector=w,exports.mkMetaName=C,exports.mkMetaValue=R,exports.registerComponent=V,exports.registerGlobalContext=U,exports.registerToken=I,exports.registerTrait=W,exports.repeatedElement=$,exports.unstable_registerFetcher=D,exports.useDataEnv=j,exports.useGlobalActions=L,exports.usePlasmicCanvasContext=h,exports.useSelector=S,exports.useSelectors=O;
 //# sourceMappingURL=host.cjs.production.min.js.map

dist/host.esm.js

@@ -527,3 +527,3 @@ 'use client';import * as PlasmicQuery from '@plasmicapp/query';
 
-var hostVersion = "1.0.112";
+var hostVersion = "1.0.113";
 
@@ -530,0 +530,0 @@ var root$7 = globalThis;

dist/registerComponent.d.ts

@@ -186,2 +186,9 @@ /// <reference types="react" />
 } & DefaultValueOrExpr<P, DataPickerValueType> & PropTypeBase<P>);
+export declare type EventHandlerType<P> = {
+    type: "eventHandler";
+    argTypes: {
+        name: string;
+        type: PropType<any>;
+    }[];
+} & DefaultValueOrExpr<P, (...args: any) => any> & PropTypeBase<P>;
 interface ChoiceTypeBase<P> extends PropTypeBase<P> {
@@ -285,3 +292,3 @@ type: "choice";
 export declare type SupportControlled<T> = Extract<T, String | CustomControl<any>> | (Exclude<T, String | CustomControl<any>> & ControlTypeBase);
-export declare type PropType<P> = SupportControlled<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P> | ChoiceType<P> | ImageUrlType<P> | CustomType<P> | GraphQLType<P> | DataPickerType<P>> | SlotType<P>;
+export declare type PropType<P> = SupportControlled<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P> | ChoiceType<P> | ImageUrlType<P> | CustomType<P> | GraphQLType<P> | DataPickerType<P> | EventHandlerType<P>> | SlotType<P>;
 declare type RestrictPropType<T, P> = T extends string ? SupportControlled<StringType<P> | ChoiceType<P> | JSONLikeType<P> | ImageUrlType<P> | CustomType<P> | DataPickerType<P>> : T extends boolean ? SupportControlled<BooleanType<P> | JSONLikeType<P> | CustomType<P> | DataPickerType<P>> : T extends number ? SupportControlled<NumberType<P> | JSONLikeType<P> | CustomType<P> | DataPickerType<P>> : PropType<P>;
@@ -330,12 +337,43 @@ export interface ActionProps<P> {
 }
-interface $State {
-    [key: string]: any;
+export declare type StateSpec = {
+    onChangeProp: string;
+} & ({
+    type: "readonly";
+    variableType: "text";
+    initVal?: string;
+} | {
+    type: "readonly";
+    variableType: "number";
+    initVal?: number;
+} | {
+    type: "readonly";
+    variableType: "boolean";
+    initVal?: boolean;
+} | {
+    type: "readonly";
+    variableType: "array";
+    initVal?: any[];
+} | {
+    type: "readonly";
+    variableType: "object";
+    initVal?: object;
+} | {
+    type: "writable";
+    variableType: "text" | "number" | "boolean" | "array" | "object";
+    valueProp: string;
+});
+export interface StateHelpers<P, T> {
+    initFunc?: ($props: P) => T;
+    onChangeArgsToValue?: (...args: any) => T;
 }
-interface $StateSpec<T> {
-    type: "private" | "readonly" | "writable";
-    initFunc?: ($props: Record<string, any>, $state: $State) => T;
-    initVal?: T;
-    valueProp?: string;
-    onChangeProp?: string;
-}
+export declare type ComponentHelpers<P> = {
+    helpers: {
+        states: Record<string, StateHelpers<P, any>>;
+    };
+    importPath: string;
+} & ({
+    importName: string;
+} | {
+    isDefaultExport: true;
+});
 export declare type StyleSection = "visibility" | "typography" | "sizing" | "spacing" | "background" | "transform" | "transitions" | "layout" | "overflow" | "border" | "shadows" | "effects";
@@ -374,6 +412,13 @@ export interface ComponentMeta<P> {
     /**
-     * WIP: An object describing the component states to be used in Studio.
+     * An object describing the component states to be used in Studio.
      */
-    unstable__states?: Record<string, $StateSpec<any>>;
+    states?: Record<string, StateSpec>;
     /**
+     * An object describing the components helpers to be used in Studio.
+     *   1. states helpers: Each state can receive an "initFunc" prop to initialize
+     *      the implicit state in Studio, and an "onChangeArgsToValue" prop to
+     *      transform the event handler arguments into a value
+     */
+    componentHelpers?: ComponentHelpers<P>;
+    /**
      * An array describing the component actions to be used in Studio.
@@ -380,0 +425,0 @@ */

dist/version.d.ts

@@ -1,1 +0,1 @@
-export declare const hostVersion = "1.0.112";
+export declare const hostVersion = "1.0.113";

package.json

 {
   "name": "@plasmicapp/host",
-  "version": "1.0.112",
+  "version": "1.0.113",
   "description": "plasmic library for app hosting",
@@ -79,3 +79,3 @@ "main": "dist/index.js",
   },
-  "gitHead": "67e119ae46c42a2b4440cd98b4d168d0b69ca229"
+  "gitHead": "256694dd227acca3600d2475b0985713252d99cb"
 }

registerComponent/dist/registerComponent.d.ts

@@ -186,2 +186,9 @@ /// <reference types="react" />
 } & DefaultValueOrExpr<P, DataPickerValueType> & PropTypeBase<P>);
+export declare type EventHandlerType<P> = {
+    type: "eventHandler";
+    argTypes: {
+        name: string;
+        type: PropType<any>;
+    }[];
+} & DefaultValueOrExpr<P, (...args: any) => any> & PropTypeBase<P>;
 interface ChoiceTypeBase<P> extends PropTypeBase<P> {
@@ -285,3 +292,3 @@ type: "choice";
 export declare type SupportControlled<T> = Extract<T, String | CustomControl<any>> | (Exclude<T, String | CustomControl<any>> & ControlTypeBase);
-export declare type PropType<P> = SupportControlled<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P> | ChoiceType<P> | ImageUrlType<P> | CustomType<P> | GraphQLType<P> | DataPickerType<P>> | SlotType<P>;
+export declare type PropType<P> = SupportControlled<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P> | ChoiceType<P> | ImageUrlType<P> | CustomType<P> | GraphQLType<P> | DataPickerType<P> | EventHandlerType<P>> | SlotType<P>;
 declare type RestrictPropType<T, P> = T extends string ? SupportControlled<StringType<P> | ChoiceType<P> | JSONLikeType<P> | ImageUrlType<P> | CustomType<P> | DataPickerType<P>> : T extends boolean ? SupportControlled<BooleanType<P> | JSONLikeType<P> | CustomType<P> | DataPickerType<P>> : T extends number ? SupportControlled<NumberType<P> | JSONLikeType<P> | CustomType<P> | DataPickerType<P>> : PropType<P>;
@@ -330,12 +337,43 @@ export interface ActionProps<P> {
 }
-interface $State {
-    [key: string]: any;
+export declare type StateSpec = {
+    onChangeProp: string;
+} & ({
+    type: "readonly";
+    variableType: "text";
+    initVal?: string;
+} | {
+    type: "readonly";
+    variableType: "number";
+    initVal?: number;
+} | {
+    type: "readonly";
+    variableType: "boolean";
+    initVal?: boolean;
+} | {
+    type: "readonly";
+    variableType: "array";
+    initVal?: any[];
+} | {
+    type: "readonly";
+    variableType: "object";
+    initVal?: object;
+} | {
+    type: "writable";
+    variableType: "text" | "number" | "boolean" | "array" | "object";
+    valueProp: string;
+});
+export interface StateHelpers<P, T> {
+    initFunc?: ($props: P) => T;
+    onChangeArgsToValue?: (...args: any) => T;
 }
-interface $StateSpec<T> {
-    type: "private" | "readonly" | "writable";
-    initFunc?: ($props: Record<string, any>, $state: $State) => T;
-    initVal?: T;
-    valueProp?: string;
-    onChangeProp?: string;
-}
+export declare type ComponentHelpers<P> = {
+    helpers: {
+        states: Record<string, StateHelpers<P, any>>;
+    };
+    importPath: string;
+} & ({
+    importName: string;
+} | {
+    isDefaultExport: true;
+});
 export declare type StyleSection = "visibility" | "typography" | "sizing" | "spacing" | "background" | "transform" | "transitions" | "layout" | "overflow" | "border" | "shadows" | "effects";
@@ -374,6 +412,13 @@ export interface ComponentMeta<P> {
     /**
-     * WIP: An object describing the component states to be used in Studio.
+     * An object describing the component states to be used in Studio.
      */
-    unstable__states?: Record<string, $StateSpec<any>>;
+    states?: Record<string, StateSpec>;
     /**
+     * An object describing the components helpers to be used in Studio.
+     *   1. states helpers: Each state can receive an "initFunc" prop to initialize
+     *      the implicit state in Studio, and an "onChangeArgsToValue" prop to
+     *      transform the event handler arguments into a value
+     */
+    componentHelpers?: ComponentHelpers<P>;
+    /**
      * An array describing the component actions to be used in Studio.
@@ -380,0 +425,0 @@ */

registerGlobalContext/dist/registerComponent.d.ts

@@ -186,2 +186,9 @@ /// <reference types="react" />
 } & DefaultValueOrExpr<P, DataPickerValueType> & PropTypeBase<P>);
+export declare type EventHandlerType<P> = {
+    type: "eventHandler";
+    argTypes: {
+        name: string;
+        type: PropType<any>;
+    }[];
+} & DefaultValueOrExpr<P, (...args: any) => any> & PropTypeBase<P>;
 interface ChoiceTypeBase<P> extends PropTypeBase<P> {
@@ -285,3 +292,3 @@ type: "choice";
 export declare type SupportControlled<T> = Extract<T, String | CustomControl<any>> | (Exclude<T, String | CustomControl<any>> & ControlTypeBase);
-export declare type PropType<P> = SupportControlled<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P> | ChoiceType<P> | ImageUrlType<P> | CustomType<P> | GraphQLType<P> | DataPickerType<P>> | SlotType<P>;
+export declare type PropType<P> = SupportControlled<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P> | ChoiceType<P> | ImageUrlType<P> | CustomType<P> | GraphQLType<P> | DataPickerType<P> | EventHandlerType<P>> | SlotType<P>;
 declare type RestrictPropType<T, P> = T extends string ? SupportControlled<StringType<P> | ChoiceType<P> | JSONLikeType<P> | ImageUrlType<P> | CustomType<P> | DataPickerType<P>> : T extends boolean ? SupportControlled<BooleanType<P> | JSONLikeType<P> | CustomType<P> | DataPickerType<P>> : T extends number ? SupportControlled<NumberType<P> | JSONLikeType<P> | CustomType<P> | DataPickerType<P>> : PropType<P>;
@@ -330,12 +337,43 @@ export interface ActionProps<P> {
 }
-interface $State {
-    [key: string]: any;
+export declare type StateSpec = {
+    onChangeProp: string;
+} & ({
+    type: "readonly";
+    variableType: "text";
+    initVal?: string;
+} | {
+    type: "readonly";
+    variableType: "number";
+    initVal?: number;
+} | {
+    type: "readonly";
+    variableType: "boolean";
+    initVal?: boolean;
+} | {
+    type: "readonly";
+    variableType: "array";
+    initVal?: any[];
+} | {
+    type: "readonly";
+    variableType: "object";
+    initVal?: object;
+} | {
+    type: "writable";
+    variableType: "text" | "number" | "boolean" | "array" | "object";
+    valueProp: string;
+});
+export interface StateHelpers<P, T> {
+    initFunc?: ($props: P) => T;
+    onChangeArgsToValue?: (...args: any) => T;
 }
-interface $StateSpec<T> {
-    type: "private" | "readonly" | "writable";
-    initFunc?: ($props: Record<string, any>, $state: $State) => T;
-    initVal?: T;
-    valueProp?: string;
-    onChangeProp?: string;
-}
+export declare type ComponentHelpers<P> = {
+    helpers: {
+        states: Record<string, StateHelpers<P, any>>;
+    };
+    importPath: string;
+} & ({
+    importName: string;
+} | {
+    isDefaultExport: true;
+});
 export declare type StyleSection = "visibility" | "typography" | "sizing" | "spacing" | "background" | "transform" | "transitions" | "layout" | "overflow" | "border" | "shadows" | "effects";
@@ -374,6 +412,13 @@ export interface ComponentMeta<P> {
     /**
-     * WIP: An object describing the component states to be used in Studio.
+     * An object describing the component states to be used in Studio.
      */
-    unstable__states?: Record<string, $StateSpec<any>>;
+    states?: Record<string, StateSpec>;
     /**
+     * An object describing the components helpers to be used in Studio.
+     *   1. states helpers: Each state can receive an "initFunc" prop to initialize
+     *      the implicit state in Studio, and an "onChangeArgsToValue" prop to
+     *      transform the event handler arguments into a value
+     */
+    componentHelpers?: ComponentHelpers<P>;
+    /**
      * An array describing the component actions to be used in Studio.
@@ -380,0 +425,0 @@ */

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

363723

increased by2.27%

Lines of code

3514

increased by4%

No dependency changes