@phila/phila-ui-core 2.1.1 → 2.2.0-beta.2

package/dist/styles/utilities/spacing.css

@@ -0,0 +1,433 @@
+.m-0 {
+  margin: 0 !important;
+}
+.m-1 {
+  margin: var(--spacing-xs) !important;
+}
+.m-2 {
+  margin: var(--spacing-s) !important;
+}
+.m-3 {
+  margin: var(--spacing-m) !important;
+}
+.m-4 {
+  margin: var(--spacing-l) !important;
+}
+.m-5 {
+  margin: var(--spacing-xl) !important;
+}
+.m-6 {
+  margin: var(--spacing-xxl) !important;
+}
+.m-7 {
+  margin: var(--spacing-6xl) !important;
+}
+.mt-0 {
+  margin-top: 0 !important;
+}
+.mt-1 {
+  margin-top: var(--spacing-xs) !important;
+}
+.mt-2 {
+  margin-top: var(--spacing-s) !important;
+}
+.mt-3 {
+  margin-top: var(--spacing-m) !important;
+}
+.mt-4 {
+  margin-top: var(--spacing-l) !important;
+}
+.mt-5 {
+  margin-top: var(--spacing-xl) !important;
+}
+.mt-6 {
+  margin-top: var(--spacing-xxl) !important;
+}
+.mt-7 {
+  margin-top: var(--spacing-6xl) !important;
+}
+.mr-0 {
+  margin-right: 0 !important;
+}
+.mr-1 {
+  margin-right: var(--spacing-xs) !important;
+}
+.mr-2 {
+  margin-right: var(--spacing-s) !important;
+}
+.mr-3 {
+  margin-right: var(--spacing-m) !important;
+}
+.mr-4 {
+  margin-right: var(--spacing-l) !important;
+}
+.mr-5 {
+  margin-right: var(--spacing-xl) !important;
+}
+.mr-6 {
+  margin-right: var(--spacing-xxl) !important;
+}
+.mr-7 {
+  margin-right: var(--spacing-6xl) !important;
+}
+.mb-0 {
+  margin-bottom: 0 !important;
+}
+.mb-1 {
+  margin-bottom: var(--spacing-xs) !important;
+}
+.mb-2 {
+  margin-bottom: var(--spacing-s) !important;
+}
+.mb-3 {
+  margin-bottom: var(--spacing-m) !important;
+}
+.mb-4 {
+  margin-bottom: var(--spacing-l) !important;
+}
+.mb-5 {
+  margin-bottom: var(--spacing-xl) !important;
+}
+.mb-6 {
+  margin-bottom: var(--spacing-xxl) !important;
+}
+.mb-7 {
+  margin-bottom: var(--spacing-6xl) !important;
+}
+.ml-0 {
+  margin-left: 0 !important;
+}
+.ml-1 {
+  margin-left: var(--spacing-xs) !important;
+}
+.ml-2 {
+  margin-left: var(--spacing-s) !important;
+}
+.ml-3 {
+  margin-left: var(--spacing-m) !important;
+}
+.ml-4 {
+  margin-left: var(--spacing-l) !important;
+}
+.ml-5 {
+  margin-left: var(--spacing-xl) !important;
+}
+.ml-6 {
+  margin-left: var(--spacing-xxl) !important;
+}
+.ml-7 {
+  margin-left: var(--spacing-6xl) !important;
+}
+.mx-0 {
+  margin-left: 0 !important;
+  margin-right: 0 !important;
+}
+.mx-1 {
+  margin-left: var(--spacing-xs) !important;
+  margin-right: var(--spacing-xs) !important;
+}
+.mx-2 {
+  margin-left: var(--spacing-s) !important;
+  margin-right: var(--spacing-s) !important;
+}
+.mx-3 {
+  margin-left: var(--spacing-m) !important;
+  margin-right: var(--spacing-m) !important;
+}
+.mx-4 {
+  margin-left: var(--spacing-l) !important;
+  margin-right: var(--spacing-l) !important;
+}
+.mx-5 {
+  margin-left: var(--spacing-xl) !important;
+  margin-right: var(--spacing-xl) !important;
+}
+.mx-6 {
+  margin-left: var(--spacing-xxl) !important;
+  margin-right: var(--spacing-xxl) !important;
+}
+.mx-7 {
+  margin-left: var(--spacing-6xl) !important;
+  margin-right: var(--spacing-6xl) !important;
+}
+.my-0 {
+  margin-top: 0 !important;
+  margin-bottom: 0 !important;
+}
+.my-1 {
+  margin-top: var(--spacing-xs) !important;
+  margin-bottom: var(--spacing-xs) !important;
+}
+.my-2 {
+  margin-top: var(--spacing-s) !important;
+  margin-bottom: var(--spacing-s) !important;
+}
+.my-3 {
+  margin-top: var(--spacing-m) !important;
+  margin-bottom: var(--spacing-m) !important;
+}
+.my-4 {
+  margin-top: var(--spacing-l) !important;
+  margin-bottom: var(--spacing-l) !important;
+}
+
+.my-5 {
+  margin-top: var(--spacing-xl) !important;
+  margin-bottom: var(--spacing-xl) !important;
+}
+.my-6 {
+  margin-top: var(--spacing-xxl) !important;
+  margin-bottom: var(--spacing-xxl) !important;
+}
+.my-7 {
+  margin-top: var(--spacing-6xl) !important;
+  margin-bottom: var(--spacing-6xl) !important;
+}
+.p-0 {
+  padding: 0 !important;
+}
+.p-1 {
+  padding: var(--spacing-xs) !important;
+}
+.p-1 {
+  padding: var(--spacing-xs) !important;
+}
+.p-2 {
+  padding: var(--spacing-s) !important;
+}
+.p-3 {
+  padding: var(--spacing-m) !important;
+}
+.p-4 {
+  padding: var(--spacing-l) !important;
+}
+.p-5 {
+  padding: var(--spacing-xl) !important;
+}
+.p-6 {
+  padding: var(--spacing-xxl) !important;
+}
+.p-7 {
+  padding: var(--spacing-6xl) !important;
+}
+.pt-0 {
+  padding-top: 0 !important;
+}
+.pt-1 {
+  padding-top: var(--spacing-xs) !important;
+}
+.pt-2 {
+  padding-top: var(--spacing-s) !important;
+}
+.pt-3 {
+  padding-top: var(--spacing-m) !important;
+}
+.pt-4 {
+  padding-top: var(--spacing-l) !important;
+}
+.pt-5 {
+  padding-top: var(--spacing-xl) !important;
+}
+.pt-6 {
+  padding-top: var(--spacing-xxl) !important;
+}
+.pt-7 {
+  padding-top: var(--spacing-6xl) !important;
+}
+.pr-0 {
+  padding-right: 0 !important;
+}
+.pr-1 {
+  padding-right: var(--spacing-xs) !important;
+}
+.pr-2 {
+  padding-right: var(--spacing-s) !important;
+}
+.pr-3 {
+  padding-right: var(--spacing-m) !important;
+}
+.pr-4 {
+  padding-right: var(--spacing-l) !important;
+}
+.pr-5 {
+  padding-right: var(--spacing-xl) !important;
+}
+.pr-6 {
+  padding-right: var(--spacing-xxl) !important;
+}
+.pr-7 {
+  padding-right: var(--spacing-6xl) !important;
+}
+.pb-0 {
+  padding-bottom: 0 !important;
+}
+.pb-1 {
+  padding-bottom: var(--spacing-xs) !important;
+}
+.pb-2 {
+  padding-bottom: var(--spacing-s) !important;
+}
+.pb-3 {
+  padding-bottom: var(--spacing-m) !important;
+}
+.pb-4 {
+  padding-bottom: var(--spacing-l) !important;
+}
+.pb-5 {
+  padding-bottom: var(--spacing-xl) !important;
+}
+.pb-6 {
+  padding-bottom: var(--spacing-xxl) !important;
+}
+.pb-7 {
+  padding-bottom: var(--spacing-6xl) !important;
+}
+.pl-0 {
+  padding-left: 0 !important;
+}
+.pl-1 {
+  padding-left: var(--spacing-xs) !important;
+}
+.pl-2 {
+  padding-left: var(--spacing-s) !important;
+}
+.pl-3 {
+  padding-left: var(--spacing-m) !important;
+}
+.pl-4 {
+  padding-left: var(--spacing-l) !important;
+}
+.pl-5 {
+  padding-left: var(--spacing-xl) !important;
+}
+.pl-6 {
+  padding-left: var(--spacing-xxl) !important;
+}
+.pl-7 {
+  padding-left: var(--spacing-6xl) !important;
+}
+.px-0 {
+  padding-left: 0 !important;
+  padding-right: 0 !important;
+}
+.px-1 {
+  padding-left: var(--spacing-xs) !important;
+  padding-right: var(--spacing-xs) !important;
+}
+.px-2 {
+  padding-left: var(--spacing-s) !important;
+  padding-right: var(--spacing-s) !important;
+}
+.px-3 {
+  padding-left: var(--spacing-m) !important;
+  padding-right: var(--spacing-m) !important;
+}
+.px-4 {
+  padding-left: var(--spacing-l) !important;
+  padding-right: var(--spacing-l) !important;
+}
+.px-5 {
+  padding-left: var(--spacing-xl) !important;
+  padding-right: var(--spacing-xl) !important;
+}
+.px-6 {
+  padding-left: var(--spacing-xxl) !important;
+  padding-right: var(--spacing-xxl) !important;
+}
+.px-7 {
+  padding-left: var(--spacing-6xl) !important;
+  padding-right: var(--spacing-6xl) !important;
+}
+.py-0 {
+  padding-top: 0 !important;
+  padding-bottom: 0 !important;
+}
+.py-1 {
+  padding-top: var(--spacing-xs) !important;
+  padding-bottom: var(--spacing-xs) !important;
+}
+.py-2 {
+  padding-top: var(--spacing-s) !important;
+  padding-bottom: var(--spacing-s) !important;
+}
+.py-3 {
+  padding-top: var(--spacing-m) !important;
+  padding-bottom: var(--spacing-m) !important;
+}
+.py-4 {
+  padding-top: var(--spacing-l) !important;
+  padding-bottom: var(--spacing-l) !important;
+}
+.py-5 {
+  padding-top: var(--spacing-xl) !important;
+  padding-bottom: var(--spacing-xl) !important;
+}
+.py-6 {
+  padding-top: var(--spacing-xxl) !important;
+  padding-bottom: var(--spacing-xxl) !important;
+}
+.py-7 {
+  padding-top: var(--spacing-6xl) !important;
+  padding-bottom: var(--spacing-6xl) !important;
+}
+.has-spacing-body-small {
+  margin: 0 0 var(--spacing-l) 0 !important;
+}
+.has-spacing-body-default {
+  margin: 0 0 var(--spacing-l) 0 !important;
+}
+.has-spacing-body-large {
+  margin: 0 0 var(--spacing-xl) 0 !important;
+}
+.has-spacing-body-extra-large {
+  margin: 0 0 var(--spacing-xxl) 0 !important;
+}
+.has-spacing-heading-1 {
+  margin: var(--spacing-xxl) 0 !important;
+}
+.has-spacing-heading-2 {
+  margin: var(--spacing-l) 0 var(--spacing-xxl) 0 !important;
+}
+.has-spacing-heading-3 {
+  margin: var(--spacing-l) 0 var(--spacing-xxl) 0 !important;
+}
+.has-spacing-heading-4 {
+  margin: var(--spacing-l) 0 !important;
+}
+.has-spacing-heading-5 {
+  margin: var(--spacing-l) 0 !important;
+}
+.has-spacing-heading-6 {
+  margin: var(--spacing-l) 0 !important;
+}
+.has-spacing-display-1 {
+  margin: 0 0 var(--spacing-xxl) 0 !important;
+}
+.has-spacing-display-2 {
+  margin: 0 0 var(--spacing-l) 0 !important;
+}
+.has-spacing-subtitle-1 {
+  margin: 0 0 var(--spacing-l) 0 !important;
+}
+.has-spacing-subtitle-2 {
+  margin: 0 0 var(--spacing-l) 0 !important;
+}
+.has-spacing-label-small {
+  margin: 0 0 var(--spacing-l) 0 !important;
+}
+.has-spacing-label-default {
+  margin: 0 0 var(--spacing-l) 0 !important;
+}
+.has-spacing-label-large {
+  margin: 0 0 var(--spacing-xl) 0 !important;
+}
+.has-spacing-quote {
+  margin: 0 0 var(--spacing-l) 0 !important;
+}
+
+/* fix for collapsing margins on flex containers when stacked */
+@media screen and (max-width: 768px) {
+  .is-flex + .is-flex {
+    margin-top: 0 !important;
+  }
+}

