@rededor/cura 1.5.0-alpha.2 → 1.5.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.
Files changed (84) hide show
  1. package/dist/cjs/app-globals-57c5b283.js +51 -0
  2. package/dist/cjs/app-globals-57c5b283.js.map +1 -0
  3. package/dist/cjs/cura-accordion_12.cjs.entry.js +1 -1
  4. package/dist/cjs/cura-accordion_12.cjs.entry.js.map +1 -1
  5. package/dist/cjs/cura-button-outline.cjs.entry.js +1 -1
  6. package/dist/cjs/cura-button-outline.cjs.entry.js.map +1 -1
  7. package/dist/cjs/cura-button-transparent.cjs.entry.js +1 -1
  8. package/dist/cjs/cura-button-transparent.cjs.entry.js.map +1 -1
  9. package/dist/cjs/cura-dropdown-search.cjs.entry.js +33 -28
  10. package/dist/cjs/cura-dropdown-search.cjs.entry.js.map +1 -1
  11. package/dist/{esm/app-globals-e54ee4c3.js → cjs/cura-theme-module-14544f5f.js} +25 -54
  12. package/dist/cjs/cura-theme-module-14544f5f.js.map +1 -0
  13. package/dist/cjs/cura.cjs.js +2 -1
  14. package/dist/cjs/cura.cjs.js.map +1 -1
  15. package/dist/cjs/index.cjs.js +7 -0
  16. package/dist/cjs/index.cjs.js.map +1 -1
  17. package/dist/cjs/loader.cjs.js +2 -1
  18. package/dist/cjs/loader.cjs.js.map +1 -1
  19. package/dist/collection/api/modules/cura-theme-module.js +21 -8
  20. package/dist/collection/api/modules/cura-theme-module.js.map +1 -1
  21. package/dist/collection/components/buttons/cura-button/cura-button.js +1 -1
  22. package/dist/collection/components/buttons/cura-button/cura-button.js.map +1 -1
  23. package/dist/collection/components/buttons/cura-button-outline/cura-button-outline.js +1 -1
  24. package/dist/collection/components/buttons/cura-button-outline/cura-button-outline.js.map +1 -1
  25. package/dist/collection/components/buttons/cura-button-transparent/cura-button-transparent.js +1 -1
  26. package/dist/collection/components/buttons/cura-button-transparent/cura-button-transparent.js.map +1 -1
  27. package/dist/collection/components/forms/cura-dropdown-search/cura-dropdown-search.js +33 -28
  28. package/dist/collection/components/forms/cura-dropdown-search/cura-dropdown-search.js.map +1 -1
  29. package/dist/collection/index.js +5 -0
  30. package/dist/collection/index.js.map +1 -1
  31. package/dist/components/cura-button-outline.js +1 -1
  32. package/dist/components/cura-button-outline.js.map +1 -1
  33. package/dist/components/cura-button-transparent2.js +1 -1
  34. package/dist/components/cura-button-transparent2.js.map +1 -1
  35. package/dist/components/cura-button.js +1 -1
  36. package/dist/components/cura-button.js.map +1 -1
  37. package/dist/components/cura-dropdown-search.js +33 -28
  38. package/dist/components/cura-dropdown-search.js.map +1 -1
  39. package/dist/components/index.js +26 -9
  40. package/dist/components/index.js.map +1 -1
  41. package/dist/cura/cura.esm.js +1 -1
  42. package/dist/cura/cura.esm.js.map +1 -1
  43. package/dist/cura/index.esm.js +1 -1
  44. package/dist/cura/index.esm.js.map +1 -1
  45. package/dist/cura/{p-82b99090.js → p-1051a947.js} +2 -2
  46. package/dist/cura/p-1051a947.js.map +1 -0
  47. package/dist/cura/{p-04006a3e.entry.js → p-57ad7c56.entry.js} +2 -2
  48. package/dist/cura/{p-04006a3e.entry.js.map → p-57ad7c56.entry.js.map} +1 -1
  49. package/dist/cura/p-62a3056f.entry.js +2 -0
  50. package/dist/cura/p-62a3056f.entry.js.map +1 -0
  51. package/dist/cura/p-d21364b2.js +2 -0
  52. package/dist/cura/p-d21364b2.js.map +1 -0
  53. package/dist/cura/{p-0a133399.entry.js → p-dbab7864.entry.js} +2 -2
  54. package/dist/cura/{p-0a133399.entry.js.map → p-dbab7864.entry.js.map} +1 -1
  55. package/dist/cura/p-f30270f0.entry.js +2 -0
  56. package/dist/cura/p-f30270f0.entry.js.map +1 -0
  57. package/dist/esm/app-globals-036c3b80.js +49 -0
  58. package/dist/esm/app-globals-036c3b80.js.map +1 -0
  59. package/dist/esm/cura-accordion_12.entry.js +1 -1
  60. package/dist/esm/cura-accordion_12.entry.js.map +1 -1
  61. package/dist/esm/cura-button-outline.entry.js +1 -1
  62. package/dist/esm/cura-button-outline.entry.js.map +1 -1
  63. package/dist/esm/cura-button-transparent.entry.js +1 -1
  64. package/dist/esm/cura-button-transparent.entry.js.map +1 -1
  65. package/dist/esm/cura-dropdown-search.entry.js +33 -28
  66. package/dist/esm/cura-dropdown-search.entry.js.map +1 -1
  67. package/dist/{cjs/app-globals-f33ceef8.js → esm/cura-theme-module-b23f8ac8.js} +23 -56
  68. package/dist/esm/cura-theme-module-b23f8ac8.js.map +1 -0
  69. package/dist/esm/cura.js +2 -1
  70. package/dist/esm/cura.js.map +1 -1
  71. package/dist/esm/index.js +7 -1
  72. package/dist/esm/index.js.map +1 -1
  73. package/dist/esm/loader.js +2 -1
  74. package/dist/esm/loader.js.map +1 -1
  75. package/dist/types/api/modules/cura-theme-module.d.ts +8 -6
  76. package/dist/types/index.d.ts +1 -0
  77. package/package.json +3 -3
  78. package/dist/cjs/app-globals-f33ceef8.js.map +0 -1
  79. package/dist/cura/p-82b99090.js.map +0 -1
  80. package/dist/cura/p-9d7c6e96.entry.js +0 -2
  81. package/dist/cura/p-9d7c6e96.entry.js.map +0 -1
  82. package/dist/cura/p-ced52230.entry.js +0 -2
  83. package/dist/cura/p-ced52230.entry.js.map +0 -1
  84. package/dist/esm/app-globals-e54ee4c3.js.map +0 -1
