@rededor/cura 0.3.2 → 0.3.4-alpha.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/dist/cjs/{app-globals-0f70160b.js → app-globals-a41d7f40.js} +40 -17
- package/dist/cjs/app-globals-a41d7f40.js.map +1 -0
- package/dist/cjs/css-shim-83cf0349.js +8 -0
- package/dist/cjs/css-shim-83cf0349.js.map +1 -0
- package/dist/cjs/{cura-display_4.cjs.entry.js → cura-button_6.cjs.entry.js} +115 -50
- package/dist/cjs/cura-button_6.cjs.entry.js.map +1 -0
- package/dist/cjs/cura-icons-view.cjs.entry.js +4 -2
- package/dist/cjs/cura-icons-view.cjs.entry.js.map +1 -0
- package/dist/cjs/cura.cjs.js +19 -4
- package/dist/cjs/cura.cjs.js.map +1 -0
- package/dist/cjs/{index-8686299e.js → index-29633529.js} +829 -29
- package/dist/cjs/index-29633529.js.map +1 -0
- package/dist/cjs/index.cjs.js +2 -0
- package/dist/cjs/index.cjs.js.map +1 -0
- package/dist/cjs/loader.cjs.js +23 -4
- package/dist/cjs/loader.cjs.js.map +1 -0
- package/dist/cjs/shadow-css-8baae635.js +391 -0
- package/dist/cjs/shadow-css-8baae635.js.map +1 -0
- package/dist/collection/api/cura-api.js +1 -0
- package/dist/collection/api/cura-api.js.map +1 -0
- package/dist/collection/api/cura-api.type.js +1 -0
- package/dist/collection/api/cura-api.type.js.map +1 -0
- package/dist/collection/api/modules/cura-theme-colors-module.js +1 -0
- package/dist/collection/api/modules/cura-theme-colors-module.js.map +1 -0
- package/dist/collection/api/modules/cura-theme-fonts-module.js +1 -0
- package/dist/collection/api/modules/cura-theme-fonts-module.js.map +1 -0
- package/dist/collection/api/modules/cura-theme-module.js +1 -0
- package/dist/collection/api/modules/cura-theme-module.js.map +1 -0
- package/dist/collection/api/modules/cura-theme-spacing-module.js +1 -0
- package/dist/collection/api/modules/cura-theme-spacing-module.js.map +1 -0
- package/dist/collection/api/theme-presets/static.js +1 -0
- package/dist/collection/api/theme-presets/static.js.map +1 -0
- package/dist/collection/api/theme-presets/theme-default.js +6 -5
- package/dist/collection/api/theme-presets/theme-default.js.map +1 -0
- package/dist/collection/api/theme-presets/theme-maternity.js +8 -0
- package/dist/collection/api/theme-presets/theme-maternity.js.map +1 -0
- package/dist/collection/api/theme-presets/theme-oncology.js +27 -12
- package/dist/collection/api/theme-presets/theme-oncology.js.map +1 -0
- package/dist/collection/api/theme-presets/theme-presets.js +1 -0
- package/dist/collection/api/theme-presets/theme-presets.js.map +1 -0
- package/dist/collection/assets/icons/iconset-default-list.js +1 -0
- package/dist/collection/assets/icons/iconset-default-list.js.map +1 -0
- package/dist/collection/collection-manifest.json +3 -2
- package/dist/collection/components/buttons/cura-button/cura-button.css +70 -0
- package/dist/collection/components/buttons/cura-button/cura-button.js +255 -0
- package/dist/collection/components/buttons/cura-button/cura-button.js.map +1 -0
- package/dist/collection/components/cura-icon/cura-icon.js +6 -4
- package/dist/collection/components/cura-icon/cura-icon.js.map +1 -0
- package/dist/collection/components/cura-icons-view/cura-icons-view.js +2 -1
- package/dist/collection/components/cura-icons-view/cura-icons-view.js.map +1 -0
- package/dist/collection/components/cura-page-template/cura-page-template.css +6 -24
- package/dist/collection/components/cura-page-template/cura-page-template.js +1 -0
- package/dist/collection/components/cura-page-template/cura-page-template.js.map +1 -0
- package/dist/collection/components/text/cura-display/cura-display.js +1 -16
- package/dist/collection/components/text/cura-display/cura-display.js.map +1 -0
- package/dist/collection/components/text/cura-heading/cura-heading.js +1 -20
- package/dist/collection/components/text/cura-heading/cura-heading.js.map +1 -0
- package/dist/collection/components/text/cura-paragraph/cura-paragraph.js +1 -12
- package/dist/collection/components/text/cura-paragraph/cura-paragraph.js.map +1 -0
- package/dist/collection/index.js +1 -0
- package/dist/collection/index.js.map +1 -0
- package/dist/collection/rededor-cura-start.js +1 -0
- package/dist/collection/rededor-cura-start.js.map +1 -0
- package/dist/collection/utils/utils.js +1 -0
- package/dist/collection/utils/utils.js.map +1 -0
- package/dist/collection/utils/utils.spec.js +16 -0
- package/dist/collection/utils/utils.spec.js.map +1 -0
- package/dist/components/cura-button.d.ts +11 -0
- package/dist/components/cura-button.js +97 -0
- package/dist/components/cura-button.js.map +1 -0
- package/dist/components/cura-display.js +3 -17
- package/dist/components/cura-display.js.map +1 -0
- package/dist/components/cura-heading.js +3 -21
- package/dist/components/cura-heading.js.map +1 -0
- package/dist/components/cura-icon.js +2 -0
- package/dist/components/cura-icon.js.map +1 -0
- package/dist/components/cura-icon2.js +8 -5
- package/dist/components/cura-icon2.js.map +1 -0
- package/dist/components/cura-icons-view.js +4 -2
- package/dist/components/cura-icons-view.js.map +1 -0
- package/dist/components/cura-page-template.js +4 -2
- package/dist/components/cura-page-template.js.map +1 -0
- package/dist/components/cura-paragraph.js +3 -13
- package/dist/components/cura-paragraph.js.map +1 -0
- package/dist/components/index.d.ts +21 -9
- package/dist/components/index.js +67 -24
- package/dist/components/index.js.map +1 -0
- package/dist/cura/cura.esm.js +2 -1
- package/dist/cura/cura.esm.js.map +1 -0
- package/dist/cura/cura.js +3 -1
- package/dist/cura/index.esm.js +2 -0
- package/dist/cura/index.esm.js.map +1 -0
- package/dist/cura/p-118112e5.system.js +14 -0
- package/dist/cura/p-118112e5.system.js.map +1 -0
- package/dist/cura/p-183305c3.js +2 -0
- package/dist/cura/p-183305c3.js.map +1 -0
- package/dist/cura/p-3f6aaefc.system.js +2 -0
- package/dist/cura/p-3f6aaefc.system.js.map +1 -0
- package/dist/cura/p-4c60d085.entry.js +2 -0
- package/dist/cura/p-4c60d085.entry.js.map +1 -0
- package/dist/cura/p-4fc49972.system.js +2 -0
- package/dist/cura/p-4fc49972.system.js.map +1 -0
- package/dist/cura/p-50ea2036.system.js +2 -1
- package/dist/cura/p-50ea2036.system.js.map +1 -0
- package/dist/cura/p-61953b75.system.js +2 -0
- package/dist/cura/p-61953b75.system.js.map +1 -0
- package/dist/cura/p-731abb13.entry.js +2 -0
- package/dist/cura/p-731abb13.entry.js.map +1 -0
- package/dist/cura/{p-5b5cf2e4.system.entry.js → p-958c8695.system.entry.js} +2 -1
- package/dist/cura/p-958c8695.system.entry.js.map +1 -0
- package/dist/cura/p-b5872ed0.system.entry.js +2 -0
- package/dist/cura/p-b5872ed0.system.entry.js.map +1 -0
- package/dist/cura/p-bac0b4ab.js +2 -0
- package/dist/cura/p-bac0b4ab.js.map +1 -0
- package/dist/cura/p-beab48cd.js +13 -0
- package/dist/cura/p-beab48cd.js.map +1 -0
- package/dist/cura/p-c30e14d5.system.js +3 -0
- package/dist/cura/p-c30e14d5.system.js.map +1 -0
- package/dist/cura/p-d5990392.js +3 -0
- package/dist/cura/p-d5990392.js.map +1 -0
- package/dist/dist/loader/index.d.ts +9 -0
- package/dist/esm/{app-globals-cb45bff3.js → app-globals-8ed931e6.js} +40 -17
- package/dist/esm/app-globals-8ed931e6.js.map +1 -0
- package/dist/esm/css-shim-d13f0738.js +6 -0
- package/dist/esm/css-shim-d13f0738.js.map +1 -0
- package/dist/esm/{cura-display_4.entry.js → cura-button_6.entry.js} +114 -51
- package/dist/esm/cura-button_6.entry.js.map +1 -0
- package/dist/esm/cura-icons-view.entry.js +4 -2
- package/dist/esm/cura-icons-view.entry.js.map +1 -0
- package/dist/esm/cura.js +16 -4
- package/dist/esm/cura.js.map +1 -0
- package/dist/esm/{index-c3d31886.js → index-e11775ce.js} +826 -30
- package/dist/esm/index-e11775ce.js.map +1 -0
- package/dist/esm/index.js +2 -0
- package/dist/esm/index.js.map +1 -0
- package/dist/esm/loader.js +23 -4
- package/dist/esm/loader.js.map +1 -0
- package/dist/esm/polyfills/css-shim.js +1 -1
- package/dist/esm/shadow-css-07b0c8c8.js +389 -0
- package/dist/esm/shadow-css-07b0c8c8.js.map +1 -0
- package/dist/esm-es5/app-globals-8ed931e6.js +2 -0
- package/dist/esm-es5/app-globals-8ed931e6.js.map +1 -0
- package/dist/esm-es5/css-shim-d13f0738.js +2 -0
- package/dist/esm-es5/css-shim-d13f0738.js.map +1 -0
- package/dist/esm-es5/cura-button_6.entry.js +2 -0
- package/dist/esm-es5/cura-button_6.entry.js.map +1 -0
- package/dist/esm-es5/cura-icons-view.entry.js +2 -1
- package/dist/esm-es5/cura-icons-view.entry.js.map +1 -0
- package/dist/esm-es5/cura.js +2 -1
- package/dist/esm-es5/cura.js.map +1 -0
- package/dist/esm-es5/index-e11775ce.js +3 -0
- package/dist/esm-es5/index-e11775ce.js.map +1 -0
- package/dist/esm-es5/index.js +2 -0
- package/dist/esm-es5/index.js.map +1 -0
- package/dist/esm-es5/loader.js +2 -1
- package/dist/esm-es5/loader.js.map +1 -0
- package/dist/esm-es5/shadow-css-07b0c8c8.js +13 -0
- package/dist/esm-es5/shadow-css-07b0c8c8.js.map +1 -0
- package/dist/types/api/theme-presets/theme-maternity.d.ts +7 -0
- package/dist/types/api/theme-presets/theme-oncology.d.ts +5 -5
- package/dist/types/api/theme-presets/theme-presets.d.ts +12 -5
- package/dist/types/components/buttons/cura-button/cura-button.d.ts +49 -0
- package/dist/types/components.d.ts +93 -0
- package/dist/types/stencil-public-runtime.d.ts +77 -15
- package/package.json +7 -7
- package/dist/cjs/cura-icon.cjs.entry.js +0 -59
- package/dist/cura/p-22290742.entry.js +0 -1
- package/dist/cura/p-32769783.system.js +0 -1
- package/dist/cura/p-84b2ad25.entry.js +0 -1
- package/dist/cura/p-8b416bc6.system.js +0 -1
- package/dist/cura/p-a50716bc.js +0 -2
- package/dist/cura/p-aca36c98.js +0 -1
- package/dist/cura/p-e3facf6a.system.entry.js +0 -1
- package/dist/cura/p-e447016d.system.js +0 -2
- package/dist/cura/p-e8fadcfa.system.entry.js +0 -1
- package/dist/cura/p-fbcea891.entry.js +0 -1
- package/dist/esm/cura-icon.entry.js +0 -55
- package/dist/esm-es5/app-globals-cb45bff3.js +0 -1
- package/dist/esm-es5/cura-display_4.entry.js +0 -1
- package/dist/esm-es5/cura-icon.entry.js +0 -1
- package/dist/esm-es5/index-c3d31886.js +0 -2
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cura-page-template.js","sourceRoot":"","sources":["../../../src/components/cura-page-template/cura-page-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOlE,MAAM,OAAO,gBAAgB;;wBAEmC,SAAS;;EAMvE,iBAAiB;IACf,IAAI,CAAC,MAAM,GAAG;MACZ,WAAW,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE;KACvD,CAAA;EACH,CAAC;EAED,UAAU;IACR,MAAM,OAAO,GAAG,EAAE,CAAC;IACnB,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,CAAC,GAAG,IAAI,CAAC;IAChD,OAAO,OAAO,CAAC;EACjB,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,WAAK,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,EAAC,eAAe;QAC5C,WAAK,EAAE,EAAC,YAAY;UAClB,YAAM,IAAI,EAAC,YAAY,GAAQ,CAC3B;QACN,WAAK,EAAE,EAAC,QAAQ;UACd,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB;QACN,WAAK,EAAE,EAAC,aAAa;UACnB,YAAM,IAAI,EAAC,aAAa,GAAQ,CAC5B;QACN,WAAK,EAAE,EAAC,mBAAmB,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE;UAClD,WAAK,EAAE,EAAC,cAAc;YACpB,YAAM,IAAI,EAAC,cAAc,GAAQ,CAC7B;UACN,WAAK,EAAE,EAAC,SAAS;YACf,YAAM,IAAI,EAAC,SAAS,GAAQ;YAC5B,eAAa,CACT;UACN,WAAK,EAAE,EAAC,eAAe;YACrB,YAAM,IAAI,EAAC,eAAe,GAAQ,CAC9B,CACF;QACN,WAAK,EAAE,EAAC,WAAW;UACjB,YAAM,IAAI,EAAC,WAAW,GAAQ,CAC1B;QACN,WAAK,EAAE,EAAC,QAAQ;UACd,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB;QACN,WAAK,EAAE,EAAC,YAAY;UAClB,YAAM,IAAI,EAAC,YAAY,GAAQ,CAC3B,CACF,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Element, Host, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-page-template',\n styleUrl: 'cura-page-template.scss',\n shadow: true,\n})\nexport class CuraPageTemplate {\n\n @Prop({reflect: true}) contentwidth: 'default' | 'centered' = 'default';\n\n @Element() host: HTMLElement;\n\n styles: any;\n\n connectedCallback() {\n this.styles = {\n '--spacing': window.CuraAPI.theme.spacing.getSpacing(),\n }\n }\n\n getClasses() {\n const classes = {};\n classes[this.contentwidth.toLowerCase()] = true;\n return classes;\n }\n\n render() {\n return (\n <Host>\n <div style={this.styles} class=\"grid-template\">\n <div id=\"sub-header\">\n <slot name='sub-header'></slot>\n </div>\n <div id=\"header\">\n <slot name='header'></slot>\n </div>\n <div id=\"pre-content\">\n <slot name='pre-content'></slot>\n </div>\n <div id=\"content-container\" class={this.getClasses()}>\n <div id=\"sidebar-left\">\n <slot name='sidebar-left'></slot>\n </div>\n <div id=\"content\">\n <slot name=\"content\"></slot>\n <slot></slot>\n </div>\n <div id=\"sidebar-right\">\n <slot name='sidebar-right'></slot>\n </div>\n </div>\n <div id=\"post-body\">\n <slot name='post-body'></slot>\n </div>\n <div id=\"footer\">\n <slot name='footer'></slot>\n </div>\n <div id=\"sub-footer\">\n <slot name='sub-footer'></slot>\n </div>\n </div>\n </Host>\n );\n }\n\n}\n"]}
|
|
@@ -1,25 +1,9 @@
|
|
|
1
1
|
import { Host, h } from '@stencil/core';
|
|
2
2
|
export class CuraDisplay {
|
|
3
3
|
constructor() {
|
|
4
|
-
/**
|
|
5
|
-
* Heading level for semantics.
|
|
6
|
-
* Values: 1(default)-6.
|
|
7
|
-
*/
|
|
8
4
|
this.level = 1;
|
|
9
|
-
/**
|
|
10
|
-
* Heading style size.
|
|
11
|
-
* Values: small | regular(default) | large.
|
|
12
|
-
*/
|
|
13
5
|
this.size = 'regular';
|
|
14
|
-
/**
|
|
15
|
-
* Apply light color to text in dark background.
|
|
16
|
-
* Values: boolean.
|
|
17
|
-
*/
|
|
18
6
|
this.inverted = false;
|
|
19
|
-
/**
|
|
20
|
-
* Apply base system color to elements like <a> and <abbr>.
|
|
21
|
-
* Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.
|
|
22
|
-
*/
|
|
23
7
|
this.spotColor = 'primary';
|
|
24
8
|
}
|
|
25
9
|
connectedCallback() {
|
|
@@ -159,3 +143,4 @@ export class CuraDisplay {
|
|
|
159
143
|
}
|
|
160
144
|
static get elementRef() { return "host"; }
|
|
161
145
|
}
|
|
146
|
+
//# sourceMappingURL=cura-display.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cura-display.js","sourceRoot":"","sources":["../../../../src/components/text/cura-display/cura-display.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Element, Prop } from '@stencil/core';\n\n@Component({\n tag: 'cura-display',\n styleUrl: 'cura-display.scss',\n shadow: true,\n})\nexport class CuraDisplay {\n\n /**\n * Heading level for semantics.\n * Values: 1(default)-6.\n */\n @Prop({reflect: true}) level = 1;\n /**\n * Heading style size.\n * Values: small | regular(default) | large.\n */\n @Prop({reflect: true}) size = 'regular';\n /**\n * Apply light color to text in dark background.\n * Values: boolean.\n */\n @Prop({reflect: true}) inverted = false;\n /**\n * Apply base system color to elements like <a> and <abbr>.\n * Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.\n */\n @Prop({reflect: true}) spotColor = 'primary';\n \n /**\n * Host element <cura-heading>\n */\n @Element() host: HTMLElement;\n \n /**\n * Internal Props\n */\n weights: any;\n styles: any;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.setFontProperties();\n this.setColors();\n }\n\n getClasses() {\n const classes = {};\n classes[this.size.toLowerCase()] = true;\n return classes;\n }\n\n setFontProperties() {\n this.styles = {\n '--font-family': window.CuraAPI.theme.fonts.getFamily('display'),\n '--font-size': window.CuraAPI.theme.fonts.getSize(),\n '--font-weight-bold': this.weights.bold,\n '--font-weight-black': this.weights.black\n }\n this.setHostProperty('--font-size', window.CuraAPI.theme.fonts.getSize());\n this.setHostProperty('--block-margin', '0.5em');\n }\n\n setColors() {\n const fontColor = this.inverted \n ? window.CuraAPI.theme.colors.getColor('neutral-100') \n : window.CuraAPI.theme.fonts.getColor();\n this.styles['--color-body'] = fontColor || window.CuraAPI.theme.colors.getColor('neutral-darker');\n this.styles['--color-link'] = this.inverted \n ? window.CuraAPI.theme.colors.getColor(`${this.spotColor}-100`)\n : window.CuraAPI.theme.colors.getColor(`${this.spotColor}-700`);\n }\n\n setHostProperty(prop: string, value: string) {\n this.host.style.setProperty(prop, value);\n }\n\n getHeadingTag() {\n const tags = {\n '1': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>,\n '2': <h2 style={this.styles} class={this.getClasses()}><slot></slot></h2>,\n '3': <h3 style={this.styles} class={this.getClasses()}><slot></slot></h3>,\n '4': <h4 style={this.styles} class={this.getClasses()}><slot></slot></h4>,\n '5': <h5 style={this.styles} class={this.getClasses()}><slot></slot></h5>,\n '6': <h6 style={this.styles} class={this.getClasses()}><slot></slot></h6>,\n 'default': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>\n };\n return tags[`${this.level}`] || tags['default'];\n }\n\n render() {\n return (\n <Host>\n { this.getHeadingTag() }\n </Host>\n );\n }\n\n}\n"]}
|
|
@@ -1,30 +1,10 @@
|
|
|
1
1
|
import { Host, h } from '@stencil/core';
|
|
2
2
|
export class CuraHeading {
|
|
3
3
|
constructor() {
|
|
4
|
-
/**
|
|
5
|
-
* Heading level for semantics.
|
|
6
|
-
* Values: 1(default)-6.
|
|
7
|
-
*/
|
|
8
4
|
this.level = 1;
|
|
9
|
-
/**
|
|
10
|
-
* Heading style size.
|
|
11
|
-
* Values: small | regular(default) | large.
|
|
12
|
-
*/
|
|
13
5
|
this.size = 'regular';
|
|
14
|
-
/**
|
|
15
|
-
* Heading font weight.
|
|
16
|
-
* Values: regular(default) | bold.
|
|
17
|
-
*/
|
|
18
6
|
this.weight = 'regular';
|
|
19
|
-
/**
|
|
20
|
-
* Apply light color to text in dark background.
|
|
21
|
-
* Values: boolean.
|
|
22
|
-
*/
|
|
23
7
|
this.inverted = false;
|
|
24
|
-
/**
|
|
25
|
-
* Apply base system color to elements like <a> and <abbr>.
|
|
26
|
-
* Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.
|
|
27
|
-
*/
|
|
28
8
|
this.spotColor = 'primary';
|
|
29
9
|
}
|
|
30
10
|
connectedCallback() {
|
|
@@ -185,3 +165,4 @@ export class CuraHeading {
|
|
|
185
165
|
}
|
|
186
166
|
static get elementRef() { return "host"; }
|
|
187
167
|
}
|
|
168
|
+
//# sourceMappingURL=cura-heading.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cura-heading.js","sourceRoot":"","sources":["../../../../src/components/text/cura-heading/cura-heading.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Element } from '@stencil/core';\n\n@Component({\n tag: 'cura-heading',\n styleUrl: 'cura-heading.scss',\n shadow: true,\n})\nexport class CuraHeading {\n\n /**\n * Heading level for semantics.\n * Values: 1(default)-6.\n */\n @Prop({reflect: true}) level = 1;\n /**\n * Heading style size.\n * Values: small | regular(default) | large.\n */\n @Prop({reflect: true}) size = 'regular';\n /**\n * Heading font weight.\n * Values: regular(default) | bold.\n */\n @Prop({reflect: true}) weight = 'regular';\n /**\n * Apply light color to text in dark background.\n * Values: boolean.\n */\n @Prop({reflect: true}) inverted = false;\n /**\n * Apply base system color to elements like <a> and <abbr>.\n * Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.\n */\n @Prop({reflect: true}) spotColor = 'primary';\n\n /**\n * Host element <cura-heading>\n */\n @Element() host: HTMLElement;\n\n /**\n * Internal Props\n */\n weights: any;\n styles: any;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.setFontProperties();\n this.setColors();\n }\n\n getClasses() {\n const classes = {};\n classes[this.size.toLowerCase()] = true;\n classes[`${this.weight.toLowerCase()}-weight`] = true;\n return classes;\n }\n\n setFontProperties() {\n this.styles = {\n '--font-family': window.CuraAPI.theme.fonts.getFamily('heading'),\n '--font-size': window.CuraAPI.theme.fonts.getSize(),\n '--font-weight-regular': this.weights.regular,\n '--font-weight-medium': this.weights.medium,\n '--font-weight-bold': this.weights.bold,\n '--font-weight-black': this.weights.black\n }\n this.setHostProperty('--font-size', window.CuraAPI.theme.fonts.getSize());\n this.setHostProperty('--block-margin', '0.5em');\n }\n\n setColors() {\n const fontColor = this.inverted \n ? window.CuraAPI.theme.colors.getColor('neutral-100') \n : window.CuraAPI.theme.fonts.getColor();\n this.styles['--color-body'] = fontColor || window.CuraAPI.theme.colors.getColor('neutral-darker');\n this.styles['--color-link'] = this.inverted \n ? window.CuraAPI.theme.colors.getColor(`${this.spotColor}-100`)\n : window.CuraAPI.theme.colors.getColor(`${this.spotColor}-700`);\n }\n\n setHostProperty(prop: string, value: string) {\n this.host.style.setProperty(prop, value);\n }\n\n getHeadingTag() {\n const tags = {\n '1': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>,\n '2': <h2 style={this.styles} class={this.getClasses()}><slot></slot></h2>,\n '3': <h3 style={this.styles} class={this.getClasses()}><slot></slot></h3>,\n '4': <h4 style={this.styles} class={this.getClasses()}><slot></slot></h4>,\n '5': <h5 style={this.styles} class={this.getClasses()}><slot></slot></h5>,\n '6': <h6 style={this.styles} class={this.getClasses()}><slot></slot></h6>,\n 'default': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>\n };\n return tags[`${this.level}`] || tags['default'];\n }\n\n render() {\n return (\n <Host>\n { this.getHeadingTag() }\n </Host>\n );\n }\n\n}\n"]}
|
|
@@ -1,20 +1,8 @@
|
|
|
1
1
|
import { Host, h } from '@stencil/core';
|
|
2
2
|
export class CuraParagraph {
|
|
3
3
|
constructor() {
|
|
4
|
-
/**
|
|
5
|
-
* Set size of body text.
|
|
6
|
-
* Values: regular (default) | large | small | caption.
|
|
7
|
-
*/
|
|
8
4
|
this.size = 'regular';
|
|
9
|
-
/**
|
|
10
|
-
* Apply light color to text in dark background.
|
|
11
|
-
* Values: boolean.
|
|
12
|
-
*/
|
|
13
5
|
this.inverted = false;
|
|
14
|
-
/**
|
|
15
|
-
* Apply base system color to elements like <a> and <abbr>.
|
|
16
|
-
* Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.
|
|
17
|
-
*/
|
|
18
6
|
this.spotColor = 'primary';
|
|
19
7
|
}
|
|
20
8
|
connectedCallback() {
|
|
@@ -125,3 +113,4 @@ export class CuraParagraph {
|
|
|
125
113
|
}
|
|
126
114
|
static get elementRef() { return "host"; }
|
|
127
115
|
}
|
|
116
|
+
//# sourceMappingURL=cura-paragraph.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cura-paragraph.js","sourceRoot":"","sources":["../../../../src/components/text/cura-paragraph/cura-paragraph.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAOlE,MAAM,OAAO,aAAa;;gBAMM,SAAS;oBAKL,KAAK;qBAKJ,SAAS;;EAa5C,iBAAiB;IACf,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;IACvD,IAAI,CAAC,iBAAiB,EAAE,CAAC;IACzB,IAAI,CAAC,SAAS,EAAE,CAAC;EACnB,CAAC;EAED,YAAY;IACV,MAAM,SAAS,GAAG,EAAE,CAAC;IACrB,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,GAAG,IAAI,CAAC;IAC1C,OAAO,SAAS,CAAC;EACnB,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,MAAM,GAAG;MACZ,eAAe,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC;MAC7D,aAAa,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE;MACnD,uBAAuB,EAAE,IAAI,CAAC,OAAO,CAAC,OAAO;MAC7C,sBAAsB,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM;MAC3C,oBAAoB,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI;KACxC,CAAA;IACD,IAAI,CAAC,eAAe,CAAC,aAAa,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC;IAC1E,IAAI,CAAC,eAAe,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAC;EACnD,CAAC;EAED,SAAS;IACP,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ;MAC7B,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC;MACrD,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;IAC1C,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,SAAS,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,gBAAgB,CAAC,CAAC;IAClG,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,IAAI,CAAC,QAAQ;MACzC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,SAAS,MAAM,CAAC;MAC/D,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,SAAS,MAAM,CAAC,CAAC;EACpE,CAAC;EAED,eAAe,CAAC,IAAY,EAAE,KAAa;IACzC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;EAC3C,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,SAAG,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE;QAC/C,eAAa,CACX,CACC,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, Prop, h, Element } from '@stencil/core';\n\n@Component({\n tag: 'cura-paragraph',\n styleUrl: 'cura-paragraph.scss',\n shadow: true,\n})\nexport class CuraParagraph {\n\n /**\n * Set size of body text.\n * Values: regular (default) | large | small | caption.\n */\n @Prop({reflect: true}) size = 'regular';\n /**\n * Apply light color to text in dark background.\n * Values: boolean.\n */\n @Prop({reflect: true}) inverted = false;\n /**\n * Apply base system color to elements like <a> and <abbr>.\n * Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.\n */\n @Prop({reflect: true}) spotColor = 'primary';\n \n /**\n * Host element <cura-paragraph>\n */\n @Element() host: HTMLElement;\n\n /**\n * Internal Props\n */\n weights: any;\n styles: any;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.setFontProperties();\n this.setColors();\n }\n\n setsizeClass() {\n const sizeclass = {};\n sizeclass[this.size.toLowerCase()] = true;\n return sizeclass;\n }\n\n setFontProperties() {\n this.styles = {\n '--font-family': window.CuraAPI.theme.fonts.getFamily('body'),\n '--font-size': window.CuraAPI.theme.fonts.getSize(),\n '--font-weight-regular': this.weights.regular,\n '--font-weight-medium': this.weights.medium,\n '--font-weight-bold': this.weights.bold\n }\n this.setHostProperty('--font-size', window.CuraAPI.theme.fonts.getSize());\n this.setHostProperty('--block-margin', '1.25em');\n }\n\n setColors() {\n const fontColor = this.inverted \n ? window.CuraAPI.theme.colors.getColor('neutral-100') \n : window.CuraAPI.theme.fonts.getColor();\n this.styles['--color-body'] = fontColor || window.CuraAPI.theme.colors.getColor('neutral-darker');\n this.styles['--color-link'] = this.inverted \n ? window.CuraAPI.theme.colors.getColor(`${this.spotColor}-100`)\n : window.CuraAPI.theme.colors.getColor(`${this.spotColor}-700`);\n }\n\n setHostProperty(prop: string, value: string) {\n this.host.style.setProperty(prop, value);\n }\n\n render() {\n return (\n <Host>\n <p style={this.styles} class={this.setsizeClass()}>\n <slot></slot>\n </p>\n </Host>\n );\n }\n\n}\n"]}
|
package/dist/collection/index.js
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"","sourcesContent":["export { Components, JSX } from './components';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"rededor-cura-start.js","sourceRoot":"","sources":["../src/rededor-cura-start.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,gBAAgB,CAAC;AAYrC,MAAM,CAAC,OAAO;EACZ,MAAM,MAAM,GAAG,MAAM,CAAC,QAAQ,CAAC;EAC/B,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC,IAAI,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,OAAO,EAAE,CAAC;EAC9D,MAAM,GAAG,GAAG,MAAM,CAAC,OAAO,CAAC;EAC3B,MAAM,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,cAAc,EAAE,EAAE,MAAM,EAAE,EAAC,GAAG,EAAC,EAAE,CAAC,CAAC,CAAC;EACzE,IAAI,MAAM,IAAI,OAAO,MAAM,CAAC,OAAO,KAAK,UAAU;IAAE,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;AAC1E,CAAC","sourcesContent":["import CuraAPI from './api/cura-api';\nimport { CuraConfig } from './api/cura-api.type';\n// import { setAssetPath } from '@stencil/core';\n\n// setAssetPath(import.meta.url);\ndeclare global {\n interface Window {\n CuraAPI?: CuraAPI,\n CuraInit?: CuraConfig\n }\n}\n\nexport default function() {\n const config = window.CuraInit;\n window.CuraAPI = config ? new CuraAPI(config) : new CuraAPI();\n const api = window.CuraAPI;\n window.dispatchEvent(new CustomEvent(\"CuraAPIReady\", { detail: {api} }));\n if (config && typeof config.onReady === 'function') config.onReady(api);\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/utils/utils.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,MAAM,CAAC,KAAa,EAAE,MAAc,EAAE,IAAY;EAChE,OAAO,CAAC,KAAK,IAAI,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;AACjF,CAAC","sourcesContent":["export function format(first: string, middle: string, last: string): string {\n return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');\n}\n"]}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { format } from './utils';
|
|
2
|
+
describe('format', () => {
|
|
3
|
+
it('returns empty string for no names defined', () => {
|
|
4
|
+
expect(format(undefined, undefined, undefined)).toEqual('');
|
|
5
|
+
});
|
|
6
|
+
it('formats just first names', () => {
|
|
7
|
+
expect(format('Joseph', undefined, undefined)).toEqual('Joseph');
|
|
8
|
+
});
|
|
9
|
+
it('formats first and last names', () => {
|
|
10
|
+
expect(format('Joseph', undefined, 'Publique')).toEqual('Joseph Publique');
|
|
11
|
+
});
|
|
12
|
+
it('formats first, middle and last names', () => {
|
|
13
|
+
expect(format('Joseph', 'Quincy', 'Publique')).toEqual('Joseph Quincy Publique');
|
|
14
|
+
});
|
|
15
|
+
});
|
|
16
|
+
//# sourceMappingURL=utils.spec.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.spec.js","sourceRoot":"","sources":["../../src/utils/utils.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAEjC,QAAQ,CAAC,QAAQ,EAAE,GAAG,EAAE;EACtB,EAAE,CAAC,2CAA2C,EAAE,GAAG,EAAE;IACnD,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;EAC9D,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,0BAA0B,EAAE,GAAG,EAAE;IAClC,MAAM,CAAC,MAAM,CAAC,QAAQ,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;EACnE,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,8BAA8B,EAAE,GAAG,EAAE;IACtC,MAAM,CAAC,MAAM,CAAC,QAAQ,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;EAC7E,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,sCAAsC,EAAE,GAAG,EAAE;IAC9C,MAAM,CAAC,MAAM,CAAC,QAAQ,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC;EACnF,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { format } from './utils';\n\ndescribe('format', () => {\n it('returns empty string for no names defined', () => {\n expect(format(undefined, undefined, undefined)).toEqual('');\n });\n\n it('formats just first names', () => {\n expect(format('Joseph', undefined, undefined)).toEqual('Joseph');\n });\n\n it('formats first and last names', () => {\n expect(format('Joseph', undefined, 'Publique')).toEqual('Joseph Publique');\n });\n\n it('formats first, middle and last names', () => {\n expect(format('Joseph', 'Quincy', 'Publique')).toEqual('Joseph Quincy Publique');\n });\n});\n"]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../types/components";
|
|
2
|
+
|
|
3
|
+
interface CuraButton extends Components.CuraButton, HTMLElement {}
|
|
4
|
+
export const CuraButton: {
|
|
5
|
+
prototype: CuraButton;
|
|
6
|
+
new (): CuraButton;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
+
import { d as defineCustomElement$2 } from './cura-icon2.js';
|
|
3
|
+
|
|
4
|
+
const curaButtonCss = ":host{display:inline-block;vertical-align:middle}:host button,:host a{outline:none;-webkit-box-shadow:none;box-shadow:none;-webkit-box-sizing:border-box;box-sizing:border-box;padding:calc(var(--base-spacing) * 3.5px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 13px);display:-ms-flexbox;display:flex;width:100%;-ms-flex-align:center;align-items:center;background-color:var(--color-base);border-width:1px;border-color:var(--color-dark);border-style:solid;border-radius:4px;-webkit-transition:background-color 0.12s linear, border-color 0.12s linear, -webkit-box-shadow 0.12s linear;transition:background-color 0.12s linear, border-color 0.12s linear, -webkit-box-shadow 0.12s linear;transition:background-color 0.12s linear, box-shadow 0.12s linear, border-color 0.12s linear;transition:background-color 0.12s linear, box-shadow 0.12s linear, border-color 0.12s linear, -webkit-box-shadow 0.12s linear;cursor:pointer}:host button:hover,:host a:hover{background-color:var(--color-light);border-color:var(--color-base);-webkit-box-shadow:0 4px 8px 0 var(--neutral-light);box-shadow:0 4px 8px 0 var(--neutral-light)}:host button .label,:host a .label{-ms-flex:1;flex:1;color:var(--neutral-black)}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 3px)}:host button.icon-right,:host a.icon-right{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 3px)}:host button.medium,:host a.medium{padding:calc(var(--base-spacing) * 2.75px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 11px)}:host button.medium:hover,:host a.medium:hover{-webkit-box-shadow:0 3px 6px 0 var(--neutral-light);box-shadow:0 3px 6px 0 var(--neutral-light)}:host button.small,:host a.small{padding:calc(var(--base-spacing) * 1.5px) calc(var(--base-spacing) * 3px);min-height:calc(var(--base-spacing) * 8px)}:host button.small:hover,:host a.small:hover{-webkit-box-shadow:0 2px 5px 0 var(--neutral-light);box-shadow:0 2px 5px 0 var(--neutral-light)}:host button.small.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 2.5px)}:host button.small.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 2.5px)}:host button.disabled,:host a.disabled{cursor:not-allowed;background-color:var(--neutral-light);border-color:var(--neutral-base)}:host button.disabled:hover,:host a.disabled:hover{-webkit-box-shadow:none;box-shadow:none}:host button.disabled .label,:host a.disabled .label{color:var(--neutral-dark)}";
|
|
5
|
+
|
|
6
|
+
const CuraButton$1 = /*@__PURE__*/ proxyCustomElement(class CuraButton extends HTMLElement {
|
|
7
|
+
constructor() {
|
|
8
|
+
super();
|
|
9
|
+
this.__registerHost();
|
|
10
|
+
this.__attachShadow();
|
|
11
|
+
this.type = 'primary';
|
|
12
|
+
this.size = 'large';
|
|
13
|
+
this.disabled = false;
|
|
14
|
+
this.isLoading = false;
|
|
15
|
+
this.iconName = undefined;
|
|
16
|
+
this.iconset = 'default';
|
|
17
|
+
this.iconPosition = 'left';
|
|
18
|
+
this.href = undefined;
|
|
19
|
+
this.target = "_self";
|
|
20
|
+
this.color = 'accent';
|
|
21
|
+
this.styles = {};
|
|
22
|
+
}
|
|
23
|
+
handleChangeColor() {
|
|
24
|
+
this.setColors();
|
|
25
|
+
}
|
|
26
|
+
connectedCallback() {
|
|
27
|
+
this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();
|
|
28
|
+
this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);
|
|
29
|
+
this.styles['--neutral-light'] = window.CuraAPI.theme.colors.getColor(`neutral-light`);
|
|
30
|
+
this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);
|
|
31
|
+
this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);
|
|
32
|
+
this.styles['--neutral-black'] = window.CuraAPI.theme.colors.getColor(`neutral-black`);
|
|
33
|
+
this.setColors();
|
|
34
|
+
}
|
|
35
|
+
getClasses() {
|
|
36
|
+
const classes = {};
|
|
37
|
+
classes[`button-${this.type.toLowerCase()}`] = true;
|
|
38
|
+
classes[`${this.size.toLowerCase()}`] = true;
|
|
39
|
+
classes[`icon-${this.iconPosition.toLowerCase()}`] = true;
|
|
40
|
+
classes['disabled'] = this.disabled;
|
|
41
|
+
return classes;
|
|
42
|
+
}
|
|
43
|
+
setColors() {
|
|
44
|
+
this.styles = Object.assign(Object.assign({}, this.styles), { '--color-light': window.CuraAPI.theme.colors.getColor(`${this.color}-light`), '--color-base': window.CuraAPI.theme.colors.getColor(`${this.color}-base`), '--color-dark': window.CuraAPI.theme.colors.getColor(`${this.color}-dark`) });
|
|
45
|
+
}
|
|
46
|
+
getIcon() {
|
|
47
|
+
if (!this.iconName)
|
|
48
|
+
return '';
|
|
49
|
+
const iconSize = this.size === 'small' ? 16 : this.size === 'medium' ? 20 : 24;
|
|
50
|
+
const color = this.disabled ? 'neutral-dark' : `neutral-black`;
|
|
51
|
+
return h("cura-icon", { name: this.iconName, iconset: this.iconset, size: iconSize, color: color });
|
|
52
|
+
}
|
|
53
|
+
render() {
|
|
54
|
+
return (h(Host, null, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles }, this.getIcon(), h("span", { class: "label" }, h("slot", null)))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null }, this.getIcon(), h("span", { class: "label" }, h("slot", null))))));
|
|
55
|
+
}
|
|
56
|
+
static get watchers() { return {
|
|
57
|
+
"color": ["handleChangeColor"]
|
|
58
|
+
}; }
|
|
59
|
+
static get style() { return curaButtonCss; }
|
|
60
|
+
}, [1, "cura-button", {
|
|
61
|
+
"type": [513],
|
|
62
|
+
"size": [513],
|
|
63
|
+
"disabled": [516],
|
|
64
|
+
"isLoading": [516, "is-loading"],
|
|
65
|
+
"iconName": [513, "icon-name"],
|
|
66
|
+
"iconset": [513],
|
|
67
|
+
"iconPosition": [513, "icon-position"],
|
|
68
|
+
"href": [513],
|
|
69
|
+
"target": [1],
|
|
70
|
+
"color": [1],
|
|
71
|
+
"styles": [32]
|
|
72
|
+
}]);
|
|
73
|
+
function defineCustomElement$1() {
|
|
74
|
+
if (typeof customElements === "undefined") {
|
|
75
|
+
return;
|
|
76
|
+
}
|
|
77
|
+
const components = ["cura-button", "cura-icon"];
|
|
78
|
+
components.forEach(tagName => { switch (tagName) {
|
|
79
|
+
case "cura-button":
|
|
80
|
+
if (!customElements.get(tagName)) {
|
|
81
|
+
customElements.define(tagName, CuraButton$1);
|
|
82
|
+
}
|
|
83
|
+
break;
|
|
84
|
+
case "cura-icon":
|
|
85
|
+
if (!customElements.get(tagName)) {
|
|
86
|
+
defineCustomElement$2();
|
|
87
|
+
}
|
|
88
|
+
break;
|
|
89
|
+
} });
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
const CuraButton = CuraButton$1;
|
|
93
|
+
const defineCustomElement = defineCustomElement$1;
|
|
94
|
+
|
|
95
|
+
export { CuraButton, defineCustomElement };
|
|
96
|
+
|
|
97
|
+
//# sourceMappingURL=cura-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"cura-button.js","mappings":"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","names":["CuraButton"],"sources":["./src/components/buttons/cura-button/cura-button.scss?tag=cura-button&encapsulation=shadow","./src/components/buttons/cura-button/cura-button.tsx"],"sourcesContent":[":host {\n display: inline-block;\n vertical-align: middle;\n\n button, a {\n outline: none;\n box-shadow: none;\n box-sizing: border-box;\n padding: calc(var(--base-spacing) * 3.5px) calc(var(--base-spacing) * 4px);\n min-height: calc(var(--base-spacing) * 13px);\n display: flex;\n width: 100%;\n align-items: center;\n background-color: var(--color-base);\n border-width: 1px;\n border-color: var(--color-dark);\n border-style: solid;\n border-radius: 4px;\n transition: background-color .12s linear, box-shadow .12s linear, border-color .12s linear;\n cursor: pointer;\n\n &:hover {\n background-color: var(--color-light);\n border-color: var(--color-base);\n box-shadow: 0 4px 8px 0 var(--neutral-light);\n }\n\n .label { \n flex: 1;\n color: var(--neutral-black);\n }\n\n &.icon-left cura-icon {\n margin-right: calc(var(--base-spacing) * 3px);\n }\n\n &.icon-right {\n flex-direction: row-reverse;\n cura-icon {\n margin-left: calc(var(--base-spacing) * 3px);\n }\n }\n\n &.medium {\n padding: calc(var(--base-spacing) * 2.75px) calc(var(--base-spacing) * 4px);\n min-height: calc(var(--base-spacing) * 11px);\n\n &:hover { box-shadow: 0 3px 6px 0 var(--neutral-light); }\n }\n\n &.small {\n padding: calc(var(--base-spacing) * 1.5px) calc(var(--base-spacing) * 3px);\n min-height: calc(var(--base-spacing) * 8px);\n\n &:hover { box-shadow: 0 2px 5px 0 var(--neutral-light); }\n\n &.icon-left cura-icon { margin-right: calc(var(--base-spacing) * 2.5px); }\n\n &.icon-right cura-icon { margin-left: calc(var(--base-spacing) * 2.5px); }\n }\n\n &.disabled {\n cursor: not-allowed;\n background-color: var(--neutral-light);\n border-color: var(--neutral-base);\n \n &:hover { box-shadow: none; }\n\n .label { color: var(--neutral-dark); }\n\n }\n\n }\n}\n","import { Component, Host, h, Prop, Watch, State } from '@stencil/core';\n\n@Component({\n tag: 'cura-button',\n styleUrl: 'cura-button.scss',\n shadow: true,\n})\nexport class CuraButton {\n\n /**\n * Button type: primary (default) | outline | transparent | icon.\n */\n @Prop({reflect: true}) type = 'primary';\n /**\n * Button size: small | medium | large (default)\n */\n @Prop({reflect: true}) size = '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';\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() target = \"_self\";\n\n /**\n * Color base from color scheme. Default: accent\n */\n @Prop() color = 'accent';\n @Watch('color')\n handleChangeColor() {\n this.setColors();\n }\n\n @State() styles = {};\n\n connectedCallback() {\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-light'] = window.CuraAPI.theme.colors.getColor(`neutral-light`);\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['--neutral-black'] = window.CuraAPI.theme.colors.getColor(`neutral-black`);\n this.setColors();\n }\n \n getClasses() {\n const classes = {};\n classes[`button-${this.type.toLowerCase()}`] = true;\n classes[`${this.size.toLowerCase()}`] = true;\n classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n classes['disabled'] = this.disabled;\n return classes;\n }\n\n setColors() {\n this.styles = {\n ...this.styles,\n '--color-light': window.CuraAPI.theme.colors.getColor(`${this.color}-light`),\n '--color-base': window.CuraAPI.theme.colors.getColor(`${this.color}-base`),\n '--color-dark': window.CuraAPI.theme.colors.getColor(`${this.color}-dark`)\n };\n }\n\n getIcon() {\n if (!this.iconName) return '';\n const iconSize = this.size === 'small' ? 16 : this.size === 'medium' ? 20 : 24;\n const color = this.disabled ? 'neutral-dark' : `neutral-black`;\n return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={color}></cura-icon>;\n }\n\n render() {\n return (\n <Host>\n { this.href ? (\n <a href={this.disabled ? '' : this.href} target={this.target} class={this.getClasses()} style={this.styles}>\n { this.getIcon() }\n <span class=\"label\"><slot></slot></span>\n </a>\n ) : (\n <button class={this.getClasses()} style={this.styles} disabled={this.disabled || null}>\n { this.getIcon() }\n <span class=\"label\"><slot></slot></span>\n </button>\n )}\n </Host>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -2,30 +2,14 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
|
|
|
2
2
|
|
|
3
3
|
const curaDisplayCss = ":host{display:block;font-size:var(--font-size);text-transform:uppercase}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:4.285em;font-weight:var(--font-weight-black);color:var(--color-body);line-height:120%;letter-spacing:-4%;-webkit-margin-before:var(--block-margin);margin-block-start:var(--block-margin);-webkit-margin-after:var(--block-margin);margin-block-end:var(--block-margin)}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:6.21em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:3em;font-weight:var(--font-weight-bold)}@media (min-width: 768px) and (max-width: 1365px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:4.92em}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:7.07em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:3.428em}}@media (min-width: 1366px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:6.14em;line-height:125%}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:8.857em;letter-spacing:-6%}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:4.285em;letter-spacing:-2%}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-decoration:none;text-underline-offset:10%;cursor:pointer}:host ::slotted(abbr){color:var(--color-link);-webkit-text-decoration:underline dashed 1px var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";
|
|
4
4
|
|
|
5
|
-
const CuraDisplay$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
5
|
+
const CuraDisplay$1 = /*@__PURE__*/ proxyCustomElement(class CuraDisplay extends HTMLElement {
|
|
6
6
|
constructor() {
|
|
7
7
|
super();
|
|
8
8
|
this.__registerHost();
|
|
9
9
|
this.__attachShadow();
|
|
10
|
-
/**
|
|
11
|
-
* Heading level for semantics.
|
|
12
|
-
* Values: 1(default)-6.
|
|
13
|
-
*/
|
|
14
10
|
this.level = 1;
|
|
15
|
-
/**
|
|
16
|
-
* Heading style size.
|
|
17
|
-
* Values: small | regular(default) | large.
|
|
18
|
-
*/
|
|
19
11
|
this.size = 'regular';
|
|
20
|
-
/**
|
|
21
|
-
* Apply light color to text in dark background.
|
|
22
|
-
* Values: boolean.
|
|
23
|
-
*/
|
|
24
12
|
this.inverted = false;
|
|
25
|
-
/**
|
|
26
|
-
* Apply base system color to elements like <a> and <abbr>.
|
|
27
|
-
* Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.
|
|
28
|
-
*/
|
|
29
13
|
this.spotColor = 'primary';
|
|
30
14
|
}
|
|
31
15
|
connectedCallback() {
|
|
@@ -101,3 +85,5 @@ const CuraDisplay = CuraDisplay$1;
|
|
|
101
85
|
const defineCustomElement = defineCustomElement$1;
|
|
102
86
|
|
|
103
87
|
export { CuraDisplay, defineCustomElement };
|
|
88
|
+
|
|
89
|
+
//# sourceMappingURL=cura-display.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"cura-display.js","mappings":"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","names":["CuraDisplay"],"sources":["./src/components/text/cura-display/cura-display.scss?tag=cura-display&encapsulation=shadow","./src/components/text/cura-display/cura-display.tsx"],"sourcesContent":["@import '../../../scss/mixins/responsive.scss';\n\n:host {\n display: block;\n font-size: var(--font-size);\n text-transform: uppercase;\n\n h1, h2, h3, h4, h5, h6 {\n font-family: var(--font-family);\n font-size: 4.285em;\n font-weight: var(--font-weight-black);\n color: var(--color-body);\n line-height: 120%;\n letter-spacing: -4%;\n margin-block-start: var(--block-margin);\n margin-block-end: var(--block-margin);\n\n &.large {\n font-size:6.21em;\n }\n\n &.small {\n font-size: 3em;\n font-weight: var(--font-weight-bold);\n }\n\n }\n\n @include medium-only() {\n h1, h2, h3, h4, h5, h6 { \n font-size: 4.92em;\n\n &.large {\n font-size: 7.07em;\n }\n\n &.small {\n font-size: 3.428em;\n }\n\n }\n }\n\n @include large-up() {\n h1, h2, h3, h4, h5, h6 { \n font-size: 6.14em;\n line-height: 125%;\n\n &.large {\n font-size: 8.857em;\n letter-spacing: -6%;\n }\n\n &.small {\n font-size: 4.285em;\n letter-spacing: -2%;\n }\n }\n }\n\n ::slotted(b), ::slotted(strong) {\n font-weight: var(--font-weight-bold);\n }\n\n ::slotted(a) {\n font-weight: var(--font-weight-bold);\n color: var(--color-link);\n text-decoration: none;\n text-underline-offset: 10%;\n cursor: pointer;\n }\n\n ::slotted(abbr) {\n color: var(--color-link);\n text-decoration: underline dashed 1px var(--color-link);\n text-underline-offset: 10%;\n cursor: default;\n }\n\n}\n","import { Component, Host, h, Element, Prop } from '@stencil/core';\n\n@Component({\n tag: 'cura-display',\n styleUrl: 'cura-display.scss',\n shadow: true,\n})\nexport class CuraDisplay {\n\n /**\n * Heading level for semantics.\n * Values: 1(default)-6.\n */\n @Prop({reflect: true}) level = 1;\n /**\n * Heading style size.\n * Values: small | regular(default) | large.\n */\n @Prop({reflect: true}) size = 'regular';\n /**\n * Apply light color to text in dark background.\n * Values: boolean.\n */\n @Prop({reflect: true}) inverted = false;\n /**\n * Apply base system color to elements like <a> and <abbr>.\n * Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.\n */\n @Prop({reflect: true}) spotColor = 'primary';\n \n /**\n * Host element <cura-heading>\n */\n @Element() host: HTMLElement;\n \n /**\n * Internal Props\n */\n weights: any;\n styles: any;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.setFontProperties();\n this.setColors();\n }\n\n getClasses() {\n const classes = {};\n classes[this.size.toLowerCase()] = true;\n return classes;\n }\n\n setFontProperties() {\n this.styles = {\n '--font-family': window.CuraAPI.theme.fonts.getFamily('display'),\n '--font-size': window.CuraAPI.theme.fonts.getSize(),\n '--font-weight-bold': this.weights.bold,\n '--font-weight-black': this.weights.black\n }\n this.setHostProperty('--font-size', window.CuraAPI.theme.fonts.getSize());\n this.setHostProperty('--block-margin', '0.5em');\n }\n\n setColors() {\n const fontColor = this.inverted \n ? window.CuraAPI.theme.colors.getColor('neutral-100') \n : window.CuraAPI.theme.fonts.getColor();\n this.styles['--color-body'] = fontColor || window.CuraAPI.theme.colors.getColor('neutral-darker');\n this.styles['--color-link'] = this.inverted \n ? window.CuraAPI.theme.colors.getColor(`${this.spotColor}-100`)\n : window.CuraAPI.theme.colors.getColor(`${this.spotColor}-700`);\n }\n\n setHostProperty(prop: string, value: string) {\n this.host.style.setProperty(prop, value);\n }\n\n getHeadingTag() {\n const tags = {\n '1': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>,\n '2': <h2 style={this.styles} class={this.getClasses()}><slot></slot></h2>,\n '3': <h3 style={this.styles} class={this.getClasses()}><slot></slot></h3>,\n '4': <h4 style={this.styles} class={this.getClasses()}><slot></slot></h4>,\n '5': <h5 style={this.styles} class={this.getClasses()}><slot></slot></h5>,\n '6': <h6 style={this.styles} class={this.getClasses()}><slot></slot></h6>,\n 'default': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>\n };\n return tags[`${this.level}`] || tags['default'];\n }\n\n render() {\n return (\n <Host>\n { this.getHeadingTag() }\n </Host>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -2,35 +2,15 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
|
|
|
2
2
|
|
|
3
3
|
const curaHeadingCss = ":host{display:block;font-size:var(--font-size)}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:1.71em;font-weight:var(--font-weight-regular);color:var(--color-body);line-height:130%;letter-spacing:0%;-webkit-margin-before:var(--block-margin);margin-block-start:var(--block-margin);-webkit-margin-after:var(--block-margin);margin-block-end:var(--block-margin)}:host h1.bold-weight,:host h2.bold-weight,:host h3.bold-weight,:host h4.bold-weight,:host h5.bold-weight,:host h6.bold-weight{font-weight:var(--font-weight-medium)}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:2.07em;letter-spacing:-2%}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:1.214em;line-height:150%;letter-spacing:0%}:host h1.small.bold-weight,:host h2.small.bold-weight,:host h3.small.bold-weight,:host h4.small.bold-weight,:host h5.small.bold-weight,:host h6.small.bold-weight{font-weight:var(--font-weight-bold)}@media (min-width: 768px) and (max-width: 1365px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:2em}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:2.357em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:1.357em}}@media (min-width: 1366px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:2.5em;line-height:135%;letter-spacing:-2%}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:2.92em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:1.71em;line-height:160%;letter-spacing:0%}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-decoration:none;text-underline-offset:10%;cursor:pointer}:host ::slotted(abbr){color:var(--color-link);-webkit-text-decoration:underline dashed 1px var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";
|
|
4
4
|
|
|
5
|
-
const CuraHeading$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
5
|
+
const CuraHeading$1 = /*@__PURE__*/ proxyCustomElement(class CuraHeading extends HTMLElement {
|
|
6
6
|
constructor() {
|
|
7
7
|
super();
|
|
8
8
|
this.__registerHost();
|
|
9
9
|
this.__attachShadow();
|
|
10
|
-
/**
|
|
11
|
-
* Heading level for semantics.
|
|
12
|
-
* Values: 1(default)-6.
|
|
13
|
-
*/
|
|
14
10
|
this.level = 1;
|
|
15
|
-
/**
|
|
16
|
-
* Heading style size.
|
|
17
|
-
* Values: small | regular(default) | large.
|
|
18
|
-
*/
|
|
19
11
|
this.size = 'regular';
|
|
20
|
-
/**
|
|
21
|
-
* Heading font weight.
|
|
22
|
-
* Values: regular(default) | bold.
|
|
23
|
-
*/
|
|
24
12
|
this.weight = 'regular';
|
|
25
|
-
/**
|
|
26
|
-
* Apply light color to text in dark background.
|
|
27
|
-
* Values: boolean.
|
|
28
|
-
*/
|
|
29
13
|
this.inverted = false;
|
|
30
|
-
/**
|
|
31
|
-
* Apply base system color to elements like <a> and <abbr>.
|
|
32
|
-
* Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.
|
|
33
|
-
*/
|
|
34
14
|
this.spotColor = 'primary';
|
|
35
15
|
}
|
|
36
16
|
connectedCallback() {
|
|
@@ -110,3 +90,5 @@ const CuraHeading = CuraHeading$1;
|
|
|
110
90
|
const defineCustomElement = defineCustomElement$1;
|
|
111
91
|
|
|
112
92
|
export { CuraHeading, defineCustomElement };
|
|
93
|
+
|
|
94
|
+
//# sourceMappingURL=cura-heading.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"cura-heading.js","mappings":"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","names":["CuraHeading"],"sources":["./src/components/text/cura-heading/cura-heading.scss?tag=cura-heading&encapsulation=shadow","./src/components/text/cura-heading/cura-heading.tsx"],"sourcesContent":["@import '../../../scss/mixins/responsive.scss';\n\n:host {\n display: block;\n font-size: var(--font-size);\n\n h1, h2, h3, h4, h5, h6 {\n font-family: var(--font-family);\n font-size: 1.71em;\n font-weight: var(--font-weight-regular);\n color: var(--color-body);\n line-height: 130%;\n letter-spacing: 0%;\n margin-block-start: var(--block-margin);\n margin-block-end: var(--block-margin);\n\n &.bold-weight {\n font-weight: var(--font-weight-medium);\n }\n\n &.large {\n font-size: 2.07em;\n letter-spacing: -2%;\n }\n\n &.small {\n font-size: 1.214em;\n line-height: 150%;\n letter-spacing: 0%;\n\n &.bold-weight {\n font-weight: var(--font-weight-bold);\n }\n }\n\n }\n\n @include medium-only() {\n h1, h2, h3, h4, h5, h6 { \n font-size: 2em;\n\n &.large {\n font-size: 2.357em;\n }\n\n &.small {\n font-size: 1.357em;\n }\n\n }\n }\n\n @include large-up() {\n h1, h2, h3, h4, h5, h6 { \n font-size: 2.5em;\n line-height: 135%;\n letter-spacing: -2%;\n\n &.large {\n font-size: 2.92em;\n }\n\n &.small {\n font-size: 1.71em;\n line-height: 160%;\n letter-spacing: 0%;\n }\n }\n }\n\n ::slotted(b), ::slotted(strong) {\n font-weight: var(--font-weight-bold);\n }\n\n ::slotted(a) {\n font-weight: var(--font-weight-bold);\n color: var(--color-link);\n text-decoration: none;\n text-underline-offset: 10%;\n cursor: pointer;\n }\n\n ::slotted(abbr) {\n color: var(--color-link);\n text-decoration: underline dashed 1px var(--color-link);\n text-underline-offset: 10%;\n cursor: default;\n }\n\n}\n","import { Component, Host, h, Prop, Element } from '@stencil/core';\n\n@Component({\n tag: 'cura-heading',\n styleUrl: 'cura-heading.scss',\n shadow: true,\n})\nexport class CuraHeading {\n\n /**\n * Heading level for semantics.\n * Values: 1(default)-6.\n */\n @Prop({reflect: true}) level = 1;\n /**\n * Heading style size.\n * Values: small | regular(default) | large.\n */\n @Prop({reflect: true}) size = 'regular';\n /**\n * Heading font weight.\n * Values: regular(default) | bold.\n */\n @Prop({reflect: true}) weight = 'regular';\n /**\n * Apply light color to text in dark background.\n * Values: boolean.\n */\n @Prop({reflect: true}) inverted = false;\n /**\n * Apply base system color to elements like <a> and <abbr>.\n * Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.\n */\n @Prop({reflect: true}) spotColor = 'primary';\n\n /**\n * Host element <cura-heading>\n */\n @Element() host: HTMLElement;\n\n /**\n * Internal Props\n */\n weights: any;\n styles: any;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.setFontProperties();\n this.setColors();\n }\n\n getClasses() {\n const classes = {};\n classes[this.size.toLowerCase()] = true;\n classes[`${this.weight.toLowerCase()}-weight`] = true;\n return classes;\n }\n\n setFontProperties() {\n this.styles = {\n '--font-family': window.CuraAPI.theme.fonts.getFamily('heading'),\n '--font-size': window.CuraAPI.theme.fonts.getSize(),\n '--font-weight-regular': this.weights.regular,\n '--font-weight-medium': this.weights.medium,\n '--font-weight-bold': this.weights.bold,\n '--font-weight-black': this.weights.black\n }\n this.setHostProperty('--font-size', window.CuraAPI.theme.fonts.getSize());\n this.setHostProperty('--block-margin', '0.5em');\n }\n\n setColors() {\n const fontColor = this.inverted \n ? window.CuraAPI.theme.colors.getColor('neutral-100') \n : window.CuraAPI.theme.fonts.getColor();\n this.styles['--color-body'] = fontColor || window.CuraAPI.theme.colors.getColor('neutral-darker');\n this.styles['--color-link'] = this.inverted \n ? window.CuraAPI.theme.colors.getColor(`${this.spotColor}-100`)\n : window.CuraAPI.theme.colors.getColor(`${this.spotColor}-700`);\n }\n\n setHostProperty(prop: string, value: string) {\n this.host.style.setProperty(prop, value);\n }\n\n getHeadingTag() {\n const tags = {\n '1': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>,\n '2': <h2 style={this.styles} class={this.getClasses()}><slot></slot></h2>,\n '3': <h3 style={this.styles} class={this.getClasses()}><slot></slot></h3>,\n '4': <h4 style={this.styles} class={this.getClasses()}><slot></slot></h4>,\n '5': <h5 style={this.styles} class={this.getClasses()}><slot></slot></h5>,\n '6': <h6 style={this.styles} class={this.getClasses()}><slot></slot></h6>,\n 'default': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>\n };\n return tags[`${this.level}`] || tags['default'];\n }\n\n render() {\n return (\n <Host>\n { this.getHeadingTag() }\n </Host>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"cura-icon.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|
|
@@ -2,15 +2,11 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
|
|
|
2
2
|
|
|
3
3
|
const curaIconCss = ":host{width:var(--size);height:var(--size)}:host svg{display:inline-block;stroke:var(--color);width:var(--size);height:var(--size);stroke-width:var(--stroke);fill:none}";
|
|
4
4
|
|
|
5
|
-
const CuraIcon = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
5
|
+
const CuraIcon = /*@__PURE__*/ proxyCustomElement(class CuraIcon extends HTMLElement {
|
|
6
6
|
constructor() {
|
|
7
7
|
super();
|
|
8
8
|
this.__registerHost();
|
|
9
9
|
this.__attachShadow();
|
|
10
|
-
this.name = '';
|
|
11
|
-
this.color = 'neutral-base';
|
|
12
|
-
this.iconset = 'default';
|
|
13
|
-
this.disabled = false;
|
|
14
10
|
this.sizes = {
|
|
15
11
|
"128": { size: 128, stroke: 5.25 },
|
|
16
12
|
"72": { size: 72, stroke: 3.5 },
|
|
@@ -23,6 +19,11 @@ const CuraIcon = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
|
23
19
|
"16": { size: 16, stroke: 1.5 },
|
|
24
20
|
"default": { size: 24, stroke: 2 }
|
|
25
21
|
};
|
|
22
|
+
this.name = '';
|
|
23
|
+
this.color = 'neutral-base';
|
|
24
|
+
this.size = undefined;
|
|
25
|
+
this.iconset = 'default';
|
|
26
|
+
this.disabled = false;
|
|
26
27
|
}
|
|
27
28
|
sizeHandler(size) {
|
|
28
29
|
const scaledStroke = (iconSize) => {
|
|
@@ -74,3 +75,5 @@ function defineCustomElement() {
|
|
|
74
75
|
}
|
|
75
76
|
|
|
76
77
|
export { CuraIcon as C, defineCustomElement as d };
|
|
78
|
+
|
|
79
|
+
//# sourceMappingURL=cura-icon2.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"cura-icon2.js","mappings":";;AAAA,MAAM,WAAW,GAAG,0KAA0K;;MCOjL,QAAQ;;;;;IAUnB,UAAK,GAAG;MACN,KAAK,EAAE,EAAC,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAC;MAChC,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,EAAC;MAC7B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;MAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;MAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,EAAC;MAC7B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;MAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAC;MAC3B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;MAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,EAAC;MAC7B,SAAS,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAC;KACjC,CAAC;gBAnB4B,EAAE;iBAChB,cAAc;;mBAEG,SAAS;oBACvB,KAAK;;EAkBxB,WAAW,CAAC,IAAqB;IAC/B,MAAM,YAAY,GAAG,CAAC,QAAyB;MAC7C,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,MAAM,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;KACnG,CAAA;IACD,IAAI,CAAC,eAAe,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,EAAE,CAAC,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,IAAI,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,CAAC;IACtH,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,EAAE,CAAC,GAAG,YAAY,CAAC,IAAI,CAAC,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC,CAAC;GACxG;EAID,YAAY;IACV,IAAI,CAAC,eAAe,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,GAAG,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;GACrH;EAID,iBAAiB;IACf,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,eAAe,CAAC;IACjD,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5B,IAAI,CAAC,YAAY,EAAE,CAAC;GACrB;EAED,eAAe,CAAC,IAAY,EAAE,KAAa;IACzC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GAC1C;EAED,MAAM;IACJ,QACE,EAAC,IAAI,QACH,WACE,OAAO,EAAC,KAAK,EACb,OAAO,EAAC,WAAW,EACnB,mBAAmB,EAAC,eAAe,EACnC,KAAK,EAAC,4BAA4B,IAClC,WACE,SAAS,EAAE,GAAG,IAAI,CAAC,UAAU,kBAAkB,IAAI,CAAC,OAAO,QAAQ,IAAI,CAAC,IAAI,EAAE,GAC1E,CACF,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/cura-icon/cura-icon.scss?tag=cura-icon&encapsulation=shadow","./src/components/cura-icon/cura-icon.tsx"],"sourcesContent":[":host {\n width: var(--size);\n height: var(--size);\n svg {\n display: inline-block;\n stroke: var(--color);\n width: var(--size);\n height: var(--size);\n stroke-width: var(--stroke);\n fill: none;\n }\n}\n","import { Component, Host, h, Prop, Element, Watch } from '@stencil/core';\n\n@Component({\n tag: 'cura-icon',\n styleUrl: 'cura-icon.scss',\n shadow: true\n})\nexport class CuraIcon {\n\n @Prop({reflect: true}) name = '';\n @Prop() color = 'neutral-base';\n @Prop() size: string | number;\n @Prop({reflect: true}) iconset = 'default';\n @Prop() disabled = false;\n\n @Element() host: HTMLElement;\n\n sizes = {\n \"128\": {size: 128, stroke: 5.25},\n \"72\": {size: 72, stroke: 3.5},\n \"64\": {size: 64, stroke: 3.25},\n \"48\": {size: 48, stroke: 2.75},\n \"40\": {size: 40, stroke: 2.5},\n \"32\": {size: 32, stroke: 2.25},\n \"24\": {size: 24, stroke: 2},\n \"20\": {size: 20, stroke: 1.75},\n \"16\": {size: 16, stroke: 1.5},\n \"default\": {size: 24, stroke: 2}\n };\n\n @Watch('size')\n sizeHandler(size: string | number) {\n const scaledStroke = (iconSize: string | number) => {\n return `${this.sizes[iconSize].stroke * (this.sizes.default.size / this.sizes[iconSize].size)}px`;\n }\n this.setHostProperty('--size', this.sizes[`${size}`] ? `${this.sizes[size].size}px` : `${this.sizes.default.size}px`);\n this.setHostProperty('--stroke', this.sizes[`${size}`] ? scaledStroke(size) : scaledStroke(\"default\"));\n }\n\n @Watch('color')\n @Watch('disabled')\n colorHandler() {\n this.setHostProperty('--color', window.CuraAPI.theme.colors.getColor(this.disabled ? 'neutral-light' : this.color));\n }\n\n assetsPath: string;\n\n connectedCallback() {\n this.assetsPath = window.CuraAPI.localAssetsPath;\n this.sizeHandler(this.size);\n this.colorHandler();\n }\n\n setHostProperty(prop: string, value: string) {\n this.host.style.setProperty(prop, value);\n }\n\n render() {\n return (\n <Host>\n <svg\n version=\"1.1\"\n viewBox=\"0 0 24 24\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <use\n xlinkHref={`${this.assetsPath}/icons/iconset-${this.iconset}.svg#${this.name}`}>\n </use>\n </svg>\n </Host>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -5,17 +5,17 @@ const iconsetdefaulticons = ["360", "accessibility", "alertCircle", "alertTriang
|
|
|
5
5
|
|
|
6
6
|
const curaIconsViewCss = ":host{display:block;padding:24px;font-family:\"Roboto\", Arial, Helvetica, sans-serif}.iconDetail{display:block}.iconSizes{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.iconSizes .size{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;text-align:center;margin-right:9px;padding:8px}.iconSizes .size:last-child{margin-right:0}.iconSizes .size span{font-size:10px}.iconSizes.invert{margin-top:12px}.iconSizes.invert .size{background-color:#262626;color:#F6F6F6;border-radius:3px}.icons{margin-top:28px;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;position:relative}.icons .icon{position:relative;padding:4px;cursor:pointer;opacity:0.6;-webkit-transition:opacity 0.2s linear;transition:opacity 0.2s linear}.icons .icon span{font-size:12px;padding:6px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#000;color:#FFF;border-radius:2px;position:absolute;top:-2px;left:50%;-webkit-transform:translateX(-50%) translateY(-100%);transform:translateX(-50%) translateY(-100%);display:none}.icons .icon:hover{opacity:1}.icons .icon:hover span{display:block}";
|
|
7
7
|
|
|
8
|
-
const CuraIconsView$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
8
|
+
const CuraIconsView$1 = /*@__PURE__*/ proxyCustomElement(class CuraIconsView extends HTMLElement {
|
|
9
9
|
constructor() {
|
|
10
10
|
super();
|
|
11
11
|
this.__registerHost();
|
|
12
12
|
this.__attachShadow();
|
|
13
13
|
this.sizes = [16, 20, 24, 32, 40, 48, 64, 72, 128];
|
|
14
14
|
this.colors = ['primary', 'secondary', 'accent', 'info', 'warning', 'error', 'success', 'neutral'];
|
|
15
|
-
this.selected = '360';
|
|
16
15
|
this.setSelected = (icon) => {
|
|
17
16
|
this.selected = icon;
|
|
18
17
|
};
|
|
18
|
+
this.selected = '360';
|
|
19
19
|
}
|
|
20
20
|
render() {
|
|
21
21
|
return (h(Host, null, h("div", { class: "iconDetail" }, h("h4", null, this.selected), h("div", { class: "iconSizes" }, this.sizes.map(size => h("div", { class: "size" }, h("cura-icon", { name: this.selected, size: size }), h("span", null, size)))), h("div", { class: "iconSizes invert" }, this.sizes.map(size => h("div", { class: "size" }, h("cura-icon", { name: this.selected, size: size, color: "neutral-white" }), h("span", null, size)))), h("div", { class: "iconSizes" }, this.colors.map(color => h("div", { class: "size" }, h("cura-icon", { name: this.selected, color: color }), h("span", null, color))), h("div", { class: "size" }, h("cura-icon", { name: this.selected, disabled: true }), h("span", null, "Disabled")))), h("div", { class: "icons" }, iconsetdefaulticons.map(icon => h("div", { class: "icon", onClick: () => this.setSelected(icon) }, h("cura-icon", { name: icon }), h("span", null, icon))))));
|
|
@@ -47,3 +47,5 @@ const CuraIconsView = CuraIconsView$1;
|
|
|
47
47
|
const defineCustomElement = defineCustomElement$1;
|
|
48
48
|
|
|
49
49
|
export { CuraIconsView, defineCustomElement };
|
|
50
|
+
|
|
51
|
+
//# sourceMappingURL=cura-icons-view.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"cura-icons-view.js","mappings":"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","names":["CuraIconsView"],"sources":["./src/assets/icons/iconset-default-list.ts","./src/components/cura-icons-view/cura-icons-view.scss?tag=cura-icons-view&encapsulation=shadow","./src/components/cura-icons-view/cura-icons-view.tsx"],"sourcesContent":["export default [\"360\",\"accessibility\",\"alertCircle\",\"alertTriangle\",\"arrowDown\",\"arrowDownCircle\",\"arrowLeft\",\"arrowLeftCircle\",\"arrowRight\",\"arrowRightCircle\",\"arrowUp\",\"arrowUpCircle\",\"attach\",\"avatarF\",\"avatarM\",\"biometry\",\"bloodGroup\",\"calendar\",\"cam\",\"camOff\",\"central\",\"chatCircle\",\"check\",\"checkBadge\",\"checkCircle\",\"checkDouble\",\"clock\",\"close\",\"closeCircle\",\"collapse\",\"config\",\"delete\",\"desktop\",\"deslike\",\"download\",\"duplicate\",\"edit\",\"exam\",\"expand\",\"facebook\",\"fileBmp\",\"fileJpg\",\"filePdf\",\"filePng\",\"fileUpload\",\"fileXls\",\"filter\",\"fullscreen\",\"gallery\",\"geotag\",\"google\",\"hate\",\"healthPlan\",\"height\",\"height2\",\"home\",\"horizontalList\",\"imageUp\",\"info2\",\"infoCircle\",\"instagram\",\"key\",\"language\",\"language2\",\"languageEN\",\"languagePT\",\"lattes\",\"like\",\"likeHand\",\"link\",\"linkExternal\",\"linkedin\",\"list\",\"login\",\"logout\",\"love\",\"mail\",\"mail2\",\"medical\",\"menuHamburguer\",\"menuKebab\",\"menuMeatballs\",\"mic\",\"micOff\",\"minus\",\"minusCircle\",\"minusSquare\",\"mobile\",\"neutral\",\"news\",\"notification\",\"order\",\"partner\",\"phone\",\"play\",\"plus\",\"plusCircle\",\"plusSquare\",\"print\",\"profile\",\"profile2\",\"pulldownG\",\"pulldownP\",\"pullupG\",\"pullupP\",\"questionCircle\",\"questionSquare\",\"range\",\"reload\",\"schedule\",\"search\",\"secure\",\"share\",\"share2\",\"sound\",\"soundOff\",\"subItem\",\"target\",\"team\",\"twitter\",\"unLink\",\"unSecure\",\"unlikeHand\",\"upload\",\"verticalList\",\"viewFalse\",\"viewTrue\",\"weight\",\"whatsapp\",\"wifi\",\"youtube\",\"zoomIn\",\"zoomOut\"];",":host {\n display: block;\n padding: 24px;\n font-family: 'Roboto', Arial, Helvetica, sans-serif;\n}\n\n.iconDetail {\n display: block;\n}\n\n.iconSizes {\n display: flex;\n align-items: center;\n\n\n .size {\n display: flex;\n flex-direction: column;\n text-align: center;\n margin-right: 9px;\n padding: 8px;\n\n &:last-child { margin-right: 0; }\n span {\n font-size: 10px;\n }\n }\n\n &.invert {\n margin-top: 12px;\n\n .size {\n background-color: #262626;\n color: #F6F6F6;\n border-radius: 3px;\n }\n }\n}\n\n.icons {\n margin-top: 28px;\n display: flex;\n flex-wrap: wrap;\n position: relative;\n\n .icon {\n position: relative;\n padding: 4px;\n cursor: pointer;\n opacity: .6;\n transition: opacity .2s linear;\n span {\n font-size: 12px;\n padding: 6px;\n box-sizing: border-box;\n background: #000;\n color: #FFF;\n border-radius: 2px;\n position: absolute;\n top: -2px;\n left: 50%;\n transform: translateX(-50%) translateY(-100%);\n display: none;\n }\n\n &:hover {\n opacity: 1;\n\n span { display: block; }\n }\n }\n}\n\n","import { Component, Host, h, State } from '@stencil/core';\nimport iconsetdefaulticons from '../../assets/icons/iconset-default-list';\n\n@Component({\n tag: 'cura-icons-view',\n styleUrl: 'cura-icons-view.scss',\n shadow: true,\n})\nexport class CuraIconsView {\n\n sizes = [16, 20, 24, 32, 40, 48, 64, 72, 128];\n colors = ['primary', 'secondary', 'accent', 'info', 'warning', 'error', 'success', 'neutral'];\n @State() selected = '360';\n\n setSelected = (icon) => {\n this.selected = icon;\n }\n\n render() {\n return (\n <Host>\n <div class=\"iconDetail\">\n <h4>{ this.selected }</h4>\n <div class=\"iconSizes\">\n { this.sizes.map( size =>\n\n <div class=\"size\">\n <cura-icon name={this.selected} size={size}></cura-icon>\n <span>{ size }</span>\n </div>\n )}\n </div>\n <div class=\"iconSizes invert\">\n { this.sizes.map( size =>\n\n <div class=\"size\">\n <cura-icon name={this.selected} size={size} color=\"neutral-white\"></cura-icon>\n <span>{ size }</span>\n </div>\n )}\n </div>\n <div class=\"iconSizes\">\n { this.colors.map( color =>\n <div class=\"size\">\n <cura-icon name={this.selected} color={color}></cura-icon>\n <span>{ color }</span>\n </div>\n )}\n <div class=\"size\">\n <cura-icon name={this.selected} disabled></cura-icon>\n <span>Disabled</span>\n </div>\n </div>\n </div>\n <div class=\"icons\">\n { iconsetdefaulticons.map(icon =>\n <div class=\"icon\" onClick={() => this.setSelected(icon)}>\n <cura-icon name={icon}></cura-icon>\n <span>{icon}</span>\n </div>\n )}\n </div>\n </Host>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
|
|
3
|
-
const curaPageTemplateCss = ":host{display:block}:host .grid-template{display:grid;grid-template-rows:auto;grid-template-columns:auto;grid-template-areas:\"sub-header\" \"header\" \"pre-content\" \"content-container\" \"post-body\" \"footer\" \"sub-footer\"}:host .grid-template #sub-header{grid-area:sub-header}:host .grid-template #header{grid-area:header}:host .grid-template #pre-content{grid-area:pre-content}:host .grid-template #content-container{grid-area:content-container}:host .grid-template #post-body{grid-area:post-body}:host .grid-template #footer{grid-area:footer}:host .grid-template #sub-footer{grid-area:sub-footer}@media (max-width: 360px){:host .grid-template{padding:0px}
|
|
3
|
+
const curaPageTemplateCss = ":host{display:block}:host .grid-template{display:grid;grid-template-rows:auto;grid-template-columns:auto;grid-template-areas:\"sub-header\" \"header\" \"pre-content\" \"content-container\" \"post-body\" \"footer\" \"sub-footer\"}:host .grid-template #sub-header{grid-area:sub-header}:host .grid-template #header{grid-area:header}:host .grid-template #pre-content{grid-area:pre-content}:host .grid-template #content-container{grid-area:content-container}:host .grid-template #post-body{grid-area:post-body}:host .grid-template #footer{grid-area:footer}:host .grid-template #sub-footer{grid-area:sub-footer}@media (max-width: 360px){:host .grid-template{padding:0px}}@media (min-width: 768px) and (max-width: 1365px){:host .grid-template{padding:0px}}@media (min-width: 1366px) and (max-width: 1919px){:host .grid-template{padding:0px}:host .grid-template #content-container #sidebar-left ::slotted(div[slot=sidebar-left]){margin-right:calc(var(--spacing) * 5px)}:host .grid-template #content-container #sidebar-right ::slotted(div[slot=sidebar-right]){margin-left:calc(var(--spacing) * 5px)}:host .grid-template #content-container{display:-ms-flexbox;display:flex}:host .grid-template #content-container #content{-ms-flex-positive:1;flex-grow:1}:host .grid-template #content-container #sidebar-left,:host .grid-template #content-container #sidebar-right{max-width:20%}}@media (min-width: 1920px){:host .grid-template{padding:0px}:host .grid-template #content-container #sidebar-left ::slotted(div[slot=sidebar-left]){margin-right:calc(var(--spacing) * 7px)}:host .grid-template #content-container #sidebar-right ::slotted(div[slot=sidebar-right]){margin-left:calc(var(--spacing) * 7px)}:host .grid-template #content-container{display:-ms-flexbox;display:flex}:host .grid-template #content-container #content{-ms-flex-positive:1;flex-grow:1}:host .grid-template #content-container #sidebar-left,:host .grid-template #content-container #sidebar-right{max-width:20%}:host .grid-template #content-container.centered{max-width:1920px;justify-self:center}}";
|
|
4
4
|
|
|
5
|
-
const CuraPageTemplate$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
5
|
+
const CuraPageTemplate$1 = /*@__PURE__*/ proxyCustomElement(class CuraPageTemplate extends HTMLElement {
|
|
6
6
|
constructor() {
|
|
7
7
|
super();
|
|
8
8
|
this.__registerHost();
|
|
@@ -45,3 +45,5 @@ const CuraPageTemplate = CuraPageTemplate$1;
|
|
|
45
45
|
const defineCustomElement = defineCustomElement$1;
|
|
46
46
|
|
|
47
47
|
export { CuraPageTemplate, defineCustomElement };
|
|
48
|
+
|
|
49
|
+
//# sourceMappingURL=cura-page-template.js.map
|