@plasmicpkgs/plasmic-tabs 0.0.4 → 0.0.5

package/dist/plasmic-tabs.cjs.development.js

@@ -28,11 +28,11 @@ function _extends() {
 var noop = function noop() {};
 function defaultButtonChildren(label) {
   return {
-    type: "default-component",
-    kind: "button",
+    type: 'default-component',
+    kind: 'button',
     props: {
       children: {
-        type: "text",
+        type: 'text',
         value: label
       }
     }
@@ -59,77 +59,77 @@ var _constate = /*#__PURE__*/constate(useTabsData),
   useTabsContextUnsafe = _constate[1];
 function useTabsContext() {
   var result = useTabsContextUnsafe();
-  return "setTabKey" in result ? result : undefined;
+  return 'setTabKey' in result ? result : undefined;
 }
-var modulePath = "@plasmicpkgs/plasmic-tabs";
+var modulePath = '@plasmicpkgs/plasmic-tabs';
 var TabsContainerMeta = {
-  name: "hostless-tabs-container",
-  displayName: "Tabs Container",
-  importName: "TabsContainer",
+  name: 'hostless-tabs-container',
+  displayName: 'Tabs Container',
+  importName: 'TabsContainer',
   importPath: modulePath,
   providesData: true,
   defaultStyles: {
-    width: "stretch",
-    padding: "8px"
+    width: 'stretch',
+    padding: '8px'
   },
   props: {
     initialKey: {
-      type: "string",
-      description: "Key of the initially selected tab",
-      defaultValue: "tab1"
+      type: 'string',
+      description: 'Key of the initially selected tab',
+      defaultValue: 'tab1'
     },
     previewKey: {
-      type: "string",
-      description: "SShow this key while editing in Plasmic Studio"
+      type: 'string',
+      description: 'SShow this key while editing in Plasmic Studio'
     },
     previewAll: {
-      type: "boolean",
-      description: "Reveal all tab contents while editing in Plasmic Studio"
+      type: 'boolean',
+      description: 'Reveal all tab contents while editing in Plasmic Studio'
     },
     children: {
-      type: "slot",
+      type: 'slot',
       defaultValue: {
-        type: "vbox",
+        type: 'vbox',
         children: [{
-          type: "hbox",
+          type: 'hbox',
           children: [{
-            type: "component",
-            name: "hostless-tab-button",
+            type: 'component',
+            name: 'hostless-tab-button',
             props: {
-              tabKey: "tab1",
-              children: /*#__PURE__*/defaultButtonChildren("Tab 1")
+              tabKey: 'tab1',
+              children: /*#__PURE__*/defaultButtonChildren('Tab 1')
             }
           }, {
-            type: "component",
-            name: "hostless-tab-button",
+            type: 'component',
+            name: 'hostless-tab-button',
             props: {
-              tabKey: "tab2",
-              children: /*#__PURE__*/defaultButtonChildren("Tab 2")
+              tabKey: 'tab2',
+              children: /*#__PURE__*/defaultButtonChildren('Tab 2')
             }
           }, {
-            type: "component",
-            name: "hostless-tab-underline"
+            type: 'component',
+            name: 'hostless-tab-underline'
           }]
         }, {
-          type: "vbox",
+          type: 'vbox',
           children: [{
-            type: "component",
-            name: "hostless-tab-content",
+            type: 'component',
+            name: 'hostless-tab-content',
             props: {
-              tabKey: "tab1",
+              tabKey: 'tab1',
               children: [{
-                type: "vbox",
-                children: ["Some content for tab 1"]
+                type: 'vbox',
+                children: ['Some content for tab 1']
               }]
             }
           }, {
-            type: "component",
-            name: "hostless-tab-content",
+            type: 'component',
+            name: 'hostless-tab-content',
             props: {
-              tabKey: "tab2",
+              tabKey: 'tab2',
               children: [{
-                type: "vbox",
-                children: ["Some content for tab 2"]
+                type: 'vbox',
+                children: ['Some content for tab 2']
               }]
             }
           }]
@@ -155,7 +155,7 @@ function TabsContainer(_ref2) {
 }
 function ensure(x) {
   if (!x) {
-    throw new Error("unexpected nil");
+    throw new Error('unexpected nil');
   }
   return x;
 }
@@ -167,23 +167,19 @@ function Helper(_ref3) {
     tabKey = _ensure.tabKey;
   var effectiveKey = inEditor ? previewKey || tabKey : tabKey;
   return React__default.createElement(host.DataProvider, {
-    name: "currentTabKey",
+    name: 'currentTabKey',
     data: effectiveKey
   }, children);
 }
 var TabUnderlineMeta = {
-  name: "hostless-tab-underline",
-  displayName: "Tab Underline",
-  importName: "TabUnderline",
+  name: 'hostless-tab-underline',
+  displayName: 'Tab Underline',
+  importName: 'TabUnderline',
   importPath: modulePath,
-  props: {
-    children: {
-      type: "slot"
-    }
-  },
+  props: {},
   defaultStyles: {
-    background: "#7777ff",
-    height: "2px"
+    background: '#7777ff',
+    height: '2px'
   }
 };
 function TabUnderline(_ref4) {
@@ -198,29 +194,29 @@ function TabUnderline(_ref4) {
     style: _extends({}, JSON.parse(JSON.stringify(bbox)), {
       top: undefined,
       bottom: 0,
-      position: "absolute",
-      transition: ".4s ease all"
+      position: 'absolute',
+      transition: '.4s ease all'
     })
   }) : null;
 }
 var TabButtonMeta = {
-  name: "hostless-tab-button",
+  name: 'hostless-tab-button',
   isAttachment: true,
-  displayName: "Tab Button",
-  importName: "TabButton",
+  displayName: 'Tab Button',
+  importName: 'TabButton',
   importPath: modulePath,
   props: {
     tabKey: {
-      type: "string",
-      description: "The answer value selecting this choice sets"
+      type: 'string',
+      description: 'The answer value selecting this choice sets'
     },
     children: {
-      type: "slot",
-      defaultValue: /*#__PURE__*/defaultButtonChildren("Some tab")
+      type: 'slot',
+      defaultValue: /*#__PURE__*/defaultButtonChildren('Some tab')
     }
   },
   defaultStyles: {
-    width: "hug"
+    width: 'hug'
   }
 };
 function TabButton(_ref6) {
@@ -258,23 +254,23 @@ function TabButton(_ref6) {
   }));
 }
 var TabContentMeta = {
-  name: "hostless-tab-content",
+  name: 'hostless-tab-content',
   isAttachment: true,
-  displayName: "Tab Content",
-  importName: "TabContent",
+  displayName: 'Tab Content',
+  importName: 'TabContent',
   importPath: modulePath,
   props: {
     tabKey: {
-      type: "string",
-      description: "The answer value selecting this choice sets"
+      type: 'string',
+      description: 'The answer value selecting this choice sets'
     },
     children: {
-      type: "slot",
+      type: 'slot',
       defaultValue: {
-        type: "vbox",
+        type: 'vbox',
         children: {
-          type: "text",
-          value: "This is some tab content"
+          type: 'text',
+          value: 'This is some tab content'
         }
       }
     }

package/dist/plasmic-tabs.cjs.development.js.map

@@ -1 +1 @@
-{"version":3,"file":"plasmic-tabs.cjs.development.js","sources":["../src/tabs.tsx","../src/index.tsx"],"sourcesContent":["import { DataProvider, usePlasmicCanvasContext,ComponentMeta } from \"@plasmicapp/host\";\nimport constate from \"constate\";\nimport React, {\n  cloneElement,\n  createContext,\n  ReactElement,\n  ReactNode,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\n\n\nconst noop = ()=>{};\n\nfunction defaultButtonChildren(label: string) {\n  return {\n    type: \"default-component\",\n    kind: \"button\",\n    props: {\n      children: {\n        type: \"text\",\n        value: label,\n      },\n    },\n  } as const;\n}\nexport interface TabsProviderProps {\n  children?: ReactNode;\n  initialKey?: string;\n  previewKey?: string;\n  previewAll?: boolean;\n}\n\nconst DebugContext = createContext(false);\n\nfunction useTabsData({ initialKey }: { initialKey?: string }) {\n  const [tabKey, setTabKey] = useState<string | undefined>(initialKey);\n  const [bbox, setBbox] = useState<{ left: number; width: number } | undefined>(\n    undefined\n  );\n  return {\n    tabKey,\n    bbox,\n    setTabKey,\n    setBbox,\n  };\n}\n\nconst [TabsProvider, useTabsContextUnsafe] = constate(useTabsData);\n\nfunction useTabsContext() {\n  const result = useTabsContextUnsafe();\n  return \"setTabKey\" in result ? result : undefined;\n}\nconst modulePath=\"@plasmicpkgs/plasmic-tabs\"\n\nexport const TabsContainerMeta: ComponentMeta<TabsProviderProps> = {\n    name: \"hostless-tabs-container\",\n    displayName: \"Tabs Container\",\n    importName: \"TabsContainer\",\n    importPath: modulePath,\n    providesData:true,\n    defaultStyles: {\n    width: \"stretch\",\n    padding: \"8px\",\n    },\n    props: {\n    initialKey: {\n      type: \"string\",\n      description: \"Key of the initially selected tab\",\n      defaultValue: \"tab1\",\n    },\n    previewKey: {\n      type: \"string\",\n      description: \"SShow this key while editing in Plasmic Studio\",\n    },\n    previewAll: {\n      type: \"boolean\",\n      description: \"Reveal all tab contents while editing in Plasmic Studio\",\n    },\n    children: {\n      type: \"slot\",\n      defaultValue: {\n        type: \"vbox\",\n        children: [\n          {\n            type: \"hbox\",\n            children: [\n              {\n                type: \"component\",\n                name: \"hostless-tab-button\",\n                props: {\n                  tabKey: \"tab1\",\n                  children:defaultButtonChildren(\"Tab 1\")\n                },\n              },\n              {\n                type: \"component\",\n                name: \"hostless-tab-button\",\n                props: {\n                  tabKey: \"tab2\",\n                  children:defaultButtonChildren(\"Tab 2\")\n                },\n              },\n              {\n                type: \"component\",\n                name: \"hostless-tab-underline\",\n              },\n            ],\n          },\n          {\n            type: \"vbox\",\n            children: [\n              {\n                type: \"component\",\n                name: \"hostless-tab-content\",\n                props: {\n                  tabKey: \"tab1\",\n                  children: [\n                    {\n                      type: \"vbox\",\n                      children: [\"Some content for tab 1\"],\n                    },\n                  ],\n                },\n              },\n              {\n                type: \"component\",\n                name: \"hostless-tab-content\",\n                props: {\n                  tabKey: \"tab2\",\n                  children: [\n                    {\n                      type: \"vbox\",\n                      children: [\"Some content for tab 2\"],\n                    },\n                  ],\n                },\n              },\n            ],\n          },\n        ],\n      },\n    },\n  },\n  };\n\n\nexport function TabsContainer({\n  children,\n  initialKey,\n  previewKey,\n  previewAll = false,\n}: TabsProviderProps) {\n  const inEditor = !!usePlasmicCanvasContext();\n  return (\n    <TabsProvider initialKey={initialKey}>\n      <DebugContext.Provider value={inEditor && previewAll}>\n        <Helper previewKey={previewKey || initialKey}>{children}</Helper>\n      </DebugContext.Provider>\n    </TabsProvider>\n  );\n}\n\nfunction ensure<T>(x: T | undefined | null) {\n  if (!x) {\n    throw new Error(\"unexpected nil\");\n  }\n  return x;\n}\n\nfunction Helper({\n  children,\n  previewKey,\n}: {\n  previewKey?: string;\n  children?: ReactNode;\n}) {\n  const inEditor = usePlasmicCanvasContext();\n  const { tabKey } = ensure(useTabsContext());\n  const effectiveKey = inEditor ? previewKey || tabKey : tabKey;\n  return (\n    <DataProvider name={\"currentTabKey\"} data={effectiveKey}>\n      {children}\n    </DataProvider>\n  );\n}\n\nexport interface TabUnderlineProps {\n  className?: string;\n}\n\nexport const TabUnderlineMeta:ComponentMeta <TabUnderlineProps>={\n    name: \"hostless-tab-underline\",\n    displayName: \"Tab Underline\",\n    importName: \"TabUnderline\",\n    importPath: modulePath,\n    props: {\n    children: {\n      type: \"slot\",\n    },\n    },\n    defaultStyles: {\n    background: \"#7777ff\",\n    height: \"2px\",\n    },\n}\n\n\nexport function TabUnderline({ className }: TabUnderlineProps) {\n  const { bbox } = useTabsContext() ?? { bbox: undefined };\n  return bbox ? (\n    <div\n      className={className}\n      style={{\n        ...JSON.parse(JSON.stringify(bbox)),\n        top: undefined,\n        bottom: 0,\n        position: \"absolute\",\n        transition: \".4s ease all\",\n      }}\n    ></div>\n  ) : null;\n}\n\nexport interface TabButtonProps {\n  className?: string;\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabButtonMeta:ComponentMeta<TabButtonProps>={\n    name: \"hostless-tab-button\",\n    isAttachment: true,\n    displayName: \"Tab Button\",\n    importName: \"TabButton\",\n    importPath: modulePath,\n    props: {\n    tabKey: {\n      type: \"string\",\n      description: \"The answer value selecting this choice sets\",\n    },\n    children: {\n      type: \"slot\",\n      defaultValue:defaultButtonChildren(\"Some tab\")\n    },\n  },\n  defaultStyles: {\n    width: \"hug\",\n  },\n}\n\nexport function TabButton({ className, children, tabKey }: TabButtonProps) {\n  const tabsContext = useTabsContext();\n  const ref = useRef<HTMLDivElement>(null);\n  const { tabKey: activeKey, setTabKey, bbox, setBbox } = tabsContext ?? {\n    tabKey: undefined,\n    setTabKey: noop,\n    bbox: undefined,\n    setBbox:noop,\n  };\n  useEffect(() => {\n    if (tabKey === activeKey) {\n      setBbox({\n        width: ref.current!.offsetWidth,\n        left: ref.current!.offsetLeft,\n      });\n    }\n  }, [ref.current, setBbox, JSON.stringify(bbox), tabKey, activeKey]);\n  return (\n    <div className={className} ref={ref}>\n      {cloneElement(React.Children.toArray(children)[0] as ReactElement, {\n        isActive: tabKey && activeKey && activeKey === tabKey,\n        onClick: () => {\n          setTabKey(tabKey);\n        },\n      })}\n    </div>\n  );\n}\n\nexport interface TabContentProps {\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabContentMeta:ComponentMeta<TabContentProps>={\n  name: \"hostless-tab-content\",\n  isAttachment: true,\n  displayName: \"Tab Content\",\n  importName: \"TabContent\",\n  importPath: modulePath,\n  props: {\n    tabKey: {\n      type: \"string\",\n      description: \"The answer value selecting this choice sets\",\n    },\n    children: {\n      type: \"slot\",\n      defaultValue: {\n      type:\"vbox\",\n      children:{\n        type:\"text\",\n        value:\"This is some tab content\"\n      }\n      },\n    },\n  },\n}\nexport function TabContent({ children, tabKey }: TabContentProps) {\n  const tabsContext = useTabsContext();\n  const previewAll = useContext(DebugContext);\n  const { tabKey: activeKey } = tabsContext ?? { tabKey: undefined };\n  return (\n    <>\n      {tabsContext === undefined || activeKey === tabKey || previewAll\n        ? children\n        : null}\n    </>\n  );\n}\n","import registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/host/registerComponent\";\n\nimport {\n  TabsContainer,\n  TabsContainerMeta,\n  TabUnderline,\n  TabUnderlineMeta,\n  TabButton,\n  TabButtonMeta,\n  TabContent, TabContentMeta\n} from \"./tabs\";\n\nexport function registerAll(loader?: {\n  registerComponent: typeof registerComponent;\n}) {\n  const _registerComponent = <T extends React.ComponentType<any>>(\n    Component: T,\n    defaultMeta: ComponentMeta<React.ComponentProps<T>>\n  ) => {\n    if (loader) {\n      loader.registerComponent(Component, defaultMeta);\n    } else {\n      registerComponent(Component, defaultMeta);\n    }\n  };\n  \n  _registerComponent(TabsContainer, TabsContainerMeta);\n  _registerComponent(TabUnderline, TabUnderlineMeta);\n  _registerComponent(TabButton, TabButtonMeta);\n  _registerComponent(TabContent, TabContentMeta);\n\n}\n\nexport * from \"./tabs\";\n"],"names":["noop","defaultButtonChildren","label","type","kind","props","children","value","DebugContext","createContext","useTabsData","initialKey","useState","tabKey","setTabKey","undefined","bbox","setBbox","constate","TabsProvider","useTabsContextUnsafe","useTabsContext","result","modulePath","TabsContainerMeta","name","displayName","importName","importPath","providesData","defaultStyles","width","padding","description","defaultValue","previewKey","previewAll","TabsContainer","inEditor","usePlasmicCanvasContext","React","Provider","Helper","ensure","x","Error","effectiveKey","DataProvider","data","TabUnderlineMeta","background","height","TabUnderline","className","style","JSON","parse","stringify","top","bottom","position","transition","TabButtonMeta","isAttachment","TabButton","tabsContext","ref","useRef","activeKey","useEffect","current","offsetWidth","left","offsetLeft","cloneElement","Children","toArray","isActive","onClick","TabContentMeta","TabContent","useContext","registerAll","loader","_registerComponent","Component","defaultMeta","registerComponent"],"mappings":"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"}
+{"version":3,"file":"plasmic-tabs.cjs.development.js","sources":["../src/tabs.tsx","../src/index.tsx"],"sourcesContent":["import {\n  ComponentMeta,\n  DataProvider,\n  usePlasmicCanvasContext,\n} from '@plasmicapp/host';\nimport constate from 'constate';\nimport React, {\n  cloneElement,\n  createContext,\n  ReactElement,\n  ReactNode,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nconst noop = () => {};\n\nfunction defaultButtonChildren(label: string) {\n  return {\n    type: 'default-component',\n    kind: 'button',\n    props: {\n      children: {\n        type: 'text',\n        value: label,\n      },\n    },\n  } as const;\n}\nexport interface TabsProviderProps {\n  children?: ReactNode;\n  initialKey?: string;\n  previewKey?: string;\n  previewAll?: boolean;\n}\n\nconst DebugContext = createContext(false);\n\nfunction useTabsData({ initialKey }: { initialKey?: string }) {\n  const [tabKey, setTabKey] = useState<string | undefined>(initialKey);\n  const [bbox, setBbox] = useState<{ left: number; width: number } | undefined>(\n    undefined\n  );\n  return {\n    tabKey,\n    bbox,\n    setTabKey,\n    setBbox,\n  };\n}\n\nconst [TabsProvider, useTabsContextUnsafe] = constate(useTabsData);\n\nfunction useTabsContext() {\n  const result = useTabsContextUnsafe();\n  return 'setTabKey' in result ? result : undefined;\n}\nconst modulePath = '@plasmicpkgs/plasmic-tabs';\n\nexport const TabsContainerMeta: ComponentMeta<TabsProviderProps> = {\n  name: 'hostless-tabs-container',\n  displayName: 'Tabs Container',\n  importName: 'TabsContainer',\n  importPath: modulePath,\n  providesData: true,\n  defaultStyles: {\n    width: 'stretch',\n    padding: '8px',\n  },\n  props: {\n    initialKey: {\n      type: 'string',\n      description: 'Key of the initially selected tab',\n      defaultValue: 'tab1',\n    },\n    previewKey: {\n      type: 'string',\n      description: 'SShow this key while editing in Plasmic Studio',\n    },\n    previewAll: {\n      type: 'boolean',\n      description: 'Reveal all tab contents while editing in Plasmic Studio',\n    },\n    children: {\n      type: 'slot',\n      defaultValue: {\n        type: 'vbox',\n        children: [\n          {\n            type: 'hbox',\n            children: [\n              {\n                type: 'component',\n                name: 'hostless-tab-button',\n                props: {\n                  tabKey: 'tab1',\n                  children: defaultButtonChildren('Tab 1'),\n                },\n              },\n              {\n                type: 'component',\n                name: 'hostless-tab-button',\n                props: {\n                  tabKey: 'tab2',\n                  children: defaultButtonChildren('Tab 2'),\n                },\n              },\n              {\n                type: 'component',\n                name: 'hostless-tab-underline',\n              },\n            ],\n          },\n          {\n            type: 'vbox',\n            children: [\n              {\n                type: 'component',\n                name: 'hostless-tab-content',\n                props: {\n                  tabKey: 'tab1',\n                  children: [\n                    {\n                      type: 'vbox',\n                      children: ['Some content for tab 1'],\n                    },\n                  ],\n                },\n              },\n              {\n                type: 'component',\n                name: 'hostless-tab-content',\n                props: {\n                  tabKey: 'tab2',\n                  children: [\n                    {\n                      type: 'vbox',\n                      children: ['Some content for tab 2'],\n                    },\n                  ],\n                },\n              },\n            ],\n          },\n        ],\n      },\n    },\n  },\n};\n\nexport function TabsContainer({\n  children,\n  initialKey,\n  previewKey,\n  previewAll = false,\n}: TabsProviderProps) {\n  const inEditor = !!usePlasmicCanvasContext();\n  return (\n    <TabsProvider initialKey={initialKey}>\n      <DebugContext.Provider value={inEditor && previewAll}>\n        <Helper previewKey={previewKey || initialKey}>{children}</Helper>\n      </DebugContext.Provider>\n    </TabsProvider>\n  );\n}\n\nfunction ensure<T>(x: T | undefined | null) {\n  if (!x) {\n    throw new Error('unexpected nil');\n  }\n  return x;\n}\n\nfunction Helper({\n  children,\n  previewKey,\n}: {\n  previewKey?: string;\n  children?: ReactNode;\n}) {\n  const inEditor = usePlasmicCanvasContext();\n  const { tabKey } = ensure(useTabsContext());\n  const effectiveKey = inEditor ? previewKey || tabKey : tabKey;\n  return (\n    <DataProvider name={'currentTabKey'} data={effectiveKey}>\n      {children}\n    </DataProvider>\n  );\n}\n\nexport interface TabUnderlineProps {\n  className?: string;\n}\n\nexport const TabUnderlineMeta: ComponentMeta<TabUnderlineProps> = {\n  name: 'hostless-tab-underline',\n  displayName: 'Tab Underline',\n  importName: 'TabUnderline',\n  importPath: modulePath,\n  props: {},\n  defaultStyles: {\n    background: '#7777ff',\n    height: '2px',\n  },\n};\n\nexport function TabUnderline({ className }: TabUnderlineProps) {\n  const { bbox } = useTabsContext() ?? { bbox: undefined };\n  return bbox ? (\n    <div\n      className={className}\n      style={{\n        ...JSON.parse(JSON.stringify(bbox)),\n        top: undefined,\n        bottom: 0,\n        position: 'absolute',\n        transition: '.4s ease all',\n      }}\n    ></div>\n  ) : null;\n}\n\nexport interface TabButtonProps {\n  className?: string;\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabButtonMeta: ComponentMeta<TabButtonProps> = {\n  name: 'hostless-tab-button',\n  isAttachment: true,\n  displayName: 'Tab Button',\n  importName: 'TabButton',\n  importPath: modulePath,\n  props: {\n    tabKey: {\n      type: 'string',\n      description: 'The answer value selecting this choice sets',\n    },\n    children: {\n      type: 'slot',\n      defaultValue: defaultButtonChildren('Some tab'),\n    },\n  },\n  defaultStyles: {\n    width: 'hug',\n  },\n};\n\nexport function TabButton({ className, children, tabKey }: TabButtonProps) {\n  const tabsContext = useTabsContext();\n  const ref = useRef<HTMLDivElement>(null);\n  const { tabKey: activeKey, setTabKey, bbox, setBbox } = tabsContext ?? {\n    tabKey: undefined,\n    setTabKey: noop,\n    bbox: undefined,\n    setBbox: noop,\n  };\n  useEffect(() => {\n    if (tabKey === activeKey) {\n      setBbox({\n        width: ref.current!.offsetWidth,\n        left: ref.current!.offsetLeft,\n      });\n    }\n  }, [ref.current, setBbox, JSON.stringify(bbox), tabKey, activeKey]);\n  return (\n    <div className={className} ref={ref}>\n      {cloneElement(React.Children.toArray(children)[0] as ReactElement, {\n        isActive: tabKey && activeKey && activeKey === tabKey,\n        onClick: () => {\n          setTabKey(tabKey);\n        },\n      })}\n    </div>\n  );\n}\n\nexport interface TabContentProps {\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabContentMeta: ComponentMeta<TabContentProps> = {\n  name: 'hostless-tab-content',\n  isAttachment: true,\n  displayName: 'Tab Content',\n  importName: 'TabContent',\n  importPath: modulePath,\n  props: {\n    tabKey: {\n      type: 'string',\n      description: 'The answer value selecting this choice sets',\n    },\n    children: {\n      type: 'slot',\n      defaultValue: {\n        type: 'vbox',\n        children: {\n          type: 'text',\n          value: 'This is some tab content',\n        },\n      },\n    },\n  },\n};\nexport function TabContent({ children, tabKey }: TabContentProps) {\n  const tabsContext = useTabsContext();\n  const previewAll = useContext(DebugContext);\n  const { tabKey: activeKey } = tabsContext ?? { tabKey: undefined };\n  return (\n    <>\n      {tabsContext === undefined || activeKey === tabKey || previewAll\n        ? children\n        : null}\n    </>\n  );\n}\n","import registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/host/registerComponent\";\n\nimport {\n  TabsContainer,\n  TabsContainerMeta,\n  TabUnderline,\n  TabUnderlineMeta,\n  TabButton,\n  TabButtonMeta,\n  TabContent, TabContentMeta\n} from \"./tabs\";\n\nexport function registerAll(loader?: {\n  registerComponent: typeof registerComponent;\n}) {\n  const _registerComponent = <T extends React.ComponentType<any>>(\n    Component: T,\n    defaultMeta: ComponentMeta<React.ComponentProps<T>>\n  ) => {\n    if (loader) {\n      loader.registerComponent(Component, defaultMeta);\n    } else {\n      registerComponent(Component, defaultMeta);\n    }\n  };\n  \n  _registerComponent(TabsContainer, TabsContainerMeta);\n  _registerComponent(TabUnderline, TabUnderlineMeta);\n  _registerComponent(TabButton, TabButtonMeta);\n  _registerComponent(TabContent, TabContentMeta);\n\n}\n\nexport * from \"./tabs\";\n"],"names":["noop","defaultButtonChildren","label","type","kind","props","children","value","DebugContext","createContext","useTabsData","initialKey","useState","tabKey","setTabKey","undefined","bbox","setBbox","constate","TabsProvider","useTabsContextUnsafe","useTabsContext","result","modulePath","TabsContainerMeta","name","displayName","importName","importPath","providesData","defaultStyles","width","padding","description","defaultValue","previewKey","previewAll","TabsContainer","inEditor","usePlasmicCanvasContext","React","Provider","Helper","ensure","x","Error","effectiveKey","DataProvider","data","TabUnderlineMeta","background","height","TabUnderline","className","style","JSON","parse","stringify","top","bottom","position","transition","TabButtonMeta","isAttachment","TabButton","tabsContext","ref","useRef","activeKey","useEffect","current","offsetWidth","left","offsetLeft","cloneElement","Children","toArray","isActive","onClick","TabContentMeta","TabContent","useContext","registerAll","loader","_registerComponent","Component","defaultMeta","registerComponent"],"mappings":"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"}

package/dist/plasmic-tabs.cjs.production.min.js

@@ -1,2 +1,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")),r=require("react"),i=e(r);function o(){return(o=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 p=r.createContext(!1);function c(e){var t=r.useState(e.initialKey),n=t[0],a=t[1],i=r.useState(void 0);return{tabKey:n,bbox:i[0],setTabKey:a,setBbox:i[1]}}var b=a(c),u=b[0],d=b[1];function y(){var e=d();return"setTabKey"in e?e:void 0}var h="@plasmicpkgs/plasmic-tabs",m={name:"hostless-tabs-container",displayName:"Tabs Container",importName:"TabsContainer",importPath:h,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"},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,r=e.previewKey,o=e.previewAll,s=void 0!==o&&o,l=!!n.usePlasmicCanvasContext();return i.createElement(u,{initialKey:a},i.createElement(p.Provider,{value:l&&s},i.createElement(f,{previewKey:r||a},t)))}function f(e){var t=e.children,a=e.previewKey,r=n.usePlasmicCanvasContext(),o=function(e){if(!e)throw new Error("unexpected nil");return e}(y()).tabKey;return i.createElement(n.DataProvider,{name:"currentTabKey",data:r&&a||o},t)}var x={name:"hostless-tab-underline",displayName:"Tab Underline",importName:"TabUnderline",importPath:h,props:{children:{type:"slot"}},defaultStyles:{background:"#7777ff",height:"2px"}};function K(e){var t,n=e.className,a=(null!=(t=y())?t:{bbox:void 0}).bbox;return a?i.createElement("div",{className:n,style:o({},JSON.parse(JSON.stringify(a)),{top:void 0,bottom:0,position:"absolute",transition:".4s ease all"})}):null}var T={name:"hostless-tab-button",isAttachment:!0,displayName:"Tab Button",importName:"TabButton",importPath:h,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,o=y(),l=r.useRef(null),p=null!=o?o:{tabKey:void 0,setTabKey:s,bbox:void 0,setBbox:s},c=p.tabKey,b=p.setTabKey,u=p.setBbox;return r.useEffect((function(){a===c&&u({width:l.current.offsetWidth,left:l.current.offsetLeft})}),[l.current,u,JSON.stringify(p.bbox),a,c]),i.createElement("div",{className:t,ref:l},r.cloneElement(i.Children.toArray(n)[0],{isActive:a&&c&&c===a,onClick:function(){b(a)}}))}var C={name:"hostless-tab-content",isAttachment:!0,displayName:"Tab Content",importName:"TabContent",importPath:h,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 w(e){var t=e.children,n=e.tabKey,a=y(),o=r.useContext(p);return i.createElement(i.Fragment,null,void 0===a||(null!=a?a:{tabKey:void 0}).tabKey===n||o?t:null)}exports.TabButton=g,exports.TabButtonMeta=T,exports.TabContent=w,exports.TabContentMeta=C,exports.TabUnderline=K,exports.TabUnderlineMeta=x,exports.TabsContainer=v,exports.TabsContainerMeta=m,exports.registerAll=function(e){var n=function(n,a){e?e.registerComponent(n,a):t(n,a)};n(v,m),n(K,x),n(g,T),n(w,C)};
+"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")),r=require("react"),i=e(r);function o(){return(o=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 p=r.createContext(!1);function c(e){var t=r.useState(e.initialKey),n=t[0],a=t[1],i=r.useState(void 0);return{tabKey:n,bbox:i[0],setTabKey:a,setBbox:i[1]}}var b=a(c),u=b[0],d=b[1];function y(){var e=d();return"setTabKey"in e?e:void 0}var m="@plasmicpkgs/plasmic-tabs",h={name:"hostless-tabs-container",displayName:"Tabs Container",importName:"TabsContainer",importPath:m,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"},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,r=e.previewKey,o=e.previewAll,s=void 0!==o&&o,l=!!n.usePlasmicCanvasContext();return i.createElement(u,{initialKey:a},i.createElement(p.Provider,{value:l&&s},i.createElement(f,{previewKey:r||a},t)))}function f(e){var t=e.children,a=e.previewKey,r=n.usePlasmicCanvasContext(),o=function(e){if(!e)throw new Error("unexpected nil");return e}(y()).tabKey;return i.createElement(n.DataProvider,{name:"currentTabKey",data:r&&a||o},t)}var x={name:"hostless-tab-underline",displayName:"Tab Underline",importName:"TabUnderline",importPath:m,props:{},defaultStyles:{background:"#7777ff",height:"2px"}};function K(e){var t,n=e.className,a=(null!=(t=y())?t:{bbox:void 0}).bbox;return a?i.createElement("div",{className:n,style:o({},JSON.parse(JSON.stringify(a)),{top:void 0,bottom:0,position:"absolute",transition:".4s ease all"})}):null}var T={name:"hostless-tab-button",isAttachment:!0,displayName:"Tab Button",importName:"TabButton",importPath:m,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,o=y(),l=r.useRef(null),p=null!=o?o:{tabKey:void 0,setTabKey:s,bbox:void 0,setBbox:s},c=p.tabKey,b=p.setTabKey,u=p.setBbox;return r.useEffect((function(){a===c&&u({width:l.current.offsetWidth,left:l.current.offsetLeft})}),[l.current,u,JSON.stringify(p.bbox),a,c]),i.createElement("div",{className:t,ref:l},r.cloneElement(i.Children.toArray(n)[0],{isActive:a&&c&&c===a,onClick:function(){b(a)}}))}var C={name:"hostless-tab-content",isAttachment:!0,displayName:"Tab Content",importName:"TabContent",importPath:m,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 w(e){var t=e.children,n=e.tabKey,a=y(),o=r.useContext(p);return i.createElement(i.Fragment,null,void 0===a||(null!=a?a:{tabKey:void 0}).tabKey===n||o?t:null)}exports.TabButton=g,exports.TabButtonMeta=T,exports.TabContent=w,exports.TabContentMeta=C,exports.TabUnderline=K,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(K,x),n(g,T),n(w,C)};
 //# sourceMappingURL=plasmic-tabs.cjs.production.min.js.map

package/dist/plasmic-tabs.cjs.production.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"plasmic-tabs.cjs.production.min.js","sources":["../src/tabs.tsx","../src/index.tsx"],"sourcesContent":["import { DataProvider, usePlasmicCanvasContext,ComponentMeta } from \"@plasmicapp/host\";\nimport constate from \"constate\";\nimport React, {\n  cloneElement,\n  createContext,\n  ReactElement,\n  ReactNode,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\n\n\nconst noop = ()=>{};\n\nfunction defaultButtonChildren(label: string) {\n  return {\n    type: \"default-component\",\n    kind: \"button\",\n    props: {\n      children: {\n        type: \"text\",\n        value: label,\n      },\n    },\n  } as const;\n}\nexport interface TabsProviderProps {\n  children?: ReactNode;\n  initialKey?: string;\n  previewKey?: string;\n  previewAll?: boolean;\n}\n\nconst DebugContext = createContext(false);\n\nfunction useTabsData({ initialKey }: { initialKey?: string }) {\n  const [tabKey, setTabKey] = useState<string | undefined>(initialKey);\n  const [bbox, setBbox] = useState<{ left: number; width: number } | undefined>(\n    undefined\n  );\n  return {\n    tabKey,\n    bbox,\n    setTabKey,\n    setBbox,\n  };\n}\n\nconst [TabsProvider, useTabsContextUnsafe] = constate(useTabsData);\n\nfunction useTabsContext() {\n  const result = useTabsContextUnsafe();\n  return \"setTabKey\" in result ? result : undefined;\n}\nconst modulePath=\"@plasmicpkgs/plasmic-tabs\"\n\nexport const TabsContainerMeta: ComponentMeta<TabsProviderProps> = {\n    name: \"hostless-tabs-container\",\n    displayName: \"Tabs Container\",\n    importName: \"TabsContainer\",\n    importPath: modulePath,\n    providesData:true,\n    defaultStyles: {\n    width: \"stretch\",\n    padding: \"8px\",\n    },\n    props: {\n    initialKey: {\n      type: \"string\",\n      description: \"Key of the initially selected tab\",\n      defaultValue: \"tab1\",\n    },\n    previewKey: {\n      type: \"string\",\n      description: \"SShow this key while editing in Plasmic Studio\",\n    },\n    previewAll: {\n      type: \"boolean\",\n      description: \"Reveal all tab contents while editing in Plasmic Studio\",\n    },\n    children: {\n      type: \"slot\",\n      defaultValue: {\n        type: \"vbox\",\n        children: [\n          {\n            type: \"hbox\",\n            children: [\n              {\n                type: \"component\",\n                name: \"hostless-tab-button\",\n                props: {\n                  tabKey: \"tab1\",\n                  children:defaultButtonChildren(\"Tab 1\")\n                },\n              },\n              {\n                type: \"component\",\n                name: \"hostless-tab-button\",\n                props: {\n                  tabKey: \"tab2\",\n                  children:defaultButtonChildren(\"Tab 2\")\n                },\n              },\n              {\n                type: \"component\",\n                name: \"hostless-tab-underline\",\n              },\n            ],\n          },\n          {\n            type: \"vbox\",\n            children: [\n              {\n                type: \"component\",\n                name: \"hostless-tab-content\",\n                props: {\n                  tabKey: \"tab1\",\n                  children: [\n                    {\n                      type: \"vbox\",\n                      children: [\"Some content for tab 1\"],\n                    },\n                  ],\n                },\n              },\n              {\n                type: \"component\",\n                name: \"hostless-tab-content\",\n                props: {\n                  tabKey: \"tab2\",\n                  children: [\n                    {\n                      type: \"vbox\",\n                      children: [\"Some content for tab 2\"],\n                    },\n                  ],\n                },\n              },\n            ],\n          },\n        ],\n      },\n    },\n  },\n  };\n\n\nexport function TabsContainer({\n  children,\n  initialKey,\n  previewKey,\n  previewAll = false,\n}: TabsProviderProps) {\n  const inEditor = !!usePlasmicCanvasContext();\n  return (\n    <TabsProvider initialKey={initialKey}>\n      <DebugContext.Provider value={inEditor && previewAll}>\n        <Helper previewKey={previewKey || initialKey}>{children}</Helper>\n      </DebugContext.Provider>\n    </TabsProvider>\n  );\n}\n\nfunction ensure<T>(x: T | undefined | null) {\n  if (!x) {\n    throw new Error(\"unexpected nil\");\n  }\n  return x;\n}\n\nfunction Helper({\n  children,\n  previewKey,\n}: {\n  previewKey?: string;\n  children?: ReactNode;\n}) {\n  const inEditor = usePlasmicCanvasContext();\n  const { tabKey } = ensure(useTabsContext());\n  const effectiveKey = inEditor ? previewKey || tabKey : tabKey;\n  return (\n    <DataProvider name={\"currentTabKey\"} data={effectiveKey}>\n      {children}\n    </DataProvider>\n  );\n}\n\nexport interface TabUnderlineProps {\n  className?: string;\n}\n\nexport const TabUnderlineMeta:ComponentMeta <TabUnderlineProps>={\n    name: \"hostless-tab-underline\",\n    displayName: \"Tab Underline\",\n    importName: \"TabUnderline\",\n    importPath: modulePath,\n    props: {\n    children: {\n      type: \"slot\",\n    },\n    },\n    defaultStyles: {\n    background: \"#7777ff\",\n    height: \"2px\",\n    },\n}\n\n\nexport function TabUnderline({ className }: TabUnderlineProps) {\n  const { bbox } = useTabsContext() ?? { bbox: undefined };\n  return bbox ? (\n    <div\n      className={className}\n      style={{\n        ...JSON.parse(JSON.stringify(bbox)),\n        top: undefined,\n        bottom: 0,\n        position: \"absolute\",\n        transition: \".4s ease all\",\n      }}\n    ></div>\n  ) : null;\n}\n\nexport interface TabButtonProps {\n  className?: string;\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabButtonMeta:ComponentMeta<TabButtonProps>={\n    name: \"hostless-tab-button\",\n    isAttachment: true,\n    displayName: \"Tab Button\",\n    importName: \"TabButton\",\n    importPath: modulePath,\n    props: {\n    tabKey: {\n      type: \"string\",\n      description: \"The answer value selecting this choice sets\",\n    },\n    children: {\n      type: \"slot\",\n      defaultValue:defaultButtonChildren(\"Some tab\")\n    },\n  },\n  defaultStyles: {\n    width: \"hug\",\n  },\n}\n\nexport function TabButton({ className, children, tabKey }: TabButtonProps) {\n  const tabsContext = useTabsContext();\n  const ref = useRef<HTMLDivElement>(null);\n  const { tabKey: activeKey, setTabKey, bbox, setBbox } = tabsContext ?? {\n    tabKey: undefined,\n    setTabKey: noop,\n    bbox: undefined,\n    setBbox:noop,\n  };\n  useEffect(() => {\n    if (tabKey === activeKey) {\n      setBbox({\n        width: ref.current!.offsetWidth,\n        left: ref.current!.offsetLeft,\n      });\n    }\n  }, [ref.current, setBbox, JSON.stringify(bbox), tabKey, activeKey]);\n  return (\n    <div className={className} ref={ref}>\n      {cloneElement(React.Children.toArray(children)[0] as ReactElement, {\n        isActive: tabKey && activeKey && activeKey === tabKey,\n        onClick: () => {\n          setTabKey(tabKey);\n        },\n      })}\n    </div>\n  );\n}\n\nexport interface TabContentProps {\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabContentMeta:ComponentMeta<TabContentProps>={\n  name: \"hostless-tab-content\",\n  isAttachment: true,\n  displayName: \"Tab Content\",\n  importName: \"TabContent\",\n  importPath: modulePath,\n  props: {\n    tabKey: {\n      type: \"string\",\n      description: \"The answer value selecting this choice sets\",\n    },\n    children: {\n      type: \"slot\",\n      defaultValue: {\n      type:\"vbox\",\n      children:{\n        type:\"text\",\n        value:\"This is some tab content\"\n      }\n      },\n    },\n  },\n}\nexport function TabContent({ children, tabKey }: TabContentProps) {\n  const tabsContext = useTabsContext();\n  const previewAll = useContext(DebugContext);\n  const { tabKey: activeKey } = tabsContext ?? { tabKey: undefined };\n  return (\n    <>\n      {tabsContext === undefined || activeKey === tabKey || previewAll\n        ? children\n        : null}\n    </>\n  );\n}\n","import registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/host/registerComponent\";\n\nimport {\n  TabsContainer,\n  TabsContainerMeta,\n  TabUnderline,\n  TabUnderlineMeta,\n  TabButton,\n  TabButtonMeta,\n  TabContent, TabContentMeta\n} from \"./tabs\";\n\nexport function registerAll(loader?: {\n  registerComponent: typeof registerComponent;\n}) {\n  const _registerComponent = <T extends React.ComponentType<any>>(\n    Component: T,\n    defaultMeta: ComponentMeta<React.ComponentProps<T>>\n  ) => {\n    if (loader) {\n      loader.registerComponent(Component, defaultMeta);\n    } else {\n      registerComponent(Component, defaultMeta);\n    }\n  };\n  \n  _registerComponent(TabsContainer, TabsContainerMeta);\n  _registerComponent(TabUnderline, TabUnderlineMeta);\n  _registerComponent(TabButton, TabButtonMeta);\n  _registerComponent(TabContent, TabContentMeta);\n\n}\n\nexport * from \"./tabs\";\n"],"names":["noop","defaultButtonChildren","label","type","kind","props","children","value","DebugContext","createContext","useTabsData","useState","initialKey","tabKey","setTabKey","undefined","bbox","setBbox","constate","TabsProvider","useTabsContextUnsafe","useTabsContext","result","modulePath","TabsContainerMeta","name","displayName","importName","importPath","providesData","defaultStyles","width","padding","description","defaultValue","previewKey","previewAll","TabsContainer","_ref2$previewAll","inEditor","usePlasmicCanvasContext","React","Provider","Helper","x","Error","ensure","DataProvider","data","TabUnderlineMeta","background","height","TabUnderline","className","style","JSON","parse","stringify","top","bottom","position","transition","TabButtonMeta","isAttachment","TabButton","tabsContext","ref","useRef","activeKey","useEffect","current","offsetWidth","left","offsetLeft","cloneElement","Children","toArray","isActive","onClick","TabContentMeta","TabContent","useContext","loader","_registerComponent","Component","defaultMeta","registerComponent"],"mappings":"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"}
+{"version":3,"file":"plasmic-tabs.cjs.production.min.js","sources":["../src/tabs.tsx","../src/index.tsx"],"sourcesContent":["import {\n  ComponentMeta,\n  DataProvider,\n  usePlasmicCanvasContext,\n} from '@plasmicapp/host';\nimport constate from 'constate';\nimport React, {\n  cloneElement,\n  createContext,\n  ReactElement,\n  ReactNode,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nconst noop = () => {};\n\nfunction defaultButtonChildren(label: string) {\n  return {\n    type: 'default-component',\n    kind: 'button',\n    props: {\n      children: {\n        type: 'text',\n        value: label,\n      },\n    },\n  } as const;\n}\nexport interface TabsProviderProps {\n  children?: ReactNode;\n  initialKey?: string;\n  previewKey?: string;\n  previewAll?: boolean;\n}\n\nconst DebugContext = createContext(false);\n\nfunction useTabsData({ initialKey }: { initialKey?: string }) {\n  const [tabKey, setTabKey] = useState<string | undefined>(initialKey);\n  const [bbox, setBbox] = useState<{ left: number; width: number } | undefined>(\n    undefined\n  );\n  return {\n    tabKey,\n    bbox,\n    setTabKey,\n    setBbox,\n  };\n}\n\nconst [TabsProvider, useTabsContextUnsafe] = constate(useTabsData);\n\nfunction useTabsContext() {\n  const result = useTabsContextUnsafe();\n  return 'setTabKey' in result ? result : undefined;\n}\nconst modulePath = '@plasmicpkgs/plasmic-tabs';\n\nexport const TabsContainerMeta: ComponentMeta<TabsProviderProps> = {\n  name: 'hostless-tabs-container',\n  displayName: 'Tabs Container',\n  importName: 'TabsContainer',\n  importPath: modulePath,\n  providesData: true,\n  defaultStyles: {\n    width: 'stretch',\n    padding: '8px',\n  },\n  props: {\n    initialKey: {\n      type: 'string',\n      description: 'Key of the initially selected tab',\n      defaultValue: 'tab1',\n    },\n    previewKey: {\n      type: 'string',\n      description: 'SShow this key while editing in Plasmic Studio',\n    },\n    previewAll: {\n      type: 'boolean',\n      description: 'Reveal all tab contents while editing in Plasmic Studio',\n    },\n    children: {\n      type: 'slot',\n      defaultValue: {\n        type: 'vbox',\n        children: [\n          {\n            type: 'hbox',\n            children: [\n              {\n                type: 'component',\n                name: 'hostless-tab-button',\n                props: {\n                  tabKey: 'tab1',\n                  children: defaultButtonChildren('Tab 1'),\n                },\n              },\n              {\n                type: 'component',\n                name: 'hostless-tab-button',\n                props: {\n                  tabKey: 'tab2',\n                  children: defaultButtonChildren('Tab 2'),\n                },\n              },\n              {\n                type: 'component',\n                name: 'hostless-tab-underline',\n              },\n            ],\n          },\n          {\n            type: 'vbox',\n            children: [\n              {\n                type: 'component',\n                name: 'hostless-tab-content',\n                props: {\n                  tabKey: 'tab1',\n                  children: [\n                    {\n                      type: 'vbox',\n                      children: ['Some content for tab 1'],\n                    },\n                  ],\n                },\n              },\n              {\n                type: 'component',\n                name: 'hostless-tab-content',\n                props: {\n                  tabKey: 'tab2',\n                  children: [\n                    {\n                      type: 'vbox',\n                      children: ['Some content for tab 2'],\n                    },\n                  ],\n                },\n              },\n            ],\n          },\n        ],\n      },\n    },\n  },\n};\n\nexport function TabsContainer({\n  children,\n  initialKey,\n  previewKey,\n  previewAll = false,\n}: TabsProviderProps) {\n  const inEditor = !!usePlasmicCanvasContext();\n  return (\n    <TabsProvider initialKey={initialKey}>\n      <DebugContext.Provider value={inEditor && previewAll}>\n        <Helper previewKey={previewKey || initialKey}>{children}</Helper>\n      </DebugContext.Provider>\n    </TabsProvider>\n  );\n}\n\nfunction ensure<T>(x: T | undefined | null) {\n  if (!x) {\n    throw new Error('unexpected nil');\n  }\n  return x;\n}\n\nfunction Helper({\n  children,\n  previewKey,\n}: {\n  previewKey?: string;\n  children?: ReactNode;\n}) {\n  const inEditor = usePlasmicCanvasContext();\n  const { tabKey } = ensure(useTabsContext());\n  const effectiveKey = inEditor ? previewKey || tabKey : tabKey;\n  return (\n    <DataProvider name={'currentTabKey'} data={effectiveKey}>\n      {children}\n    </DataProvider>\n  );\n}\n\nexport interface TabUnderlineProps {\n  className?: string;\n}\n\nexport const TabUnderlineMeta: ComponentMeta<TabUnderlineProps> = {\n  name: 'hostless-tab-underline',\n  displayName: 'Tab Underline',\n  importName: 'TabUnderline',\n  importPath: modulePath,\n  props: {},\n  defaultStyles: {\n    background: '#7777ff',\n    height: '2px',\n  },\n};\n\nexport function TabUnderline({ className }: TabUnderlineProps) {\n  const { bbox } = useTabsContext() ?? { bbox: undefined };\n  return bbox ? (\n    <div\n      className={className}\n      style={{\n        ...JSON.parse(JSON.stringify(bbox)),\n        top: undefined,\n        bottom: 0,\n        position: 'absolute',\n        transition: '.4s ease all',\n      }}\n    ></div>\n  ) : null;\n}\n\nexport interface TabButtonProps {\n  className?: string;\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabButtonMeta: ComponentMeta<TabButtonProps> = {\n  name: 'hostless-tab-button',\n  isAttachment: true,\n  displayName: 'Tab Button',\n  importName: 'TabButton',\n  importPath: modulePath,\n  props: {\n    tabKey: {\n      type: 'string',\n      description: 'The answer value selecting this choice sets',\n    },\n    children: {\n      type: 'slot',\n      defaultValue: defaultButtonChildren('Some tab'),\n    },\n  },\n  defaultStyles: {\n    width: 'hug',\n  },\n};\n\nexport function TabButton({ className, children, tabKey }: TabButtonProps) {\n  const tabsContext = useTabsContext();\n  const ref = useRef<HTMLDivElement>(null);\n  const { tabKey: activeKey, setTabKey, bbox, setBbox } = tabsContext ?? {\n    tabKey: undefined,\n    setTabKey: noop,\n    bbox: undefined,\n    setBbox: noop,\n  };\n  useEffect(() => {\n    if (tabKey === activeKey) {\n      setBbox({\n        width: ref.current!.offsetWidth,\n        left: ref.current!.offsetLeft,\n      });\n    }\n  }, [ref.current, setBbox, JSON.stringify(bbox), tabKey, activeKey]);\n  return (\n    <div className={className} ref={ref}>\n      {cloneElement(React.Children.toArray(children)[0] as ReactElement, {\n        isActive: tabKey && activeKey && activeKey === tabKey,\n        onClick: () => {\n          setTabKey(tabKey);\n        },\n      })}\n    </div>\n  );\n}\n\nexport interface TabContentProps {\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabContentMeta: ComponentMeta<TabContentProps> = {\n  name: 'hostless-tab-content',\n  isAttachment: true,\n  displayName: 'Tab Content',\n  importName: 'TabContent',\n  importPath: modulePath,\n  props: {\n    tabKey: {\n      type: 'string',\n      description: 'The answer value selecting this choice sets',\n    },\n    children: {\n      type: 'slot',\n      defaultValue: {\n        type: 'vbox',\n        children: {\n          type: 'text',\n          value: 'This is some tab content',\n        },\n      },\n    },\n  },\n};\nexport function TabContent({ children, tabKey }: TabContentProps) {\n  const tabsContext = useTabsContext();\n  const previewAll = useContext(DebugContext);\n  const { tabKey: activeKey } = tabsContext ?? { tabKey: undefined };\n  return (\n    <>\n      {tabsContext === undefined || activeKey === tabKey || previewAll\n        ? children\n        : null}\n    </>\n  );\n}\n","import registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/host/registerComponent\";\n\nimport {\n  TabsContainer,\n  TabsContainerMeta,\n  TabUnderline,\n  TabUnderlineMeta,\n  TabButton,\n  TabButtonMeta,\n  TabContent, TabContentMeta\n} from \"./tabs\";\n\nexport function registerAll(loader?: {\n  registerComponent: typeof registerComponent;\n}) {\n  const _registerComponent = <T extends React.ComponentType<any>>(\n    Component: T,\n    defaultMeta: ComponentMeta<React.ComponentProps<T>>\n  ) => {\n    if (loader) {\n      loader.registerComponent(Component, defaultMeta);\n    } else {\n      registerComponent(Component, defaultMeta);\n    }\n  };\n  \n  _registerComponent(TabsContainer, TabsContainerMeta);\n  _registerComponent(TabUnderline, TabUnderlineMeta);\n  _registerComponent(TabButton, TabButtonMeta);\n  _registerComponent(TabContent, TabContentMeta);\n\n}\n\nexport * from \"./tabs\";\n"],"names":["noop","defaultButtonChildren","label","type","kind","props","children","value","DebugContext","createContext","useTabsData","useState","initialKey","tabKey","setTabKey","undefined","bbox","setBbox","constate","TabsProvider","useTabsContextUnsafe","useTabsContext","result","modulePath","TabsContainerMeta","name","displayName","importName","importPath","providesData","defaultStyles","width","padding","description","defaultValue","previewKey","previewAll","TabsContainer","_ref2$previewAll","inEditor","usePlasmicCanvasContext","React","Provider","Helper","x","Error","ensure","DataProvider","data","TabUnderlineMeta","background","height","TabUnderline","className","style","JSON","parse","stringify","top","bottom","position","transition","TabButtonMeta","isAttachment","TabButton","tabsContext","ref","useRef","activeKey","useEffect","current","offsetWidth","left","offsetLeft","cloneElement","Children","toArray","isActive","onClick","TabContentMeta","TabContent","useContext","loader","_registerComponent","Component","defaultMeta","registerComponent"],"mappings":"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"}

package/dist/plasmic-tabs.esm.js

@@ -21,11 +21,11 @@ function _extends() {
 var noop = function noop() {};
 function defaultButtonChildren(label) {
   return {
-    type: "default-component",
-    kind: "button",
+    type: 'default-component',
+    kind: 'button',
     props: {
       children: {
-        type: "text",
+        type: 'text',
         value: label
       }
     }
@@ -52,77 +52,77 @@ var _constate = /*#__PURE__*/constate(useTabsData),
   useTabsContextUnsafe = _constate[1];
 function useTabsContext() {
   var result = useTabsContextUnsafe();
-  return "setTabKey" in result ? result : undefined;
+  return 'setTabKey' in result ? result : undefined;
 }
-var modulePath = "@plasmicpkgs/plasmic-tabs";
+var modulePath = '@plasmicpkgs/plasmic-tabs';
 var TabsContainerMeta = {
-  name: "hostless-tabs-container",
-  displayName: "Tabs Container",
-  importName: "TabsContainer",
+  name: 'hostless-tabs-container',
+  displayName: 'Tabs Container',
+  importName: 'TabsContainer',
   importPath: modulePath,
   providesData: true,
   defaultStyles: {
-    width: "stretch",
-    padding: "8px"
+    width: 'stretch',
+    padding: '8px'
   },
   props: {
     initialKey: {
-      type: "string",
-      description: "Key of the initially selected tab",
-      defaultValue: "tab1"
+      type: 'string',
+      description: 'Key of the initially selected tab',
+      defaultValue: 'tab1'
     },
     previewKey: {
-      type: "string",
-      description: "SShow this key while editing in Plasmic Studio"
+      type: 'string',
+      description: 'SShow this key while editing in Plasmic Studio'
     },
     previewAll: {
-      type: "boolean",
-      description: "Reveal all tab contents while editing in Plasmic Studio"
+      type: 'boolean',
+      description: 'Reveal all tab contents while editing in Plasmic Studio'
     },
     children: {
-      type: "slot",
+      type: 'slot',
       defaultValue: {
-        type: "vbox",
+        type: 'vbox',
         children: [{
-          type: "hbox",
+          type: 'hbox',
           children: [{
-            type: "component",
-            name: "hostless-tab-button",
+            type: 'component',
+            name: 'hostless-tab-button',
             props: {
-              tabKey: "tab1",
-              children: /*#__PURE__*/defaultButtonChildren("Tab 1")
+              tabKey: 'tab1',
+              children: /*#__PURE__*/defaultButtonChildren('Tab 1')
             }
           }, {
-            type: "component",
-            name: "hostless-tab-button",
+            type: 'component',
+            name: 'hostless-tab-button',
             props: {
-              tabKey: "tab2",
-              children: /*#__PURE__*/defaultButtonChildren("Tab 2")
+              tabKey: 'tab2',
+              children: /*#__PURE__*/defaultButtonChildren('Tab 2')
             }
           }, {
-            type: "component",
-            name: "hostless-tab-underline"
+            type: 'component',
+            name: 'hostless-tab-underline'
           }]
         }, {
-          type: "vbox",
+          type: 'vbox',
           children: [{
-            type: "component",
-            name: "hostless-tab-content",
+            type: 'component',
+            name: 'hostless-tab-content',
             props: {
-              tabKey: "tab1",
+              tabKey: 'tab1',
               children: [{
-                type: "vbox",
-                children: ["Some content for tab 1"]
+                type: 'vbox',
+                children: ['Some content for tab 1']
               }]
             }
           }, {
-            type: "component",
-            name: "hostless-tab-content",
+            type: 'component',
+            name: 'hostless-tab-content',
             props: {
-              tabKey: "tab2",
+              tabKey: 'tab2',
               children: [{
-                type: "vbox",
-                children: ["Some content for tab 2"]
+                type: 'vbox',
+                children: ['Some content for tab 2']
               }]
             }
           }]
@@ -148,7 +148,7 @@ function TabsContainer(_ref2) {
 }
 function ensure(x) {
   if (!x) {
-    throw new Error("unexpected nil");
+    throw new Error('unexpected nil');
   }
   return x;
 }
@@ -160,23 +160,19 @@ function Helper(_ref3) {
     tabKey = _ensure.tabKey;
   var effectiveKey = inEditor ? previewKey || tabKey : tabKey;
   return React.createElement(DataProvider, {
-    name: "currentTabKey",
+    name: 'currentTabKey',
     data: effectiveKey
   }, children);
 }
 var TabUnderlineMeta = {
-  name: "hostless-tab-underline",
-  displayName: "Tab Underline",
-  importName: "TabUnderline",
+  name: 'hostless-tab-underline',
+  displayName: 'Tab Underline',
+  importName: 'TabUnderline',
   importPath: modulePath,
-  props: {
-    children: {
-      type: "slot"
-    }
-  },
+  props: {},
   defaultStyles: {
-    background: "#7777ff",
-    height: "2px"
+    background: '#7777ff',
+    height: '2px'
   }
 };
 function TabUnderline(_ref4) {
@@ -191,29 +187,29 @@ function TabUnderline(_ref4) {
     style: _extends({}, JSON.parse(JSON.stringify(bbox)), {
       top: undefined,
       bottom: 0,
-      position: "absolute",
-      transition: ".4s ease all"
+      position: 'absolute',
+      transition: '.4s ease all'
     })
   }) : null;
 }
 var TabButtonMeta = {
-  name: "hostless-tab-button",
+  name: 'hostless-tab-button',
   isAttachment: true,
-  displayName: "Tab Button",
-  importName: "TabButton",
+  displayName: 'Tab Button',
+  importName: 'TabButton',
   importPath: modulePath,
   props: {
     tabKey: {
-      type: "string",
-      description: "The answer value selecting this choice sets"
+      type: 'string',
+      description: 'The answer value selecting this choice sets'
     },
     children: {
-      type: "slot",
-      defaultValue: /*#__PURE__*/defaultButtonChildren("Some tab")
+      type: 'slot',
+      defaultValue: /*#__PURE__*/defaultButtonChildren('Some tab')
     }
   },
   defaultStyles: {
-    width: "hug"
+    width: 'hug'
   }
 };
 function TabButton(_ref6) {
@@ -251,23 +247,23 @@ function TabButton(_ref6) {
   }));
 }
 var TabContentMeta = {
-  name: "hostless-tab-content",
+  name: 'hostless-tab-content',
   isAttachment: true,
-  displayName: "Tab Content",
-  importName: "TabContent",
+  displayName: 'Tab Content',
+  importName: 'TabContent',
   importPath: modulePath,
   props: {
     tabKey: {
-      type: "string",
-      description: "The answer value selecting this choice sets"
+      type: 'string',
+      description: 'The answer value selecting this choice sets'
     },
     children: {
-      type: "slot",
+      type: 'slot',
       defaultValue: {
-        type: "vbox",
+        type: 'vbox',
         children: {
-          type: "text",
-          value: "This is some tab content"
+          type: 'text',
+          value: 'This is some tab content'
         }
       }
     }

package/dist/plasmic-tabs.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"plasmic-tabs.esm.js","sources":["../src/tabs.tsx","../src/index.tsx"],"sourcesContent":["import { DataProvider, usePlasmicCanvasContext,ComponentMeta } from \"@plasmicapp/host\";\nimport constate from \"constate\";\nimport React, {\n  cloneElement,\n  createContext,\n  ReactElement,\n  ReactNode,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\n\n\nconst noop = ()=>{};\n\nfunction defaultButtonChildren(label: string) {\n  return {\n    type: \"default-component\",\n    kind: \"button\",\n    props: {\n      children: {\n        type: \"text\",\n        value: label,\n      },\n    },\n  } as const;\n}\nexport interface TabsProviderProps {\n  children?: ReactNode;\n  initialKey?: string;\n  previewKey?: string;\n  previewAll?: boolean;\n}\n\nconst DebugContext = createContext(false);\n\nfunction useTabsData({ initialKey }: { initialKey?: string }) {\n  const [tabKey, setTabKey] = useState<string | undefined>(initialKey);\n  const [bbox, setBbox] = useState<{ left: number; width: number } | undefined>(\n    undefined\n  );\n  return {\n    tabKey,\n    bbox,\n    setTabKey,\n    setBbox,\n  };\n}\n\nconst [TabsProvider, useTabsContextUnsafe] = constate(useTabsData);\n\nfunction useTabsContext() {\n  const result = useTabsContextUnsafe();\n  return \"setTabKey\" in result ? result : undefined;\n}\nconst modulePath=\"@plasmicpkgs/plasmic-tabs\"\n\nexport const TabsContainerMeta: ComponentMeta<TabsProviderProps> = {\n    name: \"hostless-tabs-container\",\n    displayName: \"Tabs Container\",\n    importName: \"TabsContainer\",\n    importPath: modulePath,\n    providesData:true,\n    defaultStyles: {\n    width: \"stretch\",\n    padding: \"8px\",\n    },\n    props: {\n    initialKey: {\n      type: \"string\",\n      description: \"Key of the initially selected tab\",\n      defaultValue: \"tab1\",\n    },\n    previewKey: {\n      type: \"string\",\n      description: \"SShow this key while editing in Plasmic Studio\",\n    },\n    previewAll: {\n      type: \"boolean\",\n      description: \"Reveal all tab contents while editing in Plasmic Studio\",\n    },\n    children: {\n      type: \"slot\",\n      defaultValue: {\n        type: \"vbox\",\n        children: [\n          {\n            type: \"hbox\",\n            children: [\n              {\n                type: \"component\",\n                name: \"hostless-tab-button\",\n                props: {\n                  tabKey: \"tab1\",\n                  children:defaultButtonChildren(\"Tab 1\")\n                },\n              },\n              {\n                type: \"component\",\n                name: \"hostless-tab-button\",\n                props: {\n                  tabKey: \"tab2\",\n                  children:defaultButtonChildren(\"Tab 2\")\n                },\n              },\n              {\n                type: \"component\",\n                name: \"hostless-tab-underline\",\n              },\n            ],\n          },\n          {\n            type: \"vbox\",\n            children: [\n              {\n                type: \"component\",\n                name: \"hostless-tab-content\",\n                props: {\n                  tabKey: \"tab1\",\n                  children: [\n                    {\n                      type: \"vbox\",\n                      children: [\"Some content for tab 1\"],\n                    },\n                  ],\n                },\n              },\n              {\n                type: \"component\",\n                name: \"hostless-tab-content\",\n                props: {\n                  tabKey: \"tab2\",\n                  children: [\n                    {\n                      type: \"vbox\",\n                      children: [\"Some content for tab 2\"],\n                    },\n                  ],\n                },\n              },\n            ],\n          },\n        ],\n      },\n    },\n  },\n  };\n\n\nexport function TabsContainer({\n  children,\n  initialKey,\n  previewKey,\n  previewAll = false,\n}: TabsProviderProps) {\n  const inEditor = !!usePlasmicCanvasContext();\n  return (\n    <TabsProvider initialKey={initialKey}>\n      <DebugContext.Provider value={inEditor && previewAll}>\n        <Helper previewKey={previewKey || initialKey}>{children}</Helper>\n      </DebugContext.Provider>\n    </TabsProvider>\n  );\n}\n\nfunction ensure<T>(x: T | undefined | null) {\n  if (!x) {\n    throw new Error(\"unexpected nil\");\n  }\n  return x;\n}\n\nfunction Helper({\n  children,\n  previewKey,\n}: {\n  previewKey?: string;\n  children?: ReactNode;\n}) {\n  const inEditor = usePlasmicCanvasContext();\n  const { tabKey } = ensure(useTabsContext());\n  const effectiveKey = inEditor ? previewKey || tabKey : tabKey;\n  return (\n    <DataProvider name={\"currentTabKey\"} data={effectiveKey}>\n      {children}\n    </DataProvider>\n  );\n}\n\nexport interface TabUnderlineProps {\n  className?: string;\n}\n\nexport const TabUnderlineMeta:ComponentMeta <TabUnderlineProps>={\n    name: \"hostless-tab-underline\",\n    displayName: \"Tab Underline\",\n    importName: \"TabUnderline\",\n    importPath: modulePath,\n    props: {\n    children: {\n      type: \"slot\",\n    },\n    },\n    defaultStyles: {\n    background: \"#7777ff\",\n    height: \"2px\",\n    },\n}\n\n\nexport function TabUnderline({ className }: TabUnderlineProps) {\n  const { bbox } = useTabsContext() ?? { bbox: undefined };\n  return bbox ? (\n    <div\n      className={className}\n      style={{\n        ...JSON.parse(JSON.stringify(bbox)),\n        top: undefined,\n        bottom: 0,\n        position: \"absolute\",\n        transition: \".4s ease all\",\n      }}\n    ></div>\n  ) : null;\n}\n\nexport interface TabButtonProps {\n  className?: string;\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabButtonMeta:ComponentMeta<TabButtonProps>={\n    name: \"hostless-tab-button\",\n    isAttachment: true,\n    displayName: \"Tab Button\",\n    importName: \"TabButton\",\n    importPath: modulePath,\n    props: {\n    tabKey: {\n      type: \"string\",\n      description: \"The answer value selecting this choice sets\",\n    },\n    children: {\n      type: \"slot\",\n      defaultValue:defaultButtonChildren(\"Some tab\")\n    },\n  },\n  defaultStyles: {\n    width: \"hug\",\n  },\n}\n\nexport function TabButton({ className, children, tabKey }: TabButtonProps) {\n  const tabsContext = useTabsContext();\n  const ref = useRef<HTMLDivElement>(null);\n  const { tabKey: activeKey, setTabKey, bbox, setBbox } = tabsContext ?? {\n    tabKey: undefined,\n    setTabKey: noop,\n    bbox: undefined,\n    setBbox:noop,\n  };\n  useEffect(() => {\n    if (tabKey === activeKey) {\n      setBbox({\n        width: ref.current!.offsetWidth,\n        left: ref.current!.offsetLeft,\n      });\n    }\n  }, [ref.current, setBbox, JSON.stringify(bbox), tabKey, activeKey]);\n  return (\n    <div className={className} ref={ref}>\n      {cloneElement(React.Children.toArray(children)[0] as ReactElement, {\n        isActive: tabKey && activeKey && activeKey === tabKey,\n        onClick: () => {\n          setTabKey(tabKey);\n        },\n      })}\n    </div>\n  );\n}\n\nexport interface TabContentProps {\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabContentMeta:ComponentMeta<TabContentProps>={\n  name: \"hostless-tab-content\",\n  isAttachment: true,\n  displayName: \"Tab Content\",\n  importName: \"TabContent\",\n  importPath: modulePath,\n  props: {\n    tabKey: {\n      type: \"string\",\n      description: \"The answer value selecting this choice sets\",\n    },\n    children: {\n      type: \"slot\",\n      defaultValue: {\n      type:\"vbox\",\n      children:{\n        type:\"text\",\n        value:\"This is some tab content\"\n      }\n      },\n    },\n  },\n}\nexport function TabContent({ children, tabKey }: TabContentProps) {\n  const tabsContext = useTabsContext();\n  const previewAll = useContext(DebugContext);\n  const { tabKey: activeKey } = tabsContext ?? { tabKey: undefined };\n  return (\n    <>\n      {tabsContext === undefined || activeKey === tabKey || previewAll\n        ? children\n        : null}\n    </>\n  );\n}\n","import registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/host/registerComponent\";\n\nimport {\n  TabsContainer,\n  TabsContainerMeta,\n  TabUnderline,\n  TabUnderlineMeta,\n  TabButton,\n  TabButtonMeta,\n  TabContent, TabContentMeta\n} from \"./tabs\";\n\nexport function registerAll(loader?: {\n  registerComponent: typeof registerComponent;\n}) {\n  const _registerComponent = <T extends React.ComponentType<any>>(\n    Component: T,\n    defaultMeta: ComponentMeta<React.ComponentProps<T>>\n  ) => {\n    if (loader) {\n      loader.registerComponent(Component, defaultMeta);\n    } else {\n      registerComponent(Component, defaultMeta);\n    }\n  };\n  \n  _registerComponent(TabsContainer, TabsContainerMeta);\n  _registerComponent(TabUnderline, TabUnderlineMeta);\n  _registerComponent(TabButton, TabButtonMeta);\n  _registerComponent(TabContent, TabContentMeta);\n\n}\n\nexport * from \"./tabs\";\n"],"names":["noop","defaultButtonChildren","label","type","kind","props","children","value","DebugContext","createContext","useTabsData","initialKey","useState","tabKey","setTabKey","undefined","bbox","setBbox","constate","TabsProvider","useTabsContextUnsafe","useTabsContext","result","modulePath","TabsContainerMeta","name","displayName","importName","importPath","providesData","defaultStyles","width","padding","description","defaultValue","previewKey","previewAll","TabsContainer","inEditor","usePlasmicCanvasContext","React","Provider","Helper","ensure","x","Error","effectiveKey","DataProvider","data","TabUnderlineMeta","background","height","TabUnderline","className","style","JSON","parse","stringify","top","bottom","position","transition","TabButtonMeta","isAttachment","TabButton","tabsContext","ref","useRef","activeKey","useEffect","current","offsetWidth","left","offsetLeft","cloneElement","Children","toArray","isActive","onClick","TabContentMeta","TabContent","useContext","registerAll","loader","_registerComponent","Component","defaultMeta","registerComponent"],"mappings":"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"}
+{"version":3,"file":"plasmic-tabs.esm.js","sources":["../src/tabs.tsx","../src/index.tsx"],"sourcesContent":["import {\n  ComponentMeta,\n  DataProvider,\n  usePlasmicCanvasContext,\n} from '@plasmicapp/host';\nimport constate from 'constate';\nimport React, {\n  cloneElement,\n  createContext,\n  ReactElement,\n  ReactNode,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nconst noop = () => {};\n\nfunction defaultButtonChildren(label: string) {\n  return {\n    type: 'default-component',\n    kind: 'button',\n    props: {\n      children: {\n        type: 'text',\n        value: label,\n      },\n    },\n  } as const;\n}\nexport interface TabsProviderProps {\n  children?: ReactNode;\n  initialKey?: string;\n  previewKey?: string;\n  previewAll?: boolean;\n}\n\nconst DebugContext = createContext(false);\n\nfunction useTabsData({ initialKey }: { initialKey?: string }) {\n  const [tabKey, setTabKey] = useState<string | undefined>(initialKey);\n  const [bbox, setBbox] = useState<{ left: number; width: number } | undefined>(\n    undefined\n  );\n  return {\n    tabKey,\n    bbox,\n    setTabKey,\n    setBbox,\n  };\n}\n\nconst [TabsProvider, useTabsContextUnsafe] = constate(useTabsData);\n\nfunction useTabsContext() {\n  const result = useTabsContextUnsafe();\n  return 'setTabKey' in result ? result : undefined;\n}\nconst modulePath = '@plasmicpkgs/plasmic-tabs';\n\nexport const TabsContainerMeta: ComponentMeta<TabsProviderProps> = {\n  name: 'hostless-tabs-container',\n  displayName: 'Tabs Container',\n  importName: 'TabsContainer',\n  importPath: modulePath,\n  providesData: true,\n  defaultStyles: {\n    width: 'stretch',\n    padding: '8px',\n  },\n  props: {\n    initialKey: {\n      type: 'string',\n      description: 'Key of the initially selected tab',\n      defaultValue: 'tab1',\n    },\n    previewKey: {\n      type: 'string',\n      description: 'SShow this key while editing in Plasmic Studio',\n    },\n    previewAll: {\n      type: 'boolean',\n      description: 'Reveal all tab contents while editing in Plasmic Studio',\n    },\n    children: {\n      type: 'slot',\n      defaultValue: {\n        type: 'vbox',\n        children: [\n          {\n            type: 'hbox',\n            children: [\n              {\n                type: 'component',\n                name: 'hostless-tab-button',\n                props: {\n                  tabKey: 'tab1',\n                  children: defaultButtonChildren('Tab 1'),\n                },\n              },\n              {\n                type: 'component',\n                name: 'hostless-tab-button',\n                props: {\n                  tabKey: 'tab2',\n                  children: defaultButtonChildren('Tab 2'),\n                },\n              },\n              {\n                type: 'component',\n                name: 'hostless-tab-underline',\n              },\n            ],\n          },\n          {\n            type: 'vbox',\n            children: [\n              {\n                type: 'component',\n                name: 'hostless-tab-content',\n                props: {\n                  tabKey: 'tab1',\n                  children: [\n                    {\n                      type: 'vbox',\n                      children: ['Some content for tab 1'],\n                    },\n                  ],\n                },\n              },\n              {\n                type: 'component',\n                name: 'hostless-tab-content',\n                props: {\n                  tabKey: 'tab2',\n                  children: [\n                    {\n                      type: 'vbox',\n                      children: ['Some content for tab 2'],\n                    },\n                  ],\n                },\n              },\n            ],\n          },\n        ],\n      },\n    },\n  },\n};\n\nexport function TabsContainer({\n  children,\n  initialKey,\n  previewKey,\n  previewAll = false,\n}: TabsProviderProps) {\n  const inEditor = !!usePlasmicCanvasContext();\n  return (\n    <TabsProvider initialKey={initialKey}>\n      <DebugContext.Provider value={inEditor && previewAll}>\n        <Helper previewKey={previewKey || initialKey}>{children}</Helper>\n      </DebugContext.Provider>\n    </TabsProvider>\n  );\n}\n\nfunction ensure<T>(x: T | undefined | null) {\n  if (!x) {\n    throw new Error('unexpected nil');\n  }\n  return x;\n}\n\nfunction Helper({\n  children,\n  previewKey,\n}: {\n  previewKey?: string;\n  children?: ReactNode;\n}) {\n  const inEditor = usePlasmicCanvasContext();\n  const { tabKey } = ensure(useTabsContext());\n  const effectiveKey = inEditor ? previewKey || tabKey : tabKey;\n  return (\n    <DataProvider name={'currentTabKey'} data={effectiveKey}>\n      {children}\n    </DataProvider>\n  );\n}\n\nexport interface TabUnderlineProps {\n  className?: string;\n}\n\nexport const TabUnderlineMeta: ComponentMeta<TabUnderlineProps> = {\n  name: 'hostless-tab-underline',\n  displayName: 'Tab Underline',\n  importName: 'TabUnderline',\n  importPath: modulePath,\n  props: {},\n  defaultStyles: {\n    background: '#7777ff',\n    height: '2px',\n  },\n};\n\nexport function TabUnderline({ className }: TabUnderlineProps) {\n  const { bbox } = useTabsContext() ?? { bbox: undefined };\n  return bbox ? (\n    <div\n      className={className}\n      style={{\n        ...JSON.parse(JSON.stringify(bbox)),\n        top: undefined,\n        bottom: 0,\n        position: 'absolute',\n        transition: '.4s ease all',\n      }}\n    ></div>\n  ) : null;\n}\n\nexport interface TabButtonProps {\n  className?: string;\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabButtonMeta: ComponentMeta<TabButtonProps> = {\n  name: 'hostless-tab-button',\n  isAttachment: true,\n  displayName: 'Tab Button',\n  importName: 'TabButton',\n  importPath: modulePath,\n  props: {\n    tabKey: {\n      type: 'string',\n      description: 'The answer value selecting this choice sets',\n    },\n    children: {\n      type: 'slot',\n      defaultValue: defaultButtonChildren('Some tab'),\n    },\n  },\n  defaultStyles: {\n    width: 'hug',\n  },\n};\n\nexport function TabButton({ className, children, tabKey }: TabButtonProps) {\n  const tabsContext = useTabsContext();\n  const ref = useRef<HTMLDivElement>(null);\n  const { tabKey: activeKey, setTabKey, bbox, setBbox } = tabsContext ?? {\n    tabKey: undefined,\n    setTabKey: noop,\n    bbox: undefined,\n    setBbox: noop,\n  };\n  useEffect(() => {\n    if (tabKey === activeKey) {\n      setBbox({\n        width: ref.current!.offsetWidth,\n        left: ref.current!.offsetLeft,\n      });\n    }\n  }, [ref.current, setBbox, JSON.stringify(bbox), tabKey, activeKey]);\n  return (\n    <div className={className} ref={ref}>\n      {cloneElement(React.Children.toArray(children)[0] as ReactElement, {\n        isActive: tabKey && activeKey && activeKey === tabKey,\n        onClick: () => {\n          setTabKey(tabKey);\n        },\n      })}\n    </div>\n  );\n}\n\nexport interface TabContentProps {\n  children?: ReactNode;\n  tabKey?: string;\n}\n\nexport const TabContentMeta: ComponentMeta<TabContentProps> = {\n  name: 'hostless-tab-content',\n  isAttachment: true,\n  displayName: 'Tab Content',\n  importName: 'TabContent',\n  importPath: modulePath,\n  props: {\n    tabKey: {\n      type: 'string',\n      description: 'The answer value selecting this choice sets',\n    },\n    children: {\n      type: 'slot',\n      defaultValue: {\n        type: 'vbox',\n        children: {\n          type: 'text',\n          value: 'This is some tab content',\n        },\n      },\n    },\n  },\n};\nexport function TabContent({ children, tabKey }: TabContentProps) {\n  const tabsContext = useTabsContext();\n  const previewAll = useContext(DebugContext);\n  const { tabKey: activeKey } = tabsContext ?? { tabKey: undefined };\n  return (\n    <>\n      {tabsContext === undefined || activeKey === tabKey || previewAll\n        ? children\n        : null}\n    </>\n  );\n}\n","import registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/host/registerComponent\";\n\nimport {\n  TabsContainer,\n  TabsContainerMeta,\n  TabUnderline,\n  TabUnderlineMeta,\n  TabButton,\n  TabButtonMeta,\n  TabContent, TabContentMeta\n} from \"./tabs\";\n\nexport function registerAll(loader?: {\n  registerComponent: typeof registerComponent;\n}) {\n  const _registerComponent = <T extends React.ComponentType<any>>(\n    Component: T,\n    defaultMeta: ComponentMeta<React.ComponentProps<T>>\n  ) => {\n    if (loader) {\n      loader.registerComponent(Component, defaultMeta);\n    } else {\n      registerComponent(Component, defaultMeta);\n    }\n  };\n  \n  _registerComponent(TabsContainer, TabsContainerMeta);\n  _registerComponent(TabUnderline, TabUnderlineMeta);\n  _registerComponent(TabButton, TabButtonMeta);\n  _registerComponent(TabContent, TabContentMeta);\n\n}\n\nexport * from \"./tabs\";\n"],"names":["noop","defaultButtonChildren","label","type","kind","props","children","value","DebugContext","createContext","useTabsData","initialKey","useState","tabKey","setTabKey","undefined","bbox","setBbox","constate","TabsProvider","useTabsContextUnsafe","useTabsContext","result","modulePath","TabsContainerMeta","name","displayName","importName","importPath","providesData","defaultStyles","width","padding","description","defaultValue","previewKey","previewAll","TabsContainer","inEditor","usePlasmicCanvasContext","React","Provider","Helper","ensure","x","Error","effectiveKey","DataProvider","data","TabUnderlineMeta","background","height","TabUnderline","className","style","JSON","parse","stringify","top","bottom","position","transition","TabButtonMeta","isAttachment","TabButton","tabsContext","ref","useRef","activeKey","useEffect","current","offsetWidth","left","offsetLeft","cloneElement","Children","toArray","isActive","onClick","TabContentMeta","TabContent","useContext","registerAll","loader","_registerComponent","Component","defaultMeta","registerComponent"],"mappings":"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"}

package/dist/tabs.d.ts

@@ -1,5 +1,5 @@
-import { ComponentMeta } from "@plasmicapp/host";
-import { ReactNode } from "react";
+import { ComponentMeta } from '@plasmicapp/host';
+import { ReactNode } from 'react';
 export interface TabsProviderProps {
     children?: ReactNode;
     initialKey?: string;

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.4",
+  "version": "0.0.5",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -63,5 +63,5 @@
   "dependencies": {
     "constate": "^3.3.2"
   },
-  "gitHead": "1a11e260711c67b16c0703de62e6d108a12fa2d9"
+  "gitHead": "aa76cffecca904270776e3de48960defac03e4d5"
 }