@plasmicpkgs/plasmic-tabs
Advanced tools
Comparing version 0.0.10 to 0.0.11
@@ -78,2 +78,3 @@ 'use strict'; | ||
providesData: true, | ||
description: 'Create bespoke/advanced tab-like UIs. [See example project](https://docs.plasmic.app/learn/tabs-components/)', | ||
defaultStyles: { | ||
@@ -80,0 +81,0 @@ width: 'stretch', |
@@ -1,2 +0,2 @@ | ||
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("@plasmicapp/host/registerComponent")),n=require("@plasmicapp/host"),a=e(require("constate")),o=require("react"),r=e(o);function i(){return(i=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e}).apply(this,arguments)}var s=function(){};function l(e){return{type:"default-component",kind:"button",props:{children:{type:"text",value:e}}}}var u=o.createContext(!1);function c(e){var t=e.previewKey,a=e.mountMode,r=void 0===a?"mountOneAtATime":a,i=o.useState(e.initialKey),s=i[0],l=i[1],u=o.useState(void 0),c=u[0],p=u[1];return{tabKey:n.usePlasmicCanvasContext()&&t||s,bbox:c,setTabKey:l,setBbox:p,mountMode:r}}var p=a(c),d=p[0],b=p[1];function m(){var e=b();return"setTabKey"in e?e:void 0}var y="@plasmicpkgs/plasmic-tabs",h={name:"hostless-tabs-container",displayName:"Tabs Container",importName:"TabsContainer",importPath:y,providesData:!0,defaultStyles:{width:"stretch",padding:"8px"},props:{initialKey:{type:"string",description:"Key of the initially selected tab",defaultValue:"tab1"},previewKey:{type:"string",description:"SShow this key while editing in Plasmic Studio"},previewAll:{type:"boolean",description:"Reveal all tab contents while editing in Plasmic Studio"},mountMode:{advanced:!0,description:"How to render/mount tab content.",type:"choice",options:[{label:"Mount one at a time, unmount on hide",value:"mountOneAtATime"},{label:"Mount all up-front, do not unmount",value:"mountAllEagerly"},{label:"Mount on-demand/lazily, do not unmount",value:"mountLazily"}],defaultValueHint:"mountOneAtATime"},children:{type:"slot",defaultValue:{type:"vbox",children:[{type:"hbox",children:[{type:"component",name:"hostless-tab-button",props:{tabKey:"tab1",children:l("Tab 1")}},{type:"component",name:"hostless-tab-button",props:{tabKey:"tab2",children:l("Tab 2")}},{type:"component",name:"hostless-tab-underline"}]},{type:"vbox",children:[{type:"component",name:"hostless-tab-content",props:{tabKey:"tab1",children:[{type:"vbox",children:["Some content for tab 1"]}]}},{type:"component",name:"hostless-tab-content",props:{tabKey:"tab2",children:[{type:"vbox",children:["Some content for tab 2"]}]}}]}]}}}};function v(e){var t=e.children,a=e.initialKey,o=e.previewKey,i=e.previewAll,s=void 0!==i&&i,l=!!n.usePlasmicCanvasContext();return r.createElement(d,{initialKey:a,previewKey:o},r.createElement(u.Provider,{value:l&&s},r.createElement(f,{previewKey:o||a},t)))}function f(e){var t=e.children,a=function(e){if(!e)throw new Error("unexpected nil");return e}(m());return r.createElement(n.DataProvider,{name:"currentTabKey",data:a.tabKey},t)}var x={name:"hostless-tab-underline",displayName:"Tab Underline",importName:"TabUnderline",importPath:y,props:{},defaultStyles:{background:"#7777ff",height:"2px"}};function T(e){var t,n=e.className,a=(null!=(t=m())?t:{bbox:void 0}).bbox;return a?r.createElement("div",{className:n,style:i({},JSON.parse(JSON.stringify(a)),{top:void 0,bottom:0,position:"absolute",transition:".4s ease all"})}):null}var K={name:"hostless-tab-button",isAttachment:!0,displayName:"Tab Button",importName:"TabButton",importPath:y,props:{tabKey:{type:"string",description:"The answer value selecting this choice sets"},children:{type:"slot",defaultValue:l("Some tab")}},defaultStyles:{width:"hug"}};function g(e){var t=e.className,n=e.children,a=e.tabKey,i=m(),l=o.useRef(null),u=null!=i?i:{tabKey:void 0,setTabKey:s,bbox:void 0,setBbox:s},c=u.tabKey,p=u.setTabKey,d=u.setBbox;return o.useEffect((function(){a===c&&d({width:l.current.offsetWidth,left:l.current.offsetLeft})}),[l.current,d,JSON.stringify(u.bbox),a,c]),r.createElement("div",{className:t,ref:l},o.cloneElement(r.Children.toArray(n)[0],{isActive:a&&c&&c===a,onClick:function(){p(a)}}))}var w={name:"hostless-tab-content",isAttachment:!0,displayName:"Tab Content",importName:"TabContent",importPath:y,props:{tabKey:{type:"string",description:"The answer value selecting this choice sets"},children:{type:"slot",defaultValue:{type:"vbox",children:{type:"text",value:"This is some tab content"}}}}};function A(e){var t=e.children,n=e.className,a=e.tabKey,i=m(),s=o.useContext(u),l=null!=i?i:{tabKey:void 0,mountMode:"mountOneAtATime"},c=l.mountMode,p=void 0===i||l.tabKey===a||s,d=o.useState(!1),b=d[0],y=d[1];o.useEffect((function(){p&&y(!0)}),[p]);var h=r.createElement("div",{className:n,style:p?{}:{display:"none"}},t);switch(c){case"mountOneAtATime":return r.createElement(r.Fragment,null,p?t:null);case"mountAllEagerly":return h;case"mountLazily":return r.createElement(r.Fragment,null,b&&h)}throw new Error("Unexpected mount mode "+c)}exports.TabButton=g,exports.TabButtonMeta=K,exports.TabContent=A,exports.TabContentMeta=w,exports.TabUnderline=T,exports.TabUnderlineMeta=x,exports.TabsContainer=v,exports.TabsContainerMeta=h,exports.registerAll=function(e){var n=function(n,a){e?e.registerComponent(n,a):t(n,a)};n(v,h),n(T,x),n(g,K),n(A,w)}; | ||
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("@plasmicapp/host/registerComponent")),n=require("@plasmicapp/host"),a=e(require("constate")),o=require("react"),r=e(o);function i(){return(i=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e}).apply(this,arguments)}var s=function(){};function l(e){return{type:"default-component",kind:"button",props:{children:{type:"text",value:e}}}}var u=o.createContext(!1);function c(e){var t=e.previewKey,a=e.mountMode,r=void 0===a?"mountOneAtATime":a,i=o.useState(e.initialKey),s=i[0],l=i[1],u=o.useState(void 0),c=u[0],p=u[1];return{tabKey:n.usePlasmicCanvasContext()&&t||s,bbox:c,setTabKey:l,setBbox:p,mountMode:r}}var p=a(c),d=p[0],b=p[1];function m(){var e=b();return"setTabKey"in e?e:void 0}var y="@plasmicpkgs/plasmic-tabs",h={name:"hostless-tabs-container",displayName:"Tabs Container",importName:"TabsContainer",importPath:y,providesData:!0,description:"Create bespoke/advanced tab-like UIs. [See example project](https://docs.plasmic.app/learn/tabs-components/)",defaultStyles:{width:"stretch",padding:"8px"},props:{initialKey:{type:"string",description:"Key of the initially selected tab",defaultValue:"tab1"},previewKey:{type:"string",description:"SShow this key while editing in Plasmic Studio"},previewAll:{type:"boolean",description:"Reveal all tab contents while editing in Plasmic Studio"},mountMode:{advanced:!0,description:"How to render/mount tab content.",type:"choice",options:[{label:"Mount one at a time, unmount on hide",value:"mountOneAtATime"},{label:"Mount all up-front, do not unmount",value:"mountAllEagerly"},{label:"Mount on-demand/lazily, do not unmount",value:"mountLazily"}],defaultValueHint:"mountOneAtATime"},children:{type:"slot",defaultValue:{type:"vbox",children:[{type:"hbox",children:[{type:"component",name:"hostless-tab-button",props:{tabKey:"tab1",children:l("Tab 1")}},{type:"component",name:"hostless-tab-button",props:{tabKey:"tab2",children:l("Tab 2")}},{type:"component",name:"hostless-tab-underline"}]},{type:"vbox",children:[{type:"component",name:"hostless-tab-content",props:{tabKey:"tab1",children:[{type:"vbox",children:["Some content for tab 1"]}]}},{type:"component",name:"hostless-tab-content",props:{tabKey:"tab2",children:[{type:"vbox",children:["Some content for tab 2"]}]}}]}]}}}};function v(e){var t=e.children,a=e.initialKey,o=e.previewKey,i=e.previewAll,s=void 0!==i&&i,l=!!n.usePlasmicCanvasContext();return r.createElement(d,{initialKey:a,previewKey:o},r.createElement(u.Provider,{value:l&&s},r.createElement(f,{previewKey:o||a},t)))}function f(e){var t=e.children,a=function(e){if(!e)throw new Error("unexpected nil");return e}(m());return r.createElement(n.DataProvider,{name:"currentTabKey",data:a.tabKey},t)}var x={name:"hostless-tab-underline",displayName:"Tab Underline",importName:"TabUnderline",importPath:y,props:{},defaultStyles:{background:"#7777ff",height:"2px"}};function T(e){var t,n=e.className,a=(null!=(t=m())?t:{bbox:void 0}).bbox;return a?r.createElement("div",{className:n,style:i({},JSON.parse(JSON.stringify(a)),{top:void 0,bottom:0,position:"absolute",transition:".4s ease all"})}):null}var K={name:"hostless-tab-button",isAttachment:!0,displayName:"Tab Button",importName:"TabButton",importPath:y,props:{tabKey:{type:"string",description:"The answer value selecting this choice sets"},children:{type:"slot",defaultValue:l("Some tab")}},defaultStyles:{width:"hug"}};function g(e){var t=e.className,n=e.children,a=e.tabKey,i=m(),l=o.useRef(null),u=null!=i?i:{tabKey:void 0,setTabKey:s,bbox:void 0,setBbox:s},c=u.tabKey,p=u.setTabKey,d=u.setBbox;return o.useEffect((function(){a===c&&d({width:l.current.offsetWidth,left:l.current.offsetLeft})}),[l.current,d,JSON.stringify(u.bbox),a,c]),r.createElement("div",{className:t,ref:l},o.cloneElement(r.Children.toArray(n)[0],{isActive:a&&c&&c===a,onClick:function(){p(a)}}))}var w={name:"hostless-tab-content",isAttachment:!0,displayName:"Tab Content",importName:"TabContent",importPath:y,props:{tabKey:{type:"string",description:"The answer value selecting this choice sets"},children:{type:"slot",defaultValue:{type:"vbox",children:{type:"text",value:"This is some tab content"}}}}};function A(e){var t=e.children,n=e.className,a=e.tabKey,i=m(),s=o.useContext(u),l=null!=i?i:{tabKey:void 0,mountMode:"mountOneAtATime"},c=l.mountMode,p=void 0===i||l.tabKey===a||s,d=o.useState(!1),b=d[0],y=d[1];o.useEffect((function(){p&&y(!0)}),[p]);var h=r.createElement("div",{className:n,style:p?{}:{display:"none"}},t);switch(c){case"mountOneAtATime":return r.createElement(r.Fragment,null,p?t:null);case"mountAllEagerly":return h;case"mountLazily":return r.createElement(r.Fragment,null,b&&h)}throw new Error("Unexpected mount mode "+c)}exports.TabButton=g,exports.TabButtonMeta=K,exports.TabContent=A,exports.TabContentMeta=w,exports.TabUnderline=T,exports.TabUnderlineMeta=x,exports.TabsContainer=v,exports.TabsContainerMeta=h,exports.registerAll=function(e){var n=function(n,a){e?e.registerComponent(n,a):t(n,a)};n(v,h),n(T,x),n(g,K),n(A,w)}; | ||
//# sourceMappingURL=plasmic-tabs.cjs.production.min.js.map |
@@ -71,2 +71,3 @@ import registerComponent from '@plasmicapp/host/registerComponent'; | ||
providesData: true, | ||
description: 'Create bespoke/advanced tab-like UIs. [See example project](https://docs.plasmic.app/learn/tabs-components/)', | ||
defaultStyles: { | ||
@@ -73,0 +74,0 @@ width: 'stretch', |
{ | ||
"version": "0.0.10", | ||
"version": "0.0.11", | ||
"license": "MIT", | ||
@@ -65,3 +65,3 @@ "main": "dist/index.js", | ||
}, | ||
"gitHead": "d933fd1793c7b2d01af2400582593724ec364085" | ||
"gitHead": "10ab82db81f1654102ff8ed100c5ee16c61465e0" | ||
} |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
81301
760