@builder.io/sdk-qwik 0.0.34 → 0.0.36

package/README.md

@@ -32,7 +32,7 @@ Add Qwik SDK code to a particular route (such as `src/routes/index.tsx`)
 ```typscript
 import { component$, Resource, useResource$ } from "@builder.io/qwik";
 import { useLocation } from "@builder.io/qwik-city";
-import { getContent, RenderContent, getBuilderSearchParams } from "@builder.io/sdk-qwik";
+import { getContent, RenderContent, RegisteredComponent, getBuilderSearchParams } from "@builder.io/sdk-qwik";
 
 export const BUILDER_PUBLIC_API_KEY = "YOUR_API_KEY_GOES_HERE"; // ggignore
 export default component$(() => {
@@ -57,11 +57,45 @@ export default component$(() => {
           model="page"
           content={content}
           apiKey={BUILDER_PUBLIC_API_KEY}
+          // Optional: pass in a custom component registry
+          // customComponents={CUSTOM_COMPONENTS}
         />
       )}
     />
   );
 });
+
+// OPTIONAL: need to add custom components to your Qwik app
+
+export const MyFunComponent = component$((props: { text: string }) => {
+  const state = useStore({
+    count: 0,
+  });
+
+  return (
+    <div>
+      <h3>{props.text.toUpperCase()}</h3>
+      <p>{state.count}</p>
+      <button onClick$={() => state.count++}>Click me</button>
+    </div>
+  );
+});
+
+export const CUSTOM_COMPONENTS: RegisteredComponent[] = [
+  {
+    component: MyFunComponent,
+    name: 'MyFunComponent',
+    builtIn: true,
+    inputs: [
+      {
+        name: 'text',
+        type: 'string',
+        defaultValue: 'Hello world',
+      },
+    ],
+  },
+];
+
 ```
 
 ## Mitosis

package/lib/index.qwik.cjs

@@ -1656,9 +1656,18 @@ const componentInfo$6 = {
 const SectionComponent = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
     return /*#__PURE__*/ jsxRuntime.jsx("section", {
         ...props.attributes,
-        style: (()=>{
-            props.maxWidth && typeof props.maxWidth === "number" ? props.maxWidth : undefined;
-        })(),
+        style: {
+            width: "100%",
+            alignSelf: "stretch",
+            flexGrow: "1",
+            boxSizing: "border-box",
+            maxWidth: `${props.maxWidth && typeof props.maxWidth === "number" ? props.maxWidth : 1200}px`,
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "stretch",
+            marginLeft: "auto",
+            marginRight: "auto"
+        },
         children: /*#__PURE__*/ jsxRuntime.jsx(qwik.Slot, {})
     });
 }, "SectionComponent_component_ZWF9iD5WeLg"));

package/lib/index.qwik.mjs

@@ -1652,9 +1652,18 @@ const componentInfo$6 = {
 const SectionComponent = /*#__PURE__*/ componentQrl(inlinedQrl((props)=>{
     return /*#__PURE__*/ jsx("section", {
         ...props.attributes,
-        style: (()=>{
-            props.maxWidth && typeof props.maxWidth === "number" ? props.maxWidth : undefined;
-        })(),
+        style: {
+            width: "100%",
+            alignSelf: "stretch",
+            flexGrow: "1",
+            boxSizing: "border-box",
+            maxWidth: `${props.maxWidth && typeof props.maxWidth === "number" ? props.maxWidth : 1200}px`,
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "stretch",
+            marginLeft: "auto",
+            marginRight: "auto"
+        },
         children: /*#__PURE__*/ jsx(Slot, {})
     });
 }, "SectionComponent_component_ZWF9iD5WeLg"));

package/package.json

@@ -1,12 +1,16 @@
 {
   "name": "@builder.io/sdk-qwik",
-  "version": "0.0.34",
+  "version": "0.0.36",
   "description": "Builder.io Qwik SDK",
   "type": "module",
   "main": "./lib/index.qwik.cjs",
   "module": "./lib/index.qwik.mjs",
   "qwik": "./lib/index.qwik.mjs",
   "types": "./types/index.d.ts",
+  "files": [
+    "lib",
+    "types"
+  ],
   "exports": {
     ".": {
       "import": "./lib/index.qwik.mjs",
@@ -16,22 +20,15 @@
   "scripts": {
     "typecheck": "tsc --noEmit",
     "build": "tsc && vite build --mode lib",
-    "release:patch": "yarn run build && npm version patch --no-git-tag-version && npm publish --access public",
-    "release:dev": "yarn run build && npm version prerelease --no-git-tag-version && npm publish --tag latest --access public"
+    "release:patch": "yarn run build && yarn version patch && npm publish --access public",
+    "release:dev": "yarn run build && npm version prerelease && npm publish --tag latest --access public"
   },
-  "files": [
-    "README.md",
-    "package.json",
-    "types-hacks.d.ts",
-    "types",
-    "lib"
-  ],
   "devDependencies": {
     "@types/node": "latest",
     "typescript": "^4",
     "vite": "^3.0.4"
   },
   "peerDependencies": {
-    "@builder.io/qwik": ">=0.0.108"
+    "@builder.io/qwik": ">=0.13.3"
   }
 }

package/types-hacks.d.ts

@@ -1,13 +0,0 @@
-type Dictionary<T> = Record<string, T>;
-type BuilderContent = any;
-type BuilderBlock = any;
-type RegisteredComponent = any;
-type RegisteredComponents = any;
-declare const builder: { env: 'dev'; apiKey: string };
-// TODO(misko): HACKS to be removed
-declare const get: (obj: any, key: string) => any;
-declare const set: (obj: any, key: string, value: any) => void;
-interface CSSProperties {
-  flexDirection: any;
-}
-declare const BuilderBlocks: (props: any) => any;