@saasquatch/mint-components 1.5.1-3 → 1.5.2-0

package/package.json

@@ -1,94 +1,94 @@
-{
-  "name": "@saasquatch/mint-components",
-  "version": "1.5.1-3",
-  "description": "Mint Components - Built with Shoelace Components",
-  "main": "dist/index.cjs.js",
-  "es2015": "dist/esm/index.js",
-  "es2017": "dist/esm/index.js",
-  "types": "dist/types/components.d.ts",
-  "module": "dist/index.js",
-  "jsnext:main": "dist/esm/index.js",
-  "collection": "dist/collection/collection-manifest.json",
-  "collection:main": "dist/collection/index.js",
-  "files": [
-    "dist/",
-    "grapesjs/",
-    "shoelace/"
-  ],
-  "scripts": {
-    "build": "stencil build --docs",
-    "build:dev": "cross-env BUILD=dev stencil build --docs",
-    "build:grapes": "cross-env BUILD=DOCS stencil build --watch --docs",
-    "serve:grapes": "npx http-server . --cors -c-1 -p 8080",
-    "start": "cross-env NODE_ENV=dev stencil build --dev --watch --serve",
-    "test": "stencil test --spec --e2e",
-    "test.watch": "stencil test --spec --e2e --watchAll",
-    "generate": "stencil generate",
-    "specs": "picklesdoc xlsx src docs --testers=2"
-  },
-  "devDependencies": {
-    "@formatjs/intl": "1.8.4",
-    "@formatjs/intl-pluralrules": "^1.5.8",
-    "@formatjs/intl-relativetimeformat": "4.5.15",
-    "@formatjs/intl-utils": "^2.2.5",
-    "@lit/reactive-element": "^1.0.0-rc.2",
-    "@rollup/plugin-alias": "^3.1.2",
-    "@saasquatch/stencil-grapes-plugin": "^1.0.2",
-    "@stencil/core": "^2.4.0",
-    "@stencil/router": "^1.0.1",
-    "@stencil/sass": "^1.3.2",
-    "@stencil/utils": "latest",
-    "@types/canvas-confetti": "^1.4.2",
-    "@types/jest": "^26.0.21",
-    "@types/luxon": "^2.0.9",
-    "@types/puppeteer": "^5.4.2",
-    "@types/resize-observer-browser": "^0.1.5",
-    "clipboard": "^1.7.1",
-    "cross-env": "^7.0.2",
-    "docx": "^5.4.1",
-    "dom-context": "^1.2.0",
-    "jest": "^26.6.3",
-    "jest-cli": "^26.6.3",
-    "jest-config": "^26.6.3",
-    "marked": "^3.0.4",
-    "picklesdoc": "^1.2.1",
-    "puppeteer": "^5.5.0",
-    "rollup-plugin-copy": "^3.4.0",
-    "rollup-plugin-css-only": "^3.1.0",
-    "rollup-plugin-string": "^3.0.0",
-    "stencil-docx-docs": "0.0.2",
-    "ts-node": "^7.0.1",
-    "workbox-build": "4.3.1"
-  },
-  "dependencies": {
-    "@saasquatch/component-boilerplate": "^1.3.1",
-    "@saasquatch/stencil-hooks": "^2.0.2",
-    "@saasquatch/stencilbook": "^1.0.0",
-    "@saasquatch/universal-hooks": "^1.0.0",
-    "@shoelace-style/shoelace": "^2.0.0-beta.32",
-    "babel-polyfill": "^6.26.0",
-    "canvas-confetti": "^1.4.0",
-    "color2k": "^1.2.4",
-    "deepmerge": "^4.2.2",
-    "graphql": "^15.5.0",
-    "graphql-request": "^3.4.0",
-    "highlight.js": "^10.6.0",
-    "jsonpointer": "^4.1.0",
-    "jss-preset-default": "^10.7.1",
-    "libphonenumber-js": "^1.9.23",
-    "luxon": "^2.0.1",
-    "password-validator": "^5.1.1",
-    "path-to-regexp": "^6.2.0"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/saasquatch/program-tools.git",
-    "directory": "packages/mint-components"
-  },
-  "author": "SaaSquatch Team",
-  "bugs": {
-    "url": "https://github.com/saasquatch/program-tools"
-  },
-  "homepage": "https://github.com/saasquatch/program-tools",
-  "license": "MIT"
-}
+{
+  "name": "@saasquatch/mint-components",
+  "version": "1.5.2-0",
+  "description": "Mint Components - Built with Shoelace Components",
+  "main": "dist/index.cjs.js",
+  "es2015": "dist/esm/index.js",
+  "es2017": "dist/esm/index.js",
+  "types": "dist/types/components.d.ts",
+  "module": "dist/index.js",
+  "jsnext:main": "dist/esm/index.js",
+  "collection": "dist/collection/collection-manifest.json",
+  "collection:main": "dist/collection/index.js",
+  "files": [
+    "dist/",
+    "grapesjs/",
+    "shoelace/"
+  ],
+  "scripts": {
+    "build": "stencil build --docs",
+    "build:dev": "cross-env BUILD=dev stencil build --docs",
+    "build:grapes": "cross-env BUILD=DOCS stencil build --watch --docs",
+    "serve:grapes": "npx http-server . --cors -c-1 -p 8080",
+    "start": "cross-env NODE_ENV=dev stencil build --dev --watch --serve",
+    "test": "stencil test --spec --e2e --verbose",
+    "test.watch": "stencil test --spec --e2e --watchAll",
+    "generate": "stencil generate",
+    "specs": "picklesdoc xlsx src docs --testers=2"
+  },
+  "devDependencies": {
+    "@formatjs/intl": "1.8.4",
+    "@formatjs/intl-pluralrules": "^1.5.8",
+    "@formatjs/intl-relativetimeformat": "4.5.15",
+    "@formatjs/intl-utils": "^2.2.5",
+    "@lit/reactive-element": "^1.0.0-rc.2",
+    "@rollup/plugin-alias": "^3.1.2",
+    "@saasquatch/stencil-grapes-plugin": "^1.0.2",
+    "@stencil/core": "^2.4.0",
+    "@stencil/router": "^1.0.1",
+    "@stencil/sass": "^1.3.2",
+    "@stencil/utils": "latest",
+    "@types/canvas-confetti": "^1.4.2",
+    "@types/jest": "^26.0.21",
+    "@types/luxon": "^2.0.9",
+    "@types/puppeteer": "^5.4.2",
+    "@types/resize-observer-browser": "^0.1.5",
+    "clipboard": "^1.7.1",
+    "cross-env": "^7.0.2",
+    "docx": "^5.4.1",
+    "dom-context": "^1.2.0",
+    "jest": "^26.6.3",
+    "jest-cli": "^26.6.3",
+    "jest-config": "^26.6.3",
+    "marked": "^3.0.4",
+    "picklesdoc": "^1.2.1",
+    "puppeteer": "^5.5.0",
+    "rollup-plugin-copy": "^3.4.0",
+    "rollup-plugin-css-only": "^3.1.0",
+    "rollup-plugin-string": "^3.0.0",
+    "stencil-docx-docs": "0.0.2",
+    "ts-node": "^7.0.1",
+    "workbox-build": "4.3.1"
+  },
+  "dependencies": {
+    "@saasquatch/component-boilerplate": "^1.3.1",
+    "@saasquatch/stencil-hooks": "^2.0.2",
+    "@saasquatch/stencilbook": "^1.0.0",
+    "@saasquatch/universal-hooks": "^1.0.0",
+    "@shoelace-style/shoelace": "^2.0.0-beta.32",
+    "babel-polyfill": "^6.26.0",
+    "canvas-confetti": "^1.4.0",
+    "color2k": "^1.2.4",
+    "deepmerge": "^4.2.2",
+    "graphql": "^15.5.0",
+    "graphql-request": "^3.4.0",
+    "highlight.js": "^10.6.0",
+    "jsonpointer": "^4.1.0",
+    "jss-preset-default": "^10.7.1",
+    "libphonenumber-js": "^1.9.23",
+    "luxon": "^2.0.1",
+    "password-validator": "^5.1.1",
+    "path-to-regexp": "^6.2.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/saasquatch/program-tools.git",
+    "directory": "packages/mint-components"
+  },
+  "author": "SaaSquatch Team",
+  "bugs": {
+    "url": "https://github.com/saasquatch/program-tools"
+  },
+  "homepage": "https://github.com/saasquatch/program-tools",
+  "license": "MIT"
+}

