@justeattakeaway/pie-divider 0.10.2 → 0.12.0

package/custom-elements.json

@@ -0,0 +1,127 @@
+{
+  "schemaVersion": "1.0.0",
+  "readme": "",
+  "modules": [
+    {
+      "kind": "javascript-module",
+      "path": "src/defs-react.js",
+      "declarations": [],
+      "exports": []
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/defs.js",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "variants",
+          "type": {
+            "text": "['default', 'inverse']"
+          },
+          "default": "['default', 'inverse']"
+        },
+        {
+          "kind": "variable",
+          "name": "orientations",
+          "type": {
+            "text": "['horizontal', 'vertical']"
+          },
+          "default": "['horizontal', 'vertical']"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "variants",
+          "declaration": {
+            "name": "variants",
+            "module": "src/defs.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "orientations",
+          "declaration": {
+            "name": "orientations",
+            "module": "src/defs.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/index.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "PieDivider",
+          "members": [
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "DividerProps['variant']"
+              },
+              "privacy": "public",
+              "default": "'default'",
+              "attribute": "variant"
+            },
+            {
+              "kind": "field",
+              "name": "orientation",
+              "type": {
+                "text": "DividerProps['orientation']"
+              },
+              "privacy": "public",
+              "default": "'horizontal'",
+              "attribute": "orientation"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "variant",
+              "type": {
+                "text": "DividerProps['variant']"
+              },
+              "default": "'default'",
+              "fieldName": "variant"
+            },
+            {
+              "name": "orientation",
+              "type": {
+                "text": "DividerProps['orientation']"
+              },
+              "default": "'horizontal'",
+              "fieldName": "orientation"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "pie-divider",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./defs"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "PieDivider",
+          "declaration": {
+            "name": "PieDivider",
+            "module": "src/index.js"
+          }
+        }
+      ]
+    }
+  ]
+}

package/dist/index.d.ts

@@ -6,11 +6,11 @@ export declare interface DividerProps {
     /**
      * What style variant the divider should be such as default or vertical.
      */
-    variant: typeof variants[number];
+    variant?: typeof variants[number];
     /**
      * What orientation the divider should be such as horizontal or inverse.
      */
-    orientation: typeof orientations[number];
+    orientation?: typeof orientations[number];
 }
 
 export declare const orientations: readonly ["horizontal", "vertical"];

package/dist/index.js

