@rededor/cura 1.6.1-alpha.4 → 1.6.1-alpha.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (133) hide show
  1. package/dist/cjs/{app-globals-5a7ddb39.js → app-globals-28c6f5c4.js} +2 -2
  2. package/dist/cjs/{app-globals-5a7ddb39.js.map → app-globals-28c6f5c4.js.map} +1 -1
  3. package/dist/cjs/cura-accordion_18.cjs.entry.js +3 -3
  4. package/dist/cjs/cura-accordion_18.cjs.entry.js.map +1 -1
  5. package/dist/cjs/cura-alert.cjs.entry.js +1 -1
  6. package/dist/cjs/cura-alert.cjs.entry.js.map +1 -1
  7. package/dist/cjs/cura-badge-pill.cjs.entry.js +1 -1
  8. package/dist/cjs/cura-badge-pill.cjs.entry.js.map +1 -1
  9. package/dist/cjs/cura-loader-bar.cjs.entry.js +1 -1
  10. package/dist/cjs/cura-loader-bar.cjs.entry.js.map +1 -1
  11. package/dist/cjs/cura-modal.cjs.entry.js +2 -2
  12. package/dist/cjs/cura-modal.cjs.entry.js.map +1 -1
  13. package/dist/cjs/{cura-theme-module-a100c643.js → cura-theme-module-f1e4a309.js} +2 -2
  14. package/dist/cjs/{cura-theme-module-a100c643.js.map → cura-theme-module-f1e4a309.js.map} +1 -1
  15. package/dist/cjs/cura-toast.cjs.entry.js +1 -1
  16. package/dist/cjs/cura-toast.cjs.entry.js.map +1 -1
  17. package/dist/cjs/cura.cjs.js +3 -3
  18. package/dist/cjs/index.cjs.js +2 -2
  19. package/dist/cjs/loader.cjs.js +3 -3
  20. package/dist/cjs/{static-4e83652c.js → static-44199808.js} +16 -2
  21. package/dist/cjs/static-44199808.js.map +1 -0
  22. package/dist/collection/api/theme-presets/static.js +15 -1
  23. package/dist/collection/api/theme-presets/static.js.map +1 -1
  24. package/dist/collection/components/accordion/cura-accordion/cura-accordion.stories.js +3 -2
  25. package/dist/collection/components/accordion/cura-accordion/cura-accordion.stories.js.map +1 -1
  26. package/dist/collection/components/badges/cura-badge-pill/cura-badge-pill.js +3 -3
  27. package/dist/collection/components/badges/cura-badge-pill/cura-badge-pill.js.map +1 -1
  28. package/dist/collection/components/badges/cura-badge-pill/cura-badge-pill.stories.js +2 -1
  29. package/dist/collection/components/badges/cura-badge-pill/cura-badge-pill.stories.js.map +1 -1
  30. package/dist/collection/components/buttons/cura-button/cura-button.stories.js +2 -1
  31. package/dist/collection/components/buttons/cura-button/cura-button.stories.js.map +1 -1
  32. package/dist/collection/components/buttons/cura-button-outline/cura-button-outline.stories.js +2 -1
  33. package/dist/collection/components/buttons/cura-button-outline/cura-button-outline.stories.js.map +1 -1
  34. package/dist/collection/components/buttons/cura-button-select/cura-button-select.stories.js +2 -1
  35. package/dist/collection/components/buttons/cura-button-select/cura-button-select.stories.js.map +1 -1
  36. package/dist/collection/components/buttons/cura-button-transparent/cura-button-transparent.stories.js +2 -1
  37. package/dist/collection/components/buttons/cura-button-transparent/cura-button-transparent.stories.js.map +1 -1
  38. package/dist/collection/components/cura-alert/cura-alert.js +1 -1
  39. package/dist/collection/components/cura-alert/cura-alert.js.map +1 -1
  40. package/dist/collection/components/cura-icon/cura-icon.js +1 -1
  41. package/dist/collection/components/cura-icon/cura-icon.js.map +1 -1
  42. package/dist/collection/components/cura-modal/cura-modal.css +2 -1
  43. package/dist/collection/components/cura-modal/cura-modal.js +1 -1
  44. package/dist/collection/components/cura-modal/cura-modal.js.map +1 -1
  45. package/dist/collection/components/cura-toast/cura-toast.css +1 -1
  46. package/dist/collection/components/forms/cura-input-text/cura-input-text.js +1 -1
  47. package/dist/collection/components/forms/cura-radio/cura-radio.stories.js +2 -1
  48. package/dist/collection/components/forms/cura-radio/cura-radio.stories.js.map +1 -1
  49. package/dist/collection/components/loaders/cura-loader-bar/cura-loader-bar.js +1 -1
  50. package/dist/collection/components/loaders/cura-loader-bar/cura-loader-bar.js.map +1 -1
  51. package/dist/collection/components/loaders/cura-loader-bar/cura-loader-bar.stories.js +1 -1
  52. package/dist/collection/components/loaders/cura-loader-bar/cura-loader-bar.stories.js.map +1 -1
  53. package/dist/collection/components/loaders/cura-loader-circle/cura-loader-circle.js +1 -1
  54. package/dist/collection/components/loaders/cura-loader-circle/cura-loader-circle.js.map +1 -1
  55. package/dist/collection/components/loaders/cura-loader-circle/cura-loader-circle.stories.js +1 -1
  56. package/dist/collection/components/loaders/cura-loader-circle/cura-loader-circle.stories.js.map +1 -1
  57. package/dist/collection/utils/utils.js +2 -2
  58. package/dist/collection/utils/utils.js.map +1 -1
  59. package/dist/components/cura-alert.js +1 -1
  60. package/dist/components/cura-alert.js.map +1 -1
  61. package/dist/components/cura-badge-pill2.js +1 -1
  62. package/dist/components/cura-badge-pill2.js.map +1 -1
  63. package/dist/components/cura-icon2.js +1 -1
  64. package/dist/components/cura-icon2.js.map +1 -1
  65. package/dist/components/cura-input-text2.js +15 -1
  66. package/dist/components/cura-input-text2.js.map +1 -1
  67. package/dist/components/cura-loader-bar2.js +1 -1
  68. package/dist/components/cura-loader-bar2.js.map +1 -1
  69. package/dist/components/cura-loader-circle2.js +1 -1
  70. package/dist/components/cura-loader-circle2.js.map +1 -1
  71. package/dist/components/cura-modal.js +2 -2
  72. package/dist/components/cura-modal.js.map +1 -1
  73. package/dist/components/cura-toast.js +1 -1
  74. package/dist/components/cura-toast.js.map +1 -1
  75. package/dist/components/index.js.map +1 -1
  76. package/dist/cura/cura.esm.js +1 -1
  77. package/dist/cura/index.esm.js +1 -1
  78. package/dist/cura/{p-3519d0ba.entry.js → p-0aeaf57a.entry.js} +2 -2
  79. package/dist/cura/p-0aeaf57a.entry.js.map +1 -0
  80. package/dist/cura/{p-daf9feac.js → p-0c25333f.js} +2 -2
  81. package/dist/cura/{p-daf9feac.js.map → p-0c25333f.js.map} +1 -1
  82. package/dist/cura/{p-e6cf81b6.entry.js → p-1c9c62f1.entry.js} +2 -2
  83. package/dist/cura/p-1c9c62f1.entry.js.map +1 -0
  84. package/dist/cura/p-24707984.entry.js +2 -0
  85. package/dist/cura/p-24707984.entry.js.map +1 -0
  86. package/dist/cura/p-2db4deb3.js +2 -0
  87. package/dist/cura/p-2db4deb3.js.map +1 -0
  88. package/dist/cura/p-57c854b3.entry.js +2 -0
  89. package/dist/cura/p-57c854b3.entry.js.map +1 -0
  90. package/dist/cura/{p-e1916252.entry.js → p-7e10b146.entry.js} +2 -2
  91. package/dist/cura/p-7e10b146.entry.js.map +1 -0
  92. package/dist/cura/{p-ec4996c2.js → p-bf8e2037.js} +2 -2
  93. package/dist/cura/p-d6897ac1.entry.js +2 -0
  94. package/dist/cura/p-d6897ac1.entry.js.map +1 -0
  95. package/dist/esm/{app-globals-83a601d0.js → app-globals-ca1945d1.js} +2 -2
  96. package/dist/esm/{app-globals-83a601d0.js.map → app-globals-ca1945d1.js.map} +1 -1
  97. package/dist/esm/cura-accordion_18.entry.js +3 -3
  98. package/dist/esm/cura-accordion_18.entry.js.map +1 -1
  99. package/dist/esm/cura-alert.entry.js +1 -1
  100. package/dist/esm/cura-alert.entry.js.map +1 -1
  101. package/dist/esm/cura-badge-pill.entry.js +1 -1
  102. package/dist/esm/cura-badge-pill.entry.js.map +1 -1
  103. package/dist/esm/cura-loader-bar.entry.js +1 -1
  104. package/dist/esm/cura-loader-bar.entry.js.map +1 -1
  105. package/dist/esm/cura-modal.entry.js +2 -2
  106. package/dist/esm/cura-modal.entry.js.map +1 -1
  107. package/dist/esm/{cura-theme-module-59e8e460.js → cura-theme-module-0fa5ee0b.js} +2 -2
  108. package/dist/esm/{cura-theme-module-59e8e460.js.map → cura-theme-module-0fa5ee0b.js.map} +1 -1
  109. package/dist/esm/cura-toast.entry.js +1 -1
  110. package/dist/esm/cura-toast.entry.js.map +1 -1
  111. package/dist/esm/cura.js +3 -3
  112. package/dist/esm/index.js +2 -2
  113. package/dist/esm/loader.js +3 -3
  114. package/dist/esm/{static-061aa850.js → static-090f0088.js} +16 -2
  115. package/dist/esm/static-090f0088.js.map +1 -0
  116. package/dist/types/api/theme-presets/static.d.ts +7 -0
  117. package/dist/types/components/badges/cura-badge-pill/cura-badge-pill.d.ts +1 -1
  118. package/dist/types/components.d.ts +2 -2
  119. package/package.json +2 -2
  120. package/dist/cjs/static-4e83652c.js.map +0 -1
  121. package/dist/cura/p-09ce32d6.entry.js +0 -2
  122. package/dist/cura/p-09ce32d6.entry.js.map +0 -1
  123. package/dist/cura/p-1016108a.entry.js +0 -2
  124. package/dist/cura/p-1016108a.entry.js.map +0 -1
  125. package/dist/cura/p-1b201271.js +0 -2
  126. package/dist/cura/p-1b201271.js.map +0 -1
  127. package/dist/cura/p-3519d0ba.entry.js.map +0 -1
  128. package/dist/cura/p-948249cf.entry.js +0 -2
  129. package/dist/cura/p-948249cf.entry.js.map +0 -1
  130. package/dist/cura/p-e1916252.entry.js.map +0 -1
  131. package/dist/cura/p-e6cf81b6.entry.js.map +0 -1
  132. package/dist/esm/static-061aa850.js.map +0 -1
  133. /package/dist/cura/{p-ec4996c2.js.map → p-bf8e2037.js.map} +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"cura-accordion.stories.js","sourceRoot":"","sources":["../../../../src/components/accordion/cura-accordion/cura-accordion.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\n\nexport default {\n title: 'Componentes/Accordion/Accordion',\n tags: ['autodocs'],\n render: ({ ...args }) => {\n // You can either use a function to create DOM elements or use a plain html string!\n // return `<div>${label}</div>`;\n return `<cura-accordion\n color=\"${args.color}\"\n color-mode=\"${args.colorMode}\" ${args.labelIcon ? `\n label-icon=\"${args.labelIcon}\"` : ''} ${args.openIcon ? `\n open-icon=\"${args.openIcon}\"` : ''} ${args.closeIcon ? `\n close-icon=\"${args.closeIcon}\"` : ''}\n icon-size=\"${args.iconSize}\" ${args.iconColor ? `\n icon-color=\"${args.iconColor}\"` : ''}\n behavior=\"${args.behavior}\" ${args.level ? `\n level=\"${args.level}\"` : ''}\n style=\"${args.darkBackground ? 'background-color: black; padding: 10px' : 'padding: 10px'}\"\n >\n <cura-accordion-item label=\"${args.label} 1\" ${args.labelIconItem ? `label-icon=\"${args.labelIconItem}\"` : ''}>\n Texto 1\n </cura-accordion-item>\n <cura-accordion-item label=\"Label 2\">\n Texto 2\n </cura-accordion-item>\n <cura-accordion-item label=\"Label 3\">\n Texto 3\n </cura-accordion-item>\n <cura-accordion-item label=\"Label 4\">\n Texto 4\n </cura-accordion-item>\n </cura-accordion>`;\n },\n argTypes: {\n color: {\n control: { type: 'select' },\n options: ['primary', 'secondary', 'accent', 'info', 'success', 'error', 'warning', 'neutral'],\n description: 'Define cor base do item. Cor do DS sem profundidade (ex: primary).',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'primary'}\n },\n name: 'color'\n },\n colorMode: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light'],\n description: 'Seta tema claro ou escuro.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'dark'}\n },\n name: 'color-mode'\n },\n behavior: {\n control: { type: 'inline-radio' },\n options: ['default', 'keep-open'],\n description: 'Comportamento do accordion.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'default'}\n },\n name: 'behavior'\n },\n level: {\n control: { type: 'number', min: 1, max: 6, step: 1 },\n description: 'Define a tag semântica da label. Ex. h1, h2, h3, etc.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 3 }\n }\n },\n labelIcon: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Ícone da label. (É possivel adicionar este atributo diretamente em um \"cura-accordion-item\")',\n table: {\n category: 'Icons'\n },\n name: 'label-icon'\n },\n openIcon: {\n control: { type: 'select' },\n options: iconNames,\n description: 'Ícone para abrir o item.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'down'}\n },\n name: 'open-icon'\n },\n closeIcon: {\n control: { type: 'select' },\n options: iconNames,\n description: 'Ícone para fechar o item.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'up'}\n },\n name: 'close-icon'\n },\n iconSize: {\n control: { type: 'select' },\n options: [\"128\", \"72\", \"64\", \"48\", \"40\", \"32\", \"24\", \"20\", \"16\"],\n description: 'Tamanho do ícone.',\n table: {\n category: 'Icons',\n defaultValue: { summary: '20'}\n },\n name: 'icon-size'\n },\n iconColor: {\n control: { type: 'select' },\n options: ['', 'primary', 'secondary', 'accent', 'info', 'success', 'error', 'warning', 'neutral'],\n description: 'Cor do ícone. (Por padrão ele utiliza a mesma cor da propriedade \\'color\\').',\n table: {\n category: 'Icons',\n },\n name: 'icon-color'\n },\n\n darkBackground: {\n control: 'boolean',\n description: 'Não é uma propriedade do componente. Aplicado como estilo CSS diretamente para visualização em temas escuros de background',\n table: {\n category: 'CSS',\n defaultValue: { summary: 'false'}\n }\n },\n\n label: {\n control: 'text',\n description: 'Label do item.',\n table: {\n category: 'Accordion Item 1'\n },\n name: 'label'\n },\n labelIconItem: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Ícone da label do item.',\n table: {\n category: 'Accordion Item 1'\n },\n name: 'label-icon'\n },\n\n },\n};\n\nexport const Accordion = {\n args: {\n color: 'primary',\n colorMode: 'dark',\n labelIcon: '',\n openIcon: 'down',\n closeIcon: 'up',\n iconSize: '20',\n iconColor: \"\",\n behavior: 'default',\n level: '',\n darkBackground: false,\n\n // Accordion Item\n label: \"Label do item\",\n labelIconItem: \"\",\n },\n};\n"]}
