@justeattakeaway/pie-divider 0.9.1 → 0.9.2

package/README.md

@@ -56,7 +56,7 @@ import '@justeattakeaway/pie-divider';
 ```js
 // React
 // For React, you will need to import our React-specific component build
-// which wraps the web component using @lit-labs/react
+// which wraps the web component using ​@lit/react
 import { PieDivider } from '@justeattakeaway/pie-divider/dist/react';
 ```
 

package/dist/index.js

@@ -1,60 +1,60 @@
-import { unsafeCSS as u, LitElement as f, html as g } from "lit";
+import { unsafeCSS as h, LitElement as u, html as f } from "lit";
 import { property as c } from "lit/decorators.js";
-const l = (i, e, r) => function(t, o) {
+const l = (i, e, t) => function(r, o) {
   const n = `#${o}`;
-  Object.defineProperty(t, o, {
+  Object.defineProperty(r, o, {
     get() {
       return this[n];
     },
     set(s) {
-      const p = this[n];
       e.includes(s) ? this[n] = s : (console.error(
         `<${i}> Invalid value "${s}" provided for property "${o}".`,
         `Must be one of: ${e.join(" | ")}.`,
-        `Falling back to default value: "${r}"`
-      ), this[n] = r), this.requestUpdate(o, p);
-    }
+        `Falling back to default value: "${t}"`
+      ), this[n] = t);
+    },
+    configurable: !0
   });
 };