@@ -20,8 +20,8 @@ class o extends h {
                 data-test-id="pie-divider"
                 aria-hidden="true"
                 class="c-divider"
-                variant=${i}
-                orientation=${e}
+                variant=${i || "default"}
+                orientation=${e || "horizontal"}
             />`;
   }
 }

package/dist/react.d.ts

@@ -1,22 +1,22 @@
 import type { CSSResult } from 'lit';
 import type { LitElement } from 'lit';
-import type { ReactWebComponent } from '@lit/react';
+import * as React_2 from 'react';
 import type { TemplateResult } from 'lit-html';
 
 export declare interface DividerProps {
     /**
      * What style variant the divider should be such as default or vertical.
      */
-    variant: typeof variants[number];
+    variant?: typeof variants[number];
     /**
      * What orientation the divider should be such as horizontal or inverse.
      */
-    orientation: typeof orientations[number];
+    orientation?: typeof orientations[number];
 }
 
 export declare const orientations: readonly ["horizontal", "vertical"];
 
-export declare const PieDivider: ReactWebComponent<PieDivider_2, {}>;
+export declare const PieDivider: React_2.ForwardRefExoticComponent<DividerProps & React_2.RefAttributes<PieDivider_2> & ReactBaseType>;
 
 /**
  * @tagname pie-divider
@@ -28,6 +28,8 @@ declare class PieDivider_2 extends LitElement implements DividerProps {
     static styles: CSSResult;
 }
 
+declare type ReactBaseType = React_2.HTMLAttributes<HTMLHRElement>;
+
 export declare const variants: readonly ["default", "inverse"];
 
 export { }

package/dist/react.js

@@ -1,19 +1,19 @@
 import * as e from "react";
 import { createComponent as i } from "@lit/react";
 import { PieDivider as r } from "./index.js";
-import { orientations as v, variants as c } from "./index.js";
+import { orientations as c, variants as D } from "./index.js";
 import "lit";
 import "lit/decorators.js";
 import "@justeattakeaway/pie-webc-core";
-const s = i({
+const t = i({
   displayName: "PieDivider",
   elementClass: r,
   react: e,
   tagName: "pie-divider",
   events: {}
-});
+}), n = t;
 export {
-  s as PieDivider,
-  v as orientations,
-  c as variants
+  n as PieDivider,
+  c as orientations,
+  D as variants
 };

package/package.json

@@ -1,18 +1,21 @@
 {
   "name": "@justeattakeaway/pie-divider",
   "description": "PIE Design System Divider built using Web Components",
-  "version": "0.10.2",
+  "version": "0.12.0",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
+    "custom-elements.json",
     "src",
     "dist",
     "**/*.d.ts"
   ],
   "scripts": {
-    "build": "yarn build:wrapper pie-divider && run -T vite build",
+    "build": "run -T vite build",
+    "build:react-wrapper": "npx build-react-wrapper",
+    "create:manifest": "yarn cem analyze --litelement",
     "lint:scripts": "run -T eslint .",
     "lint:scripts:fix": "yarn lint:scripts --fix",
     "lint:style": "run -T stylelint ./src/**/*.{css,scss}",
@@ -28,14 +31,18 @@
   "author": "Just Eat Takeaway.com - Design System Team",
   "license": "Apache-2.0",
   "devDependencies": {
-    "@justeattakeaway/pie-components-config": "0.7.0"
+    "@custom-elements-manifest/analyzer": "0.9.0",
+    "@justeattakeaway/pie-components-config": "0.9.0",
+    "@justeattakeaway/pie-wrapper-react": "0.13.0",
+    "cem-plugin-module-file-extensions": "0.0.5"
   },
   "dependencies": {
-    "@justeattakeaway/pie-webc-core": "0.15.0"
+    "@justeattakeaway/pie-webc-core": "0.17.0"
   },
   "volta": {
     "extends": "../../../package.json"
   },
+  "customElements": "custom-elements.json",
   "sideEffects": [
     "dist/*.js"
   ]

package/src/defs-react.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+
+export type ReactBaseType = React.HTMLAttributes<HTMLHRElement>

package/src/defs.ts

@@ -5,9 +5,9 @@ export interface DividerProps {
    /**
      * What style variant the divider should be such as default or vertical.
      */
-   variant: typeof variants[number];
+   variant?: typeof variants[number];
     /**
      * What orientation the divider should be such as horizontal or inverse.
      */
-   orientation: typeof orientations[number];
+   orientation?: typeof orientations[number];
 }

package/src/index.ts

@@ -29,8 +29,8 @@ export class PieDivider extends LitElement implements DividerProps {
                 data-test-id="pie-divider"
                 aria-hidden="true"
                 class="c-divider"
-                variant=${variant}
-                orientation=${orientation}
+                variant=${variant || 'default'}
+                orientation=${orientation || 'horizontal'}
             />`;
     }
 

package/src/react.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { createComponent } from '@lit/react';
+import { PieDivider as PieDividerLit } from './index';
+import { DividerProps } from './defs';
+
+export * from './defs';
+
+const PieDividerReact = createComponent({
+    displayName: 'PieDivider',
+    elementClass: PieDividerLit,
+    react: React,
+    tagName: 'pie-divider',
+    events: {},
+});
+
+type ReactBaseType = React.HTMLAttributes<HTMLHRElement>
+
+
+
+export const PieDivider = PieDividerReact as React.ForwardRefExoticComponent<React.PropsWithoutRef<DividerProps> & React.RefAttributes<PieDividerLit> & ReactBaseType>;