1
+ {"version":3,"file":"cura-accordion.stories.js","sourceRoot":"","sources":["../../../../src/components/accordion/cura-accordion/cura-accordion.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\nimport { baseColors } from '../../../utils/utils';\n\nexport default {\n title: 'Componentes/Accordion/Accordion',\n tags: ['autodocs'],\n render: ({ ...args }) => {\n // You can either use a function to create DOM elements or use a plain html string!\n // return `<div>${label}</div>`;\n return `<cura-accordion\n color=\"${args.color}\"\n color-mode=\"${args.colorMode}\" ${args.labelIcon ? `\n label-icon=\"${args.labelIcon}\"` : ''} ${args.openIcon ? `\n open-icon=\"${args.openIcon}\"` : ''} ${args.closeIcon ? `\n close-icon=\"${args.closeIcon}\"` : ''}\n icon-size=\"${args.iconSize}\" ${args.iconColor ? `\n icon-color=\"${args.iconColor}\"` : ''}\n behavior=\"${args.behavior}\" ${args.level ? `\n level=\"${args.level}\"` : ''}\n style=\"${args.darkBackground ? 'background-color: black; padding: 10px' : 'padding: 10px'}\"\n >\n <cura-accordion-item label=\"${args.label} 1\" ${args.labelIconItem ? `label-icon=\"${args.labelIconItem}\"` : ''}>\n Texto 1\n </cura-accordion-item>\n <cura-accordion-item label=\"Label 2\">\n Texto 2\n </cura-accordion-item>\n <cura-accordion-item label=\"Label 3\">\n Texto 3\n </cura-accordion-item>\n <cura-accordion-item label=\"Label 4\">\n Texto 4\n </cura-accordion-item>\n </cura-accordion>`;\n },\n argTypes: {\n color: {\n control: { type: 'select' },\n options: ['', ...baseColors],\n description: 'Define cor base do item. Cor do DS sem profundidade (ex: primary).',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'primary'}\n },\n name: 'color'\n },\n colorMode: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light'],\n description: 'Seta tema claro ou escuro.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'dark'}\n },\n name: 'color-mode'\n },\n behavior: {\n control: { type: 'inline-radio' },\n options: ['default', 'keep-open'],\n description: 'Comportamento do accordion.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'default'}\n },\n name: 'behavior'\n },\n level: {\n control: { type: 'number', min: 1, max: 6, step: 1 },\n description: 'Define a tag semântica da label. Ex. h1, h2, h3, etc.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 3 }\n }\n },\n labelIcon: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Ícone da label. (É possivel adicionar este atributo diretamente em um \"cura-accordion-item\")',\n table: {\n category: 'Icons'\n },\n name: 'label-icon'\n },\n openIcon: {\n control: { type: 'select' },\n options: iconNames,\n description: 'Ícone para abrir o item.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'down'}\n },\n name: 'open-icon'\n },\n closeIcon: {\n control: { type: 'select' },\n options: iconNames,\n description: 'Ícone para fechar o item.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'up'}\n },\n name: 'close-icon'\n },\n iconSize: {\n control: { type: 'select' },\n options: [\"128\", \"72\", \"64\", \"48\", \"40\", \"32\", \"24\", \"20\", \"16\"],\n description: 'Tamanho do ícone.',\n table: {\n category: 'Icons',\n defaultValue: { summary: '20'}\n },\n name: 'icon-size'\n },\n iconColor: {\n control: { type: 'select' },\n options: ['', ...baseColors],\n description: 'Cor do ícone. (Por padrão ele utiliza a mesma cor da propriedade \\'color\\').',\n table: {\n category: 'Icons',\n },\n name: 'icon-color'\n },\n\n darkBackground: {\n control: 'boolean',\n description: 'Não é uma propriedade do componente. Aplicado como estilo CSS diretamente para visualização em temas escuros de background',\n table: {\n category: 'CSS',\n defaultValue: { summary: 'false'}\n }\n },\n\n label: {\n control: 'text',\n description: 'Label do item.',\n table: {\n category: 'Accordion Item 1'\n },\n name: 'label'\n },\n labelIconItem: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Ícone da label do item.',\n table: {\n category: 'Accordion Item 1'\n },\n name: 'label-icon'\n },\n\n },\n};\n\nexport const Accordion = {\n args: {\n color: 'primary',\n colorMode: 'dark',\n labelIcon: '',\n openIcon: 'down',\n closeIcon: 'up',\n iconSize: '20',\n iconColor: \"\",\n behavior: 'default',\n level: '',\n darkBackground: false,\n\n // Accordion Item\n label: \"Label do item\",\n labelIconItem: \"\",\n },\n};\n"]}
@@ -57,7 +57,7 @@ export class CuraBadgePill {
57
57
  }
58
58
  render() {
59
59
  const symbolColor = this.getSymbolColor();
60
- return (h(Host, { key: 'ac5aafc485ee2a88514a34fc5025f54c01901a46', style: this.hostCSSProperties() }, h("div", { key: '7f32b824ab54471c0517980e6e4ed2b1b21fd435', class: this.getClasses(), style: this.styles }, this.getIcon(), h("cura-label", { key: 'c2ef8d70153a5b8498cf2cb3ce6b60f80aec1d51', size: "xsmall", "line-height": "117%", color: symbolColor }, h("slot", { key: '758b0c994aab961f4c76b7030028268aa8c2364f' })))));
60
+ return (h(Host, { key: '35b9f05a97844c95b2926d077acbed1dc1b18ef4', style: this.hostCSSProperties() }, h("div", { key: '57af34395f1a661aa1a20199b7226f8df6f571c7', class: this.getClasses(), style: this.styles }, this.getIcon(), h("cura-label", { key: '93d6092e4ba21119449424a612d165e5afdbb4fb', size: "xsmall", "line-height": "117%", color: symbolColor }, h("slot", { key: '1225032a818fb22d1d4d43151dea20ea44cf4a31' })))));
61
61
  }
62
62
  static get is() { return "cura-badge-pill"; }
63
63
  static get encapsulation() { return "shadow"; }