-function m(i, e) {
+function g(i, e) {
   customElements.get(i) ? console.warn(`PIE Web Component: "${i}" has already been defined. Please ensure the component is only being defined once in your application.`) : customElements.define(i, e);
 }
-const b = `.c-divider{--divider-bg-color: var(--dt-color-divider-default);--divider-width: 100%;--divider-height: 1px;margin:0;border:0;width:var(--divider-width);height:var(--divider-height);background-color:var(--divider-bg-color)}.c-divider[variant=inverse]{--divider-bg-color: var(--dt-color-divider-inverse)}.c-divider[orientation=vertical]{--divider-width: 1px;--divider-height: 100%}
-`, P = ["default", "inverse"], y = ["horizontal", "vertical"];
-var $ = Object.defineProperty, w = Object.getOwnPropertyDescriptor, h = (i, e, r, d) => {
-  for (var t = d > 1 ? void 0 : d ? w(e, r) : e, o = i.length - 1, n; o >= 0; o--)
-    (n = i[o]) && (t = (d ? n(e, r, t) : n(t)) || t);
-  return d && t && $(e, r, t), t;
+const m = `.c-divider{--divider-bg-color: var(--dt-color-divider-default);--divider-width: 100%;--divider-height: 1px;margin:0;border:0;width:var(--divider-width);height:var(--divider-height);background-color:var(--divider-bg-color)}.c-divider[variant=inverse]{--divider-bg-color: var(--dt-color-divider-inverse)}.c-divider[orientation=vertical]{--divider-width: 1px;--divider-height: 100%}
+`, b = ["default", "inverse"], y = ["horizontal", "vertical"];
+var P = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, p = (i, e, t, d) => {
+  for (var r = d > 1 ? void 0 : d ? $(e, t) : e, o = i.length - 1, n; o >= 0; o--)
+    (n = i[o]) && (r = (d ? n(e, t, r) : n(r)) || r);
+  return d && r && P(e, t, r), r;
 };
 const v = "pie-divider";
-class a extends f {
+class a extends u {
   constructor() {
     super(...arguments), this.variant = "default", this.orientation = "horizontal";
   }
   render() {
-    const { variant: e, orientation: r } = this;
-    return g`
+    const { variant: e, orientation: t } = this;
+    return f`
             <hr
                 data-test-id="pie-divider"
                 aria-hidden="true"
                 class="c-divider"
                 variant=${e}
-                orientation=${r}
+                orientation=${t}
             />`;
   }
 }
-a.styles = u(b);
-h([
+a.styles = h(m);
+p([
   c({ type: String }),
-  l(v, P, "default")
+  l(v, b, "default")
 ], a.prototype, "variant", 2);
-h([
+p([
   c({ type: String }),
   l(v, y, "horizontal")
 ], a.prototype, "orientation", 2);
-m(v, a);
+g(v, a);
 export {
   a as PieDivider,
   y as orientations,
-  P as variants
+  b as variants
 };

package/dist/react.d.ts

@@ -1,6 +1,6 @@
 import type { CSSResult } from 'lit';
 import type { LitElement } from 'lit';
-import type { ReactWebComponent } from '@lit-labs/react';
+import type { ReactWebComponent } from '@lit/react';
 import type { TemplateResult } from 'lit-html';
 
 export declare interface DividerProps {

package/dist/react.js

@@ -1,72 +1,18 @@
-import * as g from "react";
-import { PieDivider as D } from "./index.js";
-import { orientations as k, variants as A } from "./index.js";
+import * as e from "react";
+import { createComponent as i } from "@lit/react";
+import { PieDivider as r } from "./index.js";
+import { orientations as d, variants as v } from "./index.js";
 import "lit";
 import "lit/decorators.js";
-/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const E = /* @__PURE__ */ new Set(["children", "localName", "ref", "style", "className"]), w = /* @__PURE__ */ new WeakMap(), b = (t, i, c, m, p) => {
-  const s = p == null ? void 0 : p[i];
-  s === void 0 || c === m ? c == null && i in HTMLElement.prototype ? t.removeAttribute(i) : t[i] = c : ((r, n, v) => {
-    let a = w.get(r);
-    a === void 0 && w.set(r, a = /* @__PURE__ */ new Map());
-    let l = a.get(n);
-    v !== void 0 ? l === void 0 ? (a.set(n, l = { handleEvent: v }), r.addEventListener(n, l)) : l.handleEvent = v : l !== void 0 && (a.delete(n), r.removeEventListener(n, l));
-  })(t, s, c);
-}, M = (t, i) => {
-  typeof t == "function" ? t(i) : t.current = i;
-};
-function P(t = window.React, i, c, m, p) {
-  let s, r, n;
-  if (i === void 0) {
-    const d = t;
-    ({ tagName: r, elementClass: n, events: m, displayName: p } = d), s = d.react;
-  } else
-    s = t, n = c, r = i;
-  const v = s.Component, a = s.createElement, l = new Set(Object.keys(m ?? {}));
-  class f extends v {
-    constructor() {
-      super(...arguments), this.o = null;
-    }
-    t(e) {
-      if (this.o !== null)
-        for (const h in this.i)
-          b(this.o, h, this.props[h], e ? e[h] : void 0, m);
-    }
-    componentDidMount() {
-      var e;
-      this.t(), (e = this.o) === null || e === void 0 || e.removeAttribute("defer-hydration");
-    }
-    componentDidUpdate(e) {
-      this.t(e);
-    }
-    render() {
-      const { _$Gl: e, ...h } = this.props;
-      this.h !== e && (this.u = (o) => {
-        e !== null && M(e, o), this.o = o, this.h = e;
-      }), this.i = {};
-      const u = { ref: this.u };
-      for (const [o, y] of Object.entries(h))
-        E.has(o) ? u[o === "className" ? "class" : o] = y : l.has(o) || o in n.prototype ? this.i[o] = y : u[o] = y;
-      return u.suppressHydrationWarning = !0, a(r, u);
-    }
-  }
-  f.displayName = p ?? n.name;
-  const N = s.forwardRef((d, e) => a(f, { ...d, _$Gl: e }, d == null ? void 0 : d.children));
-  return N.displayName = f.displayName, N;
-}
-const R = P({
+const p = i({
   displayName: "PieDivider",
-  elementClass: D,
-  react: g,
+  elementClass: r,
+  react: e,
   tagName: "pie-divider",
   events: {}
 });
 export {
-  R as PieDivider,
-  k as orientations,
-  A as variants
+  p as PieDivider,
+  d as orientations,
+  v as variants
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@justeattakeaway/pie-divider",
   "description": "PIE Design System Divider built using Web Components",
-  "version": "0.9.1",
+  "version": "0.9.2",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -28,10 +28,10 @@
   "author": "Just Eat Takeaway.com - Design System Team",
   "license": "Apache-2.0",
   "devDependencies": {
-    "@justeattakeaway/pie-components-config": "0.4.0"
+    "@justeattakeaway/pie-components-config": "0.6.0"
   },
   "dependencies": {
-    "@justeattakeaway/pie-webc-core": "0.11.0"
+    "@justeattakeaway/pie-webc-core": "0.12.0"
   },
   "volta": {
     "extends": "../../../package.json"