@jumpgroup/jump-design-system 0.0.1 → 0.1.1
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-button.cjs.entry.js +1 -1
- package/dist/cjs/app-button.cjs.entry.js.map +1 -1
- package/dist/cjs/app-icon.cjs.entry.js +1 -1
- package/dist/cjs/app-icon.cjs.entry.js.map +1 -1
- package/dist/cjs/{index-95f2f619.js → index-168ed626.js} +21 -11
- package/dist/cjs/index-168ed626.js.map +1 -0
- package/dist/cjs/jump-design-system.cjs.js +2 -5
- package/dist/cjs/jump-design-system.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -10
- package/dist/cjs/loader.cjs.js.map +1 -1
- package/dist/collection/collection-manifest.json +4 -4
- package/dist/collection/components/app-button/app-button.js +1 -1
- package/dist/collection/components/app-button/app-button.stories.js +1 -1
- package/dist/collection/components/app-button/test/app-button.e2e.js +10 -0
- package/dist/collection/components/app-button/test/app-button.e2e.js.map +1 -0
- package/dist/collection/components/app-button/test/app-button.spec.js +18 -0
- package/dist/collection/components/app-button/test/app-button.spec.js.map +1 -0
- package/dist/collection/components/app-icon/app-icon.js +2 -2
- package/dist/collection/components/app-icon/app-icon.stories.js +1 -1
- package/dist/collection/components/app-icon/test/app-icon.e2e.js +10 -0
- package/dist/collection/components/app-icon/test/app-icon.e2e.js.map +1 -0
- package/dist/collection/components/app-icon/test/app-icon.spec.js +18 -0
- package/dist/collection/components/app-icon/test/app-icon.spec.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/app-button.js.map +1 -1
- package/dist/components/app-icon.js.map +1 -1
- package/dist/esm/app-button.entry.js +1 -1
- package/dist/esm/app-button.entry.js.map +1 -1
- package/dist/esm/app-icon.entry.js +1 -1
- package/dist/esm/app-icon.entry.js.map +1 -1
- package/dist/esm/{index-4c9cac2b.js → index-330d1de1.js} +21 -11
- package/dist/esm/index-330d1de1.js.map +1 -0
- package/dist/esm/jump-design-system.js +3 -6
- package/dist/esm/jump-design-system.js.map +1 -1
- package/dist/esm/loader.js +2 -11
- package/dist/esm/loader.js.map +1 -1
- package/dist/jump-design-system/jump-design-system.esm.js +1 -1
- package/dist/jump-design-system/jump-design-system.esm.js.map +1 -1
- package/dist/jump-design-system/p-28b9ffd5.js +3 -0
- package/dist/jump-design-system/p-28b9ffd5.js.map +1 -0
- package/dist/jump-design-system/{p-08fde855.entry.js → p-90bb231d.entry.js} +2 -2
- package/dist/jump-design-system/p-90bb231d.entry.js.map +1 -0
- package/dist/jump-design-system/{p-771ebb2a.entry.js → p-e8515cce.entry.js} +2 -2
- package/dist/jump-design-system/p-e8515cce.entry.js.map +1 -0
- package/dist/jump-design-system-elements.json +70 -0
- package/dist/types/stencil-public-runtime.d.ts +2 -0
- package/package.json +21 -17
- package/dist/cjs/index-95f2f619.js.map +0 -1
- package/dist/esm/index-4c9cac2b.js.map +0 -1
- package/dist/esm/polyfills/css-shim.js +0 -1
- package/dist/jump-design-system/p-08fde855.entry.js.map +0 -1
- package/dist/jump-design-system/p-771ebb2a.entry.js.map +0 -1
- package/dist/jump-design-system/p-fce83307.js +0 -3
- package/dist/jump-design-system/p-fce83307.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"jump-design-system.cjs.js","mappings":";;;;;;AAAA;AACA;AACA;
|
|
1
|
+
{"file":"jump-design-system.cjs.js","mappings":";;;;;;AAAA;AACA;AACA;AAGA,MAAM,YAAY,GAAG,MAAM;AAyB3B,IAAI,MAAM,UAAU,GAAG,oNAAe,CAAC;AACvC,IAAI,MAAM,IAAI,GAAiE,EAAE,CAAC;AAClF,IAAI,IAAI,UAAU,KAAK,EAAE,EAAE;AAC3B,QAAQ,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI,CAAC;AAC1D,KAAK;AACL,IAAI,OAAOA,oBAAc,CAAC,IAAI,CAAC,CAAC;AAChC,CAAC;;AChCD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,IAAI;AAE/B,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC;;;;","names":["promiseResolve","bootstrapLazy"],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.0.1 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, doc, promiseResolve, H } from '@stencil/core';\nconst patchBrowser = () => {\n // NOTE!! This fn cannot use async/await!\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo('Running in development mode.');\n }\n if (BUILD.cloneNodeFix) {\n // opted-in to polyfill cloneNode() for slot polyfilled components\n patchCloneNodeFix(H.prototype);\n }\n if (BUILD.profile && !performance.mark) {\n // not all browsers support performance.mark/measure (Safari 10)\n // because the mark/measure APIs are designed to write entries to a buffer in the browser that does not exist,\n // simply stub the implementations out.\n // TODO(STENCIL-323): Remove this patch when support for older browsers is removed (breaking)\n // @ts-ignore\n performance.mark = performance.measure = () => {\n /*noop*/\n };\n performance.getEntriesByName = () => [];\n }\n // @ts-ignore\n const scriptElm = BUILD.scriptDataOpts\n ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n 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};\nconst 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 // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport { patchBrowser };\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(options => {\n globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"version":3}
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -2,20 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
6
|
-
|
|
7
|
-
/*
|
|
8
|
-
Stencil Client Patch Esm v3.2.2 | MIT Licensed | https://stenciljs.com
|
|
9
|
-
*/
|
|
10
|
-
const patchEsm = () => {
|
|
11
|
-
return index.promiseResolve();
|
|
12
|
-
};
|
|
5
|
+
const index = require('./index-168ed626.js');
|
|
13
6
|
|
|
14
7
|
const defineCustomElements = (win, options) => {
|
|
15
8
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
16
|
-
return patchEsm().then(() => {
|
|
17
9
|
return index.bootstrapLazy([["app-button.cjs",[[4,"app-button",{"disabled":[4],"variant":[513],"outline":[516],"size":[513],"pill":[516],"text":[516],"onlyIcon":[516,"only-icon"]}]]],["app-icon.cjs",[[0,"app-icon",{"name":[1],"class":[1]}]]]], options);
|
|
18
|
-
});
|
|
19
10
|
};
|
|
20
11
|
|
|
21
12
|
exports.setNonce = index.setNonce;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"loader.cjs.js","mappings":";;;;;;
|
|
1
|
+
{"file":"loader.cjs.js","mappings":";;;;;;AAGY,MAAC,oBAAoB,GAAG,CAAC,GAAG,EAAE,OAAO,KAAK;AACtD,EAAE,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,OAAO,OAAO,CAAC,OAAO,EAAE,CAAC;AAE9D,EAAE,OAAOA,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D;;;;;","names":["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 = (win, options) => {\n if (typeof window === 'undefined') return Promise.resolve();\n globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n};\n"],"version":3}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"entries": [
|
|
3
|
-
"
|
|
4
|
-
"
|
|
3
|
+
"components/app-button/app-button.js",
|
|
4
|
+
"components/app-icon/app-icon.js"
|
|
5
5
|
],
|
|
6
6
|
"compiler": {
|
|
7
7
|
"name": "@stencil/core",
|
|
8
|
-
"version": "
|
|
9
|
-
"typescriptVersion": "
|
|
8
|
+
"version": "4.0.1",
|
|
9
|
+
"typescriptVersion": "5.0.4"
|
|
10
10
|
},
|
|
11
11
|
"collections": [],
|
|
12
12
|
"bundles": []
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { newE2EPage } from "@stencil/core/testing";
|
|
2
|
+
describe('app-button', () => {
|
|
3
|
+
it('renders', async () => {
|
|
4
|
+
const page = await newE2EPage();
|
|
5
|
+
await page.setContent('<app-button></app-button>');
|
|
6
|
+
const element = await page.find('app-button');
|
|
7
|
+
expect(element).toHaveClass('hydrated');
|
|
8
|
+
});
|
|
9
|
+
});
|
|
10
|
+
//# sourceMappingURL=app-button.e2e.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"app-button.e2e.js","sourceRoot":"","sources":["../../../../src/components/app-button/test/app-button.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;EAC1B,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC,2BAA2B,CAAC,CAAC;IAEnD,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IAC9C,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;EAC1C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newE2EPage } from '@stencil/core/testing';\n\ndescribe('app-button', () => {\n it('renders', async () => {\n const page = await newE2EPage();\n await page.setContent('<app-button></app-button>');\n\n const element = await page.find('app-button');\n expect(element).toHaveClass('hydrated');\n });\n});\n"]}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
2
|
+
import { AppButton } from "../app-button";
|
|
3
|
+
describe('app-button', () => {
|
|
4
|
+
it('renders', async () => {
|
|
5
|
+
const page = await newSpecPage({
|
|
6
|
+
components: [AppButton],
|
|
7
|
+
html: `<app-button></app-button>`,
|
|
8
|
+
});
|
|
9
|
+
expect(page.root).toEqualHtml(`
|
|
10
|
+
<app-button>
|
|
11
|
+
<mock:shadow-root>
|
|
12
|
+
<slot></slot>
|
|
13
|
+
</mock:shadow-root>
|
|
14
|
+
</app-button>
|
|
15
|
+
`);
|
|
16
|
+
});
|
|
17
|
+
});
|
|
18
|
+
//# sourceMappingURL=app-button.spec.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"app-button.spec.js","sourceRoot":"","sources":["../../../../src/components/app-button/test/app-button.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;EAC1B,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;MACvB,IAAI,EAAE,2BAA2B;KAClC,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAM7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { AppButton } from '../app-button';\n\ndescribe('app-button', () => {\n it('renders', async () => {\n const page = await newSpecPage({\n components: [AppButton],\n html: `<app-button></app-button>`,\n });\n expect(page.root).toEqualHtml(`\n <app-button>\n <mock:shadow-root>\n <slot></slot>\n </mock:shadow-root>\n </app-button>\n `);\n });\n});\n"]}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { newE2EPage } from "@stencil/core/testing";
|
|
2
|
+
describe('app-icon', () => {
|
|
3
|
+
it('renders', async () => {
|
|
4
|
+
const page = await newE2EPage();
|
|
5
|
+
await page.setContent('<app-icon></app-icon>');
|
|
6
|
+
const element = await page.find('app-icon');
|
|
7
|
+
expect(element).toHaveClass('hydrated');
|
|
8
|
+
});
|
|
9
|
+
});
|
|
10
|
+
//# sourceMappingURL=app-icon.e2e.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"app-icon.e2e.js","sourceRoot":"","sources":["../../../../src/components/app-icon/test/app-icon.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;EACxB,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC;IAE/C,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IAC5C,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;EAC1C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newE2EPage } from '@stencil/core/testing';\n\ndescribe('app-icon', () => {\n it('renders', async () => {\n const page = await newE2EPage();\n await page.setContent('<app-icon></app-icon>');\n\n const element = await page.find('app-icon');\n expect(element).toHaveClass('hydrated');\n });\n});\n"]}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
2
|
+
import { AppIcon } from "../app-icon";
|
|
3
|
+
describe('app-icon', () => {
|
|
4
|
+
it('renders', async () => {
|
|
5
|
+
const page = await newSpecPage({
|
|
6
|
+
components: [AppIcon],
|
|
7
|
+
html: `<app-icon></app-icon>`,
|
|
8
|
+
});
|
|
9
|
+
expect(page.root).toEqualHtml(`
|
|
10
|
+
<app-icon>
|
|
11
|
+
<mock:shadow-root>
|
|
12
|
+
<slot></slot>
|
|
13
|
+
</mock:shadow-root>
|
|
14
|
+
</app-icon>
|
|
15
|
+
`);
|
|
16
|
+
});
|
|
17
|
+
});
|
|
18
|
+
//# sourceMappingURL=app-icon.spec.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"app-icon.spec.js","sourceRoot":"","sources":["../../../../src/components/app-icon/test/app-icon.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEtC,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;EACxB,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;MACrB,IAAI,EAAE,uBAAuB;KAC9B,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAM7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { AppIcon } from '../app-icon';\n\ndescribe('app-icon', () => {\n it('renders', async () => {\n const page = await newSpecPage({\n components: [AppIcon],\n html: `<app-icon></app-icon>`,\n });\n expect(page.root).toEqualHtml(`\n <app-icon>\n <mock:shadow-root>\n <slot></slot>\n </mock:shadow-root>\n </app-icon>\n `);\n });\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"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"app-button.js","mappings":";;AAAA,MAAM,YAAY,GAAG,s8FAAs8F;;MCO98FA,WAAS;;;;oBAIQ,KAAK;mBAKkC,SAAS;mBAKlC,KAAK;gBAKT,QAAQ;gBAKP,KAAK;gBAKL,KAAK;oBAKD,KAAK;;EAEhD,MAAM;IACJ,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IAClB,QACE,EAAC,IAAI,QACH,8BAAsB,IAAI,CAAC,OAAO,kBAAgB,IAAI,CAAC,OAAO,eAAa,IAAI,CAAC,IAAI,eAAa,IAAI,CAAC,IAAI,eAAa,IAAI,CAAC,IAAI,oBAAkB,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,IACtL,YAAM,IAAI,EAAC,QAAQ,GAAQ,EAEzB,CAAC,IAAI,CAAC,QAAQ,IAAI,eAAa,EAEjC,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACpB,CACJ,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["AppButton"],"sources":["
|
|
1
|
+
{"file":"app-button.js","mappings":";;AAAA,MAAM,YAAY,GAAG,s8FAAs8F;;MCO98FA,WAAS;;;;oBAIQ,KAAK;mBAKkC,SAAS;mBAKlC,KAAK;gBAKT,QAAQ;gBAKP,KAAK;gBAKL,KAAK;oBAKD,KAAK;;EAEhD,MAAM;IACJ,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IAClB,QACE,EAAC,IAAI,QACH,8BAAsB,IAAI,CAAC,OAAO,kBAAgB,IAAI,CAAC,OAAO,eAAa,IAAI,CAAC,IAAI,eAAa,IAAI,CAAC,IAAI,eAAa,IAAI,CAAC,IAAI,oBAAkB,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,IACtL,YAAM,IAAI,EAAC,QAAQ,GAAQ,EAEzB,CAAC,IAAI,CAAC,QAAQ,IAAI,eAAa,EAEjC,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACpB,CACJ,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["AppButton"],"sources":["src/components/app-button/app-button.scss?tag=app-button","src/components/app-button/app-button.tsx"],"sourcesContent":["%reset-button {\n background-color: transparent;\n border: none;\n padding: 0;\n margin: 0;\n font: inherit;\n color: inherit;\n cursor: pointer;\n}\n\napp-button {\n display: inline-flex;\n align-items: center;\n --app-button-color: #ffffff;\n --app-button-color-disabled: #cbcbcb;\n --app-button-background: blue;\n --app-button-background-outline: transparent;\n --app-button-color-hover: #ffffff;\n --app-button-background-hover: darkblue;\n --app-button-border-radius: var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem);\n --app-button-padding: 1rem 1.25rem;\n\n button {\n @extend %reset-button;\n background-color: var(--app-button-background);\n border-radius: var(--app-button-border-radius);\n color: var(--app-button-color);\n position: relative;\n font-family: var(--ff-primary, 'Arial'), sans-serif;\n font-weight: var(--fw-400, 400);\n font-size: var(--fs-400, 1rem);\n line-height: var(--lh-400, 1.3);\n display: flex;\n align-items: center;\n gap: var(--app-button-gap, 0.5rem);\n\n //TODO: internal padding of the button\n padding: var(--app-button-padding);\n\n // TODO: gestire il focus con un outline\n &:hover {\n background-color: var(--app-button-background-hover);\n color: var(--app-button-color-hover);\n }\n\n &[data-variant='primary'] {\n --app-button-color: var(--neutral-white);\n --app-button-background: var(--primary-standard);\n --app-button-color-hover: var(--neutral-white);\n --app-button-background-hover: var(--primary-hard);\n }\n\n &[data-variant='secondary'] {\n --app-button-color: var(--neutral-white);\n --app-button-background: var(--secondary-standard);\n --app-button-color-hover: var(--neutral-white);\n --app-button-background-hover: var(--secondary-hard);\n }\n\n &[disabled] {\n --app-button-background: var(--app-button-color-disabled);\n --app-button-background-hover: var(--app-button-color-disabled);\n cursor: not-allowed;\n }\n\n &[data-pill] {\n border-radius: 100rem;\n }\n\n &[data-size='small'] {\n font-size: var(--fs-300, 0.875rem);\n line-height: var(--lh-300, 1.2);\n --app-button-padding: 0.5rem 1rem;\n }\n\n &[data-size='medium'] {\n font-size: var(--fs-400, 1rem);\n line-height: var(--lh-400, 1.3);\n }\n\n &[data-size='large'] {\n font-size: var(--fs-500, 1.125rem);\n line-height: var(--lh-500, 1.4);\n --app-button-padding: 1.125rem 1.5rem;\n }\n\n &[data-outline] {\n background-color: var(--app-button-background-outline);\n border: 1px solid var(--app-button-background);\n color: var(--app-button-background);\n &:hover {\n background-color: var(--app-button-background-hover);\n border: 1px solid var(--app-button-background-hover);\n color: var(--app-button-background-hover);\n }\n }\n\n &[data-text] {\n background-color: transparent;\n border: none;\n color: var(--app-button-background);\n padding: 0;\n &:hover {\n background-color: transparent;\n border: none;\n color: var(--app-button-background-hover);\n }\n }\n\n &[data-only-icon] {\n --app-button-padding: 1.125rem;\n }\n &[data-only-icon][data-size='small'] {\n --app-button-padding: 0.5rem;\n }\n &[data-only-icon][data-size='medium'] {\n --app-button-padding: 1rem;\n }\n &[data-only-icon][data-size='large'] {\n --app-button-padding: 1.125rem;\n }\n }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'app-button',\n styleUrl: 'app-button.scss',\n shadow: false,\n})\nexport class AppButton {\n /**\n * Set the button as disabled\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Indicates the variant of the button\n */\n @Prop({reflect: true}) variant: 'primary'|'secondary'|'tertiary' = 'primary';\n\n /**\n * Indicates the button as outline\n */\n @Prop({reflect: true}) outline: boolean = false;\n\n /**\n * Indicates the size of the button\n */\n @Prop({reflect: true}) size: string = 'medium';\n\n /**\n * Indicates the button as pill\n */\n @Prop({reflect: true}) pill: boolean = false;\n\n /**\n * Indicates the button as text\n */\n @Prop({reflect: true}) text: boolean = false;\n\n /**\n * Indicates the button as only icon\n **/\n @Prop({reflect: true}) onlyIcon: boolean = false;\n\n render() {\n console.log(this);\n return (\n <Host>\n <button data-variant={this.variant} data-outline={this.outline} data-size={this.size} data-pill={this.pill} data-text={this.text} data-only-icon={this.onlyIcon} disabled={this.disabled} >\n <slot name=\"prefix\"></slot>\n {\n !this.onlyIcon && <slot></slot>\n }\n <slot name=\"suffix\"></slot>\n </button>\n </Host>\n );\n }\n\n}\n"],"version":3}
|