@@ -95,8 +95,8 @@ export class CuraBadgePill {
95
95
  "type": "string",
96
96
  "mutable": false,
97
97
  "complexType": {
98
- "original": "'primary' | 'secondary' | 'accent' | 'neutral' | 'info' | 'success' | 'warning' | 'error'",
99
- "resolved": "\"accent\" | \"error\" | \"info\" | \"neutral\" | \"primary\" | \"secondary\" | \"success\" | \"warning\"",
98
+ "original": "'primary' | 'secondary' | 'accent' | 'neutral' | 'info' | 'success' | 'warning' | 'error' | 'whatsapp'",
99
+ "resolved": "\"accent\" | \"error\" | \"info\" | \"neutral\" | \"primary\" | \"secondary\" | \"success\" | \"warning\" | \"whatsapp\"",
100
100
  "references": {}
101
101
  },
102
102
  "required": false,
@@ -1 +1 @@
1
- {"version":3,"file":"cura-badge-pill.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-pill/cura-badge-pill.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, State, h, Watch, Element } from '@stencil/core';\n\n@Component({\n tag: 'cura-badge-pill',\n styleUrl: 'cura-badge-pill.scss',\n shadow: true,\n})\nexport class CuraBadgePill {\n @Element() host: HTMLElement;\n\n /**\n * Badge type: solid | outline | transparent\n */\n @Prop({ reflect: true }) type: 'solid' | 'outline' | 'transparent' = 'solid';\n\n /**\n * Color base from color scheme. Default: primary\n */\n @Prop() color: 'primary' | 'secondary' | 'accent' | 'neutral' | 'info' | 'success' | 'warning' | 'error' = 'primary';\n\n /**\n * Name of the icon to be used from iconset\n */\n @Prop({ reflect: true }) iconName: string;\n\n /**\n * Custom iconset if needed\n */\n @Prop({ reflect: true }) iconset = 'default';\n\n /**\n * Disabled state. Boolean\n */\n @Prop({ reflect: true }) disabled = false;\n\n /**\n * Set badge to icon only. Boolean\n */\n @Prop({ reflect: true }) iconOnly = false;\n\n /**\n * Set border-radius.\n */\n @Prop({ reflect: true }) borderRadius: string = '2px';\n\n @State() styles = {};\n\n theme = window.CuraAPI.theme;\n\n @Watch('color')\n watchColorChange() {\n this.setColors();\n }\n\n connectedCallback() {\n this.setBaseStyles();\n this.setColors();\n }\n\n private setBaseStyles() {\n this.styles = {\n ...this.styles,\n '--base-spacing': this.theme.spacing.getSpacing(),\n '--font-family': this.theme.fonts.getFamily(),\n '--font-size': this.theme.fonts.getSize(),\n };\n }\n\n private setColors() {\n const colors = [\n { name: '--color-background', theme: `${this.color}-lighter` },\n { name: '--color-base', theme: `${this.color}-dark` },\n { name: '--color-background-disabled', theme: 'neutral-pale' },\n { name: '--color-outline-disabled', theme: 'neutral-medium' },\n ];\n\n const newStyles = { ...this.styles };\n colors.forEach(color => {\n newStyles[color.name] = this.theme.colors.getColor(color.theme);\n });\n\n this.styles = newStyles;\n }\n\n hostCSSProperties() {\n return {\n '--border-radius': this.borderRadius || '2px',\n };\n }\n\n getClasses() {\n const classes = {};\n classes['badge-container'] = true;\n classes[`icon-only`] = this.iconOnly;\n classes['disabled'] = this.disabled;\n classes[`${this.type}`] = true;\n return classes;\n }\n\n getSymbolColor() {\n return this.disabled ? 'neutral-medium' : `${this.color}-dark`;\n }\n\n getIcon() {\n if (!this.iconName) return '';\n return <cura-icon name={this.iconName} iconset={this.iconset} size={'micro'} color={this.getSymbolColor()} />;\n }\n\n render() {\n const symbolColor = this.getSymbolColor();\n return (\n <Host style={this.hostCSSProperties()}>\n <div class={this.getClasses()} style={this.styles}>\n {this.getIcon()}\n <cura-label size=\"xsmall\" line-height=\"117%\" color={symbolColor}>\n <slot></slot>\n </cura-label>\n </div>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"cura-badge-pill.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-pill/cura-badge-pill.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, State, h, Watch, Element } from '@stencil/core';\n\n@Component({\n tag: 'cura-badge-pill',\n styleUrl: 'cura-badge-pill.scss',\n shadow: true,\n})\nexport class CuraBadgePill {\n @Element() host: HTMLElement;\n\n /**\n * Badge type: solid | outline | transparent\n */\n @Prop({ reflect: true }) type: 'solid' | 'outline' | 'transparent' = 'solid';\n\n /**\n * Color base from color scheme. Default: primary\n */\n @Prop() color: 'primary' | 'secondary' | 'accent' | 'neutral' | 'info' | 'success' | 'warning' | 'error' | 'whatsapp' = 'primary';\n\n /**\n * Name of the icon to be used from iconset\n */\n @Prop({ reflect: true }) iconName: string;\n\n /**\n * Custom iconset if needed\n */\n @Prop({ reflect: true }) iconset = 'default';\n\n /**\n * Disabled state. Boolean\n */\n @Prop({ reflect: true }) disabled = false;\n\n /**\n * Set badge to icon only. Boolean\n */\n @Prop({ reflect: true }) iconOnly = false;\n\n /**\n * Set border-radius.\n */\n @Prop({ reflect: true }) borderRadius: string = '2px';\n\n @State() styles = {};\n\n theme = window.CuraAPI.theme;\n\n @Watch('color')\n watchColorChange() {\n this.setColors();\n }\n\n connectedCallback() {\n this.setBaseStyles();\n this.setColors();\n }\n\n private setBaseStyles() {\n this.styles = {\n ...this.styles,\n '--base-spacing': this.theme.spacing.getSpacing(),\n '--font-family': this.theme.fonts.getFamily(),\n '--font-size': this.theme.fonts.getSize(),\n };\n }\n\n private setColors() {\n const colors = [\n { name: '--color-background', theme: `${this.color}-lighter` },\n { name: '--color-base', theme: `${this.color}-dark` },\n { name: '--color-background-disabled', theme: 'neutral-pale' },\n { name: '--color-outline-disabled', theme: 'neutral-medium' },\n ];\n\n const newStyles = { ...this.styles };\n colors.forEach(color => {\n newStyles[color.name] = this.theme.colors.getColor(color.theme);\n });\n\n this.styles = newStyles;\n }\n\n hostCSSProperties() {\n return {\n '--border-radius': this.borderRadius || '2px',\n };\n }\n\n getClasses() {\n const classes = {};\n classes['badge-container'] = true;\n classes[`icon-only`] = this.iconOnly;\n classes['disabled'] = this.disabled;\n classes[`${this.type}`] = true;\n return classes;\n }\n\n getSymbolColor() {\n return this.disabled ? 'neutral-medium' : `${this.color}-dark`;\n }\n\n getIcon() {\n if (!this.iconName) return '';\n return <cura-icon name={this.iconName} iconset={this.iconset} size={'micro'} color={this.getSymbolColor()} />;\n }\n\n render() {\n const symbolColor = this.getSymbolColor();\n return (\n <Host style={this.hostCSSProperties()}>\n <div class={this.getClasses()} style={this.styles}>\n {this.getIcon()}\n <cura-label size=\"xsmall\" line-height=\"117%\" color={symbolColor}>\n <slot></slot>\n </cura-label>\n </div>\n </Host>\n );\n }\n}\n"]}
@@ -11,6 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
11
11
  return t;
12
12
  };
13
13
  import iconNames from "../../../assets/icons/iconset-default-list";
14
+ import { baseColors } from "../../../utils/utils";
14
15
  export default {
15
16
  title: 'Componentes/Badges/Badge Pill',
16
17
  tags: ['autodocs'],
@@ -45,7 +46,7 @@ ${args.cssBorderRadius ? `<style>
45
46
  },
46
47
  color: {
47
48
  control: { type: 'select' },
48
- options: ['primary', 'secondary', 'accent', 'neutral', 'info', 'success', 'warning', 'error'],
49
+ options: ['', ...baseColors],
49
50
  description: 'Cor base do badge',
50
51
  table: {
51
52
  category: 'Properties',
@@ -1 +1 @@
1
- {"version":3,"file":"cura-badge-pill.stories.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-pill/cura-badge-pill.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\n\nexport default {\n title: 'Componentes/Badges/Badge Pill',\n tags: ['autodocs'],\n render: ({ ...args }) => {\n return `<cura-badge-pill\n type=\"${args.type}\"\n color=\"${args.color}\"${args.iconName ? `\n icon-name=\"${args.iconName}\"` : ''} ${args.iconset ? `\n iconset=\"${args.iconset}\"` : ''} ${args.disabled ? `\n disabled` : ''} ${args.iconOnly ? `\n icon-only` : ''} ${args.borderRadius ? `\n border-radius=\"${args.borderRadius}\"` : ''}\n>\n ${args.label}\n</cura-badge-pill>\n${args.cssBorderRadius ? `<style>\n cura-badge-pill {\n --border-radius: ${args.cssBorderRadius} !important;\n }\n</style>` : ''}`;\n },\n argTypes: {\n type: {\n control: { type: 'select' },\n options: ['solid', 'outline', 'transparent'],\n description: 'Tipo do badge',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'solid' }\n }\n },\n color: {\n control: { type: 'select' },\n options: ['primary', 'secondary', 'accent', 'neutral', 'info', 'success', 'warning', 'error'],\n description: 'Cor base do badge',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'primary' }\n }\n },\n iconName: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Nome do ícone do iconset',\n table: {\n category: 'Icons'\n }\n },\n iconset: {\n control: { type: 'text' },\n description: 'Conjunto de ícones personalizado',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'default' }\n }\n },\n iconOnly: {\n control: 'boolean',\n description: 'Mostra apenas o ícone',\n table: {\n category: 'Icons',\n defaultValue: { summary: false }\n }\n },\n disabled: {\n control: 'boolean',\n description: 'Estado desabilitado',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n }\n },\n label: {\n control: 'text',\n description: 'Label do badge',\n table: {\n category: 'Properties'\n }\n },\n borderRadius: {\n control: 'text',\n description: 'Border radius do badge',\n table: {\n category: 'Properties',\n defaultValue: { summary: '2px' }\n }\n },\n cssBorderRadius: {\n control: 'text',\n name: '--border-radius',\n description: 'É possível sobrescrever o border-radius do componente (Ex: 10px, 50%, etc.)',\n table: {\n category: 'CSS Properties',\n defaultValue: { summary: '' }\n }\n },\n },\n};\n\nexport const BadgePill = {\n args: {\n type: 'solid',\n color: 'primary',\n iconName: '',\n iconset: '',\n disabled: false,\n iconOnly: false,\n label: 'Badge Pill',\n borderRadius: '',\n cssBorderRadius: '',\n },\n};\n\n"]}
1
+ {"version":3,"file":"cura-badge-pill.stories.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-pill/cura-badge-pill.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\nimport { baseColors } from '../../../utils/utils';\n\nexport default {\n title: 'Componentes/Badges/Badge Pill',\n tags: ['autodocs'],\n render: ({ ...args }) => {\n return `<cura-badge-pill\n type=\"${args.type}\"\n color=\"${args.color}\"${args.iconName ? `\n icon-name=\"${args.iconName}\"` : ''} ${args.iconset ? `\n iconset=\"${args.iconset}\"` : ''} ${args.disabled ? `\n disabled` : ''} ${args.iconOnly ? `\n icon-only` : ''} ${args.borderRadius ? `\n border-radius=\"${args.borderRadius}\"` : ''}\n>\n ${args.label}\n</cura-badge-pill>\n${args.cssBorderRadius ? `<style>\n cura-badge-pill {\n --border-radius: ${args.cssBorderRadius} !important;\n }\n</style>` : ''}`;\n },\n argTypes: {\n type: {\n control: { type: 'select' },\n options: ['solid', 'outline', 'transparent'],\n description: 'Tipo do badge',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'solid' }\n }\n },\n color: {\n control: { type: 'select' },\n options: ['', ...baseColors],\n description: 'Cor base do badge',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'primary' }\n }\n },\n iconName: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Nome do ícone do iconset',\n table: {\n category: 'Icons'\n }\n },\n iconset: {\n control: { type: 'text' },\n description: 'Conjunto de ícones personalizado',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'default' }\n }\n },\n iconOnly: {\n control: 'boolean',\n description: 'Mostra apenas o ícone',\n table: {\n category: 'Icons',\n defaultValue: { summary: false }\n }\n },\n disabled: {\n control: 'boolean',\n description: 'Estado desabilitado',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n }\n },\n label: {\n control: 'text',\n description: 'Label do badge',\n table: {\n category: 'Properties'\n }\n },\n borderRadius: {\n control: 'text',\n description: 'Border radius do badge',\n table: {\n category: 'Properties',\n defaultValue: { summary: '2px' }\n }\n },\n cssBorderRadius: {\n control: 'text',\n name: '--border-radius',\n description: 'É possível sobrescrever o border-radius do componente (Ex: 10px, 50%, etc.)',\n table: {\n category: 'CSS Properties',\n defaultValue: { summary: '' }\n }\n },\n },\n};\n\nexport const BadgePill = {\n args: {\n type: 'solid',\n color: 'primary',\n iconName: '',\n iconset: '',\n disabled: false,\n iconOnly: false,\n label: 'Badge Pill',\n borderRadius: '',\n cssBorderRadius: '',\n },\n};\n\n"]}
@@ -11,6 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
11
11
  return t;
12
12
  };
13
13
  import iconNames from "../../../assets/icons/iconset-default-list";
