@rededor/cura 1.5.0-alpha.0 → 1.5.0-alpha.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/assets/icons/iconset-default-list.ts +1 -1
- package/dist/assets/assets/icons/iconset-default-tmp.svg +26 -0
- package/dist/assets/assets/icons/iconset-default.svg +1 -1
- package/dist/cjs/{cura-accordion_13.cjs.entry.js → cura-accordion_12.cjs.entry.js} +59 -96
- package/dist/cjs/cura-accordion_12.cjs.entry.js.map +1 -0
- package/dist/cjs/cura-badge-distance.cjs.entry.js +1 -1
- package/dist/cjs/cura-badge-distance.cjs.entry.js.map +1 -1
- package/dist/cjs/cura-badge-pill.cjs.entry.js +9 -13
- package/dist/cjs/cura-badge-pill.cjs.entry.js.map +1 -1
- package/dist/cjs/cura-display.cjs.entry.js +1 -1
- package/dist/cjs/cura-dropdown-search.cjs.entry.js +5 -4
- package/dist/cjs/cura-dropdown-search.cjs.entry.js.map +1 -1
- package/dist/cjs/cura-icons-view.cjs.entry.js +1 -1
- package/dist/cjs/cura-icons-view.cjs.entry.js.map +1 -1
- package/dist/cjs/cura-loader-bar.cjs.entry.js +1 -1
- package/dist/cjs/cura-modal.cjs.entry.js +73 -0
- package/dist/cjs/cura-modal.cjs.entry.js.map +1 -0
- package/dist/cjs/cura-stepper.cjs.entry.js +1 -1
- package/dist/cjs/cura-stepper.cjs.entry.js.map +1 -1
- package/dist/cjs/cura-switch.cjs.entry.js +1 -1
- package/dist/cjs/cura.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/assets/icons/iconset-default-list.js +1 -1
- package/dist/collection/assets/icons/iconset-default-list.js.map +1 -1
- package/dist/collection/assets/icons/iconset-default-tmp.svg +26 -0
- package/dist/collection/assets/icons/iconset-default.svg +1 -1
- package/dist/collection/assets-raw/icons/default/accessibility2.svg +4 -0
- package/dist/collection/assets-raw/icons/default/accessibility3.svg +5 -0
- package/dist/collection/assets-raw/icons/default/accessibility4.svg +4 -0
- package/dist/collection/assets-raw/icons/default/elevator.svg +5 -0
- package/dist/collection/assets-raw/icons/default/parking.svg +3 -0
- package/dist/collection/components/badges/cura-badge-distance/cura-badge-distance.css +2 -2
- package/dist/collection/components/badges/cura-badge-pill/cura-badge-pill.js +10 -14
- package/dist/collection/components/badges/cura-badge-pill/cura-badge-pill.js.map +1 -1
- package/dist/collection/components/cura-modal/cura-modal.css +0 -1
- package/dist/collection/components/cura-stepper/cura-stepper.js +1 -1
- package/dist/collection/components/cura-stepper/cura-stepper.js.map +1 -1
- package/dist/collection/components/forms/cura-dropdown-search/cura-dropdown-search.js +5 -4
- package/dist/collection/components/forms/cura-dropdown-search/cura-dropdown-search.js.map +1 -1
- package/dist/collection/components/forms/cura-input-text/cura-input-text.js +3 -1
- package/dist/collection/components/forms/cura-input-text/cura-input-text.js.map +1 -1
- package/dist/collection/components/forms/cura-select/cura-select.css +5 -1
- package/dist/collection/components/forms/cura-select/cura-select.js +99 -24
- package/dist/collection/components/forms/cura-select/cura-select.js.map +1 -1
- package/dist/collection/components/forms/cura-select/cura-select.stories.js +61 -15
- package/dist/collection/components/forms/cura-select/cura-select.stories.js.map +1 -1
- package/dist/collection/components/forms/cura-select-options/cura-select-option.js +1 -1
- package/dist/collection/components/forms/cura-switch/cura-switch.js +1 -1
- package/dist/collection/components/loaders/cura-loader-bar/cura-loader-bar.js +1 -1
- package/dist/collection/components/loaders/cura-loader-circle/cura-loader-circle.js +1 -1
- package/dist/collection/components/text/cura-display/cura-display.js +1 -1
- package/dist/collection/components/text/cura-heading/cura-heading.js +1 -1
- package/dist/collection/components/text/cura-paragraph/cura-paragraph.js +1 -1
- package/dist/components/cura-badge-distance.js +1 -1
- package/dist/components/cura-badge-distance.js.map +1 -1
- package/dist/components/cura-badge-pill2.js +10 -14
- package/dist/components/cura-badge-pill2.js.map +1 -1
- package/dist/components/cura-display.js +1 -1
- package/dist/components/cura-dropdown-search.js +5 -4
- package/dist/components/cura-dropdown-search.js.map +1 -1
- package/dist/components/cura-heading2.js +1 -1
- package/dist/components/cura-icons-view.js +1 -1
- package/dist/components/cura-icons-view.js.map +1 -1
- package/dist/components/cura-input-text2.js +3 -1
- package/dist/components/cura-input-text2.js.map +1 -1
- package/dist/components/cura-loader-bar2.js +1 -1
- package/dist/components/cura-loader-circle2.js +1 -1
- package/dist/components/cura-modal.js +1 -1
- package/dist/components/cura-modal.js.map +1 -1
- package/dist/components/cura-paragraph2.js +1 -1
- package/dist/components/cura-select-option2.js +1 -1
- package/dist/components/cura-select2.js +53 -25
- package/dist/components/cura-select2.js.map +1 -1
- package/dist/components/cura-stepper.js +1 -1
- package/dist/components/cura-stepper.js.map +1 -1
- package/dist/components/cura-switch.js +1 -1
- package/dist/cura/cura.esm.js +1 -1
- package/dist/cura/cura.esm.js.map +1 -1
- package/dist/cura/{p-a5af4225.entry.js → p-3030774e.entry.js} +2 -2
- package/dist/cura/p-629c34fe.entry.js +2 -0
- package/dist/cura/p-629c34fe.entry.js.map +1 -0
- package/dist/cura/{p-46b21329.entry.js → p-70adcf7b.entry.js} +2 -2
- package/dist/cura/p-7f25f4dc.entry.js +2 -0
- package/dist/cura/p-7f25f4dc.entry.js.map +1 -0
- package/dist/cura/p-935eeb7b.entry.js +2 -0
- package/dist/cura/p-935eeb7b.entry.js.map +1 -0
- package/dist/cura/p-9d7c6e96.entry.js +2 -0
- package/dist/cura/p-9d7c6e96.entry.js.map +1 -0
- package/dist/cura/p-a4a1f6c6.entry.js +2 -0
- package/dist/cura/p-a4a1f6c6.entry.js.map +1 -0
- package/dist/cura/{p-cfbe2bce.entry.js → p-bd99ef4c.entry.js} +2 -2
- package/dist/cura/{p-cfbe2bce.entry.js.map → p-bd99ef4c.entry.js.map} +1 -1
- package/dist/cura/{p-6f1a3fe5.entry.js → p-ced52230.entry.js} +2 -2
- package/dist/cura/p-ced52230.entry.js.map +1 -0
- package/dist/cura/{p-a7c60a4e.entry.js → p-ee8db3dc.entry.js} +2 -2
- package/dist/esm/{cura-accordion_13.entry.js → cura-accordion_12.entry.js} +60 -96
- package/dist/esm/cura-accordion_12.entry.js.map +1 -0
- package/dist/esm/cura-badge-distance.entry.js +1 -1
- package/dist/esm/cura-badge-distance.entry.js.map +1 -1
- package/dist/esm/cura-badge-pill.entry.js +9 -13
- package/dist/esm/cura-badge-pill.entry.js.map +1 -1
- package/dist/esm/cura-display.entry.js +1 -1
- package/dist/esm/cura-dropdown-search.entry.js +5 -4
- package/dist/esm/cura-dropdown-search.entry.js.map +1 -1
- package/dist/esm/cura-icons-view.entry.js +1 -1
- package/dist/esm/cura-icons-view.entry.js.map +1 -1
- package/dist/esm/cura-loader-bar.entry.js +1 -1
- package/dist/esm/cura-modal.entry.js +69 -0
- package/dist/esm/cura-modal.entry.js.map +1 -0
- package/dist/esm/cura-stepper.entry.js +1 -1
- package/dist/esm/cura-stepper.entry.js.map +1 -1
- package/dist/esm/cura-switch.entry.js +1 -1
- package/dist/esm/cura.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/badges/cura-badge-pill/cura-badge-pill.d.ts +1 -1
- package/dist/types/components/forms/cura-select/cura-select.d.ts +18 -8
- package/dist/types/components/forms/cura-select/cura-select.stories.d.ts +25 -0
- package/dist/types/components.d.ts +15 -0
- package/package.json +2 -2
- package/dist/cjs/cura-accordion_13.cjs.entry.js.map +0 -1
- package/dist/cura/p-23fa2246.entry.js +0 -2
- package/dist/cura/p-23fa2246.entry.js.map +0 -1
- package/dist/cura/p-2af6216a.entry.js +0 -2
- package/dist/cura/p-2af6216a.entry.js.map +0 -1
- package/dist/cura/p-6e4f4fbf.entry.js +0 -2
- package/dist/cura/p-6e4f4fbf.entry.js.map +0 -1
- package/dist/cura/p-6f1a3fe5.entry.js.map +0 -1
- package/dist/cura/p-7ba80d78.entry.js +0 -2
- package/dist/cura/p-7ba80d78.entry.js.map +0 -1
- package/dist/esm/cura-accordion_13.entry.js.map +0 -1
- /package/dist/cura/{p-a5af4225.entry.js.map → p-3030774e.entry.js.map} +0 -0
- /package/dist/cura/{p-46b21329.entry.js.map → p-70adcf7b.entry.js.map} +0 -0
- /package/dist/cura/{p-a7c60a4e.entry.js.map → p-ee8db3dc.entry.js.map} +0 -0
package/dist/cura/cura.esm.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,b as o}from"./p-fd5ed6b0.js";export{s as setNonce}from"./p-fd5ed6b0.js";import{g as l}from"./p-82b99090.js";var a=()=>{const o=import.meta.url;const l={};if(o!==""){l.resourcesUrl=new URL(".",o).href}return e(l)};a().then((async e=>{await l();return o(JSON.parse('[["p-6f1a3fe5",[[65,"cura-button",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors"]}],[1,"cura-accordion-item",{"label":[513],"iconSize":[514,"icon-size"],"labelIcon":[513,"label-icon"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"colorMode":[1,"color-mode"],"level":[514],"opened":[1540],"styles":[32]}],[1,"cura-modal",{"open":[1540],"background":[1],"top":[2],"bottom":[2],"left":[2],"right":[2],"mobileCloseLabel":[513,"mobile-close-label"],"zindex":[513],"styles":[32]},null,{"background":["setColors"],"top":["setTop"],"bottom":["setBottom"],"left":["setLeft"],"right":["setRight"]}],[1,"cura-accordion",{"color":[513],"colorMode":[513,"color-mode"],"iconSize":[514,"icon-size"],"labelIcon":[513,"label-icon"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"behavior":[513],"level":[514],"styles":[32]},null,{"color":["handleChangeColor"]}],[1,"cura-page-template",{"contentwidth":[513]}],[65,"cura-input-text",{"mode":[1537],"status":[1537],"size":[1537],"type":[513],"inputMode":[513,"input-mode"],"label":[513],"name":[513],"placeholder":[513],"value":[1032],"iconName":[1537,"icon-name"],"helperText":[1537,"helper-text"],"disabled":[516],"required":[516],"maskPreset":[8,"mask-preset"],"enableSelectionMode":[1540,"enable-selection-mode"],"maskRegex":[1537,"mask-regex"],"maskAdvanced":[1544,"mask-advanced"],"maxlength":[1538],"readOnly":[516,"read-only"],"isLoading":[1540,"is-loading"],"clearIcon":[1540,"clear-icon"],"hideErrorIcon":[4,"hide-error-icon"],"autocomplete":[513],"isHovered":[32],"isFocused":[32],"styles":[32]},null,{"styles":["connectedCallback"],"size":["getClasses"],"status":["renderIcon"],"mode":["renderIcon"],"maskPreset":["initializeMask"],"maskRegex":["initializeMask"],"maskAdvanced":["initializeMask"]}],[65,"cura-select",{"label":[513],"placeholder":[513],"value":[1537],"mode":[513],"size":[513],"status":[1537],"disabled":[516],"required":[516],"searchBehavior":[516,"search-behavior"],"isHovered":[32],"isFocused":[32],"isOpen":[32],"options":[32],"activeIndex":[32],"textInput":[32]},null,{"activeIndex":["updateOptionHighlights"],"textInput":["filterOptions"],"value":["handleValueChange"]}],[1,"cura-select-option",{"value":[513],"selected":[516],"active":[516],"size":[1],"styles":[32]},null,{"size":["getSize"]}],[1,"cura-heading",{"level":[514],"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-loader-circle",{"size":[513],"color":[513]}],[1,"cura-paragraph",{"size":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-icon",{"name":[513],"color":[1],"size":[8],"iconset":[513],"disabled":[4]},null,{"size":["sizeHandler"],"color":["colorHandler"],"disabled":["colorHandler"]}],[1,"cura-label",{"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["p-4aefe237",[[65,"cura-input-date",{"label":[513],"status":[1537],"size":[513],"name":[513],"helperText":[513,"helper-text"],"enableRangeDates":[516,"enable-range-dates"],"disableFutureDates":[516,"disable-future-dates"],"disablePassDates":[516,"disable-pass-dates"],"iconName":[513,"icon-name"],"placeholder":[513],"styles":[32],"isCalendarVisible":[32],"dates":[32],"value":[32],"dateSettings":[32]},[[8,"click","handleClick"]],{"enableRangeDates":["updateDateSettings"]}]]],["p-cfbe2bce",[[1,"cura-stepper",{"activeStepIndex":[514,"active-step-index"],"errorInCurrentStep":[516,"error-in-current-step"],"displayHeading":[516,"display-heading"],"variant":[513],"steps":[1],"styles":[32],"stepList":[32]}]]],["p-8622c492",[[1,"cura-tooltip",{"elementId":[1,"element-id"],"interactive":[4],"delay":[2],"maxWidth":[1,"max-width"],"position":[513],"label":[513],"closeButton":[516,"close-button"],"isMobile":[32]},[[9,"resize","onWindowResize"],[9,"scroll","onWindowScroll"]]]]],["p-23fa2246",[[1,"cura-dropdown-search",{"size":[1537],"status":[513],"disabled":[516],"name":[513],"required":[1540],"selected":[1540],"value":[1537],"placeholder":[1537],"label":[1537],"iconName":[513,"icon-name"],"dropdownMaxHeight":[513,"dropdown-max-height"],"overlayVisible":[32],"isDropdownOpen":[32],"styles":[32],"isMobile":[32],"mode":[32],"inputTextRef":[32],"isOnBlurInput":[32],"hoveredIndex":[32],"options":[32],"originalOverflow":[32],"screenDefaultHeight":[32]},null,{"value":["onValueChange"]}]]],["p-3c0931d3",[[1,"cura-toast",{"type":[1],"position":[1],"icon":[513],"label":[513],"closeButton":[516,"close-button"],"loader":[516],"autoCloseDelay":[514,"auto-close-delay"],"styles":[32],"progress":[32]},null,{"type":["handleChangeType"],"position":["handleChangeType"]}]]],["p-b3e93e74",[[1,"cura-alert",{"type":[1],"floating":[516],"label":[513],"closeable":[516],"icon":[513],"styles":[32]},null,{"type":["setColors"]}]]],["p-0a133399",[[65,"cura-button-outline",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[1],"fontColor":[1,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors","getSymbolColor"],"fontColor":["getSymbolColor"]}]]],["p-545e8e55",[[1,"cura-button-select",{"selected":[1540],"iconName":[1537,"icon-name"],"size":[513],"counter":[1538],"disabled":[516],"background":[1],"color":[1],"iconPosition":[513,"icon-position"],"hovered":[32],"styles":[32]},null,{"background":["setColors"],"color":["setColors"]}]]],["p-f96b0923",[[65,"cura-checkbox",{"checked":[1540],"indeterminate":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"size":[513],"background":[1],"iconColor":[1,"icon-color"],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"],"iconColor":["assignColor"]}]]],["p-2af6216a",[[1,"cura-icons-view",{"selected":[32]}]]],["p-d13e3295",[[65,"cura-radio",{"checked":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"background":[1],"size":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"]}]]],["p-6e4f4fbf",[[1,"cura-badge-distance",{"distance":[2],"label":[513],"styles":[32],"displayDistance":[32]},null,{"distance":["formatDistance"]}]]],["p-235ac0b4",[[1,"cura-dropdown-search-option",{"value":[513],"selected":[1540],"selectable":[516],"hovered":[1540],"styles":[32]},null,{"selected":["updateIconColor"]}]]],["p-6624108e",[[1,"cura-dropdown-search-option-title"]]],["p-a7c60a4e",[[65,"cura-switch",{"checked":[1540],"disabled":[516],"label":[513],"ontabindex":[514],"position":[513],"size":[513],"background":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors"]}]]],["p-164ddb46",[[1,"cura-avatar",{"size":[1],"backgroundColor":[513,"background-color"],"borderColor":[513,"border-color"],"borderRadius":[513,"border-radius"],"border":[516],"type":[513],"imageSrc":[1537,"image-src"],"imageSrcDefault":[513,"image-src-default"],"floating":[516],"styles":[32]},null,{"size":["sizeHandler"]}]]],["p-6b627841",[[1,"cura-badge-dot",{"color":[1],"disabled":[516],"type":[513],"styles":[32]}]]],["p-bce10f9b",[[1,"cura-card",{"hasPadding":[1028,"has-padding"],"hasShadow":[1028,"has-shadow"],"type":[1025],"colorMode":[1025,"color-mode"],"href":[1537],"target":[513],"styles":[32]}]]],["p-46b21329",[[1,"cura-display",{"level":[514],"size":[513],"spotColor":[1,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["p-ec7876d3",[[1,"cura-calendar",{"period":[513],"width":[513],"minWidth":[513,"min-width"],"maxWidth":[513,"max-width"],"mode":[513],"dateFormat":[1537,"date-format"],"locale":[513],"type":[513],"disable":[16],"enable":[16],"defaultDate":[1537,"default-date"],"customDates":[16],"limitRange":[514,"limit-range"],"disablePassDates":[1540,"disable-pass-dates"],"disableFutureDates":[1540,"disable-future-dates"],"collapsed":[1540],"floating":[1540],"embedded":[1540],"currentDate":[32],"selectedDates":[32],"rangeStart":[32],"defaultDates":[32],"selectMonth":[32],"selectYear":[32],"styles":[32]},null,{"customDates":["watchDefaultDatesArray"],"defaultDate":["handleDefaultDateChange"]}]]],["p-529332d3",[[1,"cura-badge-counter",{"number":[514],"color":[1],"disabled":[4],"type":[1],"styles":[32]},null,{"disabled":["handleColorChange"],"color":["handleColorChange"],"type":["handleColorChange"]}]]],["p-a5af4225",[[1,"cura-loader-bar",{"color":[1],"progress":[2],"styles":[32]},null,{"color":["handleChangeColor"],"progress":["handleProgress"]}]]],["p-7ba80d78",[[1,"cura-badge-pill",{"type":[513],"color":[1],"iconName":[513,"icon-name"],"iconset":[513],"disabled":[516],"iconOnly":[516,"icon-only"],"borderRadius":[513,"border-radius"],"styles":[32]},null,{"color":["handleColorChange"]}]]],["p-557b90c4",[[1,"cura-stepper-item",{"displayHeading":[516,"display-heading"],"heading":[513],"label":[513],"status":[513],"styles":[32]}],[1,"cura-progress-bar",{"progressColor":[513,"progress-color"],"progress":[514],"size":[514],"strokeWidth":[514,"stroke-width"],"active":[516]}]]],["p-04006a3e",[[65,"cura-button-transparent",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"hovered":[32],"styles":[32]},null,{"fontColor":["getSymbolColor"],"color":["getSymbolColor"]}]]]]'),e)}));
|
|
1
|
+
import{p as e,b as o}from"./p-fd5ed6b0.js";export{s as setNonce}from"./p-fd5ed6b0.js";import{g as l}from"./p-82b99090.js";var a=()=>{const o=import.meta.url;const l={};if(o!==""){l.resourcesUrl=new URL(".",o).href}return e(l)};a().then((async e=>{await l();return o(JSON.parse('[["p-ced52230",[[65,"cura-button",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors"]}],[1,"cura-accordion-item",{"label":[513],"iconSize":[514,"icon-size"],"labelIcon":[513,"label-icon"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"colorMode":[1,"color-mode"],"level":[514],"opened":[1540],"styles":[32]}],[1,"cura-accordion",{"color":[513],"colorMode":[513,"color-mode"],"iconSize":[514,"icon-size"],"labelIcon":[513,"label-icon"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"behavior":[513],"level":[514],"styles":[32]},null,{"color":["handleChangeColor"]}],[1,"cura-page-template",{"contentwidth":[513]}],[65,"cura-input-text",{"mode":[1537],"status":[1537],"size":[1537],"type":[513],"inputMode":[513,"input-mode"],"label":[513],"name":[513],"placeholder":[513],"value":[1032],"iconName":[1537,"icon-name"],"helperText":[1537,"helper-text"],"disabled":[516],"required":[516],"maskPreset":[8,"mask-preset"],"enableSelectionMode":[1540,"enable-selection-mode"],"maskRegex":[1537,"mask-regex"],"maskAdvanced":[1544,"mask-advanced"],"maxlength":[1538],"readOnly":[516,"read-only"],"isLoading":[1540,"is-loading"],"clearIcon":[1540,"clear-icon"],"hideErrorIcon":[4,"hide-error-icon"],"autocomplete":[513],"isHovered":[32],"isFocused":[32],"styles":[32]},null,{"styles":["connectedCallback"],"size":["getClasses"],"status":["renderIcon"],"mode":["renderIcon"],"maskPreset":["initializeMask"],"maskRegex":["initializeMask"],"maskAdvanced":["initializeMask"]}],[65,"cura-select",{"label":[513],"placeholder":[513],"value":[1537],"mode":[513],"size":[513],"iconName":[1,"icon-name"],"status":[1537],"disabled":[516],"required":[516],"searchBehavior":[516,"search-behavior"],"caseSensitive":[516,"case-sensitive"],"isHovered":[32],"isFocused":[32],"isOpen":[32],"options":[32],"activeIndex":[32],"textInput":[32]},null,{"activeIndex":["updateOptionHighlights"],"textInput":["filterOptions"],"value":["handleValueChange"]}],[1,"cura-select-option",{"value":[513],"selected":[516],"active":[516],"size":[1],"styles":[32]},null,{"size":["getSize"]}],[1,"cura-heading",{"level":[514],"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-loader-circle",{"size":[513],"color":[513]}],[1,"cura-paragraph",{"size":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-icon",{"name":[513],"color":[1],"size":[8],"iconset":[513],"disabled":[4]},null,{"size":["sizeHandler"],"color":["colorHandler"],"disabled":["colorHandler"]}],[1,"cura-label",{"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["p-4aefe237",[[65,"cura-input-date",{"label":[513],"status":[1537],"size":[513],"name":[513],"helperText":[513,"helper-text"],"enableRangeDates":[516,"enable-range-dates"],"disableFutureDates":[516,"disable-future-dates"],"disablePassDates":[516,"disable-pass-dates"],"iconName":[513,"icon-name"],"placeholder":[513],"styles":[32],"isCalendarVisible":[32],"dates":[32],"value":[32],"dateSettings":[32]},[[8,"click","handleClick"]],{"enableRangeDates":["updateDateSettings"]}]]],["p-bd99ef4c",[[1,"cura-stepper",{"activeStepIndex":[514,"active-step-index"],"errorInCurrentStep":[516,"error-in-current-step"],"displayHeading":[516,"display-heading"],"variant":[513],"steps":[1],"styles":[32],"stepList":[32]}]]],["p-8622c492",[[1,"cura-tooltip",{"elementId":[1,"element-id"],"interactive":[4],"delay":[2],"maxWidth":[1,"max-width"],"position":[513],"label":[513],"closeButton":[516,"close-button"],"isMobile":[32]},[[9,"resize","onWindowResize"],[9,"scroll","onWindowScroll"]]]]],["p-9d7c6e96",[[1,"cura-dropdown-search",{"size":[1537],"status":[513],"disabled":[516],"name":[513],"required":[1540],"selected":[1540],"value":[1537],"placeholder":[1537],"label":[1537],"iconName":[513,"icon-name"],"dropdownMaxHeight":[513,"dropdown-max-height"],"overlayVisible":[32],"isDropdownOpen":[32],"styles":[32],"isMobile":[32],"mode":[32],"inputTextRef":[32],"isOnBlurInput":[32],"hoveredIndex":[32],"options":[32],"originalOverflow":[32],"screenDefaultHeight":[32]},null,{"value":["onValueChange"]}]]],["p-3c0931d3",[[1,"cura-toast",{"type":[1],"position":[1],"icon":[513],"label":[513],"closeButton":[516,"close-button"],"loader":[516],"autoCloseDelay":[514,"auto-close-delay"],"styles":[32],"progress":[32]},null,{"type":["handleChangeType"],"position":["handleChangeType"]}]]],["p-b3e93e74",[[1,"cura-alert",{"type":[1],"floating":[516],"label":[513],"closeable":[516],"icon":[513],"styles":[32]},null,{"type":["setColors"]}]]],["p-0a133399",[[65,"cura-button-outline",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[1],"fontColor":[1,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors","getSymbolColor"],"fontColor":["getSymbolColor"]}]]],["p-545e8e55",[[1,"cura-button-select",{"selected":[1540],"iconName":[1537,"icon-name"],"size":[513],"counter":[1538],"disabled":[516],"background":[1],"color":[1],"iconPosition":[513,"icon-position"],"hovered":[32],"styles":[32]},null,{"background":["setColors"],"color":["setColors"]}]]],["p-f96b0923",[[65,"cura-checkbox",{"checked":[1540],"indeterminate":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"size":[513],"background":[1],"iconColor":[1,"icon-color"],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"],"iconColor":["assignColor"]}]]],["p-7f25f4dc",[[1,"cura-icons-view",{"selected":[32]}]]],["p-a4a1f6c6",[[1,"cura-modal",{"open":[1540],"background":[1],"top":[2],"bottom":[2],"left":[2],"right":[2],"mobileCloseLabel":[513,"mobile-close-label"],"zindex":[513],"styles":[32]},null,{"background":["setColors"],"top":["setTop"],"bottom":["setBottom"],"left":["setLeft"],"right":["setRight"]}]]],["p-d13e3295",[[65,"cura-radio",{"checked":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"background":[1],"size":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"]}]]],["p-935eeb7b",[[1,"cura-badge-distance",{"distance":[2],"label":[513],"styles":[32],"displayDistance":[32]},null,{"distance":["formatDistance"]}]]],["p-235ac0b4",[[1,"cura-dropdown-search-option",{"value":[513],"selected":[1540],"selectable":[516],"hovered":[1540],"styles":[32]},null,{"selected":["updateIconColor"]}]]],["p-6624108e",[[1,"cura-dropdown-search-option-title"]]],["p-ee8db3dc",[[65,"cura-switch",{"checked":[1540],"disabled":[516],"label":[513],"ontabindex":[514],"position":[513],"size":[513],"background":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors"]}]]],["p-164ddb46",[[1,"cura-avatar",{"size":[1],"backgroundColor":[513,"background-color"],"borderColor":[513,"border-color"],"borderRadius":[513,"border-radius"],"border":[516],"type":[513],"imageSrc":[1537,"image-src"],"imageSrcDefault":[513,"image-src-default"],"floating":[516],"styles":[32]},null,{"size":["sizeHandler"]}]]],["p-6b627841",[[1,"cura-badge-dot",{"color":[1],"disabled":[516],"type":[513],"styles":[32]}]]],["p-bce10f9b",[[1,"cura-card",{"hasPadding":[1028,"has-padding"],"hasShadow":[1028,"has-shadow"],"type":[1025],"colorMode":[1025,"color-mode"],"href":[1537],"target":[513],"styles":[32]}]]],["p-70adcf7b",[[1,"cura-display",{"level":[514],"size":[513],"spotColor":[1,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["p-ec7876d3",[[1,"cura-calendar",{"period":[513],"width":[513],"minWidth":[513,"min-width"],"maxWidth":[513,"max-width"],"mode":[513],"dateFormat":[1537,"date-format"],"locale":[513],"type":[513],"disable":[16],"enable":[16],"defaultDate":[1537,"default-date"],"customDates":[16],"limitRange":[514,"limit-range"],"disablePassDates":[1540,"disable-pass-dates"],"disableFutureDates":[1540,"disable-future-dates"],"collapsed":[1540],"floating":[1540],"embedded":[1540],"currentDate":[32],"selectedDates":[32],"rangeStart":[32],"defaultDates":[32],"selectMonth":[32],"selectYear":[32],"styles":[32]},null,{"customDates":["watchDefaultDatesArray"],"defaultDate":["handleDefaultDateChange"]}]]],["p-529332d3",[[1,"cura-badge-counter",{"number":[514],"color":[1],"disabled":[4],"type":[1],"styles":[32]},null,{"disabled":["handleColorChange"],"color":["handleColorChange"],"type":["handleColorChange"]}]]],["p-3030774e",[[1,"cura-loader-bar",{"color":[1],"progress":[2],"styles":[32]},null,{"color":["handleChangeColor"],"progress":["handleProgress"]}]]],["p-629c34fe",[[1,"cura-badge-pill",{"type":[513],"color":[1],"iconName":[513,"icon-name"],"iconset":[513],"disabled":[516],"iconOnly":[516,"icon-only"],"borderRadius":[513,"border-radius"],"styles":[32]},null,{"color":["watchColorChange"]}]]],["p-557b90c4",[[1,"cura-stepper-item",{"displayHeading":[516,"display-heading"],"heading":[513],"label":[513],"status":[513],"styles":[32]}],[1,"cura-progress-bar",{"progressColor":[513,"progress-color"],"progress":[514],"size":[514],"strokeWidth":[514,"stroke-width"],"active":[516]}]]],["p-04006a3e",[[65,"cura-button-transparent",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"hovered":[32],"styles":[32]},null,{"fontColor":["getSymbolColor"],"color":["getSymbolColor"]}]]]]'),e)}));
|
|
2
2
|
//# sourceMappingURL=cura.esm.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","JSON","parse"],"sources":["../../node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.22.0 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo(\"Running in development mode.\");\n }\n if (BUILD.cloneNodeFix) {\n patchCloneNodeFix(H.prototype);\n }\n const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n ) : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n if (importMeta !== \"\") {\n opts.resourcesUrl = new URL(\".\", importMeta).href;\n }\n return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function(deep) {\n if (this.nodeName === \"TEMPLATE\") {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport {\n patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n await globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"0HAOA,IAAIA,EAAe,KAUjB,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACrBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACjD,CACE,OAAOC,EAAeJ,EAAK,EClB7BH,IAAeQ,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAcC,KAAAC,MAAA,
|
|
1
|
+
{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","JSON","parse"],"sources":["../../node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.22.0 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo(\"Running in development mode.\");\n }\n if (BUILD.cloneNodeFix) {\n patchCloneNodeFix(H.prototype);\n }\n const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n ) : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n if (importMeta !== \"\") {\n opts.resourcesUrl = new URL(\".\", importMeta).href;\n }\n return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function(deep) {\n if (this.nodeName === \"TEMPLATE\") {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport {\n patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n await globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"0HAOA,IAAIA,EAAe,KAUjB,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACrBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACjD,CACE,OAAOC,EAAeJ,EAAK,EClB7BH,IAAeQ,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAcC,KAAAC,MAAA,gjVAAuCJ,EAAA","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as s,h as r,H as t,g as e}from"./p-fd5ed6b0.js";const
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as s,h as r,H as t,g as e}from"./p-fd5ed6b0.js";const a=":host{display:block}:host .progress-bar{position:absolute;left:0;bottom:0;width:100%;height:4px;background-color:var(--neutral-base)}:host .progress-bar span{position:absolute;left:0;bottom:0;width:var(--bar-width);height:100%;border-radius:0 2px 2px 0;background-color:var(--color-base);transition:width 0.2s linear}";const o=a;const i=class{constructor(r){s(this,r);this.color="primary-base";this.progress=0;this.styles={}}handleChangeColor(){this.setColor()}handleProgress(){this.setProgress()}connectedCallback(){this.setColor();this.setProgress()}render(){return r(t,{key:"4dc7ef7b17bfb408fa7ff9a74509637bb9045353"},r("div",{key:"cd2654377f0b45c5b6fa6aa57940f5d81cfd0cce",id:"progress-bar",class:"progress-bar",style:this.styles},r("span",{key:"5d7b4a058162b840f167adb81843403f6c488c4e",class:"progress-bar-fill"})))}setColor(){this.styles=Object.assign(Object.assign({},this.styles),{"--neutral-base":window.CuraAPI.theme.colors.getColor(`neutral-base`,.2),"--color-base":window.CuraAPI.theme.colors.getColor(this.color)})}setProgress(){this.styles=Object.assign(Object.assign({},this.styles),{"--bar-width":`${this.progress}%`})}get host(){return e(this)}static get watchers(){return{color:["handleChangeColor"],progress:["handleProgress"]}}};i.style=o;export{i as cura_loader_bar};
|
|
2
|
+
//# sourceMappingURL=p-3030774e.entry.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,h as t,H as a,g as r}from"./p-fd5ed6b0.js";const o='.badge-container{display:flex;align-items:center;justify-content:center;gap:calc(var(--base-spacing) * 1px);padding:calc(var(--base-spacing) * 1px);border-radius:var(--border-radius);font-family:var(--font-family);font-size:var(--font-size);position:relative;box-sizing:border-box;width:fit-content;height:calc(var(--base-spacing) * 5px);min-width:calc(var(--base-spacing) * 5px);background-color:var(--color-background)}.badge-container::before{content:"";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:1px solid transparent;border-radius:var(--border-radius);pointer-events:none}.badge-container.icon-only cura-label{display:none !important}.badge-container.disabled{background-color:var(--color-background-disabled)}.badge-container.outline{background-color:transparent}.badge-container.outline::before{border:1px solid var(--color-base)}.badge-container.outline.disabled::before{border:1px solid var(--color-outline-disabled)}.badge-container.transparent{background-color:transparent}.badge-container.transparent::before{border:1px solid transparent}.badge-container.transparent.disabled{background-color:transparent}.badge-container cura-icon{display:flex}';const i=o;const s=class{constructor(t){e(this,t);this.theme=window.CuraAPI.theme;this.type="solid";this.color="primary";this.iconName=undefined;this.iconset="default";this.disabled=false;this.iconOnly=false;this.borderRadius="2px";this.styles={}}watchColorChange(){this.setColors()}connectedCallback(){this.setBaseStyles();this.setColors()}setBaseStyles(){this.styles=Object.assign(Object.assign({},this.styles),{"--base-spacing":this.theme.spacing.getSpacing(),"--font-family":this.theme.fonts.getFamily(),"--font-size":this.theme.fonts.getSize()})}setColors(){const e=[{name:"--color-background",theme:`${this.color}-lighter`},{name:"--color-base",theme:`${this.color}-dark`},{name:"--color-background-disabled",theme:"neutral-pale"},{name:"--color-outline-disabled",theme:"neutral-medium"}];const t=Object.assign({},this.styles);e.forEach((e=>{t[e.name]=this.theme.colors.getColor(e.theme)}));this.styles=t}hostCSSProperties(){return{"--border-radius":this.borderRadius||"2px"}}getClasses(){const e={};e["badge-container"]=true;e[`icon-only`]=this.iconOnly;e["disabled"]=this.disabled;e[`${this.type}`]=true;return e}getSymbolColor(){return this.disabled?"neutral-medium":`${this.color}-dark`}getIcon(){if(!this.iconName)return"";return t("cura-icon",{name:this.iconName,iconset:this.iconset,size:"micro",color:this.getSymbolColor()})}render(){const e=this.getSymbolColor();return t(a,{key:"ac5aafc485ee2a88514a34fc5025f54c01901a46",style:this.hostCSSProperties()},t("div",{key:"7f32b824ab54471c0517980e6e4ed2b1b21fd435",class:this.getClasses(),style:this.styles},this.getIcon(),t("cura-label",{key:"c2ef8d70153a5b8498cf2cb3ce6b60f80aec1d51",size:"xsmall","line-height":"117%",color:e},t("slot",{key:"758b0c994aab961f4c76b7030028268aa8c2364f"}))))}get host(){return r(this)}static get watchers(){return{color:["watchColorChange"]}}};s.style=i;export{s as cura_badge_pill};
|
|
2
|
+
//# sourceMappingURL=p-629c34fe.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["curaBadgePillCss","CuraBadgePillStyle0","CuraBadgePill","this","theme","window","CuraAPI","watchColorChange","setColors","connectedCallback","setBaseStyles","styles","Object","assign","spacing","getSpacing","fonts","getFamily","getSize","colors","name","color","newStyles","forEach","getColor","hostCSSProperties","borderRadius","getClasses","classes","iconOnly","disabled","type","getSymbolColor","getIcon","iconName","h","iconset","size","render","symbolColor","Host","key","style","class"],"sources":["src/components/badges/cura-badge-pill/cura-badge-pill.scss?tag=cura-badge-pill&encapsulation=shadow","src/components/badges/cura-badge-pill/cura-badge-pill.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n.badge-container {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: #{$spacing-tiny};\n padding: #{$spacing-tiny};\n border-radius: var(--border-radius);\n font-family: var(--font-family);\n font-size: var(--font-size);\n position: relative;\n box-sizing: border-box;\n width: fit-content;\n height: #{$spacing-xs};\n min-width: #{$spacing-xs};\n\n background-color: var(--color-background);\n\n &::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0px;\n top: 0px;\n box-sizing: border-box;\n border: 1px solid transparent;\n border-radius: var(--border-radius);\n pointer-events: none;\n }\n\n &.icon-only {\n cura-label {\n display: none !important;\n }\n }\n\n &.disabled {\n background-color: var(--color-background-disabled);\n }\n\n &.outline {\n background-color: transparent;\n\n &::before {\n border: 1px solid var(--color-base);\n }\n\n &.disabled::before {\n border: 1px solid var(--color-outline-disabled);\n }\n }\n\n &.transparent {\n background-color: transparent;\n\n &::before {\n border: 1px solid transparent;\n }\n\n &.disabled {\n background-color: transparent;\n }\n }\n\n cura-icon {\n display: flex;\n }\n}\n","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"],"mappings":"yDAAA,MAAMA,EAAmB,orCACzB,MAAAC,EAAeD,E,MCMFE,EAAa,M,yBAwCxBC,KAAAC,MAAQC,OAAOC,QAAQF,M,UAlC8C,Q,WAKsC,U,qCAUxE,U,cAKC,M,cAKA,M,kBAKY,M,YAE9B,E,CAKlB,gBAAAG,GACEJ,KAAKK,W,CAGP,iBAAAC,GACEN,KAAKO,gBACLP,KAAKK,W,CAGC,aAAAE,GACNP,KAAKQ,OAAMC,OAAAC,OAAAD,OAAAC,OAAA,GACNV,KAAKQ,QAAM,CACd,iBAAkBR,KAAKC,MAAMU,QAAQC,aACrC,gBAAiBZ,KAAKC,MAAMY,MAAMC,YAClC,cAAed,KAAKC,MAAMY,MAAME,W,CAI5B,SAAAV,GACN,MAAMW,EAAS,CACb,CAAEC,KAAM,qBAAsBhB,MAAO,GAAGD,KAAKkB,iBAC7C,CAAED,KAAM,eAAgBhB,MAAO,GAAGD,KAAKkB,cACvC,CAAED,KAAM,8BAA+BhB,MAAO,gBAC9C,CAAEgB,KAAM,2BAA4BhB,MAAO,mBAG7C,MAAMkB,EAASV,OAAAC,OAAA,GAAQV,KAAKQ,QAC5BQ,EAAOI,SAAQF,IACbC,EAAUD,EAAMD,MAAQjB,KAAKC,MAAMe,OAAOK,SAASH,EAAMjB,MAAM,IAGjED,KAAKQ,OAASW,C,CAGhB,iBAAAG,GACE,MAAO,CACL,kBAAmBtB,KAAKuB,cAAgB,M,CAI5C,UAAAC,GACE,MAAMC,EAAU,GAChBA,EAAQ,mBAAqB,KAC7BA,EAAQ,aAAezB,KAAK0B,SAC5BD,EAAQ,YAAczB,KAAK2B,SAC3BF,EAAQ,GAAGzB,KAAK4B,QAAU,KAC1B,OAAOH,C,CAGT,cAAAI,GACE,OAAO7B,KAAK2B,SAAW,iBAAmB,GAAG3B,KAAKkB,Y,CAGpD,OAAAY,GACE,IAAK9B,KAAK+B,SAAU,MAAO,GAC3B,OAAOC,EAAA,aAAWf,KAAMjB,KAAK+B,SAAUE,QAASjC,KAAKiC,QAASC,KAAM,QAAShB,MAAOlB,KAAK6B,kB,CAG3F,MAAAM,GACE,MAAMC,EAAcpC,KAAK6B,iBACzB,OACEG,EAACK,EAAI,CAAAC,IAAA,2CAACC,MAAOvC,KAAKsB,qBAChBU,EAAA,OAAAM,IAAA,2CAAKE,MAAOxC,KAAKwB,aAAce,MAAOvC,KAAKQ,QACxCR,KAAK8B,UACNE,EAAA,cAAAM,IAAA,2CAAYJ,KAAK,SAAQ,cAAa,OAAOhB,MAAOkB,GAClDJ,EAAA,QAAAM,IAAA,+C","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as t,h as s,H as h,g as o}from"./p-fd5ed6b0.js";const l=":host{display:block;font-size:var(--font-size-base)}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:3em;font-weight:var(--font-weight-bold);color:var(--color-body);line-height:var(--line-height);margin-block:var(--margin-block);letter-spacing:0px}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:2.2857142857em;letter-spacing:-1.68px}@media (min-width: 769px) and (max-width: 1920px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:3.429em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:2.8571428571em;letter-spacing:-1.92px}}@media (min-width: 1921px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:4.286em;line-height:calc(var(--line-height) + 5%)}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:3.5714285714em;letter-spacing:-1.2px}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-underline-offset:10%;cursor:pointer}:host ::slotted(u){text-underline-offset:10%}:host ::slotted(i),:host ::slotted(em){font-style:italic;font-weight:var(--font-weight-medium)}:host ::slotted(abbr){color:var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";const e=l;const i=class{constructor(s){t(this,s);this.theme=window.CuraAPI.theme;this.level=1;this.size="large";this.spotColor="accent-dark";this.color=undefined;this.marginBlock="1.25em";this.lineHeight="120%";this.styles={}}handleChangeColor(){this.setColors()}connectedCallback(){this.setFontProperties();this.setColors()}setFontProperties(){this.weights=this.theme.fonts.getWeights();this.fontSizeBase=this.theme.fonts.getSize();this.styles={"--font-family":window.CuraAPI.theme.fonts.getFamily("display"),"--font-size":window.CuraAPI.theme.fonts.getSize(),"--font-weight-bold":this.weights.bold,"--font-weight-medium":this.weights.medium}}hostCSSProperties(){return{"--margin-block":this.marginBlock,"--font-size-base":this.fontSizeBase,"--line-height":this.lineHeight}}setColors(){const t=this.color?this.theme.colors.getColor(this.color):this.theme.fonts.getColor();this.styles=Object.assign(Object.assign({},this.styles),{"--color-body":t||this.theme.colors.getColor("neutral-darker"),"--color-link":this.theme.colors.getColor(`${this.spotColor}`)})}getClasses(){var t;const s={};s[`${(t=this.size)===null||t===void 0?void 0:t.toLowerCase()}`]=true;return s}getHeadingTag(){const t=this.getClasses();const h={1:s("h1",{style:this.styles,class:t},s("slot",null)),2:s("h2",{style:this.styles,class:t},s("slot",null)),3:s("h3",{style:this.styles,class:t},s("slot",null)),4:s("h4",{style:this.styles,class:t},s("slot",null)),5:s("h5",{style:this.styles,class:t},s("slot",null)),6:s("h6",{style:this.styles,class:t},s("slot",null)),default:s("h1",{style:this.styles,class:t},s("slot",null))};return h[`${this.level}`]||h["default"]}render(){return s(h,{key:"
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as t,h as s,H as h,g as o}from"./p-fd5ed6b0.js";const l=":host{display:block;font-size:var(--font-size-base)}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:3em;font-weight:var(--font-weight-bold);color:var(--color-body);line-height:var(--line-height);margin-block:var(--margin-block);letter-spacing:0px}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:2.2857142857em;letter-spacing:-1.68px}@media (min-width: 769px) and (max-width: 1920px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:3.429em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:2.8571428571em;letter-spacing:-1.92px}}@media (min-width: 1921px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:4.286em;line-height:calc(var(--line-height) + 5%)}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:3.5714285714em;letter-spacing:-1.2px}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-underline-offset:10%;cursor:pointer}:host ::slotted(u){text-underline-offset:10%}:host ::slotted(i),:host ::slotted(em){font-style:italic;font-weight:var(--font-weight-medium)}:host ::slotted(abbr){color:var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";const e=l;const i=class{constructor(s){t(this,s);this.theme=window.CuraAPI.theme;this.level=1;this.size="large";this.spotColor="accent-dark";this.color=undefined;this.marginBlock="1.25em";this.lineHeight="120%";this.styles={}}handleChangeColor(){this.setColors()}connectedCallback(){this.setFontProperties();this.setColors()}setFontProperties(){this.weights=this.theme.fonts.getWeights();this.fontSizeBase=this.theme.fonts.getSize();this.styles={"--font-family":window.CuraAPI.theme.fonts.getFamily("display"),"--font-size":window.CuraAPI.theme.fonts.getSize(),"--font-weight-bold":this.weights.bold,"--font-weight-medium":this.weights.medium}}hostCSSProperties(){return{"--margin-block":this.marginBlock,"--font-size-base":this.fontSizeBase,"--line-height":this.lineHeight}}setColors(){const t=this.color?this.theme.colors.getColor(this.color):this.theme.fonts.getColor();this.styles=Object.assign(Object.assign({},this.styles),{"--color-body":t||this.theme.colors.getColor("neutral-darker"),"--color-link":this.theme.colors.getColor(`${this.spotColor}`)})}getClasses(){var t;const s={};s[`${(t=this.size)===null||t===void 0?void 0:t.toLowerCase()}`]=true;return s}getHeadingTag(){const t=this.getClasses();const h={1:s("h1",{style:this.styles,class:t},s("slot",null)),2:s("h2",{style:this.styles,class:t},s("slot",null)),3:s("h3",{style:this.styles,class:t},s("slot",null)),4:s("h4",{style:this.styles,class:t},s("slot",null)),5:s("h5",{style:this.styles,class:t},s("slot",null)),6:s("h6",{style:this.styles,class:t},s("slot",null)),default:s("h1",{style:this.styles,class:t},s("slot",null))};return h[`${this.level}`]||h["default"]}render(){return s(h,{key:"01876449797c600a4fa37c9b4addd80855e6fc83",style:this.hostCSSProperties()},this.getHeadingTag())}get host(){return o(this)}static get watchers(){return{color:["handleChangeColor"],spotColor:["handleChangeColor"]}}};i.style=e;export{i as cura_display};
|
|
2
|
+
//# sourceMappingURL=p-70adcf7b.entry.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,h as i,H as a}from"./p-fd5ed6b0.js";import{i as c}from"./p-48f9289b.js";const r=["360","accessibility","accessibility2","accessibility3","accessibility4","addUser","airdrop","alertCircle","alertTriangle","arrowDown","arrowDownCircle","arrowLeft","arrowLeftCircle","arrowRight","arrowRightCircle","arrowUp","arrowUpCircle","attach","avatarF","avatarM","biometry","bloodGroup","calendar","cam","camOff","central","chatCircle","check","checkBadge","checkCircle","checkDouble","clock","close","closeCircle","collapse","config","contacts","currency","delete","desktop","doc","down","download","drug","duplicate","edit","elevator","exam","examDoc","expand","facebook","fileBmp","fileJpg","filePdf","filePng","fileUpload","fileXls","filter","fullscreen","gallery","geotag","geotagUnity","geotagUnityGroup","google","graph","healthPlan","heart","height","height2","home","horizontalList","imageUp","infoCircle","instagram","key","lamp","language","language2","languageEN","languagePT","lattes","left","like","link","linkExternal","linkedin","list","login","logout","mail","maintenance","medDoc","medEspec","medImg","medUser","medical","menuHamburguer","menuKebab","menuMeatballs","mic","micOff","minus","minusCircle","minusSquare","mobile","news","notification","npsDeslike","npsHate","npsLike","npsLove","npsNeutral","order","parking","partner","phone","play","plus","plusCircle","plusSquare","print","profile","profileCircle","questionCircle","questionSquare","range","reload","ribbon","right","schedule","scheduleCancel","scheduleCheck","scheduleHistorico","search","secure","share","siren","sound","soundOff","subItem","swap","target","team","telegram","twitter","unLink","unSecure","unity","unlike","up","upload","verticalList","viewFalse","viewTrue","weight","whatsapp","wifi","wifiOff","youtube","zoomIn","zoomOut"];const l=':host{display:block;padding:24px;font-family:"Roboto", Arial, Helvetica, sans-serif}.iconDetail{display:block}.iconSizes{display:flex;align-items:center}.iconSizes .size{display:flex;flex-direction:column;text-align:center;align-items:center;margin-right:9px;padding:8px}.iconSizes .size:last-child{margin-right:0}.iconSizes .size span{font-size:10px;margin:8px 0}.iconSizes.invert{margin-top:12px}.iconSizes.invert .size{background-color:#2d2d2d;color:#F6F6F6;border-radius:3px}.icons{margin-top:28px;display:flex;flex-wrap:wrap;position:relative}.icons .icon{position:relative;padding:4px;cursor:pointer;opacity:0.6;transition:opacity 0.2s linear;width:105px;display:flex;flex-direction:column;text-align:center;align-items:center;margin-bottom:16px;box-sizing:border-box;}.icons .icon cura-label{margin-top:8px}.icons .icon cura-paragraph{margin-top:4px}';const n=l;const s=class{constructor(i){e(this,i);this.sizes=Object.keys(c).filter((e=>e!=="default"));this.colors=["primary","secondary","accent","info","warning","error","success","neutral"];this.setSelected=e=>{this.selected=e};this.selected=r[0]}connectedCallback(){this.sizes.unshift(this.sizes.pop())}render(){return i(a,{key:"4918bc5d13f24f3133af45ce5991b3f3f43e99cf"},i("div",{key:"837d47976a39702b13ceb5a7c5ac8ae097d34988",class:"iconDetail"},i("cura-heading",{key:"de4c75c4652b464991aa173cf7243db65f9ba2ba",size:"small","margin-block":"0 24px"},"Icon: ",i("b",{key:"77591ce199e5140ddcde3d7b956586d27fe6bc05"},this.selected)),i("div",{key:"6da36b174603d48ab3b11a8490c424f164855147",class:"iconSizes"},this.sizes.map((e=>i("div",{class:"size"},i("cura-icon",{name:this.selected,size:e}),i("span",null,e))))),i("div",{key:"4920c8010e0a55f80bb557f4ba0e537b7861ae36",class:"iconSizes invert"},this.sizes.map((e=>i("div",{class:"size"},i("cura-icon",{name:this.selected,size:e,color:"neutral-white"}),i("span",null,e)))))),i("div",{key:"99739b351fb25036efd4b55774c0f077058be8fc",class:"icons"},r.map((e=>i("div",{class:{icon:true,selected:e===this.selected},onClick:()=>this.setSelected(e)},i("cura-icon",{name:e,size:"32",color:e===this.selected?"accent-dark":"neutral-dark"}),i("cura-label",{size:"xsmall",weight:e===this.selected?"bold":"regular",color:e===this.selected?"accent-dark":"neutral-dark"},e))))))}};s.style=n;export{s as cura_icons_view};
|
|
2
|
+
//# sourceMappingURL=p-7f25f4dc.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["iconsetdefaulticons","curaIconsViewCss","CuraIconsViewStyle0","CuraIconsView","this","sizes","Object","keys","iconSizes","filter","key","colors","setSelected","icon","selected","connectedCallback","unshift","pop","render","h","Host","class","size","map","name","color","onClick","weight"],"sources":["src/assets/icons/iconset-default-list.ts","src/components/cura-icons-view/cura-icons-view.scss?tag=cura-icons-view&encapsulation=shadow","src/components/cura-icons-view/cura-icons-view.tsx"],"sourcesContent":["export default [\"360\",\"accessibility\",\"accessibility2\",\"accessibility3\",\"accessibility4\",\"addUser\",\"airdrop\",\"alertCircle\",\"alertTriangle\",\"arrowDown\",\"arrowDownCircle\",\"arrowLeft\",\"arrowLeftCircle\",\"arrowRight\",\"arrowRightCircle\",\"arrowUp\",\"arrowUpCircle\",\"attach\",\"avatarF\",\"avatarM\",\"biometry\",\"bloodGroup\",\"calendar\",\"cam\",\"camOff\",\"central\",\"chatCircle\",\"check\",\"checkBadge\",\"checkCircle\",\"checkDouble\",\"clock\",\"close\",\"closeCircle\",\"collapse\",\"config\",\"contacts\",\"currency\",\"delete\",\"desktop\",\"doc\",\"down\",\"download\",\"drug\",\"duplicate\",\"edit\",\"elevator\",\"exam\",\"examDoc\",\"expand\",\"facebook\",\"fileBmp\",\"fileJpg\",\"filePdf\",\"filePng\",\"fileUpload\",\"fileXls\",\"filter\",\"fullscreen\",\"gallery\",\"geotag\",\"geotagUnity\",\"geotagUnityGroup\",\"google\",\"graph\",\"healthPlan\",\"heart\",\"height\",\"height2\",\"home\",\"horizontalList\",\"imageUp\",\"infoCircle\",\"instagram\",\"key\",\"lamp\",\"language\",\"language2\",\"languageEN\",\"languagePT\",\"lattes\",\"left\",\"like\",\"link\",\"linkExternal\",\"linkedin\",\"list\",\"login\",\"logout\",\"mail\",\"maintenance\",\"medDoc\",\"medEspec\",\"medImg\",\"medUser\",\"medical\",\"menuHamburguer\",\"menuKebab\",\"menuMeatballs\",\"mic\",\"micOff\",\"minus\",\"minusCircle\",\"minusSquare\",\"mobile\",\"news\",\"notification\",\"npsDeslike\",\"npsHate\",\"npsLike\",\"npsLove\",\"npsNeutral\",\"order\",\"parking\",\"partner\",\"phone\",\"play\",\"plus\",\"plusCircle\",\"plusSquare\",\"print\",\"profile\",\"profileCircle\",\"questionCircle\",\"questionSquare\",\"range\",\"reload\",\"ribbon\",\"right\",\"schedule\",\"scheduleCancel\",\"scheduleCheck\",\"scheduleHistorico\",\"search\",\"secure\",\"share\",\"siren\",\"sound\",\"soundOff\",\"subItem\",\"swap\",\"target\",\"team\",\"telegram\",\"twitter\",\"unLink\",\"unSecure\",\"unity\",\"unlike\",\"up\",\"upload\",\"verticalList\",\"viewFalse\",\"viewTrue\",\"weight\",\"whatsapp\",\"wifi\",\"wifiOff\",\"youtube\",\"zoomIn\",\"zoomOut\"];",":host {\n display: block;\n padding: 24px;\n font-family: 'Roboto', Arial, Helvetica, sans-serif;\n}\n\n.iconDetail {\n display: block;\n}\n\n.iconSizes {\n display: flex;\n align-items: center;\n\n\n .size {\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n margin-right: 9px;\n padding: 8px;\n\n &:last-child { margin-right: 0; }\n span {\n font-size: 10px;\n margin: 8px 0;\n }\n }\n\n &.invert {\n margin-top: 12px;\n\n .size {\n background-color: #2d2d2d;\n color: #F6F6F6;\n border-radius: 3px;\n }\n }\n}\n\n.icons {\n margin-top: 28px;\n display: flex;\n flex-wrap: wrap;\n position: relative;\n\n .icon {\n position: relative;\n padding: 4px;\n cursor: pointer;\n opacity: .6;\n transition: opacity .2s linear;\n width: 105px;\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n margin-bottom: 16px;\n box-sizing: border-box;\n cura-label {\n margin-top: 8px;\n }\n cura-paragraph {\n margin-top: 4px;\n }\n /* &.selected {\n transform: scale(1.2);\n } */\n }\n}\n\n","import { Component, Host, h, State } from '@stencil/core';\nimport iconsetdefaulticons from '../../assets/icons/iconset-default-list';\nimport { iconSizes } from '../cura-icon/cura-icon.definitions';\n\n@Component({\n tag: 'cura-icons-view',\n styleUrl: 'cura-icons-view.scss',\n shadow: true,\n})\nexport class CuraIconsView {\n\n sizes = Object.keys(iconSizes).filter(key => key !== 'default');\n colors = ['primary', 'secondary', 'accent', 'info', 'warning', 'error', 'success', 'neutral'];\n @State() selected = iconsetdefaulticons[0];\n\n connectedCallback() {\n this.sizes.unshift(this.sizes.pop());\n }\n\n setSelected = (icon) => {\n this.selected = icon;\n }\n\n render() {\n return (\n <Host>\n <div class=\"iconDetail\">\n <cura-heading size=\"small\" margin-block=\"0 24px\">Icon: <b>{ this.selected }</b></cura-heading>\n <div class=\"iconSizes\">\n { this.sizes.map( size =>\n <div class=\"size\">\n <cura-icon name={this.selected} size={size}></cura-icon>\n <span>{ size }</span>\n </div>\n )}\n </div>\n <div class=\"iconSizes invert\">\n { this.sizes.map( size =>\n <div class=\"size\">\n <cura-icon name={this.selected} size={size} color=\"neutral-white\"></cura-icon>\n <span>{ size }</span>\n </div>\n )}\n </div>\n </div>\n <div class=\"icons\">\n { iconsetdefaulticons.map(icon =>\n <div class={{icon: true, selected: icon === this.selected }} onClick={() => this.setSelected(icon)}>\n <cura-icon\n name={icon}\n size=\"32\"\n color={icon === this.selected ? 'accent-dark' : 'neutral-dark'}></cura-icon>\n <cura-label\n size=\"xsmall\"\n weight={icon === this.selected ? 'bold' : 'regular'}\n color={icon === this.selected ? 'accent-dark' : 'neutral-dark'}>{icon}</cura-label>\n </div>\n )}\n </div>\n </Host>\n );\n }\n\n}\n"],"mappings":"sFAAA,MAAAA,EAAe,CAAC,MAAM,gBAAgB,iBAAiB,iBAAiB,iBAAiB,UAAU,UAAU,cAAc,gBAAgB,YAAY,kBAAkB,YAAY,kBAAkB,aAAa,mBAAmB,UAAU,gBAAgB,SAAS,UAAU,UAAU,WAAW,aAAa,WAAW,MAAM,SAAS,UAAU,aAAa,QAAQ,aAAa,cAAc,cAAc,QAAQ,QAAQ,cAAc,WAAW,SAAS,WAAW,WAAW,SAAS,UAAU,MAAM,OAAO,WAAW,OAAO,YAAY,OAAO,WAAW,OAAO,UAAU,SAAS,WAAW,UAAU,UAAU,UAAU,UAAU,aAAa,UAAU,SAAS,aAAa,UAAU,SAAS,cAAc,mBAAmB,SAAS,QAAQ,aAAa,QAAQ,SAAS,UAAU,OAAO,iBAAiB,UAAU,aAAa,YAAY,MAAM,OAAO,WAAW,YAAY,aAAa,aAAa,SAAS,OAAO,OAAO,OAAO,eAAe,WAAW,OAAO,QAAQ,SAAS,OAAO,cAAc,SAAS,WAAW,SAAS,UAAU,UAAU,iBAAiB,YAAY,gBAAgB,MAAM,SAAS,QAAQ,cAAc,cAAc,SAAS,OAAO,eAAe,aAAa,UAAU,UAAU,UAAU,aAAa,QAAQ,UAAU,UAAU,QAAQ,OAAO,OAAO,aAAa,aAAa,QAAQ,UAAU,gBAAgB,iBAAiB,iBAAiB,QAAQ,SAAS,SAAS,QAAQ,WAAW,iBAAiB,gBAAgB,oBAAoB,SAAS,SAAS,QAAQ,QAAQ,QAAQ,WAAW,UAAU,OAAO,SAAS,OAAO,WAAW,UAAU,SAAS,WAAW,QAAQ,SAAS,KAAK,SAAS,eAAe,YAAY,WAAW,SAAS,WAAW,OAAO,UAAU,UAAU,SAAS,WCA3sD,MAAMC,EAAmB,41BACzB,MAAAC,EAAeD,E,MCQFE,EAAa,M,yBAExBC,KAAAC,MAAQC,OAAOC,KAAKC,GAAWC,QAAOC,GAAOA,IAAQ,YACrDN,KAAAO,OAAS,CAAC,UAAW,YAAa,SAAU,OAAQ,UAAW,QAAS,UAAW,WAOnFP,KAAAQ,YAAeC,IACbT,KAAKU,SAAWD,CAAI,E,cAPFb,EAAoB,E,CAExC,iBAAAe,GACEX,KAAKC,MAAMW,QAAQZ,KAAKC,MAAMY,M,CAOhC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAV,IAAA,4CACHS,EAAA,OAAAT,IAAA,2CAAKW,MAAM,cACTF,EAAA,gBAAAT,IAAA,2CAAcY,KAAK,QAAO,eAAc,UAAQ,SAAOH,EAAA,KAAAT,IAAA,4CAAKN,KAAKU,WACjEK,EAAA,OAAAT,IAAA,2CAAKW,MAAM,aACPjB,KAAKC,MAAMkB,KAAKD,GAChBH,EAAA,OAAKE,MAAM,QACTF,EAAA,aAAWK,KAAMpB,KAAKU,SAAUQ,KAAMA,IACtCH,EAAA,YAAQG,OAIdH,EAAA,OAAAT,IAAA,2CAAKW,MAAM,oBACPjB,KAAKC,MAAMkB,KAAKD,GAChBH,EAAA,OAAKE,MAAM,QACTF,EAAA,aAAWK,KAAMpB,KAAKU,SAAUQ,KAAMA,EAAMG,MAAM,kBAClDN,EAAA,YAAQG,QAKhBH,EAAA,OAAAT,IAAA,2CAAKW,MAAM,SACPrB,EAAoBuB,KAAIV,GACxBM,EAAA,OAAKE,MAAO,CAACR,KAAM,KAAMC,SAAUD,IAAST,KAAKU,UAAYY,QAAS,IAAMtB,KAAKQ,YAAYC,IAC3FM,EAAA,aACEK,KAAMX,EACNS,KAAK,KACLG,MAAOZ,IAAST,KAAKU,SAAW,cAAgB,iBAClDK,EAAA,cACEG,KAAK,SACLK,OAAQd,IAAST,KAAKU,SAAW,OAAS,UAC1CW,MAAOZ,IAAST,KAAKU,SAAW,cAAgB,gBAAiBD,O","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as a,h as e,H as t}from"./p-fd5ed6b0.js";const s=":host .container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:calc(var(--base-spacing) * 10px);height:calc(var(--base-spacing) * 10px);border-radius:calc(var(--base-spacing) * 1px);background:var(--neutral-pale)}";const c=s;const i=class{constructor(e){a(this,e);this.isThousandRounded=false;this.theme=window.CuraAPI.theme;this.distance=0;this.label="km";this.styles={};this.displayDistance=0}formatDistance(){const a=this.distance%1!==0?parseFloat(this.distance.toFixed(1)):this.distance;this.isThousandRounded=Math.abs(a)>=1e3;this.displayDistance=this.isThousandRounded?parseFloat((a/1e3).toFixed(1)):a}connectedCallback(){this.setCssProperties();this.formatDistance()}render(){return e(t,{key:"cdc206deecbed2e069befda5d21ddcaf03049afc"},e("div",{key:"d22d2b5b97964281e8588fbc17a66f3fddcd875e",class:"container",style:this.styles},e("cura-label",{key:"0d54ab1ad403ba23a57fb78a422ed8c577cd627e",size:"xsmall",weight:"bold",color:"neutral-black"},this.displayDistance,this.isThousandRounded?"K":""),e("cura-label",{key:"d4929a67484bbfd6d6f3edce82414951ea4778c8",size:"xsmall",weight:"bold",color:"neutral-dark"},this.label)))}setCssProperties(){this.styles={"--neutral-pale":this.theme.colors.getColor(`neutral-pale`),"--base-spacing":this.theme.spacing.getSpacing()}}static get watchers(){return{distance:["formatDistance"]}}};i.style=c;export{i as cura_badge_distance};
|
|
2
|
+
//# sourceMappingURL=p-935eeb7b.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["curaBadgeDistanceCss","CuraBadgeDistanceStyle0","CuraDistance","this","isThousandRounded","theme","window","CuraAPI","formatDistance","roundedDistance","distance","parseFloat","toFixed","Math","abs","displayDistance","connectedCallback","setCssProperties","render","h","Host","key","class","style","styles","size","weight","color","label","colors","getColor","spacing","getSpacing"],"sources":["src/components/badges/cura-badge-distance/cura-badge-distance.scss?tag=cura-badge-distance&encapsulation=shadow","src/components/badges/cura-badge-distance/cura-badge-distance.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n:host {\n .container{\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: calc(#{$base-spacing} * 10px);\n height: calc(#{$base-spacing} * 10px);\n border-radius: calc(#{$base-spacing} * 1px);\n background: var(--neutral-pale);\n }\n}\n","import { Component, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-badge-distance',\n styleUrl: 'cura-badge-distance.scss',\n shadow: true,\n})\nexport class CuraDistance {\n\n @Prop() distance = 0;\n @Prop({ reflect: true }) label = 'km';\n @State() styles = {};\n @State() displayDistance = 0;\n isThousandRounded = false;\n\n theme = window.CuraAPI.theme;\n\n @Watch('distance')\n formatDistance() {\n const roundedDistance = this.distance % 1 !== 0 ? parseFloat(this.distance.toFixed(1)) : this.distance; \n this.isThousandRounded = Math.abs(roundedDistance) >= 1000;\n this.displayDistance = this.isThousandRounded ? parseFloat((roundedDistance / 1000).toFixed(1)) : roundedDistance;\n }\n\n\n connectedCallback(){\n this.setCssProperties();\n this.formatDistance(); \n }\n\n render() {\n return (\n <Host>\n <div class=\"container\" style={this.styles}>\n <cura-label size='xsmall' weight='bold' color='neutral-black'>\n {this.displayDistance}{this.isThousandRounded ? 'K' : ''}\n </cura-label>\n <cura-label size='xsmall' weight='bold' color='neutral-dark'>\n {this.label}\n </cura-label>\n </div>\n </Host>\n );\n }\n\n setCssProperties() {\n this.styles = {\n '--neutral-pale': this.theme.colors.getColor(`neutral-pale`),\n '--base-spacing': this.theme.spacing.getSpacing()\n }\n }\n\n}\n"],"mappings":"kDAAA,MAAMA,EAAuB,6PAC7B,MAAAC,EAAeD,E,MCMFE,EAAY,M,yBAMvBC,KAAAC,kBAAoB,MAEpBD,KAAAE,MAAQC,OAAOC,QAAQF,M,cANJ,E,WACc,K,YACf,G,qBACS,C,CAM3B,cAAAG,GACE,MAAMC,EAAkBN,KAAKO,SAAW,IAAM,EAAIC,WAAWR,KAAKO,SAASE,QAAQ,IAAMT,KAAKO,SAC9FP,KAAKC,kBAAoBS,KAAKC,IAAIL,IAAoB,IACtDN,KAAKY,gBAAkBZ,KAAKC,kBAAoBO,YAAYF,EAAkB,KAAMG,QAAQ,IAAMH,C,CAIpG,iBAAAO,GACEb,KAAKc,mBACLd,KAAKK,gB,CAGP,MAAAU,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,YAAYC,MAAOpB,KAAKqB,QACjCL,EAAA,cAAAE,IAAA,2CAAYI,KAAK,SAASC,OAAO,OAAOC,MAAM,iBAC3CxB,KAAKY,gBAAiBZ,KAAKC,kBAAoB,IAAM,IAExDe,EAAA,cAAAE,IAAA,2CAAYI,KAAK,SAASC,OAAO,OAAOC,MAAM,gBAC3CxB,KAAKyB,Q,CAOhB,gBAAAX,GACEd,KAAKqB,OAAS,CACZ,iBAAkBrB,KAAKE,MAAMwB,OAAOC,SAAS,gBAC7C,iBAAkB3B,KAAKE,MAAM0B,QAAQC,a","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as i,c as t,h as o,H as e,g as s}from"./p-fd5ed6b0.js";const d=":host{display:block;width:100%;box-sizing:border-box}.dropdown{display:flex;position:relative;flex-direction:column;width:inherit}.dropdown .dropdown-search-list{z-index:1000}.dropdown-input-search{width:100%;display:flex;justify-content:center;align-items:center;background:transparent}.dropdown-input-search.dropdown-open ::part(cura-input-field){border-radius:4px 4px 0px 0px}.dropdown-input-search.dropdown-open ::slotted([slot=helperText]){display:none}.dropdown-input-search.dropdown-open cura-input-text ::slotted([slot=helperText]){display:none}.dropdown-search-list{position:absolute;top:calc(100% - 8px);width:100%;max-height:var(--dropdown-max-height);padding:12px 12px;margin:0;box-sizing:border-box;box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16));border-radius:0px 0px 4px 4px;border-top:0 var(--neutral-light);border-right:2px solid var(--neutral-light);border-bottom:2px solid var(--neutral-light);border-left:2px solid var(--neutral-light);background-color:var(--neutral-purewhite);list-style:none;overflow-y:auto;display:none}.dropdown-search-list.visible{display:block}.dropdown-search-list-input-search{width:inherit;display:flex;justify-content:center;align-items:center;padding:16px 8px;border-bottom:2px solid var(--info-base);background-color:var(--neutral-purewhite)}.dropdown-search-list-input-search cura-input-text{width:inherit}.dropdown-search-list-input-search.error{background-color:var(--error-lighter);border-bottom:2px solid var(--error-dark)}.dropdown-mobile{position:fixed;top:1%;left:0;right:0;width:100%;z-index:10000}.dropdown-mobile .dropdown-input-search{display:flex;background-color:var(--neutral-purewhite);border-bottom:2px solid var(--info-base);z-index:10000}.dropdown-mobile .dropdown-input-search cura-button-transparent{display:flex;margin-right:4px}.dropdown-mobile .dropdown-input-search cura-input-text{padding:12px 8px 12px 0px}.dropdown-mobile .dropdown-input-search.error{background-color:var(--error-lighter);border-bottom:2px solid var(--error-dark)}.dropdown-mobile .dropdown-input-search.dropdown-open{display:flex}.dropdown-mobile .dropdown-input-search.dropdown-open ::slotted([slot=helperText]){display:block}.dropdown-mobile .dropdown-search-list{position:static;width:100%;height:calc(100vh - var(--dynamic-input-search-height, 0));max-height:none;padding:12px 12px;margin:0;box-sizing:border-box;box-shadow:none;border:none;background-color:var(--neutral-purewhite);list-style:none;overflow-y:auto;z-index:10000}";const r=d;const n=class{constructor(o){i(this,o);this.valueChanged=t(this,"valueChanged",7);this.onselect=t(this,"onselect",7);this.overlayElement=null;this.adjustInputPosition=async()=>{var i,t;const o=(window===null||window===void 0?void 0:window.innerHeight)<this.screenDefaultHeight;const e=(i=this.host.shadowRoot)===null||i===void 0?void 0:i.querySelector(".dropdown-mobile");if(e){e.style.bottom=o?`${((t=window===null||window===void 0?void 0:window.screen)===null||t===void 0?void 0:t.height)-(window===null||window===void 0?void 0:window.innerHeight)}px`:"0";window.scroll({top:0,left:0,behavior:"smooth"})}};this.handleSlotChange=()=>{this.options=Array.from(this.host.querySelectorAll("cura-dropdown-search-option"));this.addClickListenersToOptions();this.updateHoveredIndex()};this.handleInputChange=i=>{const t=i.target;this.value=t.value;this.onValueChange(this.value)};this.handleKeyDown=i=>{if(i.key==="ArrowDown"){i.preventDefault();this.moveHighlight(1)}else if(i.key==="ArrowUp"){i.preventDefault();this.moveHighlight(-1)}else if(i.key==="Enter"){i.preventDefault();if(this.hoveredIndex>-1){this.handleOnBlur();this.onSelectedOption(this.hoveredIndex)}}};this.handleResize=()=>{this.isMobile=window.innerWidth<768;if(this.isDropdownOpen){if(this.isMobile){this.showOverlay()}else{this.resetDropdownStyles();this.removeOverlay()}}};this.setUp=()=>{this.handleResize();this.adjustInputPosition()};this.size="large";this.status="default";this.disabled=false;this.name=undefined;this.required=false;this.selected=false;this.value="";this.placeholder="";this.label="";this.iconName="search";this.dropdownMaxHeight="630px";this.overlayVisible=false;this.isDropdownOpen=false;this.styles={};this.isMobile=window.innerWidth<768;this.mode="default";this.inputTextRef=undefined;this.isOnBlurInput=true;this.hoveredIndex=-1;this.options=[];this.originalOverflow="";this.screenDefaultHeight=0}connectedCallback(){this.weights=window.CuraAPI.theme.fonts.getWeights();this.styles["--info-base"]=window.CuraAPI.theme.colors.getColor("info-base");this.styles["--neutral-purewhite"]=window.CuraAPI.theme.colors.getColor("neutral-purewhite");this.styles["--neutral-light"]=window.CuraAPI.theme.colors.getColor("neutral-light");this.styles["--neutral-dark"]=window.CuraAPI.theme.colors.getColor("neutral-dark");this.styles["--neutral-black-shadow"]=window.CuraAPI.theme.colors.getColor(`neutral-black`,.16);this.styles["--error-dark"]=window.CuraAPI.theme.colors.getColor("error-dark");this.styles["--error-lighter"]=window.CuraAPI.theme.colors.getColor("error-lighter");this.styles["--breakpoints"]=window.CuraAPI.theme.breakpoints.get();this.styles["--font-size"]=window.CuraAPI.theme.fonts.getSize();this.styles["--font-family"]=window.CuraAPI.theme.fonts.getFamily();this.styles["--font-weight-medium"]=this.weights.medium}onValueChange(i){this.updateSelectedOption(i);this.valueChanged.emit(i)}componentWillLoad(){this.updateSelectedOption(this.value)}componentDidRender(){if(this.isDropdownOpen&&this.isMobile){this.showOverlay();this.getDropdownSearchListHeight()}else{this.removeOverlay()}}componentDidLoad(){var i;this.screenDefaultHeight=window===null||window===void 0?void 0:window.innerHeight;window===null||window===void 0?void 0:window.addEventListener("resize",this.setUp);(i=window===null||window===void 0?void 0:window.visualViewport)===null||i===void 0?void 0:i.addEventListener("resize",this.adjustInputPosition)}disconnectedCallback(){var i;window===null||window===void 0?void 0:window.removeEventListener("resize",this.setUp);(i=window===null||window===void 0?void 0:window.visualViewport)===null||i===void 0?void 0:i.removeEventListener("resize",this.adjustInputPosition)}showOverlay(){if(!this.overlayElement){this.overlayElement=document.createElement("div");this.overlayElement.className="dropdown-overlay";this.overlayElement.style.position="fixed";this.overlayElement.style.top="0";this.overlayElement.style.left="0";this.overlayElement.style.width="100%";this.overlayElement.style.height="100%";this.overlayElement.style.zIndex="9999";this.overlayElement.style.backgroundColor="white";document.body.appendChild(this.overlayElement);this.originalOverflow=document.body.style.overflow;document.body.style.overflow="hidden"}}removeOverlay(){if(this.overlayElement&&this.overlayElement.parentNode===document.body){document.body.removeChild(this.overlayElement);this.overlayElement=null;document.body.style.overflow=this.originalOverflow}}addClickListenersToOptions(){this.options.forEach(((i,t)=>{i===null||i===void 0?void 0:i.addEventListener("optionSelected",(()=>this.onSelectedOption(t)))}))}updateSelectedOption(i){const t=this.options.findIndex((t=>t.getAttribute("value")===i));this.hoveredIndex=t;this.updateOptionAttribute("hovered",this.hoveredIndex);this.updateOptionAttribute("selected",this.hoveredIndex);this.scrollHoveredOptionIntoView();this.adjustInputPosition()}onSelectedOption(i){const t=this.options[i];if(t.selectable){const i=t.getAttribute("value")||t.textContent;this.value=i||"";this.updateSelectedOption(this.value);this.isDropdownOpen=false;this.isOnBlurInput=true;this.resetDropdownStyles();this.removeOverlay()}}moveHighlight(i){const t=this.options;const o=(this.hoveredIndex+i+t.length)%t.length;this.hoveredIndex=o;this.updateOptionAttribute("hovered",this.hoveredIndex);this.scrollHoveredOptionIntoView()}updateOptionAttribute(i,t){this.options.forEach(((o,e)=>{o[i]=e===t}))}updateHoveredIndex(){const i=this.options;const t=this.value;this.hoveredIndex=i.findIndex((i=>i.getAttribute("value")===t))}scrollHoveredOptionIntoView(){var i;const t=(i=this.host.shadowRoot)===null||i===void 0?void 0:i.querySelector(".dropdown-search-list");const o=this.options[this.hoveredIndex];if(t&&o){const i=o.getBoundingClientRect();const e=t.getBoundingClientRect();if(i.bottom>e.bottom){t.scrollTop+=i.bottom-e.bottom}if(i.top<e.top){t.scrollTop-=e.top-i.top}}}handleOnBlur(){if(this.isOnBlurInput===true){setTimeout((()=>{this.isDropdownOpen=false;this.resetDropdownStyles();this.removeOverlay()}),200)}}getClasses(){return{"dropdown-input-search":true,"dropdown-open":this.isDropdownOpen,disabled:this.disabled,[this.status]:true}}getDropdownClasses(){return{"dropdown-search-list":true,visible:this.options.length&&this.isDropdownOpen?true:false}}hostCSSProperties(){return{"--dropdown-max-height":this.dropdownMaxHeight}}handleOnFocus(){this.isDropdownOpen=true}getDropdownSearchListHeight(){var i;const t=(i=this.host.shadowRoot)===null||i===void 0?void 0:i.querySelector(".dropdown-input-search");if(t){this.host.style.setProperty("--dynamic-input-search-height",`${t.offsetHeight}px`)}}handleGoBack(){this.resetDropdownStyles();this.isMobile=false}resetDropdownStyles(){var i;const t=(i=this.host.shadowRoot)===null||i===void 0?void 0:i.querySelector(".dropdown-mobile");if(t&&t.style.position==="fixed"){t.style.position="relative";t.style.removeProperty("bottom")}}render(){const i=this.isMobile&&this.isDropdownOpen;return o(e,{key:"85b79d1f41c8f03ed8aa8f915743c6a35d529b20",style:this.hostCSSProperties(),class:"dropdown-overlay"},o("div",{key:"c5255bc1445309a8da2e28e76d31c151170fb1bf",class:`dropdown ${i?"dropdown-mobile":""}`,style:this.styles},o("div",{key:"a0e9db281870954a6f3155cd482c741e3d44db24",class:this.getClasses()},this.isMobile&&this.isDropdownOpen&&o("cura-button-transparent",{key:"67e58b57752cbe8a8fbbaee555e9c905c710782c",fontColor:"dark",onClick:()=>this.handleGoBack(),iconName:"arrowLeft",size:"medium",iconOnly:true,color:"primary"}),o("cura-input-text",{key:"87edd1a5b058a9c7ae966999269f1546d7132a53",disabled:this.disabled,label:this.label,part:"cura-input-field",mode:i?"transparent":"default",required:this.required,hideErrorIcon:this.status==="error",iconName:this.iconName||"search",value:this.value,status:this.status,onValueChange:i=>this.onValueChange(i.target.value),onInput:i=>this.handleInputChange(i),onFocus:()=>this.handleOnFocus(),onClick:()=>window.innerWidth<768?this.isMobile=true:null,onBlur:()=>{this.handleOnBlur()},placeholder:this.placeholder,size:this.size,onKeyDown:this.handleKeyDown},o("slot",{key:"47f7e07fbcce084cef173c23583ad43e580ae02d",name:"helperText"}))),o("div",{key:"4748cdb4cd039f29f50cfdf1f9ff110bafbeb064",id:"dropdown-search-list",class:this.getDropdownClasses()},o("slot",{key:"21a66543f65ff198f0b9f60758f1f0930342dc4c",name:"dropdown-search-option",onSlotchange:this.handleSlotChange}))))}get host(){return s(this)}static get watchers(){return{value:["onValueChange"]}}};n.style=r;export{n as cura_dropdown_search};
|
|
2
|
+
//# sourceMappingURL=p-9d7c6e96.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["curaDropdownSearchCss","CuraDropdownSearchStyle0","CuraDropdownSearch","this","overlayElement","adjustInputPosition","async","isKeyboardOpen","window","innerHeight","screenDefaultHeight","dropdown","_a","host","shadowRoot","querySelector","style","bottom","_b","screen","height","scroll","top","left","behavior","handleSlotChange","options","Array","from","querySelectorAll","addClickListenersToOptions","updateHoveredIndex","handleInputChange","event","input","target","value","onValueChange","handleKeyDown","key","preventDefault","moveHighlight","hoveredIndex","handleOnBlur","onSelectedOption","handleResize","isMobile","innerWidth","isDropdownOpen","showOverlay","resetDropdownStyles","removeOverlay","setUp","connectedCallback","weights","CuraAPI","theme","fonts","getWeights","styles","colors","getColor","breakpoints","get","getSize","getFamily","medium","newValue","updateSelectedOption","valueChanged","emit","componentWillLoad","componentDidRender","getDropdownSearchListHeight","componentDidLoad","addEventListener","visualViewport","disconnectedCallback","removeEventListener","document","createElement","className","position","width","zIndex","backgroundColor","body","appendChild","originalOverflow","overflow","parentNode","removeChild","forEach","option","index","selectedOptionIndex","findIndex","getAttribute","updateOptionAttribute","scrollHoveredOptionIntoView","selectedOption","selectable","selectedValue","textContent","isOnBlurInput","direction","visibleOptions","newIndex","length","attribute","indexToUpdate","currentValue","container","hoveredOption","optionRect","getBoundingClientRect","containerRect","scrollTop","setTimeout","getClasses","disabled","status","getDropdownClasses","visible","hostCSSProperties","dropdownMaxHeight","handleOnFocus","dropdownInputSearchElement","setProperty","offsetHeight","handleGoBack","removeProperty","render","isMobileDropdown","h","Host","class","fontColor","onClick","iconName","size","iconOnly","color","label","part","mode","required","hideErrorIcon","e","onInput","onFocus","onBlur","placeholder","onKeyDown","name","id","onSlotchange"],"sources":["src/components/forms/cura-dropdown-search/cura-dropdown-search.scss?tag=cura-dropdown-search&encapsulation=shadow","src/components/forms/cura-dropdown-search/cura-dropdown-search.tsx"],"sourcesContent":["@import '../../../scss/mixins/shadows.scss';\n\n:host {\n display: block;\n width: 100%;\n box-sizing: border-box;\n}\n\n.dropdown {\n display: flex;\n position: relative;\n\n flex-direction: column;\n width: inherit;\n\n .dropdown-search-list {\n z-index: 1000;\n }\n\n &-input-search {\n width: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n background: transparent;\n\n\n &.dropdown-open {\n ::part(cura-input-field) {\n border-radius: 4px 4px 0px 0px;\n }\n ::slotted([slot='helperText']) {\n display: none;\n }\n\n cura-input-text {\n ::slotted([slot='helperText']) {\n display: none;\n }\n }\n }\n }\n\n &-search-list {\n position: absolute;\n top: calc(100% - 8px);\n width: 100%;\n max-height: var(--dropdown-max-height);\n padding: 12px 12px;\n margin: 0;\n box-sizing: border-box;\n @include shadow-level3(--neutral-black-shadow);\n border-radius: 0px 0px 4px 4px;\n border-top: 0 var(--neutral-light);\n border-right: 2px solid var(--neutral-light);\n border-bottom: 2px solid var(--neutral-light);\n border-left: 2px solid var(--neutral-light);\n background-color: var(--neutral-purewhite);\n list-style: none;\n overflow-y: auto;\n display: none;\n\n &.visible {\n display: block;\n }\n\n &-input-search {\n width: inherit;\n\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 16px 8px;\n border-bottom: 2px solid var(--info-base);\n background-color: var(--neutral-purewhite);\n\n cura-input-text {\n width: inherit;\n }\n\n &.error {\n background-color: var(--error-lighter);\n border-bottom: 2px solid var(--error-dark);\n }\n }\n }\n\n &-mobile {\n position: fixed;\n top: 1%;\n left: 0;\n right: 0;\n width: 100%;\n z-index: 10000;\n \n .dropdown-input-search {\n display: flex;\n background-color: var(--neutral-purewhite);\n border-bottom: 2px solid var(--info-base);\n z-index: 10000;\n cura-button-transparent {\n display: flex;\n margin-right: 4px;\n }\n cura-input-text {\n padding: 12px 8px 12px 0px;\n }\n &.error {\n background-color: var(--error-lighter);\n border-bottom: 2px solid var(--error-dark);\n }\n &.dropdown-open {\n display: flex;\n\n ::slotted([slot='helperText']) {\n display: block;\n }\n }\n }\n\n .dropdown-search-list {\n position: static;\n width: 100%;\n height: calc(100vh - var(--dynamic-input-search-height, 0));\n max-height: none;\n padding: 12px 12px;\n margin: 0;\n box-sizing: border-box;\n box-shadow: none;\n border: none;\n background-color: var(--neutral-purewhite);\n list-style: none;\n overflow-y: auto;\n z-index: 10000;\n }\n }\n}\n","import { Component, Host, Prop, State, Event, EventEmitter, Element, Watch, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-dropdown-search',\n styleUrl: 'cura-dropdown-search.scss',\n shadow: true,\n})\nexport class CuraDropdownSearch {\n /**\n * Size of the dropdown search mode default: 'small', 'medium', or 'large' (default: 'large')\n */\n @Prop({ reflect: true, mutable: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n /**\n * Define the status of the dropdown search.\n */\n @Prop({ reflect: true }) status: 'error' | 'default' = 'default';\n\n /**\n * Whether the select component is disabled.\n * Reflects as an attribute in the DOM.\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /**\n * The name of the dropdown search component.\n */\n @Prop({ reflect: true }) name: string;\n\n /**\n * Indicates if the dropdown search is required.\n */\n @Prop({ reflect: true, mutable: true }) required: boolean = false;\n\n /**\n * Indicates if the dropdown search is selected.\n */\n @Prop({ reflect: true, mutable: true }) selected: boolean = false;\n\n /**\n * The value of the dropdown search.\n */\n @Prop({ reflect: true, mutable: true }) value: string = '';\n\n /**\n * The placeholder text for the dropdown search.\n */\n @Prop({ reflect: true, mutable: true }) placeholder: string = '';\n\n /**\n * The label for the dropdown search.\n */\n @Prop({ reflect: true, mutable: true }) label: string = '';\n\n /**\n * Custom icon name. Default: search.\n */\n @Prop({ reflect: true }) iconName = 'search';\n\n /**\n * CSS max-height property for dropdown item.\n * Default to 630px\n */\n @Prop({ reflect: true }) dropdownMaxHeight = '630px';\n\n /**\n * Reference to the host element.\n */\n @Element() host: HTMLElement;\n\n /**\n * Indicates if the overlay is visible.\n */\n @State() overlayVisible: boolean = false;\n\n /**\n * Event emitted when the value changes.\n */\n @Event() valueChanged: EventEmitter<string>;\n\n /**\n * Indicates if the dropdown is open.\n */\n @State() isDropdownOpen: boolean = false;\n\n /**\n * Styles for the component.\n\n */\n @State() styles = {};\n\n /**\n * Indicates if the component is being viewed on a mobile device.\n */\n @State() isMobile: boolean = window.innerWidth < 768;\n\n /**\n * The mode of the dropdown search.\n */\n @State() mode: 'default' | 'transparent' = 'default';\n\n @Event() onselect: EventEmitter;\n\n @State() inputTextRef!: HTMLCuraInputTextElement;\n\n /**\n * Indicates if the input is on blur.\n */\n @State() isOnBlurInput: boolean = true;\n\n /**\n * The index of the currently hovered option.\n */\n @State() hoveredIndex: number = -1;\n\n /**\n * The options for the dropdown search.\n * @type {HTMLCuraDropdownSearchOptionElement[]}\n */\n\n weights;\n\n private overlayElement: HTMLDivElement | null = null;\n\n @State() options: HTMLCuraDropdownSearchOptionElement[] = [];\n\n /**\n *\n * Stores the original value of the 'overflow' style of the body\n * before blocking the scroll.\n */\n @State() originalOverflow: string = '';\n @State() screenDefaultHeight = 0;\n\n private adjustInputPosition = async () => {\n // const tick = await Promise.resolve().then();\n const isKeyboardOpen = window?.innerHeight < this.screenDefaultHeight;\n const dropdown = this.host.shadowRoot?.querySelector('.dropdown-mobile') as HTMLElement;\n if (dropdown) {\n // dropdown.style.position = isKeyboardOpen ? 'absolute' : 'fixed';\n dropdown.style.bottom = isKeyboardOpen ? `${window?.screen?.height - window?.innerHeight}px` : '0';\n window.scroll({ top: 0, left: 0, behavior: 'smooth' });\n }\n };\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.styles['--info-base'] = window.CuraAPI.theme.colors.getColor('info-base');\n this.styles['--neutral-purewhite'] = window.CuraAPI.theme.colors.getColor('neutral-purewhite');\n this.styles['--neutral-light'] = window.CuraAPI.theme.colors.getColor('neutral-light');\n this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor('neutral-dark');\n this.styles['--neutral-black-shadow'] = window.CuraAPI.theme.colors.getColor(`neutral-black`, 0.16);\n this.styles['--error-dark'] = window.CuraAPI.theme.colors.getColor('error-dark');\n this.styles['--error-lighter'] = window.CuraAPI.theme.colors.getColor('error-lighter');\n this.styles['--breakpoints'] = window.CuraAPI.theme.breakpoints.get();\n this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n this.styles['--font-weight-medium'] = this.weights.medium;\n }\n\n @Watch('value')\n onValueChange(newValue: string) {\n this.updateSelectedOption(newValue);\n this.valueChanged.emit(newValue);\n }\n\n componentWillLoad() {\n this.updateSelectedOption(this.value);\n }\n\n componentDidRender() {\n if (this.isDropdownOpen && this.isMobile) {\n this.showOverlay();\n this.getDropdownSearchListHeight();\n } else {\n this.removeOverlay();\n }\n }\n componentDidLoad() {\n this.screenDefaultHeight = window?.innerHeight;\n window?.addEventListener('resize', this.setUp);\n window?.visualViewport?.addEventListener('resize', this.adjustInputPosition);\n }\n\n disconnectedCallback() {\n window?.removeEventListener('resize', this.setUp);\n window?.visualViewport?.removeEventListener('resize', this.adjustInputPosition);\n }\n\n private showOverlay() {\n if (!this.overlayElement) {\n this.overlayElement = document.createElement('div');\n this.overlayElement.className = 'dropdown-overlay';\n this.overlayElement.style.position = 'fixed';\n this.overlayElement.style.top = '0';\n this.overlayElement.style.left = '0';\n this.overlayElement.style.width = '100%';\n this.overlayElement.style.height = '100%';\n this.overlayElement.style.zIndex = '9999';\n this.overlayElement.style.backgroundColor = 'white';\n document.body.appendChild(this.overlayElement);\n\n this.originalOverflow = document.body.style.overflow;\n document.body.style.overflow = 'hidden';\n }\n }\n\n private removeOverlay() {\n if (this.overlayElement && this.overlayElement.parentNode === document.body) {\n document.body.removeChild(this.overlayElement);\n this.overlayElement = null;\n document.body.style.overflow = this.originalOverflow;\n }\n }\n\n private handleSlotChange = () => {\n this.options = Array.from(this.host.querySelectorAll('cura-dropdown-search-option'));\n this.addClickListenersToOptions();\n this.updateHoveredIndex();\n };\n\n private addClickListenersToOptions() {\n this.options.forEach((option, index) => {\n option?.addEventListener('optionSelected', () => this.onSelectedOption(index));\n });\n }\n\n private updateSelectedOption(value: string) {\n const selectedOptionIndex = this.options.findIndex(option => option.getAttribute('value') === value);\n this.hoveredIndex = selectedOptionIndex;\n this.updateOptionAttribute('hovered', this.hoveredIndex);\n this.updateOptionAttribute('selected', this.hoveredIndex);\n\n this.scrollHoveredOptionIntoView();\n this.adjustInputPosition();\n }\n\n private handleInputChange = (event: Event) => {\n const input = event.target as HTMLInputElement;\n this.value = input.value;\n this.onValueChange(this.value);\n // this.valueChanged.emit(this.value);\n };\n\n private onSelectedOption(index: number) {\n const selectedOption = this.options[index];\n if (selectedOption.selectable) {\n const selectedValue = selectedOption.getAttribute('value') || selectedOption.textContent;\n\n this.value = selectedValue || '';\n this.updateSelectedOption(this.value);\n\n this.isDropdownOpen = false;\n this.isOnBlurInput = true;\n this.resetDropdownStyles();\n this.removeOverlay();\n }\n }\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'ArrowDown') {\n event.preventDefault();\n this.moveHighlight(1);\n } else if (event.key === 'ArrowUp') {\n event.preventDefault();\n this.moveHighlight(-1);\n } else if (event.key === 'Enter') {\n event.preventDefault();\n if (this.hoveredIndex > -1) {\n this.handleOnBlur();\n this.onSelectedOption(this.hoveredIndex);\n }\n }\n };\n\n private moveHighlight(direction: number) {\n const visibleOptions = this.options;\n const newIndex = (this.hoveredIndex + direction + visibleOptions.length) % visibleOptions.length;\n this.hoveredIndex = newIndex;\n this.updateOptionAttribute('hovered', this.hoveredIndex);\n this.scrollHoveredOptionIntoView();\n }\n\n private updateOptionAttribute(attribute: string, indexToUpdate: number) {\n this.options.forEach((option, index) => {\n (option as any)[attribute] = index === indexToUpdate;\n });\n }\n\n private updateHoveredIndex() {\n const visibleOptions = this.options;\n const currentValue = this.value;\n this.hoveredIndex = visibleOptions.findIndex(option => option.getAttribute('value') === currentValue);\n }\n\n private scrollHoveredOptionIntoView() {\n const container = this.host.shadowRoot?.querySelector('.dropdown-search-list');\n const hoveredOption = this.options[this.hoveredIndex];\n\n if (container && hoveredOption) {\n const optionRect = hoveredOption.getBoundingClientRect();\n const containerRect = container.getBoundingClientRect();\n\n if (optionRect.bottom > containerRect.bottom) {\n container.scrollTop += optionRect.bottom - containerRect.bottom;\n }\n\n if (optionRect.top < containerRect.top) {\n container.scrollTop -= containerRect.top - optionRect.top;\n }\n }\n }\n\n private handleResize = () => {\n this.isMobile = window.innerWidth < 768;\n if (this.isDropdownOpen) {\n if (this.isMobile) {\n this.showOverlay();\n } else {\n this.resetDropdownStyles();\n this.removeOverlay();\n }\n }\n };\n\n handleOnBlur() {\n if (this.isOnBlurInput === true) {\n setTimeout(() => {\n this.isDropdownOpen = false;\n this.resetDropdownStyles();\n this.removeOverlay();\n }, 200);\n }\n }\n getClasses() {\n return {\n 'dropdown-input-search': true,\n 'dropdown-open': this.isDropdownOpen,\n 'disabled': this.disabled,\n [this.status]: true,\n };\n }\n\n getDropdownClasses() {\n return {\n 'dropdown-search-list': true,\n 'visible': this.options.length && this.isDropdownOpen ? true : false,\n };\n }\n\n hostCSSProperties() {\n return {\n '--dropdown-max-height': this.dropdownMaxHeight,\n };\n }\n\n handleOnFocus() {\n this.isDropdownOpen = true;\n }\n\n getDropdownSearchListHeight() {\n const dropdownInputSearchElement = this.host.shadowRoot?.querySelector('.dropdown-input-search') as HTMLInputElement;\n if (dropdownInputSearchElement) {\n this.host.style.setProperty('--dynamic-input-search-height', `${dropdownInputSearchElement.offsetHeight}px`);\n }\n }\n\n handleGoBack() {\n this.resetDropdownStyles();\n this.isMobile = false;\n }\n\n resetDropdownStyles() {\n const dropdown = this.host.shadowRoot?.querySelector('.dropdown-mobile') as HTMLInputElement;\n if (dropdown && dropdown.style.position === 'fixed') {\n dropdown.style.position = 'relative';\n dropdown.style.removeProperty('bottom');\n }\n }\n\n setUp = () => {\n this.handleResize()\n this.adjustInputPosition();\n }\n\n render() {\n const isMobileDropdown = this.isMobile && this.isDropdownOpen;\n return (\n <Host style={this.hostCSSProperties()} class=\"dropdown-overlay\">\n <div class={`dropdown ${isMobileDropdown ? 'dropdown-mobile' : ''}`} style={this.styles}>\n <div class={this.getClasses()}>\n {this.isMobile && this.isDropdownOpen && (\n <cura-button-transparent fontColor=\"dark\" onClick={() => this.handleGoBack()} iconName=\"arrowLeft\" size=\"medium\" iconOnly color=\"primary\"></cura-button-transparent>\n )}\n <cura-input-text\n disabled={this.disabled}\n label={this.label}\n part=\"cura-input-field\"\n mode={isMobileDropdown ? 'transparent' : 'default'}\n required={this.required}\n hideErrorIcon={this.status === 'error'}\n iconName={this.iconName || 'search'}\n value={this.value}\n status={this.status}\n onValueChange={e => this.onValueChange(e.target.value as string)}\n onInput={e => this.handleInputChange(e)}\n onFocus={() => this.handleOnFocus()}\n onClick={() => (window.innerWidth < 768 ? (this.isMobile = true) : null)}\n onBlur={() => {\n this.handleOnBlur();\n }}\n placeholder={this.placeholder}\n size={this.size}\n onKeyDown={this.handleKeyDown}\n >\n <slot name=\"helperText\"></slot>\n </cura-input-text>\n </div>\n <div id=\"dropdown-search-list\" class={this.getDropdownClasses()}>\n <slot name=\"dropdown-search-option\" onSlotchange={this.handleSlotChange}></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as a,c as e,h as t,H as s}from"./p-fd5ed6b0.js";const i=":host{display:block}.modal{position:fixed;height:100%;width:100%;top:var(--top-offset);bottom:var(--bottom-offset);left:var(--left-offset);right:var(--right-offset);z-index:-1;margin-top:var(--offset-top)}.modal.open{z-index:var(--zIndex)}.modal.open .backdrop,.modal.open .wrapper{opacity:1;visibility:visible;animation:fadeIn 0.3s ease-out}.container{display:flex;align-items:center;justify-content:center}.backdrop,.wrapper{opacity:0;visibility:hidden;transition:opacity 0.3s ease, visibility 0.3s ease}.backdrop{background-color:var(--background-color);z-index:calc(var(--zIndex) - 10);animation:fadeIn 0.3s ease-out}.wrapper{position:fixed;background-color:var(--neutral-white);border:2px solid var(--neutral-light);border-radius:calc(var(--base-spacing) * 3px);max-width:600px;min-width:200px;padding:0px calc(var(--base-spacing) * 4px) calc(var(--base-spacing) * 4px) calc(var(--base-spacing) * 4px);z-index:var(--zIndex);box-shadow:0px 8px 16px 0px var(--neutral-black-shadow-4, rgba(38, 38, 38, 0.12));transform:scale(0.95);transition:transform 0.3s ease-out, opacity 0.3s ease, visibility 0.3s ease}.wrapper ::slotted(*){max-height:80vh;overflow:auto;padding-right:calc(var(--base-spacing) * 5px)}.modal.open .wrapper{transform:scale(1);opacity:1;visibility:visible}.close{justify-self:flex-end;padding-top:calc(var(--base-spacing) * 4px);background:none;border:none;cursor:pointer}.close.mobile{display:none}.close.desktop{display:flex}@media (max-width: 768px){.wrapper{position:fixed;bottom:0px;width:80%;padding-top:calc(var(--base-spacing) * 4px);padding-bottom:0px;border-radius:calc(var(--base-spacing) * 3px) calc(var(--base-spacing) * 3px) 0px 0px;border-bottom:none}.close{align-items:center;border-top:1px dashed var(--neutral-light);margin-top:calc(var(--base-spacing) * 4px);padding:calc(var(--base-spacing) * 4px) 0px;justify-content:center;width:100%}.close.mobile{display:flex;gap:calc(var(--base-spacing) * 2px)}.close.desktop{display:none}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}";const o=i;const r=class{constructor(t){a(this,t);this.modalClose=e(this,"modalClose",7);this.handleClose=()=>{this.modalClose.emit();this.open=false};this.open=false;this.background="light";this.top=0;this.bottom=0;this.left=0;this.right=0;this.mobileCloseLabel="Fechar";this.zindex="100";this.styles={}}setColors(){const a={dark:window.CuraAPI.theme.colors.getColor("neutral-black",.4),light:window.CuraAPI.theme.colors.getColor("primary-darker",.8)};this.styles=Object.assign(Object.assign({},this.styles),{"--background-color":a[this.background]})}setOffset(a,e){this.styles=Object.assign(Object.assign({},this.styles),{[`--${a}-offset`]:`${e}px`})}setTop(){this.setOffset("top",this.top)}setBottom(){this.setOffset("bottom",this.bottom)}setLeft(){this.setOffset("left",this.left)}setRight(){this.setOffset("right",this.right)}connectedCallback(){this.styles=Object.assign(Object.assign({},this.styles),{"--neutral-white":window.CuraAPI.theme.colors.getColor("neutral-white"),"--neutral-light":window.CuraAPI.theme.colors.getColor("neutral-light"),"--base-spacing":window.CuraAPI.theme.spacing.getSpacing()});this.setColors();this.setTop();this.setBottom();this.setLeft();this.setRight()}render(){return t(s,{key:"50f4146aed5392ae16803fb060d4921a5e8a3271",role:"dialog","aria-modal":"true",style:{"--zIndex":this.zindex}},t("div",{key:"149e99a4b8b479515ed3d67c5c8aea08d4d96d1c",class:this.open?"modal container open":"modal container",style:this.styles},t("div",{key:"f32f7f7e16475c51babf95e1ca5f4fea449c1bb0",class:this.open?"modal backdrop open":"modal backdrop",onClick:this.handleClose}),t("div",{key:"183f7ab8f2cee8106795f6104c38a2c93272387f",class:"wrapper"},t("button",{key:"28778c8120c92dfcae0443dccd21f55a204bd82e",class:"close desktop",onClick:this.handleClose},t("cura-icon",{key:"a847de5c1314ea1460673870334f3f98e98f1cf9",name:"close",color:"error-dark",size:"small"})),t("slot",{key:"e08b556b7232425c2b83a21dac75d30fb4361a83"}),t("button",{key:"e736a95f878ff5a2ad6897d9140fd74b26939445",class:"close mobile",onClick:this.handleClose},t("cura-icon",{key:"9eaeaca6f4ea9d3cde5fd44e108de389c727f991",name:"close",color:"error-dark",size:"16"}),t("cura-paragraph",{key:"2476b85e5dd7d6092d3d1d1714ee4a79b73b12d0",color:"error-dark",size:"small",marginBlock:"0"},this.mobileCloseLabel)))))}static get watchers(){return{background:["setColors"],top:["setTop"],bottom:["setBottom"],left:["setLeft"],right:["setRight"]}}};r.style=o;export{r as cura_modal};
|
|
2
|
+
//# sourceMappingURL=p-a4a1f6c6.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["curaModalCss","CuraModalStyle0","CuraModal","this","handleClose","modalClose","emit","open","setColors","backgroundTheme","dark","window","CuraAPI","theme","colors","getColor","light","styles","Object","assign","background","setOffset","name","value","setTop","top","setBottom","bottom","setLeft","left","setRight","right","connectedCallback","spacing","getSpacing","render","h","Host","key","role","style","zindex","class","onClick","color","size","marginBlock","mobileCloseLabel"],"sources":["src/components/cura-modal/cura-modal.scss?tag=cura-modal&encapsulation=shadow","src/components/cura-modal/cura-modal.tsx"],"sourcesContent":["@import '../../../src/scss/mixins/spacing.scss';\n@import '../../../src/scss/mixins/shadows.scss';\n@import '../../../src/scss/mixins/responsive.scss';\n@import '../../../src/scss/mixins/animations.scss';\n\n:host {\n display: block;\n}\n\n.modal {\n position: fixed;\n height: 100%;\n width: 100%;\n top: var(--top-offset);\n bottom: var(--bottom-offset);\n left: var(--left-offset);\n right: var(--right-offset);\n z-index: -1;\n margin-top: var(--offset-top);\n\n &.open {\n z-index: var(--zIndex);\n\n .backdrop,\n .wrapper {\n opacity: 1;\n visibility: visible;\n animation: fadeIn 0.3s ease-out;\n }\n }\n}\n\n.container {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.backdrop,\n.wrapper {\n opacity: 0;\n visibility: hidden;\n transition: opacity 0.3s ease, visibility 0.3s ease;\n}\n\n.backdrop {\n background-color: var(--background-color);\n z-index: calc(var(--zIndex) - 10);\n animation: fadeIn 0.3s ease-out;\n}\n\n.wrapper {\n position: fixed;\n background-color: var(--neutral-white);\n border: 2px solid var(--neutral-light);\n border-radius: #{$spacing-xxxs};\n max-width: 600px;\n min-width: 200px;\n padding: #{$spacing-none} #{$spacing-xxs} #{$spacing-xxs} #{$spacing-xxs};\n z-index: var(--zIndex);\n\n @include shadow-level4();\n\n transform: scale(0.95);\n transition: transform 0.3s ease-out, opacity 0.3s ease, visibility 0.3s ease;\n\n ::slotted(*) {\n max-height: 80vh;\n overflow: auto;\n padding-right: #{$spacing-xs};\n }\n}\n\n.modal.open .wrapper {\n transform: scale(1);\n opacity: 1;\n visibility: visible;\n}\n\n.close {\n justify-self: flex-end;\n padding-top: #{$spacing-xxs};\n background: none;\n border: none;\n cursor: pointer;\n\n &.mobile {\n display: none;\n }\n\n &.desktop {\n display: flex;\n }\n}\n\n@include mobile-only() {\n .wrapper {\n position: fixed;\n bottom: #{$spacing-none};\n width: 80%;\n padding-top: #{$spacing-xxs};\n padding-bottom: #{$spacing-none};\n border-radius: #{$spacing-xxxs} #{$spacing-xxxs} #{$spacing-none} #{$spacing-none};\n border-bottom: none;\n }\n\n .close {\n align-items: center;\n border-top: 1px dashed var(--neutral-light);\n margin-top: #{$spacing-xxs};\n padding: #{$spacing-xxs} #{$spacing-none};\n justify-content: center;\n width: 100%;\n\n &.mobile {\n display: flex;\n gap: #{$spacing-mini};\n }\n\n &.desktop {\n display: none;\n }\n }\n}\n\n@include fadeIn();\n@include fadeOut();\n","import { Component, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-modal',\n styleUrl: 'cura-modal.scss',\n shadow: true,\n})\nexport class CuraModal {\n /**\n * Property open to control modal visibility.\n * Default: false\n */\n @Prop({ mutable: true, reflect: true }) open?: boolean = false;\n /**\n * Property background to control modal backdrop color.\n * Default: light\n */\n @Prop() background?: 'dark' | 'light' = 'light';\n /**\n * Property top to control modal top position.\n * Default: 0px\n */\n @Prop() top?: number = 0;\n /**\n * Property bottom to control modal bottom position.\n * Default: 0px\n */\n @Prop() bottom?: number = 0;\n /**\n * Property left to control modal left position.\n * Default: 0px\n */\n @Prop() left?: number = 0;\n /**\n * Property right to control modal right position.\n * Default: 0px\n */\n @Prop() right?: number = 0;\n /**\n * Defines the label for the close button when the modal is viewed on mobile.\n * Default: Fechar\n */\n @Prop({ reflect: true }) mobileCloseLabel: string = 'Fechar';\n /**\n * Property zindex to control the z-index value of the component.\n * Default: 100\n */\n @Prop({ reflect: true }) zindex: string = '100';\n /**\n * Event close to handle modal close.\n */\n @Event({ eventName: 'modalClose' }) modalClose: EventEmitter<void>;\n\n @State() styles = {};\n\n @Watch('background')\n setColors() {\n const backgroundTheme = {\n dark: window.CuraAPI.theme.colors.getColor('neutral-black', 0.4),\n light: window.CuraAPI.theme.colors.getColor('primary-darker', 0.8),\n };\n\n this.styles = {\n ...this.styles,\n '--background-color': backgroundTheme[this.background],\n };\n }\n\n setOffset(name: string, value: number) {\n this.styles = {\n ...this.styles,\n [`--${name}-offset`]: `${value}px`,\n };\n }\n\n @Watch('top')\n setTop() {\n this.setOffset('top', this.top);\n }\n\n @Watch('bottom')\n setBottom() {\n this.setOffset('bottom', this.bottom);\n }\n\n @Watch('left')\n setLeft() {\n this.setOffset('left', this.left);\n }\n\n @Watch('right')\n setRight() {\n this.setOffset('right', this.right);\n }\n\n connectedCallback() {\n this.styles = {\n ...this.styles,\n '--neutral-white': window.CuraAPI.theme.colors.getColor('neutral-white'),\n '--neutral-light': window.CuraAPI.theme.colors.getColor('neutral-light'),\n '--base-spacing': window.CuraAPI.theme.spacing.getSpacing(),\n };\n this.setColors();\n this.setTop();\n this.setBottom();\n this.setLeft();\n this.setRight();\n }\n\n private handleClose = () => {\n this.modalClose.emit();\n this.open = false;\n };\n\n render() {\n return (\n <Host role=\"dialog\" aria-modal=\"true\" style={{ '--zIndex': this.zindex }}>\n <div class={this.open ? 'modal container open' : 'modal container'} style={this.styles}>\n <div class={this.open ? 'modal backdrop open' : 'modal backdrop'} onClick={this.handleClose}></div>\n <div class=\"wrapper\">\n {/* Desktop button */}\n <button class=\"close desktop\" onClick={this.handleClose}>\n <cura-icon name=\"close\" color=\"error-dark\" size=\"small\"></cura-icon>\n </button>\n <slot></slot>\n {/* Mobile button */}\n <button class=\"close mobile\" onClick={this.handleClose}>\n <cura-icon name=\"close\" color=\"error-dark\" size=\"16\"></cura-icon>\n <cura-paragraph color=\"error-dark\" size=\"small\" marginBlock=\"0\">\n {this.mobileCloseLabel}\n </cura-paragraph>\n </button>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAe,khEACrB,MAAAC,EAAeD,E,MCMFE,EAAS,M,gEAsGZC,KAAAC,YAAc,KACpBD,KAAKE,WAAWC,OAChBH,KAAKI,KAAO,KAAK,E,UAnGsC,M,gBAKjB,Q,SAKjB,E,YAKG,E,UAKF,E,WAKC,E,sBAK2B,S,YAKV,M,YAMxB,E,CAGlB,SAAAC,GACE,MAAMC,EAAkB,CACtBC,KAAMC,OAAOC,QAAQC,MAAMC,OAAOC,SAAS,gBAAiB,IAC5DC,MAAOL,OAAOC,QAAQC,MAAMC,OAAOC,SAAS,iBAAkB,KAGhEZ,KAAKc,OAAMC,OAAAC,OAAAD,OAAAC,OAAA,GACNhB,KAAKc,QAAM,CACd,qBAAsBR,EAAgBN,KAAKiB,a,CAI/C,SAAAC,CAAUC,EAAcC,GACtBpB,KAAKc,OAAMC,OAAAC,OAAAD,OAAAC,OAAA,GACNhB,KAAKc,QAAM,CACd,CAAC,KAAKK,YAAgB,GAAGC,O,CAK7B,MAAAC,GACErB,KAAKkB,UAAU,MAAOlB,KAAKsB,I,CAI7B,SAAAC,GACEvB,KAAKkB,UAAU,SAAUlB,KAAKwB,O,CAIhC,OAAAC,GACEzB,KAAKkB,UAAU,OAAQlB,KAAK0B,K,CAI9B,QAAAC,GACE3B,KAAKkB,UAAU,QAASlB,KAAK4B,M,CAG/B,iBAAAC,GACE7B,KAAKc,OAAMC,OAAAC,OAAAD,OAAAC,OAAA,GACNhB,KAAKc,QAAM,CACd,kBAAmBN,OAAOC,QAAQC,MAAMC,OAAOC,SAAS,iBACxD,kBAAmBJ,OAAOC,QAAQC,MAAMC,OAAOC,SAAS,iBACxD,iBAAkBJ,OAAOC,QAAQC,MAAMoB,QAAQC,eAEjD/B,KAAKK,YACLL,KAAKqB,SACLrB,KAAKuB,YACLvB,KAAKyB,UACLzB,KAAK2B,U,CAQP,MAAAK,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAK,SAAQ,aAAY,OAAOC,MAAO,CAAE,WAAYrC,KAAKsC,SAC9DL,EAAA,OAAAE,IAAA,2CAAKI,MAAOvC,KAAKI,KAAO,uBAAyB,kBAAmBiC,MAAOrC,KAAKc,QAC9EmB,EAAA,OAAAE,IAAA,2CAAKI,MAAOvC,KAAKI,KAAO,sBAAwB,iBAAkBoC,QAASxC,KAAKC,cAChFgC,EAAA,OAAAE,IAAA,2CAAKI,MAAM,WAETN,EAAA,UAAAE,IAAA,2CAAQI,MAAM,gBAAgBC,QAASxC,KAAKC,aAC1CgC,EAAA,aAAAE,IAAA,2CAAWhB,KAAK,QAAQsB,MAAM,aAAaC,KAAK,WAElDT,EAAA,QAAAE,IAAA,6CAEAF,EAAA,UAAAE,IAAA,2CAAQI,MAAM,eAAeC,QAASxC,KAAKC,aACzCgC,EAAA,aAAAE,IAAA,2CAAWhB,KAAK,QAAQsB,MAAM,aAAaC,KAAK,OAChDT,EAAA,kBAAAE,IAAA,2CAAgBM,MAAM,aAAaC,KAAK,QAAQC,YAAY,KACzD3C,KAAK4C,qB","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as t,h as e,H as s,g as r}from"./p-fd5ed6b0.js";const i=":host{display:block;box-sizing:border-box;width:100%}cura-heading{--margin-block:0 !important}.container{display:flex}.compact{display:flex;padding:0px;justify-content:space-between;align-items:center}.compact .heading{text-align:right}.stepper-list{gap:4px;display:flex;flex-shrink:0;align-items:center;padding:0;flex:1;width:100%;justify-content:space-between}.step{display:flex;align-items:center;flex-direction:row;flex:1;gap:4px}.step .wrapper{flex:1;position:relative}.step .divider{background-color:var(--neutral-light);height:2px;flex:1;transition:all 1s}.step .animation{position:absolute;top:0;left:0;right:0;width:var(--progress-width)}.step .done{background-color:var(--success-light)}.step .stop{background-color:var(--error-light)}.step .active{background-color:var(--info-light)}.last{flex:0}";const o=i;const a=class{constructor(e){t(this,e);this.activeStepIndex=undefined;this.errorInCurrentStep=false;this.displayHeading=false;this.variant="default";this.steps=[];this.styles={};this.stepList=[]}connectedCallback(){this.initializeSteps();const{fonts:t,colors:e,spacing:s}=window.CuraAPI.theme;const r=t.getWeights();this.styles=this.generateStyles(e,t,s,r)}generateStyles(t,e,s,r){return{"--base-spacing":s.getSpacing(),"--neutral-purewhite":t.getColor("neutral-purewhite"),"--neutral-lighter":t.getColor("neutral-lighter"),"--neutral-base":t.getColor("neutral-base"),"--neutral-light":t.getColor("neutral-light"),"--success-light":t.getColor("success-light"),"--info-light":t.getColor("info-light"),"--error-light":t.getColor("error-light"),"--font-size":e.getSize(),"--font-color":e.getColor(),"--font-family":e.getFamily(),"--font-weight-regular":r.regular}}initializeSteps(){if(typeof this.steps==="string"){this.stepList=JSON.parse(this.steps||"[]")}else{this.stepList=this.steps}}getStepStatus(t){if(this.activeStepIndex===t&&this.errorInCurrentStep)return"stop";if(this.activeStepIndex===t&&this.stepList.length!==t)return"active";if(this.activeStepIndex>=t)return"done";return"default"}getProgressStyles(){const t={default:{progressColor:"var(--info-light)",activeStepTextColor:"info-darker",nextStepTextColor:"info-dark"},firstStep:{progressColor:"var(--info-light)",activeStepTextColor:"neutral-dark",nextStepTextColor:"neutral-medium"},completed:{progressColor:"var(--success-light)",activeStepTextColor:"success-darker",nextStepTextColor:"success-dark"},error:{progressColor:"var(--error-light)",activeStepTextColor:"error-darker",nextStepTextColor:"error-dark"}};if(this.errorInCurrentStep){return t.error}if(this.activeStepIndex===0){return t.firstStep}if(this.activeStepIndex===this.stepList.length){return t.completed}return t.default}renderCompactStepper(){var t;const s=this.activeStepIndex===0?this.stepList[this.activeStepIndex].title:this.stepList[this.activeStepIndex-1].title;const r=this.activeStepIndex===0?this.stepList[this.activeStepIndex+1].title:(t=this.stepList[this.activeStepIndex])===null||t===void 0?void 0:t.title;const i=this.activeStepIndex===this.stepList.length;const o=!(i||this.errorInCurrentStep);const{progressColor:a,activeStepTextColor:l,nextStepTextColor:n}=this.getProgressStyles();const c=this.activeStepIndex*100/this.stepList.length;return e("div",{class:"container compact",style:this.styles},e("cura-progress-bar",{progress:c,progressColor:a,active:this.activeStepIndex!==0},!o?e("cura-icon",{name:this.errorInCurrentStep?"alertCircle":"checkCircle",color:this.errorInCurrentStep?"error-dark":"success-dark",size:"16"}):e("cura-heading",{color:"neutral-dark",size:"xsmall"},this.activeStepIndex,"/",this.stepList.length)),this.displayHeading&&e("div",{class:"heading"},e("cura-heading",{size:"small",weight:"bold",color:l},s),!i&&e("cura-heading",{size:"xsmall",weight:"regular",color:n},"Próximo: ",r)))}renderStep(t,s){const r=this.getStepStatus(s+1);const i=s===this.stepList.length-1;const o=r!=="default"?"100%":"0";return e("div",{class:`step ${i?"last":""}`,key:t.title},e("cura-stepper-item",{heading:t.title,label:t.label,displayHeading:this.displayHeading,status:r}),s<this.stepList.length-1&&e("div",{class:"wrapper"},e("div",{class:"divider"}),e("div",{class:`divider ${r} animation`,style:{"--progress-width":o}})))}renderStepper(){return e("div",{class:"container",style:this.styles},e("div",{class:"stepper-list"},this.stepList.map(((t,e)=>this.renderStep(t,e)))))}render(){return e(s,{key:"
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as t,h as e,H as s,g as r}from"./p-fd5ed6b0.js";const i=":host{display:block;box-sizing:border-box;width:100%}cura-heading{--margin-block:0 !important}.container{display:flex}.compact{display:flex;padding:0px;justify-content:space-between;align-items:center}.compact .heading{text-align:right}.stepper-list{gap:4px;display:flex;flex-shrink:0;align-items:center;padding:0;flex:1;width:100%;justify-content:space-between}.step{display:flex;align-items:center;flex-direction:row;flex:1;gap:4px}.step .wrapper{flex:1;position:relative}.step .divider{background-color:var(--neutral-light);height:2px;flex:1;transition:all 1s}.step .animation{position:absolute;top:0;left:0;right:0;width:var(--progress-width)}.step .done{background-color:var(--success-light)}.step .stop{background-color:var(--error-light)}.step .active{background-color:var(--info-light)}.last{flex:0}";const o=i;const a=class{constructor(e){t(this,e);this.activeStepIndex=undefined;this.errorInCurrentStep=false;this.displayHeading=false;this.variant="default";this.steps=[];this.styles={};this.stepList=[]}connectedCallback(){this.initializeSteps();const{fonts:t,colors:e,spacing:s}=window.CuraAPI.theme;const r=t.getWeights();this.styles=this.generateStyles(e,t,s,r)}generateStyles(t,e,s,r){return{"--base-spacing":s.getSpacing(),"--neutral-purewhite":t.getColor("neutral-purewhite"),"--neutral-lighter":t.getColor("neutral-lighter"),"--neutral-base":t.getColor("neutral-base"),"--neutral-light":t.getColor("neutral-light"),"--success-light":t.getColor("success-light"),"--info-light":t.getColor("info-light"),"--error-light":t.getColor("error-light"),"--font-size":e.getSize(),"--font-color":e.getColor(),"--font-family":e.getFamily(),"--font-weight-regular":r.regular}}initializeSteps(){if(typeof this.steps==="string"){this.stepList=JSON.parse(this.steps||"[]")}else{this.stepList=this.steps}}getStepStatus(t){if(this.activeStepIndex===t&&this.errorInCurrentStep)return"stop";if(this.activeStepIndex===t&&this.stepList.length!==t)return"active";if(this.activeStepIndex>=t)return"done";return"default"}getProgressStyles(){const t={default:{progressColor:"var(--info-light)",activeStepTextColor:"info-darker",nextStepTextColor:"info-dark"},firstStep:{progressColor:"var(--info-light)",activeStepTextColor:"neutral-dark",nextStepTextColor:"neutral-medium"},completed:{progressColor:"var(--success-light)",activeStepTextColor:"success-darker",nextStepTextColor:"success-dark"},error:{progressColor:"var(--error-light)",activeStepTextColor:"error-darker",nextStepTextColor:"error-dark"}};if(this.errorInCurrentStep){return t.error}if(this.activeStepIndex===0){return t.firstStep}if(this.activeStepIndex===this.stepList.length){return t.completed}return t.default}renderCompactStepper(){var t;const s=this.activeStepIndex===0?this.stepList[this.activeStepIndex].title:this.stepList[this.activeStepIndex-1].title;const r=this.activeStepIndex===0?this.stepList[this.activeStepIndex+1].title:(t=this.stepList[this.activeStepIndex])===null||t===void 0?void 0:t.title;const i=this.activeStepIndex===this.stepList.length;const o=!(i||this.errorInCurrentStep);const{progressColor:a,activeStepTextColor:l,nextStepTextColor:n}=this.getProgressStyles();const c=this.activeStepIndex*100/this.stepList.length;return e("div",{class:"container compact",style:this.styles},e("cura-progress-bar",{progress:c,progressColor:a,active:this.activeStepIndex!==0},!o?e("cura-icon",{name:this.errorInCurrentStep?"alertCircle":"checkCircle",color:this.errorInCurrentStep?"error-dark":"success-dark",size:"16"}):e("cura-heading",{color:"neutral-dark",size:"xsmall"},this.activeStepIndex,"/",this.stepList.length)),this.displayHeading&&e("div",{class:"heading"},e("cura-heading",{size:"small",weight:"bold",color:l},s),!i&&e("cura-heading",{size:"xsmall",weight:"regular",color:n},"Próximo: ",r)))}renderStep(t,s){const r=this.getStepStatus(s+1);const i=s===this.stepList.length-1;const o=r!=="default"?"100%":"0";return e("div",{class:`step ${i?"last":""}`,key:t.title},e("cura-stepper-item",{heading:t.title,label:t.label,displayHeading:this.displayHeading,status:r}),s<this.stepList.length-1&&e("div",{class:"wrapper"},e("div",{class:"divider"}),e("div",{class:`divider ${r} animation`,style:{"--progress-width":o}})))}renderStepper(){return e("div",{class:"container",style:this.styles},e("div",{class:"stepper-list"},this.stepList.map(((t,e)=>this.renderStep(t,e)))))}render(){return e(s,{key:"a6562de52fefff80eb2d310555ce56956cce64d9"},this.variant==="default"?this.renderStepper():this.renderCompactStepper())}get host(){return r(this)}};a.style=o;export{a as cura_stepper};
|
|
2
|
+
//# sourceMappingURL=p-bd99ef4c.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["curaStepperCss","CuraStepperStyle0","CuraStepper","connectedCallback","this","initializeSteps","fonts","colors","spacing","window","CuraAPI","theme","weights","getWeights","styles","generateStyles","getSpacing","getColor","getSize","getFamily","regular","steps","stepList","JSON","parse","getStepStatus","step","activeStepIndex","errorInCurrentStep","length","getProgressStyles","progressStyles","default","progressColor","activeStepTextColor","nextStepTextColor","firstStep","completed","error","renderCompactStepper","title","subtitle","_a","inProgress","progress","h","class","style","active","name","color","size","displayHeading","weight","renderStep","stepIndex","stepStatus","lastStep","progressWidth","key","heading","label","status","renderStepper","map","render","Host","variant"],"sources":["src/components/cura-stepper/cura-stepper.scss?tag=cura-stepper&encapsulation=shadow","src/components/cura-stepper/cura-stepper.tsx"],"sourcesContent":[":host {\n display: block;\n box-sizing: border-box;\n width: 100%;\n}\n\ncura-heading { \n --margin-block: 0 !important;\n}\n\n.container {\n display: flex;\n}\n\n.compact {\n display: flex;\n padding: 0px;\n justify-content: space-between;\n align-items: center;\n\n .heading{\n text-align: right;\n }\n}\n\n.stepper-list {\n gap: 4px;\n display: flex;\n flex-shrink: 0;\n align-items: center;\n padding: 0;\n flex: 1;\n width: 100%;\n justify-content: space-between;\n}\n\n.step{\n display: flex;\n align-items: center;\n flex-direction: row;\n flex: 1;\n gap: 4px;\n\n .wrapper {\n flex: 1;\n position: relative;\n }\n\n .divider{\n background-color: var(--neutral-light);\n height: 2px;\n flex: 1;\n\n transition: all 1s;\n }\n\n .animation {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n width: var(--progress-width);\n }\n\n .done{\n background-color: var(--success-light);\n }\n\n .stop{\n background-color: var(--error-light);\n }\n\n .active{\n background-color: var(--info-light);\n }\n}\n\n.last{\n flex: 0;\n}\n","import { Component, Host, State, h, Element, Prop } from '@stencil/core';\nimport { Step } from './stepper.type';\n\n@Component({\n tag: 'cura-stepper',\n styleUrl: 'cura-stepper.scss',\n shadow: true,\n})\nexport class CuraStepper {\n /**\n * The current active step index\n */\n @Prop({ reflect: true }) activeStepIndex: number;\n\n /**\n * Indicates if a step has encountered an error\n * If `true`, the current step will be marked as 'stop'\n */\n @Prop({ reflect: true }) errorInCurrentStep: boolean = false;\n\n /**\n * Whether to display the title (default: false)\n */\n @Prop({ reflect: true }) displayHeading: boolean = false;\n\n /**\n * Allows you to set the appearance of the component (default: default)\n */\n @Prop({ reflect: true }) variant: 'compact' | 'default' = 'default';\n\n /**\n * List of steps in the stepper.\n */\n @Prop() steps: Step[] | string = [];\n /**\n * Reference to the host element.\n */\n @Element() host: HTMLElement;\n\n @State() styles = {};\n\n /**\n * Array of steps in the stepper.\n *\n * @type {Date[]}\n * @default []\n */\n @State() stepList: Step[] = [];\n\n connectedCallback() {\n this.initializeSteps();\n\n const { fonts, colors, spacing } = window.CuraAPI.theme;\n const weights = fonts.getWeights();\n\n this.styles = this.generateStyles(colors, fonts, spacing, weights);\n }\n\n generateStyles(colors, fonts, spacing, weights) {\n return {\n '--base-spacing': spacing.getSpacing(),\n '--neutral-purewhite': colors.getColor('neutral-purewhite'),\n '--neutral-lighter': colors.getColor('neutral-lighter'),\n '--neutral-base': colors.getColor('neutral-base'),\n '--neutral-light': colors.getColor('neutral-light'),\n '--success-light': colors.getColor('success-light'),\n '--info-light': colors.getColor('info-light'),\n '--error-light': colors.getColor('error-light'),\n '--font-size': fonts.getSize(),\n '--font-color': fonts.getColor(),\n '--font-family': fonts.getFamily(),\n '--font-weight-regular': weights.regular,\n };\n }\n\n initializeSteps() {\n if (typeof this.steps === 'string') {\n this.stepList = JSON.parse(this.steps || '[]');\n } else {\n this.stepList = this.steps;\n }\n }\n\n getStepStatus(step: number): 'done' | 'stop' | 'active' | 'default' {\n if (this.activeStepIndex === step && this.errorInCurrentStep) return 'stop';\n if (this.activeStepIndex === step && this.stepList.length !== step) return 'active';\n if (this.activeStepIndex >= step) return 'done';\n\n return 'default';\n }\n\n getProgressStyles() {\n const progressStyles = {\n default: {\n progressColor: 'var(--info-light)',\n activeStepTextColor: 'info-darker',\n nextStepTextColor: 'info-dark',\n },\n firstStep: {\n progressColor: 'var(--info-light)',\n activeStepTextColor: 'neutral-dark',\n nextStepTextColor: 'neutral-medium',\n },\n completed: {\n progressColor: 'var(--success-light)',\n activeStepTextColor: 'success-darker',\n nextStepTextColor: 'success-dark',\n },\n error: {\n progressColor: 'var(--error-light)',\n activeStepTextColor: 'error-darker',\n nextStepTextColor: 'error-dark',\n },\n };\n\n if (this.errorInCurrentStep) {\n return progressStyles.error;\n }\n\n if (this.activeStepIndex === 0) {\n return progressStyles.firstStep;\n }\n\n if (this.activeStepIndex === this.stepList.length) {\n return progressStyles.completed;\n }\n\n return progressStyles.default;\n }\n\n renderCompactStepper() {\n const title = this.activeStepIndex === 0 ? this.stepList[this.activeStepIndex].title : this.stepList[this.activeStepIndex - 1].title;\n const subtitle = this.activeStepIndex === 0 ? this.stepList[this.activeStepIndex + 1].title : this.stepList[this.activeStepIndex]?.title;\n const completed = this.activeStepIndex === this.stepList.length;\n const inProgress = !(completed || this.errorInCurrentStep);\n const { progressColor, activeStepTextColor, nextStepTextColor } = this.getProgressStyles();\n\n // Representa a porcentagem de progresso (step atual / quantidade de steps;)\n const progress = (this.activeStepIndex * 100) / this.stepList.length;\n\n return (\n <div class=\"container compact\" style={this.styles}>\n <cura-progress-bar progress={progress} progressColor={progressColor} active={this.activeStepIndex !== 0}>\n {!inProgress ? (\n <cura-icon name={this.errorInCurrentStep ? 'alertCircle' : 'checkCircle'} color={this.errorInCurrentStep ? 'error-dark' : 'success-dark'} size=\"16\"></cura-icon>\n ) : (\n <cura-heading color=\"neutral-dark\" size=\"xsmall\">\n {this.activeStepIndex}/{this.stepList.length}\n </cura-heading>\n )}\n </cura-progress-bar>\n {this.displayHeading && (\n <div class=\"heading\">\n <cura-heading size=\"small\" weight=\"bold\" color={activeStepTextColor}>\n {title}\n </cura-heading>\n {!completed && (\n <cura-heading size=\"xsmall\" weight=\"regular\" color={nextStepTextColor}>\n Próximo: {subtitle}\n </cura-heading>\n )}\n </div>\n )}\n </div>\n );\n }\n\n renderStep(step: Step, stepIndex: number) {\n const stepStatus = this.getStepStatus(stepIndex + 1);\n const lastStep = stepIndex === this.stepList.length - 1;\n const progressWidth = stepStatus !== 'default' ? '100%' : '0';\n\n return (\n <div class={`step ${lastStep ? 'last' : ''}`} key={step.title}>\n <cura-stepper-item heading={step.title} label={step.label} displayHeading={this.displayHeading} status={stepStatus} />\n {stepIndex < this.stepList.length - 1 && (\n <div class=\"wrapper\">\n <div class=\"divider\" />\n <div class={`divider ${stepStatus} animation`} style={{ '--progress-width': progressWidth }} />\n </div>\n )}\n </div>\n );\n }\n renderStepper() {\n return (\n <div class=\"container\" style={this.styles}>\n <div class=\"stepper-list\">{this.stepList.map((step, stepIndex) => this.renderStep(step, stepIndex))}</div>\n </div>\n );\n }\n\n render() {\n return <Host>{this.variant === 'default' ? this.renderStepper() : this.renderCompactStepper()}</Host>;\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAiB,0yBACvB,MAAAC,EAAeD,E,MCOFE,EAAW,M,gFAUiC,M,oBAKJ,M,aAKO,U,WAKzB,G,YAMf,G,cAQU,E,CAE5B,iBAAAC,GACEC,KAAKC,kBAEL,MAAMC,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,GAAYC,OAAOC,QAAQC,MAClD,MAAMC,EAAUN,EAAMO,aAEtBT,KAAKU,OAASV,KAAKW,eAAeR,EAAQD,EAAOE,EAASI,E,CAG5D,cAAAG,CAAeR,EAAQD,EAAOE,EAASI,GACrC,MAAO,CACL,iBAAkBJ,EAAQQ,aAC1B,sBAAuBT,EAAOU,SAAS,qBACvC,oBAAqBV,EAAOU,SAAS,mBACrC,iBAAkBV,EAAOU,SAAS,gBAClC,kBAAmBV,EAAOU,SAAS,iBACnC,kBAAmBV,EAAOU,SAAS,iBACnC,eAAgBV,EAAOU,SAAS,cAChC,gBAAiBV,EAAOU,SAAS,eACjC,cAAeX,EAAMY,UACrB,eAAgBZ,EAAMW,WACtB,gBAAiBX,EAAMa,YACvB,wBAAyBP,EAAQQ,Q,CAIrC,eAAAf,GACE,UAAWD,KAAKiB,QAAU,SAAU,CAClCjB,KAAKkB,SAAWC,KAAKC,MAAMpB,KAAKiB,OAAS,K,KACpC,CACLjB,KAAKkB,SAAWlB,KAAKiB,K,EAIzB,aAAAI,CAAcC,GACZ,GAAItB,KAAKuB,kBAAoBD,GAAQtB,KAAKwB,mBAAoB,MAAO,OACrE,GAAIxB,KAAKuB,kBAAoBD,GAAQtB,KAAKkB,SAASO,SAAWH,EAAM,MAAO,SAC3E,GAAItB,KAAKuB,iBAAmBD,EAAM,MAAO,OAEzC,MAAO,S,CAGT,iBAAAI,GACE,MAAMC,EAAiB,CACrBC,QAAS,CACPC,cAAe,oBACfC,oBAAqB,cACrBC,kBAAmB,aAErBC,UAAW,CACTH,cAAe,oBACfC,oBAAqB,eACrBC,kBAAmB,kBAErBE,UAAW,CACTJ,cAAe,uBACfC,oBAAqB,iBACrBC,kBAAmB,gBAErBG,MAAO,CACLL,cAAe,qBACfC,oBAAqB,eACrBC,kBAAmB,eAIvB,GAAI/B,KAAKwB,mBAAoB,CAC3B,OAAOG,EAAeO,K,CAGxB,GAAIlC,KAAKuB,kBAAoB,EAAG,CAC9B,OAAOI,EAAeK,S,CAGxB,GAAIhC,KAAKuB,kBAAoBvB,KAAKkB,SAASO,OAAQ,CACjD,OAAOE,EAAeM,S,CAGxB,OAAON,EAAeC,O,CAGxB,oBAAAO,G,MACE,MAAMC,EAAQpC,KAAKuB,kBAAoB,EAAIvB,KAAKkB,SAASlB,KAAKuB,iBAAiBa,MAAQpC,KAAKkB,SAASlB,KAAKuB,gBAAkB,GAAGa,MAC/H,MAAMC,EAAWrC,KAAKuB,kBAAoB,EAAIvB,KAAKkB,SAASlB,KAAKuB,gBAAkB,GAAGa,OAAQE,EAAAtC,KAAKkB,SAASlB,KAAKuB,oBAAgB,MAAAe,SAAA,SAAAA,EAAEF,MACnI,MAAMH,EAAYjC,KAAKuB,kBAAoBvB,KAAKkB,SAASO,OACzD,MAAMc,IAAeN,GAAajC,KAAKwB,oBACvC,MAAMK,cAAEA,EAAaC,oBAAEA,EAAmBC,kBAAEA,GAAsB/B,KAAK0B,oBAGvE,MAAMc,EAAYxC,KAAKuB,gBAAkB,IAAOvB,KAAKkB,SAASO,OAE9D,OACEgB,EAAA,OAAKC,MAAM,oBAAoBC,MAAO3C,KAAKU,QACzC+B,EAAA,qBAAmBD,SAAUA,EAAUX,cAAeA,EAAee,OAAQ5C,KAAKuB,kBAAoB,IAClGgB,EACAE,EAAA,aAAWI,KAAM7C,KAAKwB,mBAAqB,cAAgB,cAAesB,MAAO9C,KAAKwB,mBAAqB,aAAe,eAAgBuB,KAAK,OAE/IN,EAAA,gBAAcK,MAAM,eAAeC,KAAK,UACrC/C,KAAKuB,gBAAe,IAAGvB,KAAKkB,SAASO,SAI3CzB,KAAKgD,gBACJP,EAAA,OAAKC,MAAM,WACTD,EAAA,gBAAcM,KAAK,QAAQE,OAAO,OAAOH,MAAOhB,GAC7CM,IAEDH,GACAQ,EAAA,gBAAcM,KAAK,SAASE,OAAO,UAAUH,MAAOf,GAAiB,YACzDM,I,CASxB,UAAAa,CAAW5B,EAAY6B,GACrB,MAAMC,EAAapD,KAAKqB,cAAc8B,EAAY,GAClD,MAAME,EAAWF,IAAcnD,KAAKkB,SAASO,OAAS,EACtD,MAAM6B,EAAgBF,IAAe,UAAY,OAAS,IAE1D,OACEX,EAAA,OAAKC,MAAO,QAAQW,EAAW,OAAS,KAAME,IAAKjC,EAAKc,OACtDK,EAAA,qBAAmBe,QAASlC,EAAKc,MAAOqB,MAAOnC,EAAKmC,MAAOT,eAAgBhD,KAAKgD,eAAgBU,OAAQN,IACvGD,EAAYnD,KAAKkB,SAASO,OAAS,GAClCgB,EAAA,OAAKC,MAAM,WACTD,EAAA,OAAKC,MAAM,YACXD,EAAA,OAAKC,MAAO,WAAWU,cAAwBT,MAAO,CAAE,mBAAoBW,M,CAMtF,aAAAK,GACE,OACElB,EAAA,OAAKC,MAAM,YAAYC,MAAO3C,KAAKU,QACjC+B,EAAA,OAAKC,MAAM,gBAAgB1C,KAAKkB,SAAS0C,KAAI,CAACtC,EAAM6B,IAAcnD,KAAKkD,WAAW5B,EAAM6B,M,CAK9F,MAAAU,GACE,OAAOpB,EAACqB,EAAI,CAAAP,IAAA,4CAAEvD,KAAK+D,UAAY,UAAY/D,KAAK2D,gBAAkB3D,KAAKmC,uB","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["curaStepperCss","CuraStepperStyle0","CuraStepper","connectedCallback","this","initializeSteps","fonts","colors","spacing","window","CuraAPI","theme","weights","getWeights","styles","generateStyles","getSpacing","getColor","getSize","getFamily","regular","steps","stepList","JSON","parse","getStepStatus","step","activeStepIndex","errorInCurrentStep","length","getProgressStyles","progressStyles","default","progressColor","activeStepTextColor","nextStepTextColor","firstStep","completed","error","renderCompactStepper","title","subtitle","_a","inProgress","progress","h","class","style","active","name","color","size","displayHeading","weight","renderStep","stepIndex","stepStatus","lastStep","progressWidth","key","heading","label","status","renderStepper","map","render","Host","variant"],"sources":["src/components/cura-stepper/cura-stepper.scss?tag=cura-stepper&encapsulation=shadow","src/components/cura-stepper/cura-stepper.tsx"],"sourcesContent":[":host {\n display: block;\n box-sizing: border-box;\n width: 100%;\n}\n\ncura-heading { \n --margin-block: 0 !important;\n}\n\n.container {\n display: flex;\n}\n\n.compact {\n display: flex;\n padding: 0px;\n justify-content: space-between;\n align-items: center;\n\n .heading{\n text-align: right;\n }\n}\n\n.stepper-list {\n gap: 4px;\n display: flex;\n flex-shrink: 0;\n align-items: center;\n padding: 0;\n flex: 1;\n width: 100%;\n justify-content: space-between;\n}\n\n.step{\n display: flex;\n align-items: center;\n flex-direction: row;\n flex: 1;\n gap: 4px;\n\n .wrapper {\n flex: 1;\n position: relative;\n }\n\n .divider{\n background-color: var(--neutral-light);\n height: 2px;\n flex: 1;\n\n transition: all 1s;\n }\n\n .animation {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n width: var(--progress-width);\n }\n\n .done{\n background-color: var(--success-light);\n }\n\n .stop{\n background-color: var(--error-light);\n }\n\n .active{\n background-color: var(--info-light);\n }\n}\n\n.last{\n flex: 0;\n}\n","import { Component, Host, State, h, Element, Prop } from '@stencil/core';\nimport { Step } from './stepper.type';\n\n@Component({\n tag: 'cura-stepper',\n styleUrl: 'cura-stepper.scss',\n shadow: true,\n})\nexport class CuraStepper {\n /**\n * The current active step index\n */\n @Prop({ reflect: true }) activeStepIndex: number;\n\n /**\n * Indicates if a step has encountered an error\n * If `true`, the current step will be marked as 'stop'\n */\n @Prop({ reflect: true }) errorInCurrentStep: boolean = false;\n\n /**\n * Whether to display the title (default: false)\n */\n @Prop({ reflect: true }) displayHeading: boolean = false;\n\n /**\n * Allows you to set the appearance of the component (default: default)\n */\n @Prop({ reflect: true }) variant: 'compact' | 'default' = 'default';\n\n /**\n * List of steps in the stepper.\n */\n @Prop() steps: Step[] | string = [];\n /**\n * Reference to the host element.\n */\n @Element() host: HTMLElement;\n\n @State() styles = {};\n\n /**\n * Array of steps in the stepper.\n *\n * @type {Date[]}\n * @default []\n */\n @State() stepList: Step[] = [];\n\n connectedCallback() {\n this.initializeSteps();\n\n const { fonts, colors, spacing } = window.CuraAPI.theme;\n const weights = fonts.getWeights();\n\n this.styles = this.generateStyles(colors, fonts, spacing, weights);\n }\n\n generateStyles(colors, fonts, spacing, weights) {\n return {\n '--base-spacing': spacing.getSpacing(),\n '--neutral-purewhite': colors.getColor('neutral-purewhite'),\n '--neutral-lighter': colors.getColor('neutral-lighter'),\n '--neutral-base': colors.getColor('neutral-base'),\n '--neutral-light': colors.getColor('neutral-light'),\n '--success-light': colors.getColor('success-light'),\n '--info-light': colors.getColor('info-light'),\n '--error-light': colors.getColor('error-light'),\n '--font-size': fonts.getSize(),\n '--font-color': fonts.getColor(),\n '--font-family': fonts.getFamily(),\n '--font-weight-regular': weights.regular,\n };\n }\n\n initializeSteps() {\n if (typeof this.steps === 'string') {\n this.stepList = JSON.parse(this.steps || '[]');\n } else {\n this.stepList = this.steps;\n }\n }\n\n getStepStatus(step: number): 'done' | 'stop' | 'active' | 'default' {\n if (this.activeStepIndex === step && this.errorInCurrentStep) return 'stop';\n if (this.activeStepIndex === step && this.stepList.length !== step) return 'active';\n if (this.activeStepIndex >= step) return 'done';\n\n return 'default';\n }\n\n getProgressStyles() {\n const progressStyles = {\n default: {\n progressColor: 'var(--info-light)',\n activeStepTextColor: 'info-darker',\n nextStepTextColor: 'info-dark',\n },\n firstStep: {\n progressColor: 'var(--info-light)',\n activeStepTextColor: 'neutral-dark',\n nextStepTextColor: 'neutral-medium',\n },\n completed: {\n progressColor: 'var(--success-light)',\n activeStepTextColor: 'success-darker',\n nextStepTextColor: 'success-dark',\n },\n error: {\n progressColor: 'var(--error-light)',\n activeStepTextColor: 'error-darker',\n nextStepTextColor: 'error-dark',\n },\n };\n\n if (this.errorInCurrentStep) {\n return progressStyles.error;\n }\n\n if (this.activeStepIndex === 0) {\n return progressStyles.firstStep;\n }\n\n if (this.activeStepIndex === this.stepList.length) {\n return progressStyles.completed;\n }\n\n return progressStyles.default;\n }\n\n renderCompactStepper() {\n const title = this.activeStepIndex === 0 ? this.stepList[this.activeStepIndex].title : this.stepList[this.activeStepIndex - 1].title;\n const subtitle = this.activeStepIndex === 0 ? this.stepList[this.activeStepIndex + 1].title : this.stepList[this.activeStepIndex]?.title;\n const completed = this.activeStepIndex === this.stepList.length;\n const inProgress = !(completed || this.errorInCurrentStep);\n const { progressColor, activeStepTextColor, nextStepTextColor } = this.getProgressStyles();\n\n // Representa a porcentagem de progresso (step atual / quantidade de steps;)\n const progress = (this.activeStepIndex * 100) / this.stepList.length;\n\n return (\n <div class=\"container compact\" style={this.styles}>\n <cura-progress-bar progress={progress} progressColor={progressColor} active={this.activeStepIndex !== 0}>\n {!inProgress ? (\n <cura-icon name={this.errorInCurrentStep ? 'alertCircle' : 'checkCircle'} color={this.errorInCurrentStep ? 'error-dark' : 'success-dark'} size=\"16\"></cura-icon>\n ) : (\n <cura-heading color=\"neutral-dark\" size=\"xsmall\">\n {this.activeStepIndex}/{this.stepList.length}\n </cura-heading>\n )}\n </cura-progress-bar>\n {this.displayHeading && (\n <div class=\"heading\">\n <cura-heading size=\"small\" weight=\"bold\" color={activeStepTextColor}>\n {title}\n </cura-heading>\n {!completed && (\n <cura-heading size=\"xsmall\" weight=\"regular\" color={nextStepTextColor}>\n Próximo: {subtitle}\n </cura-heading>\n )}\n </div>\n )}\n </div>\n );\n }\n\n renderStep(step: Step, stepIndex: number) {\n const stepStatus = this.getStepStatus(stepIndex + 1);\n const lastStep = stepIndex === this.stepList.length - 1;\n const progressWidth = stepStatus !== 'default' ? '100%' : '0';\n\n return (\n <div class={`step ${lastStep ? 'last' : ''}`} key={step.title}>\n <cura-stepper-item heading={step.title} label={step.label} displayHeading={this.displayHeading} status={stepStatus}></cura-stepper-item>\n {stepIndex < this.stepList.length - 1 && (\n <div class=\"wrapper\">\n <div class=\"divider\" />\n <div class={`divider ${stepStatus} animation`} style={{ '--progress-width': progressWidth }} />\n </div>\n )}\n </div>\n );\n }\n renderStepper() {\n return (\n <div class=\"container\" style={this.styles}>\n <div class=\"stepper-list\">{this.stepList.map((step, stepIndex) => this.renderStep(step, stepIndex))}</div>\n </div>\n );\n }\n\n render() {\n return <Host>{this.variant === 'default' ? this.renderStepper() : this.renderCompactStepper()}</Host>;\n }\n}\n"],"mappings":"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","ignoreList":[]}
|