package/readme.md

@@ -1,13 +1,13 @@
-![Built With Stencil](https://img.shields.io/badge/-Built%20With%20Stencil-16161d.svg?logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjIuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIgNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI%2BCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI%2BCgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU%2BCjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00MjQuNywzNzMuOWMwLDM3LjYtNTUuMSw2OC42LTkyLjcsNjguNkgxODAuNGMtMzcuOSwwLTkyLjctMzAuNy05Mi43LTY4LjZ2LTMuNmgzMzYuOVYzNzMuOXoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTQyNC43LDI5Mi4xSDE4MC40Yy0zNy42LDAtOTIuNy0zMS05Mi43LTY4LjZ2LTMuNkgzMzJjMzcuNiwwLDkyLjcsMzEsOTIuNyw2OC42VjI5Mi4xeiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNDI0LjcsMTQxLjdIODcuN3YtMy42YzAtMzcuNiw1NC44LTY4LjYsOTIuNy02OC42SDMzMmMzNy45LDAsOTIuNywzMC43LDkyLjcsNjguNlYxNDEuN3oiLz4KPC9zdmc%2BCg%3D%3D&colorA=16161d&style=flat-square)
-
-# Mint Components
-
-Mint components for the SaaSquatch content platform. Built with Stencil.
-
-# About Stencil
-
-Stencil is a compiler for building fast web apps using Web Components.
-
-Stencil combines the best concepts of the most popular frontend frameworks into a compile-time rather than run-time tool. Stencil takes TypeScript, JSX, a tiny virtual DOM layer, efficient one-way data binding, an asynchronous rendering pipeline (similar to React Fiber), and lazy-loading out of the box, and generates 100% standards-based Web Components that run in any browser supporting the Custom Elements v1 spec.
-
-Stencil components are just Web Components, so they work in any major framework or with no framework at all.
+![Built With Stencil](https://img.shields.io/badge/-Built%20With%20Stencil-16161d.svg?logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjIuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIgNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI%2BCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI%2BCgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU%2BCjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00MjQuNywzNzMuOWMwLDM3LjYtNTUuMSw2OC42LTkyLjcsNjguNkgxODAuNGMtMzcuOSwwLTkyLjctMzAuNy05Mi43LTY4LjZ2LTMuNmgzMzYuOVYzNzMuOXoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTQyNC43LDI5Mi4xSDE4MC40Yy0zNy42LDAtOTIuNy0zMS05Mi43LTY4LjZ2LTMuNkgzMzJjMzcuNiwwLDkyLjcsMzEsOTIuNyw2OC42VjI5Mi4xeiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNDI0LjcsMTQxLjdIODcuN3YtMy42YzAtMzcuNiw1NC44LTY4LjYsOTIuNy02OC42SDMzMmMzNy45LDAsOTIuNywzMC43LDkyLjcsNjguNlYxNDEuN3oiLz4KPC9zdmc%2BCg%3D%3D&colorA=16161d&style=flat-square)
+
+# Mint Components
+
+Mint components for the SaaSquatch content platform. Built with Stencil.
+
+# About Stencil
+
+Stencil is a compiler for building fast web apps using Web Components.
+
+Stencil combines the best concepts of the most popular frontend frameworks into a compile-time rather than run-time tool. Stencil takes TypeScript, JSX, a tiny virtual DOM layer, efficient one-way data binding, an asynchronous rendering pipeline (similar to React Fiber), and lazy-loading out of the box, and generates 100% standards-based Web Components that run in any browser supporting the Custom Elements v1 spec.
+
+Stencil components are just Web Components, so they work in any major framework or with no framework at all.

package/dist/collection/components/sqm-checkbox-field/CheckboxField.stories.js

@@ -1,84 +0,0 @@
-import { h } from "@stencil/core";
-import { PortalRegisterView, } from "../sqm-portal-register/sqm-portal-register-view";
-import { createHookStory } from "../sqm-stencilbook/HookStoryAddon";
-import { CheckboxFieldView, } from "./sqm-checkbox-field-view";
-export default {
-  title: "Components/Checkbox Field",
-};
-const defaultProps = {
-  states: {
-    validationErrors: {},
-    checked: false,
-  },
-  content: {
-    checkboxName: "agree",
-    checkboxLabel: "By signing up you agree to the {labelLink}",
-    checkboxLabelLink: "https://example.com",
-    checkboxLabelLinkText: "Terms and Conditions",
-    errorMessage: "Must be checked",
-  },
-  callbacks: {
-    setChecked: () => { },
-  },
-};
-const defaultRegisterProps = {
-  states: {
-    error: "",
-    loading: false,
-    confirmPassword: true,
-    hideInputs: false,
-    loginPath: "/login",
-  },
-  callbacks: {
-    submit: () => console.log("Submit!"),
-    inputFunction: () => { },
-  },
-  refs: {
-    formRef: {},
-  },
-  content: { pageLabel: "Register", confirmPasswordLabel: "Confirm Password" },
-};
-export const Default = createHookStory(() => (h(CheckboxFieldView, Object.assign({}, defaultProps))));
-export const DefaultChecked = createHookStory(() => (h(CheckboxFieldView, Object.assign({}, defaultProps, { states: {
-    ...defaultProps.states,
-    checked: true,
-  } }))));
-export const CustomLabel = createHookStory(() => (h(CheckboxFieldView, Object.assign({}, defaultProps, { content: {
-    ...defaultProps.content,
-    checkboxLabel: "I Agree",
-  } }))));
-export const Error = createHookStory(() => (h(CheckboxFieldView, Object.assign({}, defaultProps, { states: {
-    ...defaultProps.states,
-    validationErrors: {
-      agree: "Must be checked",
-    },
-  } }))));
-export const CustomError = createHookStory(() => (h(CheckboxFieldView, Object.assign({}, defaultProps, { states: {
-    ...defaultProps.states,
-    validationErrors: {
-      agree: "This checkbox must be checked to continue",
-    },
-  } }))));
-export const TermsAndConditions = createHookStory(() => (h(PortalRegisterView, Object.assign({}, defaultRegisterProps, { 
-  //@ts-ignore
-  content: {
-    ...defaultRegisterProps.content,
-    terms: (h("p", null,
-      h("sqm-checkbox-field", null))),
-  } }))));
-export const TermsAndConditionsCustomLabel = createHookStory(() => (h(PortalRegisterView, Object.assign({}, defaultRegisterProps, { 
-  //@ts-ignore
-  content: {
-    ...defaultRegisterProps.content,
-    terms: (h("p", null,
-      "By signing up you agree to the",
-      " ",
-      h("a", { href: "https://example.com", target: "_blank" }, "Terms and Conditions"),
-      h("sqm-checkbox-field", { "checkbox-label": "I agree" }))),
-  } }))));
-export const TermsAndConditionsLongCustomLabel = createHookStory(() => (h(PortalRegisterView, Object.assign({}, defaultRegisterProps, { 
-  //@ts-ignore
-  content: {
-    ...defaultRegisterProps.content,
-    terms: (h("sqm-checkbox-field", { "checkbox-label": "Participants must be at least 18 years of age and a legal resident of the U.S. or Canada. By signing up to participate in the rewards program, you agree to the {labelLink}.", "checkbox-label-link": "https://www.example.com", "checkbox-label-link-text": "terms", "checkbox-name": "termsAndConditions" })),
-  } }))));

package/dist/collection/components/sqm-checkbox-field/UseCheckboxField.stories.js

@@ -1,58 +0,0 @@
-import { setUserIdentity } from "@saasquatch/component-boilerplate";
-import { useEffect } from "@saasquatch/universal-hooks";
-import { h } from "@stencil/core";
-import { createHookStory } from "../sqm-stencilbook/HookStoryAddon";
-export default {
-  title: "Hooks / useCheckboxField",
-};
-function setupGraphQL() {
-  const id = "testestest";
-  const accountId = id;
-  const programId = "sam-partner-test-2";
-  //@ts-ignore
-  window.widgetIdent = {
-    tenantAlias: "test_a8b41jotf8a1v",
-    appDomain: "https://staging.referralsaasquatch.com",
-    programId,
-  };
-  useEffect(() => {
-    setUserIdentity({
-      accountId,
-      id,
-      jwt: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6InRlc3Rlc3Rlc3QiLCJpZCI6InRlc3Rlc3Rlc3QifX0.qYnU5hNeIj9C_G3NogfG7btgCPGZC7JRXY0MG6a63zs",
-    });
-    return () => {
-      window.widgetIdent = undefined;
-      setUserIdentity(undefined);
-    };
-  }, []);
-  return { id, accountId };
-}
-export const TermsAndConditions = createHookStory(() => {
-  setupGraphQL();
-  return (h("sqm-portal-register", null,
-    h("div", { slot: "terms" },
-      h("sqm-checkbox-field", { "checkbox-name": "terms" }))));
-});
-export const TermsAndConditionsWithLabel = createHookStory(() => {
-  setupGraphQL();
-  return (h("sqm-portal-register", null,
-    h("div", { slot: "terms" },
-      h("sqm-checkbox-field", { "checkbox-label": "I agree", "checkbox-name": "terms" }))));
-});
-export const MultipleCheckboxes = createHookStory(() => {
-  setupGraphQL();
-  return (h("sqm-portal-register", null,
-    h("sqm-name-fields", { slot: "formData" }),
-    h("sqm-checkbox-field", { slot: "formData", "checkbox-label": "I am not a robot", "error-message": "Cannot be a robot", "checkbox-name": "isHuman" }),
-    h("div", { slot: "terms" },
-      h("sqm-checkbox-field", null))));
-});
-export const OptionalCheckboxes = createHookStory(() => {
-  setupGraphQL();
-  return (h("sqm-portal-register", null,
-    h("sqm-name-fields", { slot: "formData" }),
-    h("sqm-checkbox-field", { slot: "formData", "checkbox-label": "I am not a robot", "checkbox-required": "false", "checkbox-name": "isHuman" }),
-    h("div", { slot: "terms" },
-      h("sqm-checkbox-field", null))));
-});

package/dist/collection/components/sqm-checkbox-field/sqm-checkbox-field-view.js

@@ -1,68 +0,0 @@
-import { h } from "@stencil/core";
-import jss from "jss";
-import preset from "jss-preset-default";
-import { intl } from "../../global/global";
-const style = {
-  ErrorStyle: {
-    "&::part(control)": {
-      background: "var(--sl-color-danger-10)",
-      borderColor: "var(--sl-color-danger-500)",
-      outline: "var(--sl-color-danger-500)",
-    },
-    "&:host": {
-      "--focus-ring": "0 0 0 var(--sl-focus-ring-width) red !important",
-    },
-  },
-  ErrorMessageStyle: {
-    margin: 0,
-    marginTop: "5px",
-    color: "var(--sl-color-danger-500)",
-    fontSize: "var(--sl-input-help-text-font-size-medium)",
-    fontFamily: "var(--sl-font-sans)",
-    fontWeight: "var(--sl-font-weight-normal)",
-  },
-  FieldContainer: {
-    "margin-bottom": "var(--sl-spacing-large)",
-  },
-};
-const vanillaStyle = `
-:host {
-  margin: 0 auto;
-  width: 100%;
-  display: block;
-}
-sl-checkbox::part(label){
-  font-size: var(--sl-input-label-font-size-small);
-  font-weight: var(--sl-font-weight-normal);
-  line-height: 20px;
-}
-sl-checkbox::part(base){
-  align-items: start;
-}
-`;
-jss.setup(preset());
-const sheet = jss.createStyleSheet(style);
-const styleString = sheet.toString();
-export function CheckboxFieldView(props) {
-  const { states, content, callbacks } = props;
-  const validationErrors = states === null || states === void 0 ? void 0 : states.validationErrors;
-  return (h("div", { class: sheet.classes.FieldContainer },
-    h("style", { type: "text/css" },
-      vanillaStyle,
-      styleString),
-    h("sl-checkbox", Object.assign({ exportparts: "label: input-label", name: `/${content.checkboxName}`, checked: states.checked, "onSl-change": (e) => {
-        e.target.value = e.target.checked;
-        callbacks.setChecked(e.target.value);
-      } }, (content.checkboxRequired ? { required: true } : []), (!states.checked && (validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors[content.checkboxName])
-      ? {
-        class: sheet.classes.ErrorStyle,
-      }
-      : [])),
-      intl.formatMessage({
-        id: content.checkboxName + "-message",
-        defaultMessage: content.checkboxLabel,
-      }, {
-        labelLink: (h("a", { href: content.checkboxLabelLink, target: "_blank" }, content.checkboxLabelLinkText || content.checkboxLabelLink)),
-      }),
-      !states.checked && (validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors[content.checkboxName]) && (h("p", { class: sheet.classes.ErrorMessageStyle }, content.errorMessage)))));
-}

package/dist/collection/components/sqm-checkbox-field/sqm-checkbox-field.js

@@ -1,216 +0,0 @@
-import { isDemo } from "@saasquatch/component-boilerplate";
-import { withHooks } from "@saasquatch/stencil-hooks";
-import { Component, h, Prop, State } from "@stencil/core";
-import deepmerge from "deepmerge";
-import { getProps } from "../../utils/utils";
-import { CheckboxFieldView, } from "./sqm-checkbox-field-view";
-import { useCheckboxField } from "./useCheckboxField";
-/**
- * @uiName Checkbox Field
- */
-export class CheckboxField {
-  constructor() {
-    this.ignored = true;
-    /**
-     * @uiName Checkbox label
-     */
-    this.checkboxLabel = "By signing up you agree to the {labelLink}";
-    /**
-     * @uiName Checkbox label link
-     * Used with link text if the checkbox label contains {labelLink}
-     */
-    this.checkboxLabelLink = "https://example.com";
-    /**
-     * @uiName Checkbox label link text
-     */
-    this.checkboxLabelLinkText = "Terms and Conditions";
-    /**
-     * @uiName Unchecked error message
-     */
-    this.errorMessage = "Must be checked";
-    /**
-     * @uiName Required
-     */
-    this.checkboxRequired = true;
-    withHooks(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const content = {
-      ...getProps(this),
-    };
-    const { states, callbacks } = isDemo()
-      ? useCheckboxFieldDemo(this)
-      : useCheckboxField();
-    return (h(CheckboxFieldView, { states: states, content: content, callbacks: callbacks }));
-  }
-  static get is() { return "sqm-checkbox-field"; }
-  static get properties() { return {
-    "checkboxName": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Checkbox name attribute",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "checkbox-name",
-      "reflect": false
-    },
-    "checkboxLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Checkbox label",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "checkbox-label",
-      "reflect": false,
-      "defaultValue": "\"By signing up you agree to the {labelLink}\""
-    },
-    "checkboxLabelLink": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Checkbox label link\r\nUsed with link text if the checkbox label contains {labelLink}",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "checkbox-label-link",
-      "reflect": false,
-      "defaultValue": "\"https://example.com\""
-    },
-    "checkboxLabelLinkText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Checkbox label link text",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "checkbox-label-link-text",
-      "reflect": false,
-      "defaultValue": "\"Terms and Conditions\""
-    },
-    "errorMessage": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Unchecked error message",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "error-message",
-      "reflect": false,
-      "defaultValue": "\"Must be checked\""
-    },
-    "checkboxRequired": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "text": "Required",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "checkbox-required",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "demoData": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "DemoData<CheckboxFieldViewProps>",
-        "resolved": "{ states?: { validationErrors?: Record<string, string>; checked: boolean; }; content?: { checkboxName: string; checkboxLabel: string; checkboxLabelLink?: string; checkboxLabelLinkText?: string; checkboxRequired?: boolean; errorMessage: string; }; }",
-        "references": {
-          "DemoData": {
-            "location": "import",
-            "path": "../../global/demo"
-          },
-          "CheckboxFieldViewProps": {
-            "location": "import",
-            "path": "./sqm-checkbox-field-view"
-          }
-        }
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "text": undefined,
-            "name": "undocumented"
-          }],
-        "text": ""
-      }
-    }
-  }; }
-  static get states() { return {
-    "ignored": {}
-  }; }
-}
-function useCheckboxFieldDemo(props) {
-  return deepmerge({
-    states: {
-      validationErrors: [],
-      checked: false,
-    },
-    callbacks: {
-      setChecked: () => { },
-    },
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
-}

package/dist/collection/components/sqm-checkbox-field/useCheckboxField.js

@@ -1,16 +0,0 @@
-import { useDomContext } from "@saasquatch/stencil-hooks";
-import { useState } from "@saasquatch/universal-hooks";
-const CONTEXT_NAME = "sq:validation-state";
-export function useCheckboxField() {
-  const validationState = useDomContext(CONTEXT_NAME);
-  const [checked, setChecked] = useState(false);
-  return {
-    states: {
-      validationErrors: validationState === null || validationState === void 0 ? void 0 : validationState.validationErrors,
-      checked,
-    },
-    callbacks: {
-      setChecked,
-    },
-  };
-}