package/dist/styles/utilities/text.css

@@ -0,0 +1,177 @@
+.default-font,
+.content {
+  font-family: var(--Body-Default-font-body-default-family);
+  font-size: var(--Body-Default-font-body-default-size);
+  font-style: normal;
+}
+.sr-only {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  padding: 0 !important;
+  margin: -1px !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+}
+.has-text-bold {
+  font-weight: 600 !important;
+}
+.has-text-italic {
+  font-style: italic !important;
+}
+.has-text-underline {
+  text-decoration: underline !important;
+}
+.has-text-center {
+  text-align: center !important;
+}
+.has-text-label-small {
+  font-family: var(--Label-ExtraSmall-font-label-xs-family) !important;
+  font-size: var(--Label-ExtraSmall-font-label-xs-size) !important;
+  font-style: normal;
+  font-weight: 600;
+  line-height: var(--Label-ExtraSmall-font-label-xs-lineheight) !important;
+}
+.has-text-label-default {
+  font-family: var(--Label-Default-font-label-default-family) !important;
+  font-size: var(--Label-Default-font-label-default-size) !important;
+  font-style: normal;
+  font-weight: 600;
+  line-height: var(--Label-Default-font-label-default-lineheight) !important;
+}
+.has-text-label-large {
+  font-family: var(--Label-Large-font-label-large-family) !important;
+  font-size: var(--Label-Large-font-label-large-size) !important;
+  font-style: normal;
+  font-weight: 600;
+  line-height: var(--Label-Large-font-label-large-lineheight) !important;
+}
+.has-text-body-default {
+  font-family: var(--Body-Default-font-body-default-family) !important;
+  font-size: var(--Body-Default-font-body-default-size) !important;
+  font-weight: 400;
+  line-height: var(--Body-Default-font-body-default-lineheight) !important;
+}
+.has-text-body-small {
+  font-family: var(--Body-Small-font-body-small-family) !important;
+  font-size: var(--Body-Small-font-body-small-size) !important;
+  font-style: normal;
+  font-weight: 400;
+  line-height: var(--Body-Small-font-body-small-lineheight) !important;
+}
+.has-text-body-large {
+  font-family: var(--Body-Large-font-body-large-family) !important;
+  font-size: var(--Body-Large-font-body-large-size) !important;
+  font-style: normal;
+  font-weight: 400;
+  line-height: var(--Body-Large-font-body-large-lineheight) !important;
+}
+.has-text-body-extra-large {
+  font-family: var(--Body-ExtraLarge-font-body-xlarge-family) !important;
+  font-size: var(--Body-ExtraLarge-font-body-xlarge-size) !important;
+  font-style: normal;
+  font-weight: 400;
+  line-height: var(--Body-ExtraLarge-font-body-xlarge-lineheight) !important;
+}
+.has-text-display-1 {
+  font-family: var(--Display-font-display-family) !important;
+  font-size: var(--Display-Display-1-font-display-1-size) !important;
+  font-weight: 600;
+  line-height: var(--Display-Display-1-font-display-1-lineheight) !important;
+}
+.has-text-display-2 {
+  font-family: var(--Display-font-display-family) !important;
+  font-size: var(--Display-Display-2-font-display-2-size) !important;
+  font-weight: 600;
+  line-height: var(--Display-Display-2-font-display-2-lineheight) !important;
+}
+.has-text-heading-1 {
+  font-family: var(--Heading-H1-font-heading-1-family) !important;
+  font-size: var(--Heading-H1-font-heading-1-size) !important;
+  font-weight: 600;
+  line-height: var(--Heading-H1-font-header-1-lineheight) !important;
+}
+.has-text-heading-2 {
+  font-family: var(--Heading-H2-font-heading-2-family) !important;
+  font-size: var(--Heading-H2-font-heading-2-size) !important;
+  font-style: normal;
+  font-weight: 600;
+  line-height: var(--Heading-H2-font-heading-2-lineheight) !important;
+}
+.has-text-heading-3 {
+  font-family: var(--Heading-H3-font-heading-3-family) !important;
+  font-size: var(--Heading-H3-font-heading-3-size) !important;
+  font-style: normal;
+  font-weight: 600;
+  line-height: var(--Heading-H3-font-heading-3-lineheight) !important;
+}
+.has-text-heading-4 {
+  font-family: var(--Heading-H4-font-heading-4-family) !important;
+  font-size: var(--Heading-H4-font-heading-4-size) !important;
+  font-style: normal;
+  font-weight: 600;
+  line-height: var(--Heading-H4-font-heading-4-lineheight) !important;
+}
+.has-text-heading-5 {
+  font-family: var(--Heading-H5-font-heading-5-family) !important;
+  font-size: var(--Heading-H5-font-heading-5-size) !important;
+  font-style: normal;
+  font-weight: 600;
+  line-height: var(--Heading-H5-font-heading-5-lineheight) !important;
+}
+.has-text-heading-6 {
+  font-family: var(--Heading-H6-font-heading-6-family) !important;
+  font-size: var(--Heading-H6-font-heading-6-size) !important;
+  font-style: normal;
+  font-weight: 600;
+  line-height: var(--Heading-H6-font-heading-6-lineheight) !important;
+}
+.has-text-subtitle-1 {
+  font-family: var(--Subtitle-font-subtitle-family) !important;
+  font-size: var(--Subtitle-Subtitle-1-font-subtitle-1-size) !important;
+  font-style: normal;
+  font-weight: 600;
+  line-height: var(--Subtitle-Subtitle-1-font-subtitle-1-lineheight) !important;
+}
+.has-text-subtitle-2 {
+  font-family: var(--Subtitle-font-subtitle-family) !important;
+  font-size: var(--Subtitle-Subtitle-2-font-subtitle-2-size) !important;
+  font-style: normal;
+  font-weight: 600;
+  line-height: var(--Subtitle-Subtitle-2-font-subtitle-2-lineheight) !important;
+}
+.has-text-quote {
+  font-family: var(--Quote-font-quote-family) !important;
+  font-size: var(--Quote-font-quote-size) !important;
+  font-style: italic !important;
+  font-weight: 700 !important;
+  line-height: var(--Quote-font-quote-lineheight) !important;
+}
+.has-text-link-large {
+  font-family: var(--Link-on-Surface-Large-font-link-on-surface-large-family, Montserrat);
+  font-size: var(--Link-on-Surface-Large-font-link-on-surface-large-size, 1.125rem);
+  font-style: normal;
+  font-weight: 700;
+  line-height: var(--Link-on-Surface-Large-font-link-on-surface-large-lineheight, 1.75rem); /* 155.556% */
+}
+.has-text-link-default {
+  font-family: var(--Link-on-Surface-Default-font-link-on-surface-default-family, Montserrat);
+  font-size: var(--Link-on-Surface-Default-font-link-on-surface-default-size, 1rem);
+  font-style: normal;
+  font-weight: 700;
+  line-height: var(--Link-on-Surface-Default-font-link-on-surface-default-lineheight, 1.5rem); /* 150% */
+}
+.has-text-link-small {
+  font-family: var(--Link-on-Surface-Small-font-link-on-surface-small-family, Montserrat);
+  font-size: var(--Link-on-Surface-Small-font-link-on-surface-small-size, 0.875rem);
+  font-style: normal;
+  font-weight: 700;
+  line-height: var(--Link-on-Surface-Small-font-link-on-surface-small-lineheight, 1.25rem); /* 142.857% */
+}
+.has-text-link-xsmall {
+  font-family: var(--Link-on-Surface-font-link-family, Montserrat);
+  font-size: var(--Link-on-Surface-ExtraSmall-font-link-on-surface-xs-size, 0.75rem);
+  font-style: normal;
+  font-weight: 700;
+  line-height: var(--Body-ExtraSmall-font-body-xs-lineheight, 1rem); /* 133.333% */
+}