@@ -1 +1 @@
1
- {"file":"cura.cjs.js","mappings":";;;;;;;AAAA;AACA;AACA;AAKA,IAAI,YAAY,GAAG,MAAM;AAUzB,EAAE,MAAM,UAAU,GAAG,sMAAe,CAAC;AACrC,EAAE,MAAM,IAAI,GAAiE,EAAE,CAAC;AAChF,EAAE,IAAI,UAAU,KAAK,EAAE,EAAE;AACzB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI,CAAC;AACtD,GAAG;AACH,EAAE,OAAOA,oBAAc,CAAC,IAAI,CAAC,CAAC;AAC9B,CAAC;;ACnBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAMC,wBAAa,EAAE,CAAC;AACxB,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC;;;;","names":["promiseResolve","globalScripts","bootstrapLazy"],"sources":["../../node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.22.0 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo(\"Running in development mode.\");\n }\n if (BUILD.cloneNodeFix) {\n patchCloneNodeFix(H.prototype);\n }\n const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n ) : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n if (importMeta !== \"\") {\n opts.resourcesUrl = new URL(\".\", importMeta).href;\n }\n return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function(deep) {\n if (this.nodeName === \"TEMPLATE\") {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport {\n patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n await globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"version":3}
1
+ {"file":"cura.cjs.js","mappings":";;;;;;;;AAAA;AACA;AACA;AAKA,IAAI,YAAY,GAAG,MAAM;AAUzB,EAAE,MAAM,UAAU,GAAG,sMAAe,CAAC;AACrC,EAAE,MAAM,IAAI,GAAiE,EAAE,CAAC;AAChF,EAAE,IAAI,UAAU,KAAK,EAAE,EAAE;AACzB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI,CAAC;AACtD,GAAG;AACH,EAAE,OAAOA,oBAAc,CAAC,IAAI,CAAC,CAAC;AAC9B,CAAC;;ACnBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAMC,wBAAa,EAAE,CAAC;AACxB,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC;;;;","names":["promiseResolve","globalScripts","bootstrapLazy"],"sources":["../../node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.22.0 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo(\"Running in development mode.\");\n }\n if (BUILD.cloneNodeFix) {\n patchCloneNodeFix(H.prototype);\n }\n const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n ) : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n if (importMeta !== \"\") {\n opts.resourcesUrl = new URL(\".\", importMeta).href;\n }\n return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function(deep) {\n if (this.nodeName === \"TEMPLATE\") {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport {\n patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n await globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"version":3}
@@ -2,10 +2,17 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
+ const curaThemeModule = require('./cura-theme-module-14544f5f.js');
6
+
5
7
  function CuraInit(options, w = window) {
6
8
  w.CuraInit = options;
7
9
  }
10
+ function InitVarsTheme(theme) {
11
+ const themeModule = new curaThemeModule.CuraThemeModule();
12
+ return themeModule.loadVarsSSR(theme);
13
+ }
8
14
 
9
15
  exports.CuraInit = CuraInit;
16
+ exports.InitVarsTheme = InitVarsTheme;
10
17
 
11
18
  //# sourceMappingURL=index.cjs.js.map
@@ -1 +1 @@
1
- {"file":"index.cjs.js","mappings":";;;;SAWgB,QAAQ,CAAC,OAAmB,EAAE,CAAC,GAAG,MAAM;IACtD,CAAC,CAAC,QAAQ,GAAG,OAAO,CAAC;AACvB;;;;","names":[],"sources":["src/index.ts"],"sourcesContent":["export { Components, JSX } from './components';\nimport CuraAPI from './api/cura-api';\nimport { CuraConfig } from './api/cura-api.type';\n\ndeclare global {\n export interface Window {\n CuraAPI?: CuraAPI,\n CuraInit?: CuraConfig\n }\n}\n\nexport function CuraInit(options: CuraConfig, w = window) {\n w.CuraInit = options;\n}\n"],"version":3}
1
+ {"file":"index.cjs.js","mappings":";;;;;;SAYgB,QAAQ,CAAC,OAAmB,EAAE,CAAC,GAAG,MAAM;IACtD,CAAC,CAAC,QAAQ,GAAG,OAAO,CAAC;AACvB,CAAC;SAEe,aAAa,CAAC,KAAa;IACzC,MAAM,WAAW,GAAG,IAAIA,+BAAe,EAAE,CAAC;IAC1C,OAAO,WAAW,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AACxC;;;;;","names":["CuraThemeModule"],"sources":["src/index.ts"],"sourcesContent":["export { Components, JSX } from './components';\nimport CuraAPI from './api/cura-api';\nimport { CuraConfig } from './api/cura-api.type';\nimport CuraThemeModule from './api/modules/cura-theme-module';\n\ndeclare global {\n export interface Window {\n CuraAPI?: CuraAPI;\n CuraInit?: CuraConfig;\n }\n}\n\nexport function CuraInit(options: CuraConfig, w = window) {\n w.CuraInit = options;\n}\n\nexport function InitVarsTheme(theme: string) {\n const themeModule = new CuraThemeModule();\n return themeModule.loadVarsSSR(theme);\n}\n"],"version":3}
@@ -3,7 +3,8 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-e6d728ec.js');
6
- const appGlobals = require('./app-globals-f33ceef8.js');
6
+ const appGlobals = require('./app-globals-57c5b283.js');
7
+ require('./cura-theme-module-14544f5f.js');
7
8
 
8
9
  const defineCustomElements = async (win, options) => {
9
10
  if (typeof window === 'undefined') return undefined;
@@ -1 +1 @@
1
- {"file":"loader.cjs.js","mappings":";;;;;;;AAGY,MAAC,oBAAoB,GAAG,OAAO,GAAG,EAAE,OAAO,KAAK;AAC5D,EAAE,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,OAAO,SAAS,CAAC;AACtD,EAAE,MAAMA,wBAAa,EAAE,CAAC;AACxB,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D;;;;;","names":["globalScripts","bootstrapLazy"],"sources":["@lazy-external-entrypoint?app-data=conditional"],"sourcesContent":["export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\nexport const defineCustomElements = async (win, options) => {\n if (typeof window === 'undefined') return undefined;\n await globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n};\n"],"version":3}
1
+ {"file":"loader.cjs.js","mappings":";;;;;;;;AAGY,MAAC,oBAAoB,GAAG,OAAO,GAAG,EAAE,OAAO,KAAK;AAC5D,EAAE,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,OAAO,SAAS,CAAC;AACtD,EAAE,MAAMA,wBAAa,EAAE,CAAC;AACxB,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D;;;;;","names":["globalScripts","bootstrapLazy"],"sources":["@lazy-external-entrypoint?app-data=conditional"],"sourcesContent":["export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\nexport const defineCustomElements = async (win, options) => {\n if (typeof window === 'undefined') return undefined;\n await globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n};\n"],"version":3}
@@ -5,11 +5,13 @@ import CuraThemeFontsModule from "./cura-theme-fonts-module";
5
5
  import CuraThemeBreakpointsModule from "./cura-theme-breakpoints-module";
6
6
  export default class CuraThemeModule {
7
7
  constructor() {
8
+ var _a;
8
9
  this.prefix = '--cura';
9
10
  this.colors = new CuraThemeColorsModule();
10
11
  this.spacing = new CuraThemeSpacingModule();
11
12
  this.fonts = new CuraThemeFontsModule();
12
13
  this.breakpoints = new CuraThemeBreakpointsModule();
14
+ this.groupObject = {};
13
15
  /* Private */
14
16
  /** Set css var based on object structure */
15
17
  this.setCssVar = (prop, path) => {
@@ -17,7 +19,7 @@ export default class CuraThemeModule {
17
19
  this.rootElement.style.setProperty(varName, prop[1]);
18
20
  };
19
21
  this.groupPath = (a, b) => `${a}-${b}`;
20
- this.isObject = (val) => {
22
+ this.isObject = val => {
21
23
  return val && typeof val === 'object' && !Array.isArray(val);
22
24
  };
23
25
  /** Deep merge objects */
@@ -33,18 +35,26 @@ export default class CuraThemeModule {
33
35
  }
34
36
  };
35
37
  /** Set css vars from preset object */
36
- this.buildCssVars = (path, obj) => {
38
+ this.buildCssVars = (path, obj, isGroup = false) => {
37
39
  const entries = Object.entries(obj);
38
40
  for (let e of entries) {
39
41
  if (this.isObject(e[1])) {
40
- this.buildCssVars(this.groupPath(path, e[0]), e[1]);
42
+ this.buildCssVars(this.groupPath(path, e[0]), e[1], isGroup);
41
43
  }
42
44
  else {
43
- this.setCssVar(e, path);
45
+ if (isGroup) {
46
+ const varName = this.groupPath(path, e[0]);
47
+ this.groupObject[varName] = e[1];
48
+ }
49
+ else {
50
+ this.setCssVar(e, path);
51
+ }
44
52
  }
45
53
  }
46
54
  };
47
- this.rootElement = window.document.documentElement;
55
+ if (typeof window === 'undefined')
56
+ return;
57
+ this.rootElement = (_a = window === null || window === void 0 ? void 0 : window.document) === null || _a === void 0 ? void 0 : _a.documentElement;
48
58
  }
49
59
  /**
50
60
  * Load a theme.
@@ -54,6 +64,11 @@ export default class CuraThemeModule {
54
64
  const preset = ThemePresets[theme] ? ThemePresets[theme] : ThemePresets.default;
55
65
  this.buildCssVars(this.prefix, preset);
56
66
  }
67
+ loadVarsSSR(theme = 'default') {
68
+ const preset = ThemePresets[theme] ? ThemePresets[theme] : ThemePresets.default;
69
+ this.buildCssVars(this.prefix, preset, true);
70
+ return this.groupObject;
71
+ }
57
72
  /**
58
73
  * Define a custom theme
59
74
  * @param customTheme Custom theme object definition
@@ -65,9 +80,7 @@ export default class CuraThemeModule {
65
80
  this.load('default');
66
81
  }
67
82
  else {
68
- const preset = customTheme.fromPreset && customTheme.fromPreset in ThemePresets
69
- ? ThemePresets[customTheme.fromPreset]
70
- : ThemePresets.default;
83
+ const preset = customTheme.fromPreset && customTheme.fromPreset in ThemePresets ? ThemePresets[customTheme.fromPreset] : ThemePresets.default;
71
84
  const newTheme = Object.assign({}, JSON.parse(JSON.stringify(preset)));
72
85
  this.mergeObject(customTheme.definitions, newTheme);
73
86
  ThemePresets[customTag] = newTheme;
@@ -1 +1 @@
1
- {"version":3,"file":"cura-theme-module.js","sourceRoot":"","sources":["../../../src/api/modules/cura-theme-module.ts"],"names":[],"mappings":"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","sourcesContent":["import { ThemePresets } from \"../theme-presets/theme-presets\";\nimport { CuraCustomTheme } from \"../cura-api.type\";\nimport CuraThemeColorsModule from \"./cura-theme-colors-module\";\nimport CuraThemeSpacingModule from \"./cura-theme-spacing-module\";\nimport CuraThemeFontsModule from \"./cura-theme-fonts-module\";\nimport CuraThemeBreakpointsModule from \"./cura-theme-breakpoints-module\";\n\nexport default class CuraThemeModule {\n\n rootElement: HTMLElement;\n prefix = '--cura';\n colors = new CuraThemeColorsModule();\n spacing = new CuraThemeSpacingModule();\n fonts = new CuraThemeFontsModule();\n breakpoints = new CuraThemeBreakpointsModule();\n\n constructor() {\n this.rootElement = window.document.documentElement;\n }\n\n /**\n * Load a theme.\n * @param theme Theme tag.\n */\n load(theme = 'default') {\n const preset = ThemePresets[theme] ? ThemePresets[theme] : ThemePresets.default;\n this.buildCssVars(this.prefix, preset);\n }\n\n /**\n * Define a custom theme\n * @param customTheme Custom theme object definition\n */\n setCustom(customTheme: CuraCustomTheme) {\n const customTag = customTheme.name;\n if (customTag in ThemePresets) {\n console.log('Error building custom theme. Theme %s already exists. Loading default theme.', customTag);\n this.load('default');\n } else {\n const preset = customTheme.fromPreset && customTheme.fromPreset in ThemePresets\n ? ThemePresets[customTheme.fromPreset]\n : ThemePresets.default;\n const newTheme = {...JSON.parse(JSON.stringify(preset))};\n this.mergeObject(customTheme.definitions, newTheme);\n ThemePresets[customTag] = newTheme;\n this.load(customTag);\n }\n }\n\n /* Private */\n\n /** Set css var based on object structure */\n setCssVar = (prop, path) => {\n const varName = this.groupPath(path, prop[0]);\n this.rootElement.style.setProperty(varName, prop[1]);\n }\n\n groupPath = (a, b) => `${a}-${b}`;\n\n isObject = (val) => {\n return val && typeof val === 'object' && !Array.isArray(val);\n }\n\n /** Deep merge objects */\n mergeObject = (from, to) => {\n const entries = Object.entries(from);\n for (let e of entries) {\n if (this.isObject(e[1])) {\n this.mergeObject(e[1], to[e[0]]);\n } else {\n to[e[0]] = e[1];\n }\n }\n }\n\n /** Set css vars from preset object */\n buildCssVars = (path, obj) => {\n const entries = Object.entries(obj);\n for (let e of entries) {\n if (this.isObject(e[1])) {\n this.buildCssVars(this.groupPath(path, e[0]), e[1]);\n } else {\n this.setCssVar(e, path);\n }\n }\n }\n}\n"]}
1
+ {"version":3,"file":"cura-theme-module.js","sourceRoot":"","sources":["../../../src/api/modules/cura-theme-module.ts"],"names":[],"mappings":"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","sourcesContent":["import { ThemePresets } from '../theme-presets/theme-presets';\nimport { CuraCustomTheme } from '../cura-api.type';\nimport CuraThemeColorsModule from './cura-theme-colors-module';\nimport CuraThemeSpacingModule from './cura-theme-spacing-module';\nimport CuraThemeFontsModule from './cura-theme-fonts-module';\nimport CuraThemeBreakpointsModule from './cura-theme-breakpoints-module';\n\nexport default class CuraThemeModule {\n rootElement: HTMLElement;\n prefix = '--cura';\n colors = new CuraThemeColorsModule();\n spacing = new CuraThemeSpacingModule();\n fonts = new CuraThemeFontsModule();\n breakpoints = new CuraThemeBreakpointsModule();\n groupObject = {};\n\n constructor() {\n if (typeof window === 'undefined') return;\n\n this.rootElement = window?.document?.documentElement;\n }\n\n /**\n * Load a theme.\n * @param theme Theme tag.\n */\n load(theme = 'default') {\n const preset = ThemePresets[theme] ? ThemePresets[theme] : ThemePresets.default;\n this.buildCssVars(this.prefix, preset);\n }\n\n loadVarsSSR(theme = 'default') {\n const preset = ThemePresets[theme] ? ThemePresets[theme] : ThemePresets.default;\n this.buildCssVars(this.prefix, preset, true);\n\n return this.groupObject;\n }\n\n /**\n * Define a custom theme\n * @param customTheme Custom theme object definition\n */\n setCustom(customTheme: CuraCustomTheme) {\n const customTag = customTheme.name;\n if (customTag in ThemePresets) {\n console.log('Error building custom theme. Theme %s already exists. Loading default theme.', customTag);\n this.load('default');\n } else {\n const preset = customTheme.fromPreset && customTheme.fromPreset in ThemePresets ? ThemePresets[customTheme.fromPreset] : ThemePresets.default;\n const newTheme = { ...JSON.parse(JSON.stringify(preset)) };\n this.mergeObject(customTheme.definitions, newTheme);\n ThemePresets[customTag] = newTheme;\n this.load(customTag);\n }\n }\n\n /* Private */\n\n /** Set css var based on object structure */\n setCssVar = (prop, path) => {\n const varName = this.groupPath(path, prop[0]);\n this.rootElement.style.setProperty(varName, prop[1]);\n };\n\n groupPath = (a, b) => `${a}-${b}`;\n\n isObject = val => {\n return val && typeof val === 'object' && !Array.isArray(val);\n };\n\n /** Deep merge objects */\n mergeObject = (from, to) => {\n const entries = Object.entries(from);\n for (let e of entries) {\n if (this.isObject(e[1])) {\n this.mergeObject(e[1], to[e[0]]);\n } else {\n to[e[0]] = e[1];\n }\n }\n };\n\n /** Set css vars from preset object */\n buildCssVars = (path, obj, isGroup = false) => {\n const entries = Object.entries(obj);\n for (let e of entries) {\n if (this.isObject(e[1])) {\n this.buildCssVars(this.groupPath(path, e[0]), e[1], isGroup);\n } else {\n if (isGroup) {\n const varName = this.groupPath(path, e[0]);\n\n this.groupObject[varName] = e[1];\n } else {\n this.setCssVar(e, path);\n }\n }\n }\n };\n}\n"]}
@@ -88,7 +88,7 @@ export class CuraButton {
88
88
  render() {
89
89
  const symbolColor = this.getSymbolColor();
90
90
  const labelSize = labelSizes[this.size] || labelSizes["default"];
91
- return (h(Host, { key: '07b87d98fb398bc2897e666dc8cd54734f20734d' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
91
+ return (h(Host, { key: '07b87d98fb398bc2897e666dc8cd54734f20734d' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: 'normal', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: 'normal', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
92
92
  }
93
93
  static get is() { return "cura-button"; }
94
94
  static get encapsulation() { return "shadow"; }
@@ -1 +1 @@
1
- {"version":3,"file":"cura-button.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button/cura-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Watch, State, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n tag: 'cura-button',\n styleUrl: 'cura-button.scss',\n shadow: true,\n formAssociated: true\n})\nexport class CuraButton {\n\n @AttachInternals() internals: ElementInternals;\n\n /**\n * Button type: button (default) | submit | reset\n */\n @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n /**\n * Button size: small | medium | large (default)\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n /**\n * Disabled state. Boolean.\n */\n @Prop({ reflect: true }) disabled = false;\n /**\n * Loading state. Boolean.\n */\n @Prop({ reflect: true }) isLoading = false;\n\n /**\n * Name of the icon to be used from iconset.\n */\n @Prop({ reflect: true }) iconName: string;\n /**\n * Custom iconset if needed.\n */\n @Prop({ reflect: true }) iconset = 'default';\n /**\n * Icon position: left (default) | right.\n */\n @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n /**\n * Set button to FAB/icon only.\n */\n @Prop({ reflect: true }) iconOnly = false;\n\n /**\n * Property href switch button to link.\n */\n @Prop({ reflect: true }) href: string;\n /**\n * Set target if link.\n */\n @Prop({ reflect: true }) target = \"_self\";\n\n /**\n * Color base from color scheme. Default: accent.\n */\n @Prop() color = 'accent';\n\n /**\n * Set the background color to dark or light.\n */\n @Prop({ reflect: true }) background: 'dark' | 'light' = 'light';\n\n /**\n * Set the font color to dark or light.\n */\n @Prop({ reflect: true }) fontColor: 'dark' | 'light' = 'dark';\n\n /**\n * Set text aligment for the button label.\n * Vales: left (default) | center | right.\n */\n @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n /**\n * Justify icons and label inside the button.\n * Vales: false (default) | true.\n */\n @Prop({ reflect: true }) justify = false;\n\n @State() styles = {};\n\n @State() hovered = false\n\n weights;\n\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n this.styles['--font-weight-medium'] = this.weights.medium;\n this.styles['--text-align'] = this.textAlign;\n this.setColors();\n }\n\n @Watch('background')\n @Watch('color')\n setColors() {\n const colors = [\n { name: '--color-base-neutral-purewhite', theme: `${this.background === 'light' ? `${this.color}-base` : 'neutral-pale'}` },\n { name: '--color-base-color-light', theme: `${this.background === 'light' ? `${this.color}-base` : `${this.color}-lighter`}` },\n { name: '--color-dark-color-light', theme: `${this.background === 'light' ? `${this.color}-dark` : `${this.color}-light`}` },\n { name: '--color-dark-color-base', theme: `${this.background === 'light' ? `${this.color}-dark` : `${this.color}-base`}` },\n { name: '--neutral-pale-neutral-black', theme: `${this.background === 'light' ? 'neutral-pale' : 'neutral-black'}` },\n ]\n\n colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.theme));\n this.styles = { ...this.styles };\n }\n\n handleMouseEnter() {\n if (this.disabled) return;\n this.hovered = true;\n }\n\n handleMouseLeave() {\n this.hovered = false;\n }\n\n getClasses() {\n const classes = {};\n classes[`${this.size?.toLowerCase()}`] = true;\n classes[`icon-${this.iconPosition?.toLowerCase()}`] = true;\n classes[`icon-only`] = this.iconOnly;\n classes['disabled'] = this.disabled;\n classes['isLoading'] = this.isLoading;\n classes['justify'] = this.justify;\n\n return classes;\n }\n\n getIcon() {\n if (!this.iconName) return '';\n const iconSize = this.size === 'large' ? 20 : 16;\n return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n }\n\n getSymbolColor() {\n if (this.isLoading && this.fontColor === 'light' ? 'neutral-white' : 'neutral-black')\n return this.disabled\n ? 'neutral-dark'\n : this.fontColor === 'light'\n ? 'neutral-white'\n : 'neutral-black';\n }\n\n handleClick(e: Event) {\n if (this.disabled || this.isLoading) {\n e.preventDefault();\n return;\n }\n if (!this.href) {\n if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n }\n }\n\n render() {\n const symbolColor = this.getSymbolColor();\n const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n return (\n <Host>\n {this.href ? (\n <a href={this.disabled ? '' : this.href}\n target={this.target}\n class={this.getClasses()}\n style={this.styles}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label class=\"label\" size={labelSize} lineHeight='105%' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </a>\n ) : (\n <button class={this.getClasses()}\n style={this.styles}\n disabled={this.disabled || null}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}\n type={this.type}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label class=\"label\" size={labelSize} lineHeight='105%' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </button>\n )}\n </Host>\n );\n }\n\n}\n"]}
1
+ {"version":3,"file":"cura-button.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button/cura-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACxF,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAQxD,MAAM,OAAO,UAAU;;oBAO0C,QAAQ;oBAKT,OAAO;wBAKjC,KAAK;yBAIJ,KAAK;;uBASP,SAAS;4BAIc,MAAM;wBAI5B,KAAK;;sBASP,OAAO;qBAKzB,QAAQ;0BAKgC,OAAO;yBAKR,MAAM;yBAMK,MAAM;uBAMrC,KAAK;sBAEtB,EAAE;uBAED,KAAK;;IAKxB,iBAAiB;QACf,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;QACvD,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAC1E,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;QAClE,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC;QACtE,IAAI,CAAC,MAAM,CAAC,sBAAsB,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;QAC1D,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC;QAC7C,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAID,SAAS;QACP,MAAM,MAAM,GAAG;YACb,EAAE,IAAI,EAAE,gCAAgC,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,cAAc,EAAE,EAAE;YAC3H,EAAE,IAAI,EAAE,0BAA0B,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,UAAU,EAAE,EAAE;YAC9H,EAAE,IAAI,EAAE,0BAA0B,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,QAAQ,EAAE,EAAE;YAC5H,EAAE,IAAI,EAAE,yBAAyB,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,EAAE,EAAE;YAC1H,EAAE,IAAI,EAAE,8BAA8B,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,eAAe,EAAE,EAAE;SACrH,CAAA;QAED,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;QACrG,IAAI,CAAC,MAAM,qBAAQ,IAAI,CAAC,MAAM,CAAE,CAAC;IACnC,CAAC;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IACtB,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;IACvB,CAAC;IAED,UAAU;;QACR,MAAM,OAAO,GAAG,EAAE,CAAC;QACnB,OAAO,CAAC,GAAG,MAAA,IAAI,CAAC,IAAI,0CAAE,WAAW,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC;QAC9C,OAAO,CAAC,QAAQ,MAAA,IAAI,CAAC,YAAY,0CAAE,WAAW,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC;QAC3D,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;QACrC,OAAO,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;QACpC,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC;QACtC,OAAO,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;QAElC,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,OAAO;QACL,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO,EAAE,CAAC;QAC9B,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACjD,OAAO,iBAAW,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,GAAc,CAAC;IAC3H,CAAC;IAED,cAAc;QACZ,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe;YACpF,OAAO,IAAI,CAAC,QAAQ;gBAClB,CAAC,CAAC,cAAc;gBAChB,CAAC,CAAC,IAAI,CAAC,SAAS,KAAK,OAAO;oBAC1B,CAAC,CAAC,eAAe;oBACjB,CAAC,CAAC,eAAe,CAAC;IACxB,CAAC;IAED,WAAW,CAAC,CAAQ;QAClB,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACpC,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI;gBAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;YAChF,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI;gBAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;QAChF,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QAC1C,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,UAAU,CAAC,SAAS,CAAC,CAAC;QACjE,OAAO,CACL,EAAC,IAAI,uDACF,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACX,SAAG,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,EACrC,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EACxB,KAAK,EAAE,IAAI,CAAC,MAAM,EAClB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EACnC,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,EAC3C,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE;YAC3C,YAAM,KAAK,EAAC,kBAAkB;gBAC3B,IAAI,CAAC,OAAO,EAAE;gBACf,kBAAY,KAAK,EAAC,OAAO,EAAC,IAAI,EAAE,SAAS,EAAE,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAE,WAAW;oBAAE,eAAa,CAAa,CACxG;YACP,0BAAoB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,WAAW,GAAuB,CAC5E,CACL,CAAC,CAAC,CAAC,CACF,cAAQ,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAC9B,KAAK,EAAE,IAAI,CAAC,MAAM,EAClB,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,EAC/B,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EACnC,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,EAC3C,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,EAC3C,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,YAAM,KAAK,EAAC,kBAAkB;gBAC3B,IAAI,CAAC,OAAO,EAAE;gBACf,kBAAY,KAAK,EAAC,OAAO,EAAC,IAAI,EAAE,SAAS,EAAE,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAE,WAAW;oBAAE,eAAa,CAAa,CACxG;YACP,0BAAoB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,WAAW,GAAuB,CACvE,CACV,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, h, Prop, Watch, State, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n tag: 'cura-button',\n styleUrl: 'cura-button.scss',\n shadow: true,\n formAssociated: true\n})\nexport class CuraButton {\n\n @AttachInternals() internals: ElementInternals;\n\n /**\n * Button type: button (default) | submit | reset\n */\n @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n /**\n * Button size: small | medium | large (default)\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n /**\n * Disabled state. Boolean.\n */\n @Prop({ reflect: true }) disabled = false;\n /**\n * Loading state. Boolean.\n */\n @Prop({ reflect: true }) isLoading = false;\n\n /**\n * Name of the icon to be used from iconset.\n */\n @Prop({ reflect: true }) iconName: string;\n /**\n * Custom iconset if needed.\n */\n @Prop({ reflect: true }) iconset = 'default';\n /**\n * Icon position: left (default) | right.\n */\n @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n /**\n * Set button to FAB/icon only.\n */\n @Prop({ reflect: true }) iconOnly = false;\n\n /**\n * Property href switch button to link.\n */\n @Prop({ reflect: true }) href: string;\n /**\n * Set target if link.\n */\n @Prop({ reflect: true }) target = \"_self\";\n\n /**\n * Color base from color scheme. Default: accent.\n */\n @Prop() color = 'accent';\n\n /**\n * Set the background color to dark or light.\n */\n @Prop({ reflect: true }) background: 'dark' | 'light' = 'light';\n\n /**\n * Set the font color to dark or light.\n */\n @Prop({ reflect: true }) fontColor: 'dark' | 'light' = 'dark';\n\n /**\n * Set text aligment for the button label.\n * Vales: left (default) | center | right.\n */\n @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n /**\n * Justify icons and label inside the button.\n * Vales: false (default) | true.\n */\n @Prop({ reflect: true }) justify = false;\n\n @State() styles = {};\n\n @State() hovered = false\n\n weights;\n\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n this.styles['--font-weight-medium'] = this.weights.medium;\n this.styles['--text-align'] = this.textAlign;\n this.setColors();\n }\n\n @Watch('background')\n @Watch('color')\n setColors() {\n const colors = [\n { name: '--color-base-neutral-purewhite', theme: `${this.background === 'light' ? `${this.color}-base` : 'neutral-pale'}` },\n { name: '--color-base-color-light', theme: `${this.background === 'light' ? `${this.color}-base` : `${this.color}-lighter`}` },\n { name: '--color-dark-color-light', theme: `${this.background === 'light' ? `${this.color}-dark` : `${this.color}-light`}` },\n { name: '--color-dark-color-base', theme: `${this.background === 'light' ? `${this.color}-dark` : `${this.color}-base`}` },\n { name: '--neutral-pale-neutral-black', theme: `${this.background === 'light' ? 'neutral-pale' : 'neutral-black'}` },\n ]\n\n colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.theme));\n this.styles = { ...this.styles };\n }\n\n handleMouseEnter() {\n if (this.disabled) return;\n this.hovered = true;\n }\n\n handleMouseLeave() {\n this.hovered = false;\n }\n\n getClasses() {\n const classes = {};\n classes[`${this.size?.toLowerCase()}`] = true;\n classes[`icon-${this.iconPosition?.toLowerCase()}`] = true;\n classes[`icon-only`] = this.iconOnly;\n classes['disabled'] = this.disabled;\n classes['isLoading'] = this.isLoading;\n classes['justify'] = this.justify;\n\n return classes;\n }\n\n getIcon() {\n if (!this.iconName) return '';\n const iconSize = this.size === 'large' ? 20 : 16;\n return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n }\n\n getSymbolColor() {\n if (this.isLoading && this.fontColor === 'light' ? 'neutral-white' : 'neutral-black')\n return this.disabled\n ? 'neutral-dark'\n : this.fontColor === 'light'\n ? 'neutral-white'\n : 'neutral-black';\n }\n\n handleClick(e: Event) {\n if (this.disabled || this.isLoading) {\n e.preventDefault();\n return;\n }\n if (!this.href) {\n if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n }\n }\n\n render() {\n const symbolColor = this.getSymbolColor();\n const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n return (\n <Host>\n {this.href ? (\n <a href={this.disabled ? '' : this.href}\n target={this.target}\n class={this.getClasses()}\n style={this.styles}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label class=\"label\" size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </a>\n ) : (\n <button class={this.getClasses()}\n style={this.styles}\n disabled={this.disabled || null}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}\n type={this.type}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label class=\"label\" size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </button>\n )}\n </Host>\n );\n }\n\n}\n"]}
@@ -87,7 +87,7 @@ export class CuraButtonOutline {
87
87
  render() {
88
88
  const symbolColor = this.getSymbolColor();
89
89
  const labelSize = labelSizes[this.size] || labelSizes["default"];
90
- return (h(Host, { key: '0a0c25f94d0c18dbb90e4836ca3e7bcbbe10d032' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
90
+ return (h(Host, { key: '0a0c25f94d0c18dbb90e4836ca3e7bcbbe10d032' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: 'normal', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: 'normal', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
91
91
  }
92
92
  static get is() { return "cura-button-outline"; }
93
93
  static get encapsulation() { return "shadow"; }
@@ -1 +1 @@
1
- {"version":3,"file":"cura-button-outline.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-outline/cura-button-outline.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Watch, State, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n tag: 'cura-button-outline',\n styleUrl: 'cura-button-outline.scss',\n shadow: true,\n formAssociated: true\n})\nexport class CuraButtonOutline {\n\n @AttachInternals() internals: ElementInternals;\n\n /**\n * Button type: button (default) | submit | reset\n */\n @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n /**\n * Button size: small | medium | large (default)\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n /**\n * Disabled state. Boolean.\n */\n @Prop({ reflect: true }) disabled = false;\n /**\n * Loading state. Boolean.\n */\n @Prop({ reflect: true }) isLoading = false;\n\n /**\n * Name of the icon to be used from iconset.\n */\n @Prop({ reflect: true }) iconName: string;\n /**\n * Custom iconset if needed.\n */\n @Prop({ reflect: true }) iconset = 'default';\n /**\n * Icon position: left (default) | right.\n */\n @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n /**\n * Set button to FAB/icon only.\n */\n @Prop({ reflect: true }) iconOnly = false;\n\n /**\n * Property href switch button to link.\n */\n @Prop({ reflect: true }) href: string;\n /**\n * Set target if link.\n */\n @Prop({ reflect: true }) target = \"_self\";\n /**\n * Color base from color scheme. Default: primary.\n */\n @Prop() color = 'primary';\n /**\n * Set the font background to dark or light.\n */\n @Prop() background: 'dark' | 'light' = 'light';\n\n /**\n * Set the font color to dark or light.\n */\n @Prop() fontColor: 'dark' | 'light' = 'dark';\n /**\n * Set text aligment for the button label.\n * Vales: left (default) | center | right.\n */\n @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n /**\n * Justify icons and label inside the button.\n * Vales: false (default) | true.\n */\n @Prop({ reflect: true }) justify = false;\n\n @State() styles = {};\n\n @State() hovered = false;\n\n weights;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n this.styles['--font-weight-medium'] = this.weights.medium;\n this.styles['--text-align'] = this.textAlign;\n this.setColors();\n }\n\n\n getClasses() {\n const classes = {};\n classes[`${this.size?.toLowerCase()}`] = true;\n classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n classes[`icon-only`] = this.iconOnly;\n classes['disabled'] = this.disabled;\n classes['isLoading'] = this.isLoading;\n classes['justify'] = this.justify;\n return classes;\n }\n\n @Watch('background')\n @Watch('color')\n setColors() {\n const colors = [\n { name: '--color-dark-neutral-purewhite', thema: `${this.background === 'light' ? `${this.color}-dark` : 'neutral-purewhite'}` },\n { name: '--color-lighter-color-darker', thema: `${this.background === 'light' ? `${this.color}-lighter` : `${this.color}-darker`}` },\n { name: '--color-light-color-darker', thema: `${this.background === 'light' ? `${this.color}-light` : `${this.color}-lighter`}` },\n { name: '--neutral-dark', thema: 'neutral-dark' },\n ]\n\n colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.thema));\n this.styles = { ...this.styles };\n }\n\n getIcon() {\n if (!this.iconName) return '';\n const iconSize = this.size === 'large' ? 20 : 16;\n\n return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n }\n\n\n handleMouseEnter() {\n if (this.disabled) return;\n this.hovered = true;\n }\n\n handleMouseLeave() {\n this.hovered = false;\n }\n\n @Watch('fontColor')\n @Watch('color')\n getSymbolColor() {\n if (this.disabled) return 'neutral-dark';\n return this.fontColor === 'light' ? 'neutral-purewhite' : `${this.color}-darker`;\n }\n\n handleClick(e: Event) {\n if (this.disabled || this.isLoading) {\n e.preventDefault();\n return;\n }\n if (!this.href) {\n if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n }\n }\n\n render() {\n const symbolColor = this.getSymbolColor();\n const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n return (\n <Host>\n {this.href ? (\n <a href={this.disabled ? '' : this.href}\n target={this.target}\n class={this.getClasses()}\n style={this.styles}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label size={labelSize} lineHeight='105%' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </a>\n ) : (\n <button class={this.getClasses()}\n style={this.styles}\n disabled={this.disabled || null}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}\n type={this.type}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label size={labelSize} lineHeight='105%' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </button>\n )}\n </Host>\n );\n }\n\n}\n"]}
1
+ {"version":3,"file":"cura-button-outline.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-outline/cura-button-outline.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Watch, State, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n tag: 'cura-button-outline',\n styleUrl: 'cura-button-outline.scss',\n shadow: true,\n formAssociated: true\n})\nexport class CuraButtonOutline {\n\n @AttachInternals() internals: ElementInternals;\n\n /**\n * Button type: button (default) | submit | reset\n */\n @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n /**\n * Button size: small | medium | large (default)\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n /**\n * Disabled state. Boolean.\n */\n @Prop({ reflect: true }) disabled = false;\n /**\n * Loading state. Boolean.\n */\n @Prop({ reflect: true }) isLoading = false;\n\n /**\n * Name of the icon to be used from iconset.\n */\n @Prop({ reflect: true }) iconName: string;\n /**\n * Custom iconset if needed.\n */\n @Prop({ reflect: true }) iconset = 'default';\n /**\n * Icon position: left (default) | right.\n */\n @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n /**\n * Set button to FAB/icon only.\n */\n @Prop({ reflect: true }) iconOnly = false;\n\n /**\n * Property href switch button to link.\n */\n @Prop({ reflect: true }) href: string;\n /**\n * Set target if link.\n */\n @Prop({ reflect: true }) target = \"_self\";\n /**\n * Color base from color scheme. Default: primary.\n */\n @Prop() color = 'primary';\n /**\n * Set the font background to dark or light.\n */\n @Prop() background: 'dark' | 'light' = 'light';\n\n /**\n * Set the font color to dark or light.\n */\n @Prop() fontColor: 'dark' | 'light' = 'dark';\n /**\n * Set text aligment for the button label.\n * Vales: left (default) | center | right.\n */\n @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n /**\n * Justify icons and label inside the button.\n * Vales: false (default) | true.\n */\n @Prop({ reflect: true }) justify = false;\n\n @State() styles = {};\n\n @State() hovered = false;\n\n weights;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n this.styles['--font-weight-medium'] = this.weights.medium;\n this.styles['--text-align'] = this.textAlign;\n this.setColors();\n }\n\n\n getClasses() {\n const classes = {};\n classes[`${this.size?.toLowerCase()}`] = true;\n classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n classes[`icon-only`] = this.iconOnly;\n classes['disabled'] = this.disabled;\n classes['isLoading'] = this.isLoading;\n classes['justify'] = this.justify;\n return classes;\n }\n\n @Watch('background')\n @Watch('color')\n setColors() {\n const colors = [\n { name: '--color-dark-neutral-purewhite', thema: `${this.background === 'light' ? `${this.color}-dark` : 'neutral-purewhite'}` },\n { name: '--color-lighter-color-darker', thema: `${this.background === 'light' ? `${this.color}-lighter` : `${this.color}-darker`}` },\n { name: '--color-light-color-darker', thema: `${this.background === 'light' ? `${this.color}-light` : `${this.color}-lighter`}` },\n { name: '--neutral-dark', thema: 'neutral-dark' },\n ]\n\n colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.thema));\n this.styles = { ...this.styles };\n }\n\n getIcon() {\n if (!this.iconName) return '';\n const iconSize = this.size === 'large' ? 20 : 16;\n\n return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n }\n\n\n handleMouseEnter() {\n if (this.disabled) return;\n this.hovered = true;\n }\n\n handleMouseLeave() {\n this.hovered = false;\n }\n\n @Watch('fontColor')\n @Watch('color')\n getSymbolColor() {\n if (this.disabled) return 'neutral-dark';\n return this.fontColor === 'light' ? 'neutral-purewhite' : `${this.color}-darker`;\n }\n\n handleClick(e: Event) {\n if (this.disabled || this.isLoading) {\n e.preventDefault();\n return;\n }\n if (!this.href) {\n if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n }\n }\n\n render() {\n const symbolColor = this.getSymbolColor();\n const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n return (\n <Host>\n {this.href ? (\n <a href={this.disabled ? '' : this.href}\n target={this.target}\n class={this.getClasses()}\n style={this.styles}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </a>\n ) : (\n <button class={this.getClasses()}\n style={this.styles}\n disabled={this.disabled || null}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}\n type={this.type}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </button>\n )}\n </Host>\n );\n }\n\n}\n"]}
@@ -76,7 +76,7 @@ export class CuraButtonTransparent {
76
76
  render() {
77
77
  const symbolColor = this.getSymbolColor();
78
78
  const labelSize = labelSizes[this.size] || labelSizes["default"];
79
- return (h(Host, { key: 'f93f2f1b495403127238468c57edfcb5e9f69d43' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
79
+ return (h(Host, { key: 'f93f2f1b495403127238468c57edfcb5e9f69d43' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: 'normal', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: 'normal', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
80
80
  }
81
81
  static get is() { return "cura-button-transparent"; }
82
82
  static get encapsulation() { return "shadow"; }
@@ -1 +1 @@
1
- {"version":3,"file":"cura-button-transparent.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-transparent/cura-button-transparent.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Watch, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n tag: 'cura-button-transparent',\n styleUrl: 'cura-button-transparent.scss',\n shadow: true,\n formAssociated: true\n})\nexport class CuraButtonTransparent {\n\n @AttachInternals() internals: ElementInternals;\n\n /**\n * Button type: button (default) | submit | reset\n */\n @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n /**\n * Button size: small | medium | large (default)\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n /**\n * Disabled state. Boolean.\n */\n @Prop({ reflect: true }) disabled = false;\n /**\n * Loading state. Boolean.\n */\n @Prop({ reflect: true }) isLoading = false;\n\n /**\n * Name of the icon to be used from iconset.\n */\n @Prop({ reflect: true }) iconName: string;\n /**\n * Custom iconset if needed.\n */\n @Prop({ reflect: true }) iconset = 'default';\n /**\n * Icon position: left (default) | right.\n */\n @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n /**\n * Set button to FAB/icon only.\n */\n @Prop({ reflect: true }) iconOnly = false;\n\n /**\n * Property href switch button to link.\n */\n @Prop({ reflect: true }) href: string;\n /**\n * Set target if link.\n */\n @Prop({ reflect: true }) target = \"_self\";\n\n /**\n * Color base from color scheme. Default: accent.\n */\n @Prop({ reflect: true }) color = 'primary';\n\n /**\n * Set the font color to dark or light.\n * Default: dark.\n */\n @Prop({ reflect: true }) fontColor: 'dark' | 'light' = 'dark';\n /**\n * Set text aligment for the button label.\n * Vales: left (default) | center | right.\n */\n @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n /**\n * Justify icons and label inside the button.\n * Vales: false (default) | true.\n */\n @Prop({ reflect: true }) justify = false;\n\n @State() hovered = false;\n\n @State() styles = {};\n\n weights;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n this.styles['--font-weight-medium'] = this.weights.medium;\n this.styles['--text-align'] = this.textAlign;\n }\n\n getClasses() {\n const classes = {};\n classes[`${this.size.toLowerCase()}`] = true;\n classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n classes[`icon-only`] = this.iconOnly;\n classes['disabled'] = this.disabled;\n classes['isLoading'] = this.isLoading;\n classes['justify'] = this.justify;\n return classes;\n }\n\n\n getIcon() {\n if (!this.iconName) return null;\n const iconSize = this.size === 'large' ? 20 : 16;\n return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n }\n\n handleMouseEnter() {\n if (this.disabled) return;\n this.hovered = true;\n }\n\n handleMouseLeave() {\n this.hovered = false;\n }\n\n @Watch('fontColor')\n @Watch('color')\n getSymbolColor() {\n if (this.disabled) return 'neutral-dark';\n if (this.hovered && !this.isLoading) return this.fontColor === 'light' ? `${this.color}-light` : `${this.color}-darker`;\n return this.fontColor === 'light' ? 'neutral-white' : `${this.color}-dark`;\n }\n\n handleClick(e: Event) {\n if (this.disabled || this.isLoading) {\n e.preventDefault();\n return;\n }\n if (!this.href) {\n if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n }\n }\n\n render() {\n const symbolColor = this.getSymbolColor();\n const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n return (\n <Host>\n {this.href ? (\n <a href={this.disabled ? '' : this.href}\n target={this.target}\n class={this.getClasses()}\n style={this.styles}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label size={labelSize} lineHeight='105%' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </a>\n ) : (\n <button class={this.getClasses()}\n style={this.styles}\n disabled={this.disabled || null}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}\n type={this.type}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label size={labelSize} lineHeight='105%' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </button>\n )}\n </Host>\n );\n }\n\n}\n"]}
1
+ {"version":3,"file":"cura-button-transparent.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-transparent/cura-button-transparent.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Watch, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n tag: 'cura-button-transparent',\n styleUrl: 'cura-button-transparent.scss',\n shadow: true,\n formAssociated: true\n})\nexport class CuraButtonTransparent {\n\n @AttachInternals() internals: ElementInternals;\n\n /**\n * Button type: button (default) | submit | reset\n */\n @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n /**\n * Button size: small | medium | large (default)\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n /**\n * Disabled state. Boolean.\n */\n @Prop({ reflect: true }) disabled = false;\n /**\n * Loading state. Boolean.\n */\n @Prop({ reflect: true }) isLoading = false;\n\n /**\n * Name of the icon to be used from iconset.\n */\n @Prop({ reflect: true }) iconName: string;\n /**\n * Custom iconset if needed.\n */\n @Prop({ reflect: true }) iconset = 'default';\n /**\n * Icon position: left (default) | right.\n */\n @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n /**\n * Set button to FAB/icon only.\n */\n @Prop({ reflect: true }) iconOnly = false;\n\n /**\n * Property href switch button to link.\n */\n @Prop({ reflect: true }) href: string;\n /**\n * Set target if link.\n */\n @Prop({ reflect: true }) target = \"_self\";\n\n /**\n * Color base from color scheme. Default: accent.\n */\n @Prop({ reflect: true }) color = 'primary';\n\n /**\n * Set the font color to dark or light.\n * Default: dark.\n */\n @Prop({ reflect: true }) fontColor: 'dark' | 'light' = 'dark';\n /**\n * Set text aligment for the button label.\n * Vales: left (default) | center | right.\n */\n @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n /**\n * Justify icons and label inside the button.\n * Vales: false (default) | true.\n */\n @Prop({ reflect: true }) justify = false;\n\n @State() hovered = false;\n\n @State() styles = {};\n\n weights;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n this.styles['--font-weight-medium'] = this.weights.medium;\n this.styles['--text-align'] = this.textAlign;\n }\n\n getClasses() {\n const classes = {};\n classes[`${this.size.toLowerCase()}`] = true;\n classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n classes[`icon-only`] = this.iconOnly;\n classes['disabled'] = this.disabled;\n classes['isLoading'] = this.isLoading;\n classes['justify'] = this.justify;\n return classes;\n }\n\n\n getIcon() {\n if (!this.iconName) return null;\n const iconSize = this.size === 'large' ? 20 : 16;\n return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n }\n\n handleMouseEnter() {\n if (this.disabled) return;\n this.hovered = true;\n }\n\n handleMouseLeave() {\n this.hovered = false;\n }\n\n @Watch('fontColor')\n @Watch('color')\n getSymbolColor() {\n if (this.disabled) return 'neutral-dark';\n if (this.hovered && !this.isLoading) return this.fontColor === 'light' ? `${this.color}-light` : `${this.color}-darker`;\n return this.fontColor === 'light' ? 'neutral-white' : `${this.color}-dark`;\n }\n\n handleClick(e: Event) {\n if (this.disabled || this.isLoading) {\n e.preventDefault();\n return;\n }\n if (!this.href) {\n if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n }\n }\n\n render() {\n const symbolColor = this.getSymbolColor();\n const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n return (\n <Host>\n {this.href ? (\n <a href={this.disabled ? '' : this.href}\n target={this.target}\n class={this.getClasses()}\n style={this.styles}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </a>\n ) : (\n <button class={this.getClasses()}\n style={this.styles}\n disabled={this.disabled || null}\n onClick={(e) => this.handleClick(e)}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}\n type={this.type}>\n <span class=\"button-container\">\n {this.getIcon()}\n <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n </span>\n <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n </button>\n )}\n </Host>\n );\n }\n\n}\n"]}
@@ -2,16 +2,17 @@ import { Host, h } from "@stencil/core";
2
2
  export class CuraDropdownSearch {
3
3
  constructor() {
4
4
  this.overlayElement = null;
5
- this.adjustInputPosition = async () => {
6
- var _a, _b;
7
- // const tick = await Promise.resolve().then();
8
- const isKeyboardOpen = (window === null || window === void 0 ? void 0 : window.innerHeight) < this.screenDefaultHeight;
9
- const dropdown = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-mobile');
10
- if (dropdown) {
11
- // dropdown.style.position = isKeyboardOpen ? 'absolute' : 'fixed';
12
- dropdown.style.bottom = isKeyboardOpen ? `${((_b = window === null || window === void 0 ? void 0 : window.screen) === null || _b === void 0 ? void 0 : _b.height) - (window === null || window === void 0 ? void 0 : window.innerHeight)}px` : '0';
13
- window.scroll({ top: 0, left: 0, behavior: 'smooth' });
14
- }
5
+ this.adjustInputPosition = () => {
6
+ setTimeout(() => {
7
+ var _a, _b;
8
+ const isKeyboardOpen = (window === null || window === void 0 ? void 0 : window.innerHeight) < this.screenDefaultHeight;
9
+ const dropdown = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-mobile');
10
+ if (dropdown) {
11
+ dropdown.style.position = isKeyboardOpen ? 'absolute' : 'fixed';
12
+ dropdown.style.bottom = isKeyboardOpen ? `${((_b = window === null || window === void 0 ? void 0 : window.screen) === null || _b === void 0 ? void 0 : _b.height) - (window === null || window === void 0 ? void 0 : window.innerHeight)}px` : '0';
13
+ window.scroll({ top: 0, left: 0 });
14
+ }
15
+ }, 300);
15
16
  };
16
17
  this.handleSlotChange = () => {
17
18
  this.options = Array.from(this.host.querySelectorAll('cura-dropdown-search-option'));
@@ -22,7 +23,6 @@ export class CuraDropdownSearch {
22
23
  const input = event.target;
23
24
  this.value = input.value;
24
25
  this.onValueChange(this.value);
25
- // this.valueChanged.emit(this.value);
26
26
  };
27
27
  this.handleKeyDown = (event) => {
28
28
  if (event.key === 'ArrowDown') {
@@ -95,6 +95,7 @@ export class CuraDropdownSearch {
95
95
  this.styles['--font-weight-medium'] = this.weights.medium;
96
96
  }
97
97
  onValueChange(newValue) {
98
+ this.value = newValue;
98
99
  this.updateSelectedOption(newValue);
99
100
  this.valueChanged.emit(newValue);
100
101
  }
@@ -158,16 +159,18 @@ export class CuraDropdownSearch {
158
159
  this.adjustInputPosition();
159
160
  }
160
161
  onSelectedOption(index) {
161
- const selectedOption = this.options[index];
162
- if (selectedOption.selectable) {
163
- const selectedValue = selectedOption.getAttribute('value') || selectedOption.textContent;
164
- this.value = selectedValue || '';
165
- this.updateSelectedOption(this.value);
166
- this.isDropdownOpen = false;
167
- this.isOnBlurInput = true;
168
- this.resetDropdownStyles();
169
- this.removeOverlay();
170
- }
162
+ setTimeout(() => {
163
+ const selectedOption = this.options[index];
164
+ if (selectedOption.selectable) {
165
+ const selectedValue = selectedOption.getAttribute('value') || selectedOption.textContent;
166
+ this.value = selectedValue || '';
167
+ this.updateSelectedOption(this.value);
168
+ this.isDropdownOpen = false;
169
+ this.isOnBlurInput = true;
170
+ this.resetDropdownStyles();
171
+ this.removeOverlay();
172
+ }
173
+ }, 200);
171
174
  }
172
175
  moveHighlight(direction) {
173
176
  const visibleOptions = this.options;
@@ -233,11 +236,13 @@ export class CuraDropdownSearch {
233
236
  this.isDropdownOpen = true;
234
237
  }
235
238
  getDropdownSearchListHeight() {
236
- var _a;
237
- const dropdownInputSearchElement = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-input-search');
238
- if (dropdownInputSearchElement) {
239
- this.host.style.setProperty('--dynamic-input-search-height', `${dropdownInputSearchElement.offsetHeight}px`);
240
- }
239
+ setTimeout(() => {
240
+ var _a;
241
+ const dropdownInputSearchElement = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-input-search');
242
+ if (dropdownInputSearchElement) {
243
+ this.host.style.setProperty('--dynamic-input-search-height', `${dropdownInputSearchElement.offsetHeight}px`);
244
+ }
245
+ }, 310);
241
246
  }
242
247
  handleGoBack() {
243
248
  this.resetDropdownStyles();
@@ -253,9 +258,9 @@ export class CuraDropdownSearch {
253
258
  }
254
259
  render() {
255
260
  const isMobileDropdown = this.isMobile && this.isDropdownOpen;
256
- return (h(Host, { key: '85b79d1f41c8f03ed8aa8f915743c6a35d529b20', style: this.hostCSSProperties(), class: "dropdown-overlay" }, h("div", { key: 'c5255bc1445309a8da2e28e76d31c151170fb1bf', class: `dropdown ${isMobileDropdown ? 'dropdown-mobile' : ''}`, style: this.styles }, h("div", { key: 'a0e9db281870954a6f3155cd482c741e3d44db24', class: this.getClasses() }, this.isMobile && this.isDropdownOpen && (h("cura-button-transparent", { key: '67e58b57752cbe8a8fbbaee555e9c905c710782c', fontColor: "dark", onClick: () => this.handleGoBack(), iconName: "arrowLeft", size: "medium", iconOnly: true, color: "primary" })), h("cura-input-text", { key: '87edd1a5b058a9c7ae966999269f1546d7132a53', disabled: this.disabled, label: this.label, part: "cura-input-field", mode: isMobileDropdown ? 'transparent' : 'default', required: this.required, hideErrorIcon: this.status === 'error', iconName: this.iconName || 'search', value: this.value, status: this.status, onValueChange: e => this.onValueChange(e.target.value), onInput: e => this.handleInputChange(e), onFocus: () => this.handleOnFocus(), onClick: () => (window.innerWidth < 768 ? (this.isMobile = true) : null), onBlur: () => {
261
+ return (h(Host, { key: '29caf35386c324e85a5b68caa280193e8f1a3aae', style: this.hostCSSProperties(), class: "dropdown-overlay" }, h("div", { key: '879dc628c89920323a97f5b29aeadf6e774615ef', class: `dropdown ${isMobileDropdown ? 'dropdown-mobile' : ''}`, style: this.styles }, h("div", { key: '31c2df66c5311abedfd1661fb9d8b135dde4ea8a', class: this.getClasses() }, this.isMobile && this.isDropdownOpen && (h("cura-button-transparent", { key: '418fa19788b7dd8374d4c9c78837ad89c9f11f9e', fontColor: "dark", onClick: () => this.handleGoBack(), iconName: "arrowLeft", size: "medium", iconOnly: true, color: "primary" })), h("cura-input-text", { key: '78dfa84f63f4a5a3b72f94e589b9c362d8e78e19', disabled: this.disabled, label: this.label, part: "cura-input-field", mode: isMobileDropdown ? 'transparent' : 'default', required: this.required, hideErrorIcon: this.status === 'error', iconName: this.iconName || 'search', value: this.value, status: this.status, onValueChange: e => this.onValueChange(e.target.value), onInput: e => this.handleInputChange(e), onFocus: () => this.handleOnFocus(), onClick: () => (window.innerWidth < 768 ? (this.isMobile = true) : null), onBlur: () => {
257
262
  this.handleOnBlur();
258
- }, placeholder: this.placeholder, size: this.size, onKeyDown: this.handleKeyDown }, h("slot", { key: '47f7e07fbcce084cef173c23583ad43e580ae02d', name: "helperText" }))), h("div", { key: '4748cdb4cd039f29f50cfdf1f9ff110bafbeb064', id: "dropdown-search-list", class: this.getDropdownClasses() }, h("slot", { key: '21a66543f65ff198f0b9f60758f1f0930342dc4c', name: "dropdown-search-option", onSlotchange: this.handleSlotChange })))));
263
+ }, placeholder: this.placeholder, size: this.size, onKeyDown: this.handleKeyDown }, h("slot", { key: 'e7f13fc467083f08b4666f4323b8734fb734fe1c', name: "helperText" }))), h("div", { key: '9a39a16c1dfefd6481593ce062036e19cd1b65fa', id: "dropdown-search-list", class: this.getDropdownClasses() }, h("slot", { key: '36af7eb7212ea066af0edb68b5e12bf9f931fae1', name: "dropdown-search-option", onSlotchange: this.handleSlotChange })))));
259
264
  }
260
265
  static get is() { return "cura-dropdown-search"; }
261
266
  static get encapsulation() { return "shadow"; }