@telia-ace/alliance-ui 1.0.3 → 1.0.4-next.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @telia-ace/alliance-ui
2
2
 
3
+ ## 1.0.4-next.0
4
+
5
+ ### Patch Changes
6
+
7
+ - 94cc0b7: Replace existing voca-foundations-style-tag element if existing.
8
+
3
9
  ## 1.0.3
4
10
 
5
11
  ### Patch Changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@telia-ace/alliance-ui",
3
- "version": "1.0.3",
3
+ "version": "1.0.4-next.0",
4
4
  "description": "UI components used by ACE Alliance apps.",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "author": "Telia Company AB",
@@ -36,7 +36,7 @@
36
36
  "lit": "^2.4.1"
37
37
  },
38
38
  "devDependencies": {
39
- "@telia-ace/alliance-framework": "^1.0.3",
39
+ "@telia-ace/alliance-framework": "^1.0.4-next.0",
40
40
  "@telia-ace/alliance-utilities": "^1.0.2",
41
41
  "@types/fs-extra": "^9.0.13",
42
42
  "fs-extra": "^10.1.0",
@@ -1,12 +1,9 @@
1
- import { t as d, s as a, a as o, m as r, l as i, b as n, d as t, c as e, g, f as u } from "../../chunks/variables-825dd261.js";
1
+ import { t as d, s as a, a as o, m as r, l as t, b as n, d as s, c as e, g, f as c } from "../../chunks/variables-825dd261.js";
2
2
  import { b as k, d as x, c as S, f as v, g as L, l as M, m as H, a as $, s as z, t as B } from "../../chunks/variables-825dd261.js";
3
3
  const y = () => {
4
- const p = "voca-foundations-style-tag";
5
- if (!!document.getElementById(p))
6
- return;
7
- const s = document.createElement("style");
8
- s.id = p;
9
- const l = {
4
+ const p = "voca-foundations-style-tag", l = document.getElementById(p), i = document.createElement("style");
5
+ i.id = p;
6
+ const u = {
10
7
  "--font-telia-heading": "TeliaSansHeading, TeliaSans, HelveticaNeue, Helvetica, Arial, sans-serif",
11
8
  "--font-telia-sans": "TeliaSans, Helvetica, Arial, Lucida Grande, sans-serif",
12
9
  "--font-normal": d.weightNormal,
@@ -43,10 +40,10 @@ const y = () => {
43
40
  "--timing-ease-in": r.easeIn,
44
41
  "--timing-ease-out": r.easeOut,
45
42
  "--timing-ease-in-out": r.easeInOut,
46
- "--layer-base": i.base,
47
- "--layer-dropdown": i.dropdown,
48
- "--layer-header": i.header,
49
- "--layer-modal": i.modal,
43
+ "--layer-base": t.base,
44
+ "--layer-dropdown": t.dropdown,
45
+ "--layer-header": t.header,
46
+ "--layer-modal": t.modal,
50
47
  "--border-width-none": n.widthNone,
51
48
  "--border-width-sm": n.widthSm,
52
49
  "--border-width-md": n.widthMd,
@@ -56,10 +53,10 @@ const y = () => {
56
53
  "--border-radius-sm": n.radiusSm,
57
54
  "--border-radius-lg": n.radiusLg,
58
55
  "--border-radius-full": n.radiusFull,
59
- "--screen-size-sm": t.breakpointSm,
60
- "--screen-size-md": t.breakpointMd,
61
- "--screen-size-lg": t.breakpointLg,
62
- "--screen-size-xl": t.breakpointXl,
56
+ "--screen-size-sm": s.breakpointSm,
57
+ "--screen-size-md": s.breakpointMd,
58
+ "--screen-size-lg": s.breakpointLg,
59
+ "--screen-size-xl": s.breakpointXl,
63
60
  "--purple-100": e.purple100,
64
61
  "--purple-200": e.purple200,
65
62
  "--purple-300": e.purple300,
@@ -159,13 +156,17 @@ const y = () => {
159
156
  "--transparent-white-800": "rgba(0, 0, 0, 0.8)",
160
157
  "--transparent-white-850": "rgba(0, 0, 0, 0.85)",
161
158
  "--transparent-white-900": "rgba(0, 0, 0, 0.9)",
162
- "--focus-border": `${u.focusBorderWidth} solid ${u.focusColor}`
163
- }, c = Object.keys(l).map((b) => `${b}:${l[b]};`).join("");
164
- s.innerHTML = `
159
+ "--focus-border": `${c.focusBorderWidth} solid ${c.focusColor}`
160
+ }, h = Object.keys(u).map((b) => `${b}:${u[b]};`).join("");
161
+ if (i.innerHTML = `
165
162
  :root {
166
- ${c}
163
+ ${h}
167
164
  }
168
- `, document.head.append(s);
165
+ `, l) {
166
+ document.head.replaceChild(i, l);
167
+ return;
168
+ }
169
+ return document.head.append(i);
169
170
  };
170
171
  export {
171
172
  y as addCssVariables,
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/voca/foundations/index.ts"],"sourcesContent":["import {\n borders,\n breakpoints,\n colors,\n grid,\n layers,\n motion,\n shadows,\n spacing,\n typography,\n} from '@teliads/components/foundations';\nimport focus from '@teliads/components/foundations/focus/variables.json';\n\nexport { borders, breakpoints, colors, grid, layers, motion, shadows, spacing, typography, focus };\n\nexport const addCssVariables = () => {\n const styleId = 'voca-foundations-style-tag';\n\n const exists = !!document.getElementById(styleId);\n\n if (exists) {\n return;\n }\n\n const element = document.createElement('style');\n\n element.id = styleId;\n\n const variables: Record<string, string> = {\n '--font-telia-heading':\n 'TeliaSansHeading, TeliaSans, HelveticaNeue, Helvetica, Arial, sans-serif',\n '--font-telia-sans': 'TeliaSans, Helvetica, Arial, Lucida Grande, sans-serif',\n '--font-normal': typography.weightNormal,\n '--font-medium': typography.weightMedium,\n '--font-bold': typography.weightBold,\n\n '--spacing-0': spacing.spacing0,\n '--spacing-2': spacing.spacing2,\n '--spacing-4': spacing.spacing4,\n '--spacing-8': spacing.spacing8,\n '--spacing-12': spacing.spacing12,\n '--spacing-16': spacing.spacing16,\n '--spacing-20': spacing.spacing20,\n '--spacing-24': spacing.spacing24,\n '--spacing-32': spacing.spacing32,\n '--spacing-48': spacing.spacing48,\n '--spacing-64': spacing.spacing64,\n '--spacing-80': spacing.spacing80,\n '--spacing-96': spacing.spacing96,\n '--spacing-128': spacing.spacing128,\n\n '--box-shadow-none': shadows.none,\n '--box-shadow-hard': shadows.hard,\n '--box-shadow-soft': shadows.soft,\n\n '--duration-50': motion.duration50,\n '--duration-100': motion.duration100,\n '--duration-150': motion.duration150,\n '--duration-200': motion.duration200,\n '--duration-250': motion.duration250,\n '--duration-300': motion.duration300,\n '--duration-350': motion.duration350,\n '--duration-400': motion.duration400,\n '--duration-500': motion.duration500,\n '--duration-1500': motion.duration1500,\n '--duration-2000': motion.duration2000,\n\n '--timing-ease-in': motion.easeIn,\n '--timing-ease-out': motion.easeOut,\n '--timing-ease-in-out': motion.easeInOut,\n\n '--layer-base': layers.base,\n '--layer-dropdown': layers.dropdown,\n '--layer-header': layers.header,\n '--layer-modal': layers.modal,\n\n '--border-width-none': borders.widthNone,\n '--border-width-sm': borders.widthSm,\n '--border-width-md': borders.widthMd,\n '--border-width-xs': borders.widthXs,\n\n '--border-radius-none': borders.radiusNone,\n '--border-radius-default': borders.radiusDefault,\n '--border-radius-sm': borders.radiusSm,\n '--border-radius-lg': borders.radiusLg,\n '--border-radius-full': borders.radiusFull,\n\n '--screen-size-sm': breakpoints.breakpointSm,\n '--screen-size-md': breakpoints.breakpointMd,\n '--screen-size-lg': breakpoints.breakpointLg,\n '--screen-size-xl': breakpoints.breakpointXl,\n\n '--purple-100': colors.purple100,\n '--purple-200': colors.purple200,\n '--purple-300': colors.purple300,\n '--purple-400': colors.purple400,\n '--purple-500': colors.purple500,\n '--purple-600': colors.purple600,\n '--purple-700': colors.purple700,\n '--purple-800': colors.purple800,\n '--purple-850': colors.purple850,\n '--purple-900': colors.purple900,\n\n '--beige-50': colors.beige50,\n '--beige-100': colors.beige100,\n '--beige-200': colors.beige200,\n '--beige-300': colors.beige300,\n '--beige-400': colors.beige400,\n '--beige-500': colors.beige500,\n '--beige-600': colors.beige600,\n '--beige-700': colors.beige700,\n '--beige-800': colors.beige800,\n '--beige-900': colors.beige900,\n\n '--gray-50': colors.gray50,\n '--gray-100': colors.gray100,\n '--gray-200': colors.gray200,\n '--gray-300': colors.gray300,\n '--gray-400': colors.gray400,\n '--gray-500': colors.gray500,\n '--gray-600': colors.gray600,\n '--gray-700': colors.gray700,\n '--gray-800': colors.gray800,\n '--gray-900': colors.gray900,\n\n '--green-100': colors.green100,\n '--green-200': colors.green200,\n '--green-300': colors.green300,\n '--green-400': colors.green400,\n '--green-500': colors.green500,\n '--green-600': colors.green600,\n '--green-700': colors.green700,\n '--green-800': colors.green800,\n '--green-900': colors.green900,\n\n '--red-100': colors.red100,\n '--red-200': colors.red200,\n '--red-300': colors.red300,\n '--red-400': colors.red400,\n '--red-500': colors.red500,\n '--red-600': colors.red600,\n '--red-700': colors.red700,\n '--red-800': colors.red800,\n '--red-900': colors.red900,\n\n '--orange-100': colors.orange100,\n '--orange-200': colors.orange200,\n '--orange-300': colors.orange300,\n '--orange-400': colors.orange400,\n '--orange-500': colors.orange500,\n '--orange-600': colors.orange600,\n '--orange-700': colors.orange700,\n '--orange-800': colors.orange800,\n '--orange-900': colors.orange900,\n\n '--blue-100': colors.blue100,\n '--blue-200': colors.blue200,\n '--blue-300': colors.blue300,\n '--blue-400': colors.blue400,\n '--blue-500': colors.blue500,\n '--blue-600': colors.blue600,\n '--blue-700': colors.blue700,\n '--blue-800': colors.blue800,\n '--blue-900': colors.blue900,\n\n '--white': colors.white,\n '--black': colors.black,\n '--functional-black': colors.functionalBlack,\n\n '--grid-gutter': grid.gutter,\n '--grid-gutter-medium': grid.gutterMedium,\n '--grid-gutter-large': grid.gutterLarge,\n '--grid-page-padding': grid.pagePadding,\n '--grid-page-padding-m': grid.pagePaddingM,\n '--grid-page-padding-l': grid.pagePaddingL,\n '--grid-page-padding-xl': grid.pagePaddingXl,\n\n // The following are not available in JS variables for some reason\n '--functional-transparent': 'transparent',\n '--transparent-black-50': 'rgba(0, 0, 0, 0.05)',\n '--transparent-black-100': 'rgba(0, 0, 0, 0.1)',\n '--transparent-black-200': 'rgba(0, 0, 0, 0.2)',\n '--transparent-black-300': 'rgba(0, 0, 0, 0.3)',\n '--transparent-black-400': 'rgba(0, 0, 0, 0.4)',\n '--transparent-black-500': 'rgba(0, 0, 0, 0.5)',\n '--transparent-black-600': 'rgba(0, 0, 0, 0.6)',\n '--transparent-black-700': 'rgba(0, 0, 0, 0.7)',\n '--transparent-black-800': 'rgba(0, 0, 0, 0.8)',\n '--transparent-black-850': 'rgba(0, 0, 0, 0.85)',\n '--transparent-black-900': 'rgba(0, 0, 0, 0.9)',\n '--transparent-white-50': 'rgba(0, 0, 0, 0.05)',\n '--transparent-white-100': 'rgba(0, 0, 0, 0.1)',\n '--transparent-white-200': 'rgba(0, 0, 0, 0.2)',\n '--transparent-white-300': 'rgba(0, 0, 0, 0.3)',\n '--transparent-white-400': 'rgba(0, 0, 0, 0.4)',\n '--transparent-white-500': 'rgba(0, 0, 0, 0.5)',\n '--transparent-white-600': 'rgba(0, 0, 0, 0.6)',\n '--transparent-white-700': 'rgba(0, 0, 0, 0.7)',\n '--transparent-white-800': 'rgba(0, 0, 0, 0.8)',\n '--transparent-white-850': 'rgba(0, 0, 0, 0.85)',\n '--transparent-white-900': 'rgba(0, 0, 0, 0.9)',\n\n '--focus-border': `${focus.focusBorderWidth} solid ${focus.focusColor}`,\n };\n\n const variableString = Object.keys(variables)\n .map((key) => `${key}:${variables[key]};`)\n .join('');\n\n element.innerHTML = `\n :root {\n ${variableString}\n }\n `;\n\n document.head.append(element);\n};\n"],"names":["addCssVariables","styleId","element","variables","typography","spacing","shadows","motion","layers","borders","breakpoints","colors","grid","focus","variableString","key"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../src/voca/foundations/index.ts"],"sourcesContent":["import {\n borders,\n breakpoints,\n colors,\n grid,\n layers,\n motion,\n shadows,\n spacing,\n typography,\n} from '@teliads/components/foundations';\nimport focus from '@teliads/components/foundations/focus/variables.json';\n\nexport { borders, breakpoints, colors, grid, layers, motion, shadows, spacing, typography, focus };\n\nexport const addCssVariables = () => {\n const styleId = 'voca-foundations-style-tag';\n const existing = document.getElementById(styleId);\n const element = document.createElement('style');\n element.id = styleId;\n\n const variables: Record<string, string> = {\n '--font-telia-heading':\n 'TeliaSansHeading, TeliaSans, HelveticaNeue, Helvetica, Arial, sans-serif',\n '--font-telia-sans': 'TeliaSans, Helvetica, Arial, Lucida Grande, sans-serif',\n '--font-normal': typography.weightNormal,\n '--font-medium': typography.weightMedium,\n '--font-bold': typography.weightBold,\n\n '--spacing-0': spacing.spacing0,\n '--spacing-2': spacing.spacing2,\n '--spacing-4': spacing.spacing4,\n '--spacing-8': spacing.spacing8,\n '--spacing-12': spacing.spacing12,\n '--spacing-16': spacing.spacing16,\n '--spacing-20': spacing.spacing20,\n '--spacing-24': spacing.spacing24,\n '--spacing-32': spacing.spacing32,\n '--spacing-48': spacing.spacing48,\n '--spacing-64': spacing.spacing64,\n '--spacing-80': spacing.spacing80,\n '--spacing-96': spacing.spacing96,\n '--spacing-128': spacing.spacing128,\n\n '--box-shadow-none': shadows.none,\n '--box-shadow-hard': shadows.hard,\n '--box-shadow-soft': shadows.soft,\n\n '--duration-50': motion.duration50,\n '--duration-100': motion.duration100,\n '--duration-150': motion.duration150,\n '--duration-200': motion.duration200,\n '--duration-250': motion.duration250,\n '--duration-300': motion.duration300,\n '--duration-350': motion.duration350,\n '--duration-400': motion.duration400,\n '--duration-500': motion.duration500,\n '--duration-1500': motion.duration1500,\n '--duration-2000': motion.duration2000,\n\n '--timing-ease-in': motion.easeIn,\n '--timing-ease-out': motion.easeOut,\n '--timing-ease-in-out': motion.easeInOut,\n\n '--layer-base': layers.base,\n '--layer-dropdown': layers.dropdown,\n '--layer-header': layers.header,\n '--layer-modal': layers.modal,\n\n '--border-width-none': borders.widthNone,\n '--border-width-sm': borders.widthSm,\n '--border-width-md': borders.widthMd,\n '--border-width-xs': borders.widthXs,\n\n '--border-radius-none': borders.radiusNone,\n '--border-radius-default': borders.radiusDefault,\n '--border-radius-sm': borders.radiusSm,\n '--border-radius-lg': borders.radiusLg,\n '--border-radius-full': borders.radiusFull,\n\n '--screen-size-sm': breakpoints.breakpointSm,\n '--screen-size-md': breakpoints.breakpointMd,\n '--screen-size-lg': breakpoints.breakpointLg,\n '--screen-size-xl': breakpoints.breakpointXl,\n\n '--purple-100': colors.purple100,\n '--purple-200': colors.purple200,\n '--purple-300': colors.purple300,\n '--purple-400': colors.purple400,\n '--purple-500': colors.purple500,\n '--purple-600': colors.purple600,\n '--purple-700': colors.purple700,\n '--purple-800': colors.purple800,\n '--purple-850': colors.purple850,\n '--purple-900': colors.purple900,\n\n '--beige-50': colors.beige50,\n '--beige-100': colors.beige100,\n '--beige-200': colors.beige200,\n '--beige-300': colors.beige300,\n '--beige-400': colors.beige400,\n '--beige-500': colors.beige500,\n '--beige-600': colors.beige600,\n '--beige-700': colors.beige700,\n '--beige-800': colors.beige800,\n '--beige-900': colors.beige900,\n\n '--gray-50': colors.gray50,\n '--gray-100': colors.gray100,\n '--gray-200': colors.gray200,\n '--gray-300': colors.gray300,\n '--gray-400': colors.gray400,\n '--gray-500': colors.gray500,\n '--gray-600': colors.gray600,\n '--gray-700': colors.gray700,\n '--gray-800': colors.gray800,\n '--gray-900': colors.gray900,\n\n '--green-100': colors.green100,\n '--green-200': colors.green200,\n '--green-300': colors.green300,\n '--green-400': colors.green400,\n '--green-500': colors.green500,\n '--green-600': colors.green600,\n '--green-700': colors.green700,\n '--green-800': colors.green800,\n '--green-900': colors.green900,\n\n '--red-100': colors.red100,\n '--red-200': colors.red200,\n '--red-300': colors.red300,\n '--red-400': colors.red400,\n '--red-500': colors.red500,\n '--red-600': colors.red600,\n '--red-700': colors.red700,\n '--red-800': colors.red800,\n '--red-900': colors.red900,\n\n '--orange-100': colors.orange100,\n '--orange-200': colors.orange200,\n '--orange-300': colors.orange300,\n '--orange-400': colors.orange400,\n '--orange-500': colors.orange500,\n '--orange-600': colors.orange600,\n '--orange-700': colors.orange700,\n '--orange-800': colors.orange800,\n '--orange-900': colors.orange900,\n\n '--blue-100': colors.blue100,\n '--blue-200': colors.blue200,\n '--blue-300': colors.blue300,\n '--blue-400': colors.blue400,\n '--blue-500': colors.blue500,\n '--blue-600': colors.blue600,\n '--blue-700': colors.blue700,\n '--blue-800': colors.blue800,\n '--blue-900': colors.blue900,\n\n '--white': colors.white,\n '--black': colors.black,\n '--functional-black': colors.functionalBlack,\n\n '--grid-gutter': grid.gutter,\n '--grid-gutter-medium': grid.gutterMedium,\n '--grid-gutter-large': grid.gutterLarge,\n '--grid-page-padding': grid.pagePadding,\n '--grid-page-padding-m': grid.pagePaddingM,\n '--grid-page-padding-l': grid.pagePaddingL,\n '--grid-page-padding-xl': grid.pagePaddingXl,\n\n // The following are not available in JS variables for some reason\n '--functional-transparent': 'transparent',\n '--transparent-black-50': 'rgba(0, 0, 0, 0.05)',\n '--transparent-black-100': 'rgba(0, 0, 0, 0.1)',\n '--transparent-black-200': 'rgba(0, 0, 0, 0.2)',\n '--transparent-black-300': 'rgba(0, 0, 0, 0.3)',\n '--transparent-black-400': 'rgba(0, 0, 0, 0.4)',\n '--transparent-black-500': 'rgba(0, 0, 0, 0.5)',\n '--transparent-black-600': 'rgba(0, 0, 0, 0.6)',\n '--transparent-black-700': 'rgba(0, 0, 0, 0.7)',\n '--transparent-black-800': 'rgba(0, 0, 0, 0.8)',\n '--transparent-black-850': 'rgba(0, 0, 0, 0.85)',\n '--transparent-black-900': 'rgba(0, 0, 0, 0.9)',\n '--transparent-white-50': 'rgba(0, 0, 0, 0.05)',\n '--transparent-white-100': 'rgba(0, 0, 0, 0.1)',\n '--transparent-white-200': 'rgba(0, 0, 0, 0.2)',\n '--transparent-white-300': 'rgba(0, 0, 0, 0.3)',\n '--transparent-white-400': 'rgba(0, 0, 0, 0.4)',\n '--transparent-white-500': 'rgba(0, 0, 0, 0.5)',\n '--transparent-white-600': 'rgba(0, 0, 0, 0.6)',\n '--transparent-white-700': 'rgba(0, 0, 0, 0.7)',\n '--transparent-white-800': 'rgba(0, 0, 0, 0.8)',\n '--transparent-white-850': 'rgba(0, 0, 0, 0.85)',\n '--transparent-white-900': 'rgba(0, 0, 0, 0.9)',\n\n '--focus-border': `${focus.focusBorderWidth} solid ${focus.focusColor}`,\n };\n\n const variableString = Object.keys(variables)\n .map((key) => `${key}:${variables[key]};`)\n .join('');\n\n element.innerHTML = `\n :root {\n ${variableString}\n }\n `;\n\n if (!!existing) {\n document.head.replaceChild(element, existing);\n return;\n }\n return document.head.append(element);\n};\n"],"names":["addCssVariables","styleId","existing","element","variables","typography","spacing","shadows","motion","layers","borders","breakpoints","colors","grid","focus","variableString","key"],"mappings":"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"}