14
+ import { baseColors } from "../../../utils/utils";
14
15
  const renderCuraButton = (label, args) => {
15
16
  const style = args.borderRadius && args.borderRadius !== '4px' ? `<style>
16
17
  cura-button {
@@ -88,7 +89,7 @@ export default {
88
89
  },
89
90
  color: {
90
91
  control: { type: 'select' },
91
- options: ['primary', 'secondary', 'accent', 'info', 'success', 'error', 'warning', 'neutral'],
92
+ options: ['', ...baseColors],
92
93
  description: 'Cor fundamental do Design System sem profundidade (ex: primary).',
93
94
  table: {
94
95
  category: 'Properties',
@@ -1 +1 @@
1
- {"version":3,"file":"cura-button.stories.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button/cura-button.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\n\nconst renderCuraButton = (label: string, args: any) => {\n const style = args.borderRadius && args.borderRadius !== '4px' ? `<style>\n cura-button {\n --border-radius: ${args.borderRadius} !important;\n }\n</style>\n` : '';\n const block = `<cura-button${args.size && args.size !== 'large' ? `\n size=\"${args.size}\"` : ''}${args.color ? `\n type=\"${args.type}\"\n color=\"${args.color}\"` : ''}${args.disabled ? `\n disabled` : ''}${args.isLoading ? `\n is-loading` : ''}${args.background && args.background !== 'light' ? `\n background=\"${args.background}\"` : ''}${args.fontColor && args.fontColor !== 'dark' ? `\n font-color=\"${args.fontColor}\"` : ''}${args.iconName ? `\n icon-name=\"${args.iconName}\"` : ''}${args.iconPosition && args.iconPosition !== 'left' ? `\n icon-position=\"${args.iconPosition}\"` : ''}${args.iconOnly ? `\n icon-only` : ''}${args.href ? `\n href=\"${args.href}\"` : ''}${args.target ? `\n target=\"${args.target}\"` : ''}${args.textAlign && args.textAlign !== 'left' ? `\n text-align=\"${args.textAlign}\"` : ''}${args.justify ? `\n justify=\"${args.justify}\"` : ''}${args.fullWidth ? `\n style=\"width: 100%;\"` : ''}>\n ${label}\n</cura-button>`;\n\n return `${style}${block}`;\n};\n\nexport default {\n title: 'Componentes/Buttons/Button',\n tags: ['autodocs'],\n render: ({ label, ...args }) => {\n return renderCuraButton(label, args);\n },\n argTypes: {\n label: {\n control: 'text',\n description: 'Texto puro com ou sem quebra de linha dentro do componente. Não é propriedade HTML.',\n name: 'Label'\n },\n disabled: {\n control: 'boolean',\n description: 'Estado desabilitado.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n }\n },\n isLoading: {\n control: 'boolean',\n description: 'Estado de carregamento. Também desabilita ação do botão e pode ser usado em conjunto com a propriedade disabled.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n },\n name: 'is-loading'\n },\n size: {\n control: { type: 'inline-radio' },\n options: ['small', 'medium', 'large'],\n description: 'Tamanhos disponíveis.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'large' }\n }\n },\n type: {\n control: { type: 'inline-radio' },\n options: ['button', 'submit', 'reset'],\n description: 'Tipo do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'button' }\n }\n },\n color: {\n control: { type: 'select' },\n options: ['primary', 'secondary', 'accent', 'info', 'success', 'error', 'warning', 'neutral'],\n description: 'Cor fundamental do Design System sem profundidade (ex: primary).',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'accent' }\n }\n },\n fontColor: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light'],\n description: 'Define cor clara ou escura do texto de acordo com contexto.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'dark' }\n },\n name: 'font-color'\n },\n background: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light'],\n description: 'Define cor clara ou escura do tema de acordo com contexto.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'light' }\n },\n name: 'background'\n },\n textAlign: {\n control: { type: 'inline-radio' },\n options: ['left', 'center', 'right'],\n description: 'Alinha texto de múltiplas linhas.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'left' }\n },\n name: 'text-align'\n },\n justify: {\n control: 'boolean',\n description: 'Expande os elementos internos para a dimensão do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: false }\n }\n },\n borderRadius: {\n control: 'text',\n description: 'Personaliza a propriedade border-radius do botão.',\n table: {\n category: 'CSS Properties',\n defaultValue: { summary: '4px' }\n },\n name: '--border-radius'\n },\n fullWidth: {\n control: 'boolean',\n description: 'Não é uma propriedade do componente. Aplicado como estilo CSS diretamente para visualização em largura total',\n table: {\n category: 'CSS',\n defaultValue: { summary: false }\n }\n },\n iconName: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Nome do ícone a ser utilizado no iconset.',\n table: {\n category: 'Icons'\n },\n name: 'icon-name'\n },\n iconPosition: {\n control: { type: 'inline-radio' },\n options: ['left', 'right'],\n description: 'Posição do ícone no botão.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'left' }\n },\n name: 'icon-position'\n },\n iconOnly: {\n control: 'boolean',\n description: 'Oculta o label do botão exibindo somente o ícone.',\n table: {\n category: 'Icons',\n defaultValue: { summary: false }\n },\n name: 'icon-only'\n },\n href: {\n control: 'text',\n description: `Se definido o elemento de ação renderizado internamente será um link.`,\n table: {\n category: 'Properties'\n }\n },\n target: {\n control: 'text',\n description: 'Define o comportamento de abertura do link quando href for informado.',\n table: {\n category: 'Properties',\n defaultValue: { summary: '_self' }\n }\n }\n },\n};\n\nexport const Button = {\n args: {\n label: 'Button',\n type: 'button',\n size: 'medium',\n color: 'accent',\n fontColor: 'dark',\n background: 'light',\n textAlign: 'left',\n justify: false,\n iconName: '',\n iconPosition: 'left',\n iconOnly: false,\n disabled: false,\n isLoading: false,\n href: '',\n target: '_self',\n borderRadius: '4px',\n fullWidth: false,\n },\n};\n"]}
1
+ {"version":3,"file":"cura-button.stories.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button/cura-button.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\nimport { baseColors } from '../../../utils/utils';\n\nconst renderCuraButton = (label: string, args: any) => {\n const style = args.borderRadius && args.borderRadius !== '4px' ? `<style>\n cura-button {\n --border-radius: ${args.borderRadius} !important;\n }\n</style>\n` : '';\n const block = `<cura-button${args.size && args.size !== 'large' ? `\n size=\"${args.size}\"` : ''}${args.color ? `\n type=\"${args.type}\"\n color=\"${args.color}\"` : ''}${args.disabled ? `\n disabled` : ''}${args.isLoading ? `\n is-loading` : ''}${args.background && args.background !== 'light' ? `\n background=\"${args.background}\"` : ''}${args.fontColor && args.fontColor !== 'dark' ? `\n font-color=\"${args.fontColor}\"` : ''}${args.iconName ? `\n icon-name=\"${args.iconName}\"` : ''}${args.iconPosition && args.iconPosition !== 'left' ? `\n icon-position=\"${args.iconPosition}\"` : ''}${args.iconOnly ? `\n icon-only` : ''}${args.href ? `\n href=\"${args.href}\"` : ''}${args.target ? `\n target=\"${args.target}\"` : ''}${args.textAlign && args.textAlign !== 'left' ? `\n text-align=\"${args.textAlign}\"` : ''}${args.justify ? `\n justify=\"${args.justify}\"` : ''}${args.fullWidth ? `\n style=\"width: 100%;\"` : ''}>\n ${label}\n</cura-button>`;\n\n return `${style}${block}`;\n};\n\nexport default {\n title: 'Componentes/Buttons/Button',\n tags: ['autodocs'],\n render: ({ label, ...args }) => {\n return renderCuraButton(label, args);\n },\n argTypes: {\n label: {\n control: 'text',\n description: 'Texto puro com ou sem quebra de linha dentro do componente. Não é propriedade HTML.',\n name: 'Label'\n },\n disabled: {\n control: 'boolean',\n description: 'Estado desabilitado.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n }\n },\n isLoading: {\n control: 'boolean',\n description: 'Estado de carregamento. Também desabilita ação do botão e pode ser usado em conjunto com a propriedade disabled.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n },\n name: 'is-loading'\n },\n size: {\n control: { type: 'inline-radio' },\n options: ['small', 'medium', 'large'],\n description: 'Tamanhos disponíveis.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'large' }\n }\n },\n type: {\n control: { type: 'inline-radio' },\n options: ['button', 'submit', 'reset'],\n description: 'Tipo do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'button' }\n }\n },\n color: {\n control: { type: 'select' },\n options: ['', ...baseColors],\n description: 'Cor fundamental do Design System sem profundidade (ex: primary).',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'accent' }\n }\n },\n fontColor: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light'],\n description: 'Define cor clara ou escura do texto de acordo com contexto.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'dark' }\n },\n name: 'font-color'\n },\n background: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light'],\n description: 'Define cor clara ou escura do tema de acordo com contexto.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'light' }\n },\n name: 'background'\n },\n textAlign: {\n control: { type: 'inline-radio' },\n options: ['left', 'center', 'right'],\n description: 'Alinha texto de múltiplas linhas.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'left' }\n },\n name: 'text-align'\n },\n justify: {\n control: 'boolean',\n description: 'Expande os elementos internos para a dimensão do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: false }\n }\n },\n borderRadius: {\n control: 'text',\n description: 'Personaliza a propriedade border-radius do botão.',\n table: {\n category: 'CSS Properties',\n defaultValue: { summary: '4px' }\n },\n name: '--border-radius'\n },\n fullWidth: {\n control: 'boolean',\n description: 'Não é uma propriedade do componente. Aplicado como estilo CSS diretamente para visualização em largura total',\n table: {\n category: 'CSS',\n defaultValue: { summary: false }\n }\n },\n iconName: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Nome do ícone a ser utilizado no iconset.',\n table: {\n category: 'Icons'\n },\n name: 'icon-name'\n },\n iconPosition: {\n control: { type: 'inline-radio' },\n options: ['left', 'right'],\n description: 'Posição do ícone no botão.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'left' }\n },\n name: 'icon-position'\n },\n iconOnly: {\n control: 'boolean',\n description: 'Oculta o label do botão exibindo somente o ícone.',\n table: {\n category: 'Icons',\n defaultValue: { summary: false }\n },\n name: 'icon-only'\n },\n href: {\n control: 'text',\n description: `Se definido o elemento de ação renderizado internamente será um link.`,\n table: {\n category: 'Properties'\n }\n },\n target: {\n control: 'text',\n description: 'Define o comportamento de abertura do link quando href for informado.',\n table: {\n category: 'Properties',\n defaultValue: { summary: '_self' }\n }\n }\n },\n};\n\nexport const Button = {\n args: {\n label: 'Button',\n type: 'button',\n size: 'medium',\n color: 'accent',\n fontColor: 'dark',\n background: 'light',\n textAlign: 'left',\n justify: false,\n iconName: '',\n iconPosition: 'left',\n iconOnly: false,\n disabled: false,\n isLoading: false,\n href: '',\n target: '_self',\n borderRadius: '4px',\n fullWidth: false,\n },\n};\n"]}
@@ -11,6 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
11
11
  return t;
12
12
  };
13
13
  import iconNames from "../../../assets/icons/iconset-default-list";
14
+ import { baseColors } from "../../../utils/utils";
14
15
  const renderCuraButtonOutline = (label, args) => {
15
16
  const style = args.borderRadius && args.borderRadius !== '4px' ? `<style>
16
17
  cura-button-outline {
@@ -88,7 +89,7 @@ export default {
88
89
  },
89
90
  color: {
90
91
  control: { type: 'select' },
91
- options: ['primary', 'secondary', 'accent', 'info', 'success', 'error', 'warning', 'neutral'],
92
+ options: ['', ...baseColors],
92
93
  description: 'Cor fundamental do Design System sem profundidade (ex: primary).',
93
94
  table: {
94
95
  category: 'Properties',
@@ -1 +1 @@
1
- {"version":3,"file":"cura-button-outline.stories.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-outline/cura-button-outline.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\n\nconst renderCuraButtonOutline = (label: string, args: any) => {\n const style = args.borderRadius && args.borderRadius !== '4px' ? `<style>\n cura-button-outline {\n --border-radius: ${args.borderRadius} !important;\n }\n</style>\n` : '';\n const block = `<cura-button-outline${args.size && args.size !== 'large' ? `\n size=\"${args.size}\"` : ''}${args.color ? `\n type=\"${args.type}\"\n color=\"${args.color}\"` : ''}${args.disabled ? `\n disabled` : ''}${args.isLoading ? `\n is-loading` : ''}${args.background && args.background !== 'light' ? `\n background=\"${args.background}\"` : ''}${args.fontColor && args.fontColor !== 'dark' ? `\n font-color=\"${args.fontColor}\"` : ''}${args.iconName ? `\n icon-name=\"${args.iconName}\"` : ''}${args.iconPosition && args.iconPosition !== 'left' ? `\n icon-position=\"${args.iconPosition}\"` : ''}${args.iconOnly ? `\n icon-only` : ''}${args.href ? `\n href=\"${args.href}\"` : ''}${args.target ? `\n target=\"${args.target}\"` : ''}${args.textAlign && args.textAlign !== 'left' ? `\n text-align=\"${args.textAlign}\"` : ''}${args.justify ? `\n justify=\"${args.justify}\"` : ''}${args.fullWidth ? `\n style=\"width: 100%;\"` : ''}>\n ${label}\n</cura-button-outline>`;\n\n return `${style}${block}`;\n};\n\nexport default {\n title: 'Componentes/Buttons/Button Outline',\n tags: ['autodocs'],\n render: ({ label, ...args }) => {\n return renderCuraButtonOutline(label, args);\n },\n argTypes: {\n label: {\n control: 'text',\n description: 'Texto puro com ou sem quebra de linha dentro do componente. Não é propriedade HTML.',\n name: 'Label'\n },\n disabled: {\n control: 'boolean',\n description: 'Estado desabilitado.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n }\n },\n isLoading: {\n control: 'boolean',\n description: 'Estado de carregamento. Também desabilita ação do botão e pode ser usado em conjunto com a propriedade disabled.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n },\n name: 'is-loading'\n },\n size: {\n control: { type: 'inline-radio' },\n options: ['small', 'medium', 'large'],\n description: 'Tamanhos disponíveis.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'large' }\n }\n },\n type: {\n control: { type: 'inline-radio' },\n options: ['button', 'submit', 'reset'],\n description: 'Tipo do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'button'}\n }\n },\n color: {\n control: { type: 'select' },\n options: ['primary', 'secondary', 'accent', 'info', 'success', 'error', 'warning', 'neutral'],\n description: 'Cor fundamental do Design System sem profundidade (ex: primary).',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'accent' }\n }\n },\n fontColor: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light' ],\n description: 'Define cor clara ou escura do text de acordo com contexto.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'dark' }\n },\n name: 'font-color'\n },\n background: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light' ],\n description: 'Define cor clara ou escura do tema de acordo com contexto.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'light' }\n },\n name: 'background'\n },\n textAlign: {\n control: { type: 'inline-radio' },\n options: ['left', 'center', 'right'],\n description: 'Alinha texto de múltiplas linhas.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'left' }\n },\n name: 'text-align'\n },\n justify: {\n control: 'boolean',\n description: 'Expande os elementos internos para a dimensão do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: false }\n }\n },\n borderRadius: {\n control: 'text',\n description: 'Personaliza a propriedade border-radius do botão.',\n table: {\n category: 'CSS Properties',\n defaultValue: { summary: '4px' }\n },\n name: '--border-radius'\n },\n fullWidth: {\n control: 'boolean',\n description: 'Não é uma propriedade do componente. Aplicado como estilo CSS diretamente para visualização em largura total',\n table: {\n category: 'CSS',\n defaultValue: { summary: false }\n }\n },\n iconName: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Nome do ícone a ser utilizado no iconset.',\n table: {\n category: 'Icons'\n },\n name: 'icon-name'\n },\n iconPosition: {\n control: { type: 'inline-radio' },\n options: ['left', 'right'],\n description: 'Posição do ícone no botão.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'left' }\n },\n name: 'icon-position'\n },\n iconOnly: {\n control: 'boolean',\n description: 'Oculta o label do botão exibindo somente o ícone.',\n table: {\n category: 'Icons',\n defaultValue: { summary: false }\n },\n name: 'icon-only'\n },\n href: {\n control: 'text',\n description: `Se definido o elemento de ação renderizado internamente será um link.`,\n table: {\n category: 'Properties'\n }\n },\n target: {\n control: 'text',\n description: 'Define o comportamento de abertura do link quando href for informado.',\n table: {\n category: 'Properties',\n defaultValue: { summary: '_self' }\n }\n }\n },\n};\n\nexport const ButtonOutline = {\n args: {\n label: 'Button',\n type: 'button',\n size: 'medium',\n color: 'primary',\n fontColor: 'dark',\n background: 'light',\n textAlign: 'left',\n justify: false,\n iconName: '',\n iconPosition: 'left',\n iconOnly: false,\n disabled: false,\n isLoading: false,\n href: '',\n target: '_self',\n borderRadius: '4px',\n fullWidth: false,\n },\n};\n"]}
1
+ {"version":3,"file":"cura-button-outline.stories.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-outline/cura-button-outline.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\nimport { baseColors } from '../../../utils/utils';\n\nconst renderCuraButtonOutline = (label: string, args: any) => {\n const style = args.borderRadius && args.borderRadius !== '4px' ? `<style>\n cura-button-outline {\n --border-radius: ${args.borderRadius} !important;\n }\n</style>\n` : '';\n const block = `<cura-button-outline${args.size && args.size !== 'large' ? `\n size=\"${args.size}\"` : ''}${args.color ? `\n type=\"${args.type}\"\n color=\"${args.color}\"` : ''}${args.disabled ? `\n disabled` : ''}${args.isLoading ? `\n is-loading` : ''}${args.background && args.background !== 'light' ? `\n background=\"${args.background}\"` : ''}${args.fontColor && args.fontColor !== 'dark' ? `\n font-color=\"${args.fontColor}\"` : ''}${args.iconName ? `\n icon-name=\"${args.iconName}\"` : ''}${args.iconPosition && args.iconPosition !== 'left' ? `\n icon-position=\"${args.iconPosition}\"` : ''}${args.iconOnly ? `\n icon-only` : ''}${args.href ? `\n href=\"${args.href}\"` : ''}${args.target ? `\n target=\"${args.target}\"` : ''}${args.textAlign && args.textAlign !== 'left' ? `\n text-align=\"${args.textAlign}\"` : ''}${args.justify ? `\n justify=\"${args.justify}\"` : ''}${args.fullWidth ? `\n style=\"width: 100%;\"` : ''}>\n ${label}\n</cura-button-outline>`;\n\n return `${style}${block}`;\n};\n\nexport default {\n title: 'Componentes/Buttons/Button Outline',\n tags: ['autodocs'],\n render: ({ label, ...args }) => {\n return renderCuraButtonOutline(label, args);\n },\n argTypes: {\n label: {\n control: 'text',\n description: 'Texto puro com ou sem quebra de linha dentro do componente. Não é propriedade HTML.',\n name: 'Label'\n },\n disabled: {\n control: 'boolean',\n description: 'Estado desabilitado.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n }\n },\n isLoading: {\n control: 'boolean',\n description: 'Estado de carregamento. Também desabilita ação do botão e pode ser usado em conjunto com a propriedade disabled.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n },\n name: 'is-loading'\n },\n size: {\n control: { type: 'inline-radio' },\n options: ['small', 'medium', 'large'],\n description: 'Tamanhos disponíveis.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'large' }\n }\n },\n type: {\n control: { type: 'inline-radio' },\n options: ['button', 'submit', 'reset'],\n description: 'Tipo do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'button'}\n }\n },\n color: {\n control: { type: 'select' },\n options: ['', ...baseColors],\n description: 'Cor fundamental do Design System sem profundidade (ex: primary).',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'accent' }\n }\n },\n fontColor: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light' ],\n description: 'Define cor clara ou escura do text de acordo com contexto.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'dark' }\n },\n name: 'font-color'\n },\n background: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light' ],\n description: 'Define cor clara ou escura do tema de acordo com contexto.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'light' }\n },\n name: 'background'\n },\n textAlign: {\n control: { type: 'inline-radio' },\n options: ['left', 'center', 'right'],\n description: 'Alinha texto de múltiplas linhas.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'left' }\n },\n name: 'text-align'\n },\n justify: {\n control: 'boolean',\n description: 'Expande os elementos internos para a dimensão do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: false }\n }\n },\n borderRadius: {\n control: 'text',\n description: 'Personaliza a propriedade border-radius do botão.',\n table: {\n category: 'CSS Properties',\n defaultValue: { summary: '4px' }\n },\n name: '--border-radius'\n },\n fullWidth: {\n control: 'boolean',\n description: 'Não é uma propriedade do componente. Aplicado como estilo CSS diretamente para visualização em largura total',\n table: {\n category: 'CSS',\n defaultValue: { summary: false }\n }\n },\n iconName: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Nome do ícone a ser utilizado no iconset.',\n table: {\n category: 'Icons'\n },\n name: 'icon-name'\n },\n iconPosition: {\n control: { type: 'inline-radio' },\n options: ['left', 'right'],\n description: 'Posição do ícone no botão.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'left' }\n },\n name: 'icon-position'\n },\n iconOnly: {\n control: 'boolean',\n description: 'Oculta o label do botão exibindo somente o ícone.',\n table: {\n category: 'Icons',\n defaultValue: { summary: false }\n },\n name: 'icon-only'\n },\n href: {\n control: 'text',\n description: `Se definido o elemento de ação renderizado internamente será um link.`,\n table: {\n category: 'Properties'\n }\n },\n target: {\n control: 'text',\n description: 'Define o comportamento de abertura do link quando href for informado.',\n table: {\n category: 'Properties',\n defaultValue: { summary: '_self' }\n }\n }\n },\n};\n\nexport const ButtonOutline = {\n args: {\n label: 'Button',\n type: 'button',\n size: 'medium',\n color: 'primary',\n fontColor: 'dark',\n background: 'light',\n textAlign: 'left',\n justify: false,\n iconName: '',\n iconPosition: 'left',\n iconOnly: false,\n disabled: false,\n isLoading: false,\n href: '',\n target: '_self',\n borderRadius: '4px',\n fullWidth: false,\n },\n};\n"]}
@@ -11,6 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
11
11
  return t;
12
12
  };
13
13
  import iconNames from "../../../assets/icons/iconset-default-list";
14
+ import { baseColors } from "../../../utils/utils";
14
15
  const renderCuraButtonSelect = (label, args) => {
15
16
  const block = `<cura-button-select ${args.selected
16
17
  ? `
@@ -85,7 +86,7 @@ export default {
85
86
  },
86
87
  color: {
87
88
  control: { type: 'select' },
88
- options: ['primary', 'secondary', 'accent', 'info', 'success', 'error', 'warning', 'neutral'],
89
+ options: ['', ...baseColors],
89
90
  description: 'Cor fundamental do Design System sem profundidade (ex: primary).',
90
91
  table: {
91
92
  category: 'Properties',
@@ -1 +1 @@
1
- {"version":3,"file":"cura-button-select.stories.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-select/cura-button-select.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\n\nconst renderCuraButtonSelect = (label: string, args: any) => {\n const block = `<cura-button-select ${\n args.selected\n ? `\n selected=\"${args.selected}\"`\n : ''\n }${\n args.disabled\n ? `\n disabled=\"${args.disabled}\"`\n : ''\n }\n ${\n args.iconName\n ? `\n icon-name=\"${args.iconName}\"`\n : ''\n }${\n args.size\n ? `\n size=\"${args.size}\"`\n : ''\n }\n ${\n args.counter\n ? `\n counter=\"${args.counter}\"`\n : ''\n }\n ${\n args.background\n ? `\n background=\"${args.background}\"`\n : ''\n }\n ${\n args.color\n ? `\n color=\"${args.color}\"`\n : ''\n }\n ${args.iconPosition ? `icon-position=\"${args.iconPosition}\"` : ''}\n >\n ${label}\n </cura-button-select>\n `;\n return `${block}`;\n};\n\nexport default {\n title: 'Componentes/Buttons/Button Select',\n tags: ['autodocs'],\n render: ({ label, ...args }) => {\n return renderCuraButtonSelect(label, args);\n },\n argTypes: {\n label: {\n control: 'text',\n description: 'Texto puro com ou sem quebra de linha dentro do componente. Não é propriedade HTML.',\n name: 'Label',\n },\n disabled: {\n control: 'boolean',\n description: 'Estado desabilitado.',\n table: {\n category: 'State',\n defaultValue: { summary: false },\n },\n },\n selected: {\n control: 'boolean',\n description: 'Estado selecionado.',\n table: {\n category: 'State',\n defaultValue: { summary: false },\n },\n },\n size: {\n control: { type: 'inline-radio' },\n options: ['small', 'medium', 'large'],\n description: 'Tamanhos disponíveis.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'large' },\n },\n },\n color: {\n control: { type: 'select' },\n options: ['primary', 'secondary', 'accent', 'info', 'success', 'error', 'warning', 'neutral'],\n description: 'Cor fundamental do Design System sem profundidade (ex: primary).',\n table: {\n category: 'Properties',\n },\n },\n iconName: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Nome do ícone a ser utilizado no iconset.',\n table: {\n category: 'Icons',\n },\n name: 'icon-name',\n },\n background: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light'],\n description: 'Define cor clara ou escura do componente.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'light' },\n },\n },\n counter: {\n control: 'number',\n description: 'Define o número a ser exibido pelo componente',\n table: {\n category: 'Properties',\n defaultValue: { summary: 1 },\n },\n },\n iconPosition: {\n control: { type: 'inline-radio' },\n options: ['left', 'right'],\n description: 'Define a posição do ícone. Apenas o ícone <b>check</b> é permitido a direita.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'left' },\n },\n },\n },\n};\n\nexport const Button = {\n args: {\n selected: false,\n iconName: 'calendar',\n size: 'medium',\n counter: 1,\n disabled: false,\n background: 'light',\n color: 'primary',\n label: 'Button',\n iconPosition: 'left',\n },\n};\n"]}
1
+ {"version":3,"file":"cura-button-select.stories.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-select/cura-button-select.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,SAAS,MAAM,4CAA4C,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAElD,MAAM,sBAAsB,GAAG,CAAC,KAAa,EAAE,IAAS,EAAE,EAAE;IAC1D,MAAM,KAAK,GAAG,uBACZ,IAAI,CAAC,QAAQ;QACX,CAAC,CAAC;oBACY,IAAI,CAAC,QAAQ,GAAG;QAC9B,CAAC,CAAC,EACN,GACE,IAAI,CAAC,QAAQ;QACX,CAAC,CAAC;oBACY,IAAI,CAAC,QAAQ,GAAG;QAC9B,CAAC,CAAC,EACN;IAEE,IAAI,CAAC,QAAQ;QACX,CAAC,CAAC;qBACa,IAAI,CAAC,QAAQ,GAAG;QAC/B,CAAC,CAAC,EACN,GACE,IAAI,CAAC,IAAI;QACP,CAAC,CAAC;gBACQ,IAAI,CAAC,IAAI,GAAG;QACtB,CAAC,CAAC,EACN;IAEE,IAAI,CAAC,OAAO;QACV,CAAC,CAAC;mBACW,IAAI,CAAC,OAAO,GAAG;QAC5B,CAAC,CAAC,EACN;IAEE,IAAI,CAAC,UAAU;QACb,CAAC,CAAC;sBACc,IAAI,CAAC,UAAU,GAAG;QAClC,CAAC,CAAC,EACN;IAEE,IAAI,CAAC,KAAK;QACR,CAAC,CAAC;iBACS,IAAI,CAAC,KAAK,GAAG;QACxB,CAAC,CAAC,EACN;UACQ,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,kBAAkB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,EAAE;;IAErE,KAAK;;OAEF,CAAC;IACN,OAAO,GAAG,KAAK,EAAE,CAAC;AACpB,CAAC,CAAC;AAEF,eAAe;IACb,KAAK,EAAE,mCAAmC;IAC1C,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,MAAM,EAAE,CAAC,EAAkB,EAAE,EAAE;YAAtB,EAAE,KAAK,OAAW,EAAN,IAAI,cAAhB,SAAkB,CAAF;QACvB,OAAO,sBAAsB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;IAC7C,CAAC;IACD,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,qFAAqF;YAClG,IAAI,EAAE,OAAO;SACd;QACD,QAAQ,EAAE;YACR,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,sBAAsB;YACnC,KAAK,EAAE;gBACL,QAAQ,EAAE,OAAO;gBACjB,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;aACjC;SACF;QACD,QAAQ,EAAE;YACR,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,qBAAqB;YAClC,KAAK,EAAE;gBACL,QAAQ,EAAE,OAAO;gBACjB,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;aACjC;SACF;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE;YACjC,OAAO,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC;YACrC,WAAW,EAAE,uBAAuB;YACpC,KAAK,EAAE;gBACL,QAAQ,EAAE,YAAY;gBACtB,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;aACnC;SACF;QACD,KAAK,EAAE;YACL,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,OAAO,EAAE,CAAC,EAAE,EAAE,GAAG,UAAU,CAAC;YAC5B,WAAW,EAAE,kEAAkE;YAC/E,KAAK,EAAE;gBACL,QAAQ,EAAE,YAAY;aACvB;SACF;QACD,QAAQ,EAAE;YACR,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,OAAO,EAAE,CAAC,EAAE,EAAE,GAAG,SAAS,CAAC;YAC3B,WAAW,EAAE,2CAA2C;YACxD,KAAK,EAAE;gBACL,QAAQ,EAAE,OAAO;aAClB;YACD,IAAI,EAAE,WAAW;SAClB;QACD,UAAU,EAAE;YACV,OAAO,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE;YACjC,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC;YAC1B,WAAW,EAAE,2CAA2C;YACxD,KAAK,EAAE;gBACL,QAAQ,EAAE,YAAY;gBACtB,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;aACnC;SACF;QACD,OAAO,EAAE;YACP,OAAO,EAAE,QAAQ;YACjB,WAAW,EAAE,+CAA+C;YAC5D,KAAK,EAAE;gBACL,QAAQ,EAAE,YAAY;gBACtB,YAAY,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;aAC7B;SACF;QACD,YAAY,EAAE;YACZ,OAAO,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE;YACjC,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC;YAC1B,WAAW,EAAE,+EAA+E;YAC5F,KAAK,EAAE;gBACL,QAAQ,EAAE,OAAO;gBACjB,YAAY,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;aAClC;SACF;KACF;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG;IACpB,IAAI,EAAE;QACJ,QAAQ,EAAE,KAAK;QACf,QAAQ,EAAE,UAAU;QACpB,IAAI,EAAE,QAAQ;QACd,OAAO,EAAE,CAAC;QACV,QAAQ,EAAE,KAAK;QACf,UAAU,EAAE,OAAO;QACnB,KAAK,EAAE,SAAS;QAChB,KAAK,EAAE,QAAQ;QACf,YAAY,EAAE,MAAM;KACrB;CACF,CAAC","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\nimport { baseColors } from '../../../utils/utils';\n\nconst renderCuraButtonSelect = (label: string, args: any) => {\n const block = `<cura-button-select ${\n args.selected\n ? `\n selected=\"${args.selected}\"`\n : ''\n }${\n args.disabled\n ? `\n disabled=\"${args.disabled}\"`\n : ''\n }\n ${\n args.iconName\n ? `\n icon-name=\"${args.iconName}\"`\n : ''\n }${\n args.size\n ? `\n size=\"${args.size}\"`\n : ''\n }\n ${\n args.counter\n ? `\n counter=\"${args.counter}\"`\n : ''\n }\n ${\n args.background\n ? `\n background=\"${args.background}\"`\n : ''\n }\n ${\n args.color\n ? `\n color=\"${args.color}\"`\n : ''\n }\n ${args.iconPosition ? `icon-position=\"${args.iconPosition}\"` : ''}\n >\n ${label}\n </cura-button-select>\n `;\n return `${block}`;\n};\n\nexport default {\n title: 'Componentes/Buttons/Button Select',\n tags: ['autodocs'],\n render: ({ label, ...args }) => {\n return renderCuraButtonSelect(label, args);\n },\n argTypes: {\n label: {\n control: 'text',\n description: 'Texto puro com ou sem quebra de linha dentro do componente. Não é propriedade HTML.',\n name: 'Label',\n },\n disabled: {\n control: 'boolean',\n description: 'Estado desabilitado.',\n table: {\n category: 'State',\n defaultValue: { summary: false },\n },\n },\n selected: {\n control: 'boolean',\n description: 'Estado selecionado.',\n table: {\n category: 'State',\n defaultValue: { summary: false },\n },\n },\n size: {\n control: { type: 'inline-radio' },\n options: ['small', 'medium', 'large'],\n description: 'Tamanhos disponíveis.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'large' },\n },\n },\n color: {\n control: { type: 'select' },\n options: ['', ...baseColors],\n description: 'Cor fundamental do Design System sem profundidade (ex: primary).',\n table: {\n category: 'Properties',\n },\n },\n iconName: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Nome do ícone a ser utilizado no iconset.',\n table: {\n category: 'Icons',\n },\n name: 'icon-name',\n },\n background: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light'],\n description: 'Define cor clara ou escura do componente.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'light' },\n },\n },\n counter: {\n control: 'number',\n description: 'Define o número a ser exibido pelo componente',\n table: {\n category: 'Properties',\n defaultValue: { summary: 1 },\n },\n },\n iconPosition: {\n control: { type: 'inline-radio' },\n options: ['left', 'right'],\n description: 'Define a posição do ícone. Apenas o ícone <b>check</b> é permitido a direita.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'left' },\n },\n },\n },\n};\n\nexport const Button = {\n args: {\n selected: false,\n iconName: 'calendar',\n size: 'medium',\n counter: 1,\n disabled: false,\n background: 'light',\n color: 'primary',\n label: 'Button',\n iconPosition: 'left',\n },\n};\n"]}
@@ -11,6 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
11
11
  return t;
12
12
  };
13
13
  import iconNames from "../../../assets/icons/iconset-default-list";
14
+ import { baseColors } from "../../../utils/utils";
14
15
  const renderCuraButtonTransparent = (label, args) => {
15
16
  const block = `<cura-button-transparent${args.size && args.size !== 'large' ? `
16
17
  size="${args.size}"` : ''}${args.type ? `
@@ -81,7 +82,7 @@ export default {
81
82
  },
82
83
  color: {
83
84
  control: { type: 'select' },
84
- options: ['primary', 'secondary', 'accent', 'info', 'success', 'error', 'warning', 'neutral'],
85
+ options: ['', ...baseColors],
85
86
  description: 'Cor fundamental do Design System sem profundidade (ex: primary).',
86
87
  table: {
87
88
  category: 'Properties',
@@ -1 +1 @@
1
- {"version":3,"file":"cura-button-transparent.stories.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-transparent/cura-button-transparent.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\n\nconst renderCuraButtonTransparent = (label: string, args: any) => {\n const block = `<cura-button-transparent${args.size && args.size !== 'large' ? `\n size=\"${args.size}\"` : ''}${args.type ? `\n type=\"${args.type}\"` : ''}${args.color ? `\n color=\"${args.color}\"` : ''}${args.disabled ? `\n disabled` : ''}${args.isLoading ? `\n is-loading` : ''}${args.fontColor && args.fontColor !== 'dark' ? `\n font-color=\"${args.fontColor}\"` : ''}${args.iconName ? `\n icon-name=\"${args.iconName}\"` : ''}${args.iconPosition && args.iconPosition !== 'left' ? `\n icon-position=\"${args.iconPosition}\"` : ''}${args.iconOnly ? `\n icon-only` : ''}${args.href ? `\n href=\"${args.href}\"` : ''}${args.target ? `\n target=\"${args.target}\"` : ''}${args.textAlign && args.textAlign !== 'left' ? `\n text-align=\"${args.textAlign}\"` : ''}${args.justify ? `\n justify=\"${args.justify}\"` : ''}${args.fullWidth ? `\n style=\"width: 100%;\"` : ''}>\n ${label}\n</cura-button-transparent>`;\n\n return `${block}`;\n};\n\nexport default {\n title: 'Componentes/Buttons/Button Transparent',\n tags: ['autodocs'],\n render: ({ label, ...args }) => {\n return renderCuraButtonTransparent(label, args);\n },\n argTypes: {\n label: {\n control: 'text',\n description: 'Texto puro com ou sem quebra de linha dentro do componente. Não é propriedade HTML.',\n name: 'Label'\n },\n disabled: {\n control: 'boolean',\n description: 'Estado desabilitado.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n }\n },\n isLoading: {\n control: 'boolean',\n description: 'Estado de carregamento. Também desabilita ação do botão e pode ser usado em conjunto com a propriedade disabled.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n },\n name: 'is-loading'\n },\n size: {\n control: { type: 'inline-radio' },\n options: ['small', 'medium', 'large'],\n description: 'Tamanhos disponíveis.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'large' }\n }\n },\n type: {\n control: { type: 'inline-radio' },\n options: ['button', 'submit', 'reset'],\n description: 'Tipo do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'button' }\n }\n },\n color: {\n control: { type: 'select' },\n options: ['primary', 'secondary', 'accent', 'info', 'success', 'error', 'warning', 'neutral'],\n description: 'Cor fundamental do Design System sem profundidade (ex: primary).',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'accent' }\n }\n },\n fontColor: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light'],\n description: 'Define cor clara ou escura do tema de acordo com contexto.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'dark' }\n },\n name: 'font-color'\n },\n textAlign: {\n control: { type: 'inline-radio' },\n options: ['left', 'center', 'right'],\n description: 'Alinha texto de múltiplas linhas.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'left' }\n },\n name: 'text-align'\n },\n justify: {\n control: 'boolean',\n description: 'Expande os elementos internos para a dimensão do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: false }\n }\n },\n fullWidth: {\n control: 'boolean',\n description: 'Não é uma propriedade do componente. Aplicado como estilo CSS diretamente para visualização em largura total',\n table: {\n category: 'CSS',\n defaultValue: { summary: false }\n }\n },\n iconName: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Nome do ícone a ser utilizado no iconset.',\n table: {\n category: 'Icons'\n },\n name: 'icon-name'\n },\n iconPosition: {\n control: { type: 'inline-radio' },\n options: ['left', 'right'],\n description: 'Posição do ícone no botão.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'left' }\n },\n name: 'icon-position'\n },\n iconOnly: {\n control: 'boolean',\n description: 'Oculta o label do botão exibindo somente o ícone.',\n table: {\n category: 'Icons',\n defaultValue: { summary: false }\n },\n name: 'icon-only'\n },\n href: {\n control: 'text',\n description: `Se definido o elemento de ação renderizado internamente será um link.`,\n table: {\n category: 'Properties'\n }\n },\n target: {\n control: 'text',\n description: 'Define o comportamento de abertura do link quando href for informado.',\n table: {\n category: 'Properties',\n defaultValue: { summary: '_self' }\n }\n }\n },\n};\n\nexport const ButtonTransparent = {\n args: {\n label: 'Button',\n type: 'button',\n size: 'medium',\n color: 'primary',\n fontColor: 'dark',\n textAlign: 'left',\n justify: false,\n iconName: '',\n iconPosition: 'left',\n iconOnly: false,\n disabled: false,\n isLoading: false,\n href: '',\n target: '_self',\n fullWidth: false,\n },\n};\n"]}
1
+ {"version":3,"file":"cura-button-transparent.stories.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-transparent/cura-button-transparent.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\nimport { baseColors } from '../../../utils/utils';\n\nconst renderCuraButtonTransparent = (label: string, args: any) => {\n const block = `<cura-button-transparent${args.size && args.size !== 'large' ? `\n size=\"${args.size}\"` : ''}${args.type ? `\n type=\"${args.type}\"` : ''}${args.color ? `\n color=\"${args.color}\"` : ''}${args.disabled ? `\n disabled` : ''}${args.isLoading ? `\n is-loading` : ''}${args.fontColor && args.fontColor !== 'dark' ? `\n font-color=\"${args.fontColor}\"` : ''}${args.iconName ? `\n icon-name=\"${args.iconName}\"` : ''}${args.iconPosition && args.iconPosition !== 'left' ? `\n icon-position=\"${args.iconPosition}\"` : ''}${args.iconOnly ? `\n icon-only` : ''}${args.href ? `\n href=\"${args.href}\"` : ''}${args.target ? `\n target=\"${args.target}\"` : ''}${args.textAlign && args.textAlign !== 'left' ? `\n text-align=\"${args.textAlign}\"` : ''}${args.justify ? `\n justify=\"${args.justify}\"` : ''}${args.fullWidth ? `\n style=\"width: 100%;\"` : ''}>\n ${label}\n</cura-button-transparent>`;\n\n return `${block}`;\n};\n\nexport default {\n title: 'Componentes/Buttons/Button Transparent',\n tags: ['autodocs'],\n render: ({ label, ...args }) => {\n return renderCuraButtonTransparent(label, args);\n },\n argTypes: {\n label: {\n control: 'text',\n description: 'Texto puro com ou sem quebra de linha dentro do componente. Não é propriedade HTML.',\n name: 'Label'\n },\n disabled: {\n control: 'boolean',\n description: 'Estado desabilitado.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n }\n },\n isLoading: {\n control: 'boolean',\n description: 'Estado de carregamento. Também desabilita ação do botão e pode ser usado em conjunto com a propriedade disabled.',\n table: {\n category: 'State',\n defaultValue: { summary: false }\n },\n name: 'is-loading'\n },\n size: {\n control: { type: 'inline-radio' },\n options: ['small', 'medium', 'large'],\n description: 'Tamanhos disponíveis.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'large' }\n }\n },\n type: {\n control: { type: 'inline-radio' },\n options: ['button', 'submit', 'reset'],\n description: 'Tipo do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'button' }\n }\n },\n color: {\n control: { type: 'select' },\n options: ['', ...baseColors],\n description: 'Cor fundamental do Design System sem profundidade (ex: primary).',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'accent' }\n }\n },\n fontColor: {\n control: { type: 'inline-radio' },\n options: ['dark', 'light'],\n description: 'Define cor clara ou escura do tema de acordo com contexto.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'dark' }\n },\n name: 'font-color'\n },\n textAlign: {\n control: { type: 'inline-radio' },\n options: ['left', 'center', 'right'],\n description: 'Alinha texto de múltiplas linhas.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'left' }\n },\n name: 'text-align'\n },\n justify: {\n control: 'boolean',\n description: 'Expande os elementos internos para a dimensão do botão.',\n table: {\n category: 'Properties',\n defaultValue: { summary: false }\n }\n },\n fullWidth: {\n control: 'boolean',\n description: 'Não é uma propriedade do componente. Aplicado como estilo CSS diretamente para visualização em largura total',\n table: {\n category: 'CSS',\n defaultValue: { summary: false }\n }\n },\n iconName: {\n control: { type: 'select' },\n options: ['', ...iconNames],\n description: 'Nome do ícone a ser utilizado no iconset.',\n table: {\n category: 'Icons'\n },\n name: 'icon-name'\n },\n iconPosition: {\n control: { type: 'inline-radio' },\n options: ['left', 'right'],\n description: 'Posição do ícone no botão.',\n table: {\n category: 'Icons',\n defaultValue: { summary: 'left' }\n },\n name: 'icon-position'\n },\n iconOnly: {\n control: 'boolean',\n description: 'Oculta o label do botão exibindo somente o ícone.',\n table: {\n category: 'Icons',\n defaultValue: { summary: false }\n },\n name: 'icon-only'\n },\n href: {\n control: 'text',\n description: `Se definido o elemento de ação renderizado internamente será um link.`,\n table: {\n category: 'Properties'\n }\n },\n target: {\n control: 'text',\n description: 'Define o comportamento de abertura do link quando href for informado.',\n table: {\n category: 'Properties',\n defaultValue: { summary: '_self' }\n }\n }\n },\n};\n\nexport const ButtonTransparent = {\n args: {\n label: 'Button',\n type: 'button',\n size: 'medium',\n color: 'primary',\n fontColor: 'dark',\n textAlign: 'left',\n justify: false,\n iconName: '',\n iconPosition: 'left',\n iconOnly: false,\n disabled: false,\n isLoading: false,\n href: '',\n target: '_self',\n fullWidth: false,\n },\n};\n"]}
@@ -44,7 +44,7 @@ export class CuraAlert {
44
44
  return this.icon ? this.icon : iconMapping[this.type];
45
45
  }
46
46
  render() {
47
- return (h(Host, { key: 'a0b22404673b1568b9cb937150dda71ce4c99d50' }, h("div", { key: 'c30bf1b97d1e1ffaf334ef3bca6cdd1f081c679c', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '1bd88c8a19e073d7b9d967d8df38bb74063cd110', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), h("div", { key: '0df09a27c27c7e1743f7cfb9e71c96b102ff4484', class: "content" }, this.label ? (h("cura-heading", { class: "title", size: "xsmall", color: "neutral-black", weight: "bold", "margin-block": "1px 0" }, this.label)) : '', h("cura-paragraph", { key: '00a039ac0b80bac62eb261c5cf8401b605e867a4', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: 'ba6989082e1f15337d5bb390b799b3dc3fda12eb' })), h("slot", { key: 'def5ab8aeca163432a52c9eb810f69c95d012313', name: "actions" })), this.closeable ?
47
+ return (h(Host, { key: '2bb12a2c1f982aa328da2ba9fd80434459651735', role: "alert", "aria-live": "polite", "aria-atomic": "true", "aria-label": this.label }, h("div", { key: 'c3103080439a2d15dc530fd4d3e1945937da302a', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '0465d437885134eefdc41cdfe74a43a83f9e5265', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), h("div", { key: '15c7545a76db2032e6ee20b8f27b90199cc95020', class: "content" }, this.label ? (h("cura-heading", { class: "title", size: "xsmall", color: "neutral-black", weight: "bold", "margin-block": "1px 0" }, this.label)) : '', h("cura-paragraph", { key: 'af74fc113ffdca4cf4ce4f52133ab1ecfb94f002', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: '5979eac43e2729097ec8d47c1f1b58a5834e4b02' })), h("slot", { key: 'c74a0bf68cb024a04c36392c6c3a2303bdd8e842', name: "actions" })), this.closeable ?
48
48
  (h("cura-icon", { name: "close", size: 16, color: "error-dark", class: "icon-right", onClick: this.handleClose }))
49
49
  : '')));
50
50
  }
@@ -1 +1 @@
1
- {"version":3,"file":"cura-alert.js","sourceRoot":"","sources":["../../../src/components/cura-alert/cura-alert.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Prop, Host, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n@Component({\n tag: 'cura-alert',\n styleUrl: 'cura-alert.scss',\n shadow: true,\n})\nexport class CuraAlert {\n @Element() host: HTMLElement;\n\n @Prop() type: 'info' | 'success' | 'warning' | 'error' = 'info';\n @Prop({ reflect: true }) floating = false;\n @Prop({ reflect: true }) label: string;\n @Prop({ reflect: true }) closeable = true;\n @Prop({ reflect: true }) icon: string;\n\n @State() styles = {};\n\n @Event({ eventName: 'close' }) close: EventEmitter<void>;\n\n @Watch('type')\n setColors() {\n const colors = [\n { name: '--color-lighter', theme: `${this.type}-lighter` },\n { name: '--neutral-black', theme: 'neutral-black' },\n { name: '--color-light', theme: `${this.type}-light` },\n { name: '--color-base', theme: `${this.type}-base` },\n ];\n\n colors.forEach(color => {\n this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.theme);\n });\n this.styles = {...this.styles};\n }\n\n connectedCallback() {\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.setColors();\n }\n\n getClasses() {\n const classes = {};\n classes['conteiner'] = true;\n classes['floating'] = this.floating;\n return classes;\n }\n\n getNameIcon() {\n const iconMapping = {\n info: 'infoCircle',\n success: 'checkCircle',\n warning: 'alertCircle',\n error: 'alertTriangle',\n };\n return this.icon ? this.icon : iconMapping[this.type];\n }\n\n handleClose = () => {\n this.close.emit();\n this.host.remove();\n };\n\n render() {\n return (\n <Host>\n <div class={this.getClasses()} style={this.styles}>\n <cura-icon name={this.getNameIcon()} class=\"icon-left\" size={16} color={`${this.type}-dark`}></cura-icon>\n <div class=\"content\">\n { this.label ? (\n <cura-heading class=\"title\" size=\"xsmall\" color=\"neutral-black\" weight=\"bold\" margin-block=\"1px 0\">\n {this.label}\n </cura-heading>\n ) : ''}\n <cura-paragraph class=\"text\" color={`${this.type}-darker`} size=\"xsmall\" marginBlock=\"0\" lineHeight=\"133.33%\">\n <slot></slot>\n </cura-paragraph>\n <slot name=\"actions\"></slot>\n </div>\n { this.closeable ?\n (<cura-icon name=\"close\" size={16} color=\"error-dark\" class=\"icon-right\" onClick={this.handleClose}></cura-icon>)\n : '' }\n </div>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"cura-alert.js","sourceRoot":"","sources":["../../../src/components/cura-alert/cura-alert.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Prop, Host, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n@Component({\n tag: 'cura-alert',\n styleUrl: 'cura-alert.scss',\n shadow: true,\n})\nexport class CuraAlert {\n @Element() host: HTMLElement;\n\n @Prop() type: 'info' | 'success' | 'warning' | 'error' = 'info';\n @Prop({ reflect: true }) floating = false;\n @Prop({ reflect: true }) label: string;\n @Prop({ reflect: true }) closeable = true;\n @Prop({ reflect: true }) icon: string;\n\n @State() styles = {};\n\n @Event({ eventName: 'close' }) close: EventEmitter<void>;\n\n @Watch('type')\n setColors() {\n const colors = [\n { name: '--color-lighter', theme: `${this.type}-lighter` },\n { name: '--neutral-black', theme: 'neutral-black' },\n { name: '--color-light', theme: `${this.type}-light` },\n { name: '--color-base', theme: `${this.type}-base` },\n ];\n\n colors.forEach(color => {\n this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.theme);\n });\n this.styles = {...this.styles};\n }\n\n connectedCallback() {\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.setColors();\n }\n\n getClasses() {\n const classes = {};\n classes['conteiner'] = true;\n classes['floating'] = this.floating;\n return classes;\n }\n\n getNameIcon() {\n const iconMapping = {\n info: 'infoCircle',\n success: 'checkCircle',\n warning: 'alertCircle',\n error: 'alertTriangle',\n };\n return this.icon ? this.icon : iconMapping[this.type];\n }\n\n handleClose = () => {\n this.close.emit();\n this.host.remove();\n };\n\n render() {\n return (\n <Host role=\"alert\"\n aria-live=\"polite\"\n aria-atomic=\"true\"\n aria-label={this.label}>\n <div class={this.getClasses()} style={this.styles}>\n <cura-icon name={this.getNameIcon()} class=\"icon-left\" size={16} color={`${this.type}-dark`}></cura-icon>\n <div class=\"content\">\n { this.label ? (\n <cura-heading class=\"title\" size=\"xsmall\" color=\"neutral-black\" weight=\"bold\" margin-block=\"1px 0\">\n {this.label}\n </cura-heading>\n ) : ''}\n <cura-paragraph class=\"text\" color={`${this.type}-darker`} size=\"xsmall\" marginBlock=\"0\" lineHeight=\"133.33%\">\n <slot></slot>\n </cura-paragraph>\n <slot name=\"actions\"></slot>\n </div>\n { this.closeable ?\n (<cura-icon name=\"close\" size={16} color=\"error-dark\" class=\"icon-right\" onClick={this.handleClose}></cura-icon>)\n : '' }\n </div>\n </Host>\n );\n }\n}\n"]}
@@ -27,7 +27,7 @@ export class CuraIcon {
27
27
  this.host.style.setProperty(prop, value);
28
28
  }
29
29
  render() {
30
- return (h(Host, { key: 'd2c7487f9fadebc1da94bc4b8cd661a75e0d93ef' }, h("svg", { key: 'd8d0a70bf11cce073da95cce58c2fca4705b4b9f', version: "1.1", viewBox: "0 0 24 24", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg" }, h("use", { key: '10f2f6c34ce7cc782de70d9e9cdd22f54e08acc9', xlinkHref: `${this.assetsPath}/icons/iconset-${this.iconset}.svg#${this.name}` }))));
30
+ return (h(Host, { key: '5dfb1ead36b19cb799e5dad924426356b23500d4', role: "img" }, h("svg", { key: '9df09822b70978c96afb525cf5967145513b4a56', version: "1.1", viewBox: "0 0 24 24", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg" }, h("use", { key: '8ce9a2c0e434ee559a8c0ff2fb14a30093ce434a', xlinkHref: `${this.assetsPath}/icons/iconset-${this.iconset}.svg#${this.name}` }))));
31
31
  }
32
32
  static get is() { return "cura-icon"; }
33
33
  static get encapsulation() { return "shadow"; }
@@ -1 +1 @@
1
- {"version":3,"file":"cura-icon.js","sourceRoot":"","sources":["../../../src/components/cura-icon/cura-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACzE,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAOpD,MAAM,OAAO,QAAQ;;oBAEW,EAAE;qBAChB,cAAc;;uBAEG,SAAS;wBACvB,KAAK;;IAKxB,WAAW,CAAC,IAAqB;QAC/B,MAAM,YAAY,GAAG,CAAC,QAAyB,EAAE,EAAE;YACjD,OAAO,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC,MAAM,GAAG,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;QACjG,CAAC,CAAA;QACD,IAAI,CAAC,eAAe,CAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,CAAC;QACnH,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE,SAAS,CAAC,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,CAAC;IACxG,CAAC;IAID,YAAY;QACV,IAAI,CAAC,eAAe,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,SAAS,CAAC,CAAC,CAAC;IACnI,CAAC;IAID,iBAAiB;QACf,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,eAAe,CAAC;QACjD,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC5B,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAED,eAAe,CAAC,IAAY,EAAE,KAAa;QACzC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IAC3C,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DACE,OAAO,EAAC,KAAK,EACb,OAAO,EAAC,WAAW,EACnB,mBAAmB,EAAC,eAAe,EACnC,KAAK,EAAC,4BAA4B;gBAClC,4DACE,SAAS,EAAE,GAAG,IAAI,CAAC,UAAU,kBAAkB,IAAI,CAAC,OAAO,QAAQ,IAAI,CAAC,IAAI,EAAE,GAC1E,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, h, Prop, Element, Watch } from '@stencil/core';\nimport { iconSizes } from './cura-icon.definitions';\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 @Watch('size')\n sizeHandler(size: string | number) {\n const scaledStroke = (iconSize: string | number) => {\n return `${iconSizes[iconSize].stroke * (iconSizes.default.size / iconSizes[iconSize].size)}px`;\n }\n this.setHostProperty('--size', iconSizes[`${size}`] ? `${iconSizes[size].size}px` : `${iconSizes.default.size}px`);\n this.setHostProperty('--stroke', iconSizes[`${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 || 'neutral'));\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"]}
1
+ {"version":3,"file":"cura-icon.js","sourceRoot":"","sources":["../../../src/components/cura-icon/cura-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACzE,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAOpD,MAAM,OAAO,QAAQ;;oBAEW,EAAE;qBAChB,cAAc;;uBAEG,SAAS;wBACvB,KAAK;;IAKxB,WAAW,CAAC,IAAqB;QAC/B,MAAM,YAAY,GAAG,CAAC,QAAyB,EAAE,EAAE;YACjD,OAAO,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC,MAAM,GAAG,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;QACjG,CAAC,CAAA;QACD,IAAI,CAAC,eAAe,CAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,CAAC;QACnH,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE,SAAS,CAAC,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,CAAC;IACxG,CAAC;IAID,YAAY;QACV,IAAI,CAAC,eAAe,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,SAAS,CAAC,CAAC,CAAC;IACnI,CAAC;IAID,iBAAiB;QACf,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,eAAe,CAAC;QACjD,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC5B,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAED,eAAe,CAAC,IAAY,EAAE,KAAa;QACzC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IAC3C,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,KAAK;YACd,4DACE,OAAO,EAAC,KAAK,EACb,OAAO,EAAC,WAAW,EACnB,mBAAmB,EAAC,eAAe,EACnC,KAAK,EAAC,4BAA4B;gBAClC,4DACE,SAAS,EAAE,GAAG,IAAI,CAAC,UAAU,kBAAkB,IAAI,CAAC,OAAO,QAAQ,IAAI,CAAC,IAAI,EAAE,GAC1E,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, h, Prop, Element, Watch } from '@stencil/core';\nimport { iconSizes } from './cura-icon.definitions';\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 @Watch('size')\n sizeHandler(size: string | number) {\n const scaledStroke = (iconSize: string | number) => {\n return `${iconSizes[iconSize].stroke * (iconSizes.default.size / iconSizes[iconSize].size)}px`;\n }\n this.setHostProperty('--size', iconSizes[`${size}`] ? `${iconSizes[size].size}px` : `${iconSizes.default.size}px`);\n this.setHostProperty('--stroke', iconSizes[`${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 || 'neutral'));\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 role=\"img\">\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"]}
@@ -139,7 +139,7 @@
139
139
  border-radius: calc(var(--cura-spacing-base) * 3px);
140
140
  max-width: 600px;
141
141
  min-width: 200px;
142
- padding: 0px calc(var(--cura-spacing-base) * 4px) calc(var(--cura-spacing-base) * 4px) calc(var(--cura-spacing-base) * 4px);
142
+ padding: calc(var(--cura-spacing-base) * 4px);
143
143
  z-index: var(--zIndex);
144
144
  box-shadow: 0px 8px 16px 0px var(--neutral-black-shadow-4, rgba(38, 38, 38, 0.12));
145
145
  transform: scale(0.95);
@@ -169,6 +169,7 @@
169
169
  }
170
170
  .close.desktop {
171
171
  display: flex;
172
+ padding: 0;
172
173
  }
173
174
 
174
175
  @media (max-width: 768px) {
@@ -46,7 +46,7 @@ export class CuraModal {
46
46
  this.setRight();
47
47
  }
48
48
  render() {
49
- return (h(Host, { key: '96d1bb55eb2e3b1de05a106b81bf1d71920ed62d', role: "dialog", "aria-modal": "true", style: { '--zIndex': this.zindex } }, h("div", { key: 'c95338b0230f898659e3cc880dfdaa665cb3897c', class: this.open ? 'modal container open' : 'modal container', style: this.styles }, h("div", { key: '195abcb943a81e317ef653b7dc17093cf85a7f11', class: this.open ? 'modal backdrop open' : 'modal backdrop', onClick: this.handleClose }), h("div", { key: 'faeee32908544ba4d9d64ac254587fa1b26348ef', class: "wrapper" }, h("button", { key: '753d1f141aa624a3bba4e31d456e08a71c69dd30', class: "close desktop", onClick: this.handleClose }, h("cura-icon", { key: '728fdfdccc431830dcc2e98bce95f05ec4432eed', name: "close", color: "error-dark", size: "small" })), h("slot", { key: '0a70931751e2a1a2ab881e3d41f4e02e8e0622f9' }), h("button", { key: '96bc2140dabb442ab0d0d58e16f608215d3013f1', class: "close mobile", onClick: this.handleClose }, h("cura-icon", { key: '2b40f06d2fb42a71571ef4401777eca2e8061c16', name: "close", color: "error-dark", size: "16" }), h("cura-paragraph", { key: '4946456779b189570a4a6762486b1c9e39cb0288', color: "error-dark", size: "small", marginBlock: "0" }, this.mobileCloseLabel))))));
49
+ return (h(Host, { key: '96d1bb55eb2e3b1de05a106b81bf1d71920ed62d', role: "dialog", "aria-modal": "true", style: { '--zIndex': this.zindex } }, h("div", { key: 'c95338b0230f898659e3cc880dfdaa665cb3897c', class: this.open ? 'modal container open' : 'modal container', style: this.styles }, h("div", { key: '195abcb943a81e317ef653b7dc17093cf85a7f11', class: this.open ? 'modal backdrop open' : 'modal backdrop', onClick: this.handleClose }), h("div", { key: 'faeee32908544ba4d9d64ac254587fa1b26348ef', class: "wrapper" }, h("button", { key: '753d1f141aa624a3bba4e31d456e08a71c69dd30', class: "close desktop", onClick: this.handleClose }, h("cura-icon", { key: '129e1dcfb4b4b048b0a8634182268dd16dd663c9', name: "close", color: "error-dark", size: "16" })), h("slot", { key: 'a199bfb47a3f7b288e5a05f4739a51eef1de2b0f' }), h("button", { key: '84cc6e3f45b754df5369969ba396f2cb49a61b38', class: "close mobile", onClick: this.handleClose }, h("cura-icon", { key: '7e9e2d1792459b5ceaea7b1070fc28b8439624f0', name: "close", color: "error-dark", size: "16" }), h("cura-paragraph", { key: '756739c185ddabd3e793aaa86f6e86941ddbe5b9', color: "error-dark", size: "small", marginBlock: "0" }, this.mobileCloseLabel))))));
50
50
  }
51
51
  static get is() { return "cura-modal"; }
52
52
  static get encapsulation() { return "shadow"; }