@wix/ditto-codegen-public 1.0.36 → 1.0.37

package/dist/wix-cli-templates/src/site/widgets/custom-elements/my-widget/widget.tsx

@@ -0,0 +1,5 @@
+export default class extends HTMLElement {
+  public connectedCallback() {
+    this.innerHTML = `<div data-testid="custom-element">Hello from custom element!</div>`;
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/ditto-codegen-public",
-  "version": "1.0.36",
+  "version": "1.0.37",
   "description": "AI-powered Wix CLI app generator - standalone executable",
   "scripts": {
     "build": "node build.mjs",
@@ -24,5 +24,5 @@
     "@wix/ditto-codegen": "1.0.0",
     "esbuild": "^0.25.9"
   },
-  "falconPackageHash": "f78cfb6e7bdafb3a57f084c58b26c3a4b12662154bae77080decebba"
+  "falconPackageHash": "5414b39630c8c19b9c7a3604fedce44b192a1242f0cae2dbecdaf844"
 }

package/dist/wix-cli-templates/src/site/widgets/custom-elements/my-widget/element.json

@@ -1,27 +0,0 @@
-{
-  "$schema": "https://dev.wix.com/wix-cli/schemas/custom-element.json",
-  "id": "6be9721d-6085-4bda-b50b-f4fe8e443263",
-  "name": "My Widget",
-  "width": {
-    "defaultWidth": 450,
-    "allowStretch": true
-  },
-  "height": {
-    "defaultHeight": 250
-  },
-  "installation": {
-    "autoAddToSite": true
-  },
-  "behaviors": {
-    "dashboard": {
-      "dashboardPageComponentId": "851162b4-65b1-47e5-9f4a-8a079204b368"
-    }
-  },
-  "presets": [
-    {
-      "id": "3588cae1-09de-4a76-941d-66b81f921162",
-      "thumbnailUrl": "../../../../assets/my-widget/thumbnail.png"
-    }
-  ]
-}
-

package/dist/wix-cli-templates/src/site/widgets/custom-elements/my-widget/element.module.css

@@ -1,32 +0,0 @@
-:root {
-  --background-color: #242A35;
-  --text-color: #fcfdfd;
-  --secondary-text-color: #c9c9c9;
-  --code-color: #d7d7d7;
-}
-
-.root {
-  width: 100%;
-  height: 100%;
-  background-color: var(--background-color);
-  color: var(--text-color);
-  box-sizing: border-box;
-  padding: 3rem 1rem;
-  font-size: 14px;
-}
-
-.root h2 {
-  font-size: 1.5rem;
-  margin-bottom: 5px;
-}
-
-.root p {
-  color: var(--secondary-text-color);
-}
-
-.root code {
-  color: var(--code-color);
-  font-size: 0.8rem;
-  font-weight: bolder;
-}
-

package/dist/wix-cli-templates/src/site/widgets/custom-elements/my-widget/element.tsx

@@ -1,36 +0,0 @@
-import React, { type FC } from 'react';
-import ReactDOM from 'react-dom';
-import reactToWebComponent from 'react-to-webcomponent';
-import styles from './element.module.css';
-
-interface Props {
-  displayName?: string;
-}
-
-const CustomElement: FC<Props> = ({
-  displayName = `Your Widget's Title`,
-}) => {
-  return (
-    <div className={styles.root}>
-      <h2>{displayName}</h2>
-      <hr />
-      <p>
-        This is a Site Widget generated by Wix CLI.<br />
-        Continue to develop this widget at <code>'src/site/widgets/custom-elements/my-widget'</code>.
-      </p>
-    </div>
-  );
-};
-
-const customElement = reactToWebComponent(
-  CustomElement,
-  React,
-  ReactDOM as any,
-  {
-    props: {
-      displayName: 'string',
-    },
-  }
-);
-
-export default customElement;

package/dist/wix-cli-templates/src/site/widgets/custom-elements/my-widget/panel.tsx

@@ -1,54 +0,0 @@
-import React, { type FC, useState, useEffect, useCallback } from 'react';
-import { widget } from '@wix/editor';
-import {
-  SidePanel,
-  WixDesignSystemProvider,
-  Input,
-  FormField,
-  SectionHelper,
-} from '@wix/design-system';
-import '@wix/design-system/styles.global.css';
-
-const SITE_WIDGETS_DOCS = 'https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-cli/supported-extensions/site-extensions/site-widgets/site-widget-extension-files-and-code';
-
-const Panel: FC = () => {
-  const [displayName, setDisplayName] = useState<string>('');
-
-  useEffect(() => {
-    widget.getProp('display-name')
-      .then(displayName => setDisplayName(displayName || `Your Widget's Title`))
-      .catch(error => console.error('Failed to fetch display-name:', error));
-  }, [setDisplayName]);
-
-  const handleDisplayNameChange = useCallback((event: React.ChangeEvent<HTMLInputElement>) => {
-    const newDisplayName = event.target.value;
-    setDisplayName(newDisplayName);
-    widget.setProp('display-name', newDisplayName);
-  }, [setDisplayName]);
-
-  return (
-    <WixDesignSystemProvider>
-      <SidePanel width="300" height="100vh">
-        <SidePanel.Content noPadding stretchVertically>
-          <SidePanel.Field>
-            <FormField label="Display Name">
-              <Input
-                type="text"
-                value={displayName}
-                onChange={handleDisplayNameChange}
-                aria-label="Display Name"
-              />
-            </FormField>
-          </SidePanel.Field>
-        </SidePanel.Content>
-        <SidePanel.Footer noPadding>
-          <SectionHelper fullWidth appearance="success" border="topBottom">
-            Learn more about <a href={SITE_WIDGETS_DOCS} target="_blank" rel="noopener noreferrer" title="Site Widget docs">Site Widgets</a>
-          </SectionHelper>
-        </SidePanel.Footer>
-      </SidePanel>
-    </WixDesignSystemProvider>
-  );
-};
-
-export default Panel;