package/dist/useRouter-BVKwor6C.js

@@ -0,0 +1,50 @@
+import { ref as u, reactive as d, computed as n, inject as o } from "vue";
+const r = u("");
+function f() {
+  return {
+    inputValue: r,
+    setInputValue: (t) => {
+      r.value = t;
+    }
+  };
+}
+const e = d({
+  validateOnBlur: !1,
+  validateOnInput: !1,
+  validateOnChange: !1,
+  validateOnMount: !1,
+  required: !1,
+  isValid: !0,
+  errors: []
+}), { inputValue: s } = f();
+function O(a, t) {
+  return {
+    init: () => {
+      a && (e.validateOnBlur = a.validateOnBlur ?? !1, e.validateOnInput = a.validateOnInput ?? !1, e.validateOnChange = a.validateOnChange ?? !1, e.validateOnMount = a.validateOnMount ?? !1, e.validate = a.validate, e.required = a.required ?? !1, e.errors = a.errors || []);
+    },
+    validation: () => {
+      const i = Object.assign([], a?.errors || []);
+      if (e.required && !s.value && (e.isValid = !1, i.push("This field is required")), e.validate) {
+        const l = e.validate(s.value);
+        typeof l == "string" ? (e.isValid = !1, i.push(l)) : Array.isArray(l) ? (e.isValid = !1, i.push(...l)) : e.isValid = !0;
+      }
+      e.errors = i, i.length > 0 ? (e.isValid = !1, t?.("error", i)) : e.isValid = !0;
+    },
+    isValid: n(() => e.isValid),
+    errors: n(() => e.errors)
+  };
+}
+const h = (a) => "to" in a && a.to !== void 0;
+function g() {
+  const a = o("router", null), t = n(() => a !== null);
+  return {
+    router: a,
+    hasRouter: t
+  };
+}
+export {
+  O as a,
+  g as b,
+  h as i,
+  f as u
+};

package/dist/useRouter-C4oT8vFk.cjs

@@ -0,0 +1 @@
+"use strict";const i=require("vue"),u=i.ref("");function s(){return{inputValue:u,setInputValue:n=>{u.value=n}}}const e=i.reactive({validateOnBlur:!1,validateOnInput:!1,validateOnChange:!1,validateOnMount:!1,required:!1,isValid:!0,errors:[]}),{inputValue:r}=s();function d(t,n){return{init:()=>{t&&(e.validateOnBlur=t.validateOnBlur??!1,e.validateOnInput=t.validateOnInput??!1,e.validateOnChange=t.validateOnChange??!1,e.validateOnMount=t.validateOnMount??!1,e.validate=t.validate,e.required=t.required??!1,e.errors=t.errors||[])},validation:()=>{const a=Object.assign([],t?.errors||[]);if(e.required&&!r.value&&(e.isValid=!1,a.push("This field is required")),e.validate){const l=e.validate(r.value);typeof l=="string"?(e.isValid=!1,a.push(l)):Array.isArray(l)?(e.isValid=!1,a.push(...l)):e.isValid=!0}e.errors=a,a.length>0?(e.isValid=!1,n?.("error",a)):e.isValid=!0},isValid:i.computed(()=>e.isValid),errors:i.computed(()=>e.errors)}}const o=t=>"to"in t&&t.to!==void 0;function f(){const t=i.inject("router",null),n=i.computed(()=>t!==null);return{router:t,hasRouter:n}}exports.isRouterLink=o;exports.useInput=s;exports.useRouter=f;exports.useValidation=d;