@crowdfarming/oliva-ds 1.81.0 → 1.82.0-rc.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/crowdfarming-oliva-ds.mjs +28 -7
- package/fesm2022/crowdfarming-oliva-ds.mjs.map +1 -1
- package/lib/icon/src/lib/icon/svg/commerce.constant.d.ts +1 -0
- package/lib/icon/src/lib/icon/svg/index.d.ts +1 -0
- package/lib/input-upload/src/lib/input-upload/input-upload.component.d.ts +4 -1
- package/package.json +1 -1
|
@@ -351,6 +351,10 @@ const commerceIcons = {
|
|
|
351
351
|
'avocado-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
352
352
|
<path d="M16 13.9999C14.8133 13.9999 13.6533 14.3518 12.6666 15.0111C11.6799 15.6704 10.9108 16.6075 10.4567 17.7038C10.0026 18.8002 9.88377 20.0066 10.1153 21.1705C10.3468 22.3344 10.9182 23.4035 11.7573 24.2426C12.5965 25.0817 13.6656 25.6531 14.8294 25.8847C15.9933 26.1162 17.1997 25.9973 18.2961 25.5432C19.3924 25.0891 20.3295 24.3201 20.9888 23.3334C21.6481 22.3467 22 21.1866 22 19.9999C21.9983 18.4092 21.3657 16.884 20.2408 15.7591C19.1159 14.6343 17.5908 14.0016 16 13.9999ZM16 23.9999C15.2089 23.9999 14.4355 23.7653 13.7777 23.3258C13.1199 22.8863 12.6072 22.2616 12.3045 21.5307C12.0017 20.7998 11.9225 19.9955 12.0768 19.2196C12.2312 18.4437 12.6122 17.7309 13.1716 17.1715C13.731 16.6121 14.4437 16.2311 15.2196 16.0768C15.9956 15.9225 16.7998 16.0017 17.5307 16.3044C18.2616 16.6072 18.8863 17.1199 19.3259 17.7777C19.7654 18.4355 20 19.2088 20 19.9999C20 21.0608 19.5786 22.0782 18.8284 22.8284C18.0783 23.5785 17.0609 23.9999 16 23.9999ZM26.375 16.3324L22.65 5.80869C22.1934 4.42094 21.314 3.21084 20.1351 2.34796C18.9562 1.48509 17.5368 1.0127 16.076 0.996987C14.6151 0.981276 13.1859 1.42303 11.9888 2.26035C10.7916 3.09767 9.88636 4.28858 9.39999 5.66619L5.71124 16.1037C5.0859 17.7589 4.86907 19.5405 5.07915 21.2974C5.28923 23.0542 5.92002 24.7345 6.918 26.1956C7.91597 27.6567 9.25168 28.8555 10.8118 29.6902C12.3719 30.525 14.1103 30.9711 15.8796 30.9907C17.6489 31.0102 19.3967 30.6027 20.9749 29.8027C22.5531 29.0027 23.915 27.8338 24.9451 26.3952C25.9752 24.9565 26.643 23.2906 26.8919 21.5388C27.1409 19.7871 26.9635 18.0011 26.375 16.3324ZM16 28.9999C14.5428 28.999 13.1075 28.6444 11.8175 27.9667C10.5275 27.2889 9.42114 26.3083 8.59349 25.1089C7.76584 23.9095 7.24158 22.5272 7.0657 21.0807C6.88983 19.6341 7.06759 18.1664 7.58374 16.8037C7.58611 16.796 7.58904 16.7885 7.59249 16.7812L11.285 6.33244C11.6325 5.34755 12.2798 4.49622 13.1358 3.89793C13.9919 3.29964 15.0138 2.98445 16.0581 2.99658C17.1025 3.00871 18.1168 3.34757 18.9587 3.96559C19.8007 4.5836 20.4279 5.44975 20.7525 6.44244L20.76 6.46494L24.4875 16.9999C24.966 18.3576 25.1121 19.8102 24.9135 21.2359C24.715 22.6617 24.1776 24.0191 23.3463 25.1944C22.5151 26.3696 21.4142 27.3285 20.136 27.9906C18.8578 28.6528 17.4395 28.9989 16 28.9999Z" fill="#1A1C1C"/>
|
|
353
353
|
</svg>
|
|
354
|
+
`,
|
|
355
|
+
'tag-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
356
|
+
<path d="M30.4138 17L18 4.58626C17.815 4.39973 17.5947 4.25185 17.352 4.15121C17.1093 4.05057 16.849 3.99917 16.5863 4.00001H5.00001C4.73479 4.00001 4.48044 4.10537 4.2929 4.2929C4.10537 4.48044 4.00001 4.73479 4.00001 5.00001V16.5863C3.99917 16.849 4.05057 17.1093 4.15121 17.352C4.25185 17.5947 4.39973 17.815 4.58626 18L17 30.4138C17.1857 30.5995 17.4062 30.7469 17.6489 30.8474C17.8916 30.948 18.1517 30.9997 18.4144 30.9997C18.6771 30.9997 18.9372 30.948 19.1799 30.8474C19.4225 30.7469 19.643 30.5995 19.8288 30.4138L30.4138 19.8288C30.5995 19.643 30.7469 19.4225 30.8474 19.1799C30.948 18.9372 30.9997 18.6771 30.9997 18.4144C30.9997 18.1517 30.948 17.8916 30.8474 17.6489C30.7469 17.4062 30.5995 17.1857 30.4138 17ZM18.4138 29L6.00001 16.5863V6.00001H16.5863L29 18.4138L18.4138 29ZM12 10.5C12 10.7967 11.912 11.0867 11.7472 11.3334C11.5824 11.58 11.3481 11.7723 11.074 11.8858C10.7999 11.9994 10.4983 12.0291 10.2074 11.9712C9.9164 11.9133 9.64913 11.7704 9.43935 11.5607C9.22957 11.3509 9.08671 11.0836 9.02883 10.7926C8.97095 10.5017 9.00066 10.2001 9.11419 9.92598C9.22772 9.6519 9.41998 9.41763 9.66666 9.25281C9.91333 9.08798 10.2033 9.00001 10.5 9.00001C10.8978 9.00001 11.2794 9.15805 11.5607 9.43935C11.842 9.72065 12 10.1022 12 10.5Z" fill="#1A1C1C"/>
|
|
357
|
+
</svg>
|
|
354
358
|
`
|
|
355
359
|
};
|
|
356
360
|
|
|
@@ -2574,11 +2578,11 @@ class AccordionComponent {
|
|
|
2574
2578
|
}
|
|
2575
2579
|
}
|
|
2576
2580
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2577
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.7", type: AccordionComponent, isStandalone: true, selector: "lib-accordion", inputs: { id: "id", expanded: "expanded", size: "size", title: "title", showText: "showText", text: "text", showSlot: "showSlot", swapTemplate: "swapTemplate", mode: "mode", radioName: "radioName", radioChecked: "radioChecked", isLoading: "isLoading" }, outputs: { expandedChange: "expandedChange", toggled: "toggled", radioCheckedChange: "radioCheckedChange" }, ngImport: i0, template: "<div\n class=\"c-accordion\"\n [class.c-accordion--expanded]=\"expanded\"\n [class.c-accordion--sm]=\"size === 'sm'\"\n [class.c-accordion--md]=\"size === 'md'\"\n [class.c-accordion--choice]=\"mode === 'choice'\"\n [class.c-accordion--loading]=\"isLoading\"\n>\n <div\n class=\"c-accordion__header\"\n [attr.role]=\"mode === 'choice' ? 'none' : 'button'\"\n [id]=\"id + '-header'\"\n [tabindex]=\"isLoading ? -1 : 0\"\n [attr.aria-expanded]=\"mode === 'choice' ? null : expanded\"\n [attr.aria-controls]=\"mode === 'choice' ? null : id + '-content'\"\n [attr.aria-disabled]=\"isLoading ? 'true' : null\"\n (click)=\"toggle()\"\n (keydown.enter)=\"toggle()\"\n (keydown.space)=\"toggle()\"\n >\n @if (isLoading) {\n <div class=\"c-accordion__skeleton\">\n <span aria-hidden=\"true\"></span>\n </div>\n } @else {\n <h3 class=\"c-accordion__title\" [id]=\"id + '-title'\">{{ title }}</h3>\n }\n\n <!-- Default arrow icons for accordion mode -->\n <span\n class=\"c-accordion__arrow\"\n *ngIf=\"mode === 'accordion' && !expanded\"\n [class.open]=\"expanded\"\n >\n <lib-icon name=\"caretdown-regular\" size=\"lg\" iconBefore />\n </span>\n <span\n class=\"c-accordion__arrow\"\n *ngIf=\"mode === 'accordion' && expanded\"\n [class.open]=\"expanded\"\n >\n <lib-icon name=\"caretup-regular\" size=\"lg\" iconBefore />\n </span>\n\n <!-- Trailing slot for choice mode -->\n <span class=\"c-accordion__choice-trailing\" *ngIf=\"mode === 'choice'\">\n <ng-content select=\"[choiceTrailing]\"></ng-content>\n </span>\n\n <!-- Radio input for choice mode -->\n <input\n *ngIf=\"mode === 'choice'\"\n type=\"radio\"\n class=\"c-accordion__radio\"\n [class.c-accordion__radio--checked]=\"radioChecked\"\n [id]=\"id + '-radio'\"\n [attr.aria-labelledby]=\"id + '-title'\"\n [name]=\"radioName || ''\"\n [checked]=\"radioChecked\"\n tabindex=\"-1\"\n />\n </div>\n\n <div\n class=\"c-accordion__content\"\n [class.c-accordion__content--visible]=\"expanded\"\n [id]=\"id + '-content'\"\n [attr.role]=\"mode === 'choice' ? 'region' : 'region'\"\n [attr.aria-labelledby]=\"mode === 'choice' ? id + '-radio' : id + '-header'\"\n >\n <div class=\"c-accordion__content-inner\">\n <ng-container *ngIf=\"swapTemplate; else normalContent\">\n <ng-container *ngTemplateOutlet=\"swapTemplate\"></ng-container>\n </ng-container>\n <ng-template #normalContent>\n <div class=\"c-accordion__text\" *ngIf=\"showText\">\n {{ text }}\n </div>\n @if (showSlot) {\n <ng-content></ng-content>\n }\n </ng-template>\n </div>\n </div>\n</div>\n", styles: [".c-accordion{display:flex;flex-direction:column;align-items:stretch;overflow:hidden;border-bottom:var(--size-border-width-sm) solid var(--color-core-border-soft, #d6e0df)}.c-accordion--choice .c-accordion__header{padding:var(--space-component-padding-lg, 1rem)}.c-accordion--loading .c-accordion__header{cursor:not-allowed;pointer-events:none}.c-accordion--sm .c-accordion__header{padding:var(--space-component-padding-md, .75rem) var(--space-component-padding-sm, .5rem)}.c-accordion--sm .c-accordion__title{font-family:var(--typography-label-sm-strong-family, Satoshi);font-size:var(--typography-label-sm-strong-size, .875rem);font-style:normal;font-weight:var(--typography-label-sm-strong-weight, 700);line-height:var(--typography-label-sm-strong-line-height, 1.25rem);letter-spacing:var(--typography-label-sm-strong-letter-spacing, 0rem)}.c-accordion--sm .c-accordion__text{font-size:var(--typography-body-sm-size, .875rem);font-style:normal;font-weight:var(--typography-body-sm-weight, 400);line-height:var(--typography-body-sm-line-height, 1.25rem);letter-spacing:var(--typography-body-sm-letter-spacing, 0rem)}.c-accordion--sm .c-accordion__content-inner{padding:0rem var(--space-component-padding-sm, .5rem) 0rem var(--space-component-padding-sm, .5rem)}.c-accordion__content--visible .c-accordion--sm .c-accordion__content-inner{padding:0rem var(--space-component-padding-sm, .5rem) var(--space-component-padding-md, .75rem) var(--space-component-padding-sm, .5rem)}.c-accordion__header{display:flex;justify-content:space-between;align-items:center;background:var(--color-action-neutral-background-default);padding:var(--space-component-padding-xl, 1.5rem) var(--space-component-padding-lg, 1rem);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .2s;align-self:stretch;box-sizing:border-box;gap:var(--space-component-gap-md, .5rem)}.c-accordion__header:hover{background:var(--color-action-neutral-background-hover, rgba(0, 0, 0, .04))}.c-accordion__header:focus:not(:focus-visible){outline:none;box-shadow:none}.c-accordion__header:focus-visible{box-shadow:var(--focus-inset);outline:none}.c-accordion__header:active,.c-accordion--expanded .c-accordion__header{background:var(--color-action-neutral-background-pressed, rgba(0, 0, 0, .06))}.c-accordion__title{flex:1;color:var(--color-core-content-default, #070707);font-family:var(--typography-label-lg-default-family, Satoshi);font-size:var(--typography-label-lg-strong-size, 1.125rem);font-style:normal;font-weight:var(--typography-label-lg-strong-weight, 700);line-height:var(--typography-label-lg-strong-line-height, 1.75rem);letter-spacing:var(--typography-label-lg-strong-letter-spacing, 0rem)}.c-accordion__content{display:grid;grid-template-rows:0fr;align-self:stretch;transition:grid-template-rows .3s ease-out,opacity .25s ease-out;opacity:0}.c-accordion__content--visible{grid-template-rows:1fr;opacity:1}.c-accordion__content-inner{overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-component-gap-md, .5rem);padding:0rem var(--space-component-padding-lg, 1rem) 0rem var(--space-component-padding-lg, 1rem);transition:padding .3s ease-out}.c-accordion__content--visible .c-accordion__content-inner{padding:0rem var(--space-component-padding-lg, 1rem) var(--space-component-padding-lg, 1rem) var(--space-component-padding-lg, 1rem)}.c-accordion__text{color:var(--color-core-content-soft, #535858);font-family:var(--typography-body-md-family, Satoshi);font-size:var(--typography-body-md-size, 1rem);font-style:normal;font-weight:var(--typography-body-md-weight, 400);line-height:var(--typography-body-md-line-height, 1.5rem);letter-spacing:var(--typography-body-md-letter-spacing, 0rem)}.c-accordion__arrow{display:contents}.c-accordion__radio{margin:0 var(--space-component-gap-sm, .25rem) 0 0;cursor:pointer;appearance:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;width:1rem;height:1rem;border:2px solid var(--color-core-border-soft, #d6e0df);border-radius:50%;background-color:var(--color-textfield-background-default, #f7f7f7);position:relative;transition:all .2s ease;flex-shrink:0}.c-accordion__radio:hover{border-color:var(--color-core-border-default, #070707)}.c-accordion__radio:focus{outline:none;box-shadow:none}.c-accordion__radio:checked,.c-accordion__radio
|
|
2581
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.7", type: AccordionComponent, isStandalone: true, selector: "lib-accordion", inputs: { id: "id", expanded: "expanded", size: "size", title: "title", showText: "showText", text: "text", showSlot: "showSlot", swapTemplate: "swapTemplate", mode: "mode", radioName: "radioName", radioChecked: "radioChecked", isLoading: "isLoading" }, outputs: { expandedChange: "expandedChange", toggled: "toggled", radioCheckedChange: "radioCheckedChange" }, ngImport: i0, template: "<div\n class=\"c-accordion\"\n [class.c-accordion--expanded]=\"expanded\"\n [class.c-accordion--sm]=\"size === 'sm'\"\n [class.c-accordion--md]=\"size === 'md'\"\n [class.c-accordion--choice]=\"mode === 'choice'\"\n [class.c-accordion--loading]=\"isLoading\"\n>\n <div\n class=\"c-accordion__header\"\n [attr.role]=\"mode === 'choice' ? 'none' : 'button'\"\n [id]=\"id + '-header'\"\n [tabindex]=\"isLoading ? -1 : 0\"\n [attr.aria-expanded]=\"mode === 'choice' ? null : expanded\"\n [attr.aria-controls]=\"mode === 'choice' ? null : id + '-content'\"\n [attr.aria-disabled]=\"isLoading ? 'true' : null\"\n (click)=\"toggle()\"\n (keydown.enter)=\"toggle()\"\n (keydown.space)=\"toggle()\"\n >\n @if (isLoading) {\n <div class=\"c-accordion__skeleton\">\n <span aria-hidden=\"true\"></span>\n </div>\n } @else {\n <h3 class=\"c-accordion__title\" [id]=\"id + '-title'\">{{ title }}</h3>\n }\n\n <!-- Default arrow icons for accordion mode -->\n <span\n class=\"c-accordion__arrow\"\n *ngIf=\"mode === 'accordion' && !expanded\"\n [class.open]=\"expanded\"\n >\n <lib-icon name=\"caretdown-regular\" size=\"lg\" iconBefore />\n </span>\n <span\n class=\"c-accordion__arrow\"\n *ngIf=\"mode === 'accordion' && expanded\"\n [class.open]=\"expanded\"\n >\n <lib-icon name=\"caretup-regular\" size=\"lg\" iconBefore />\n </span>\n\n <!-- Trailing slot for choice mode -->\n <span class=\"c-accordion__choice-trailing\" *ngIf=\"mode === 'choice'\">\n <ng-content select=\"[choiceTrailing]\"></ng-content>\n </span>\n\n <!-- Radio input for choice mode -->\n <input\n *ngIf=\"mode === 'choice'\"\n type=\"radio\"\n class=\"c-accordion__radio\"\n [class.c-accordion__radio--checked]=\"radioChecked\"\n [id]=\"id + '-radio'\"\n [attr.aria-labelledby]=\"id + '-title'\"\n [name]=\"radioName || ''\"\n [checked]=\"radioChecked\"\n tabindex=\"-1\"\n />\n </div>\n\n <div\n class=\"c-accordion__content\"\n [class.c-accordion__content--visible]=\"expanded\"\n [id]=\"id + '-content'\"\n [attr.role]=\"mode === 'choice' ? 'region' : 'region'\"\n [attr.aria-labelledby]=\"mode === 'choice' ? id + '-radio' : id + '-header'\"\n >\n <div class=\"c-accordion__content-inner\">\n <ng-container *ngIf=\"swapTemplate; else normalContent\">\n <ng-container *ngTemplateOutlet=\"swapTemplate\"></ng-container>\n </ng-container>\n <ng-template #normalContent>\n <div class=\"c-accordion__text\" *ngIf=\"showText\">\n {{ text }}\n </div>\n @if (showSlot) {\n <ng-content></ng-content>\n }\n </ng-template>\n </div>\n </div>\n</div>\n", styles: [".c-accordion{display:flex;flex-direction:column;align-items:stretch;overflow:hidden;border-bottom:var(--size-border-width-sm) solid var(--color-core-border-soft, #d6e0df)}.c-accordion--choice .c-accordion__header{padding:var(--space-component-padding-lg, 1rem)}.c-accordion--loading .c-accordion__header{cursor:not-allowed;pointer-events:none}.c-accordion--sm .c-accordion__header{padding:var(--space-component-padding-md, .75rem) var(--space-component-padding-sm, .5rem)}.c-accordion--sm .c-accordion__title{font-family:var(--typography-label-sm-strong-family, Satoshi);font-size:var(--typography-label-sm-strong-size, .875rem);font-style:normal;font-weight:var(--typography-label-sm-strong-weight, 700);line-height:var(--typography-label-sm-strong-line-height, 1.25rem);letter-spacing:var(--typography-label-sm-strong-letter-spacing, 0rem)}.c-accordion--sm .c-accordion__text{font-size:var(--typography-body-sm-size, .875rem);font-style:normal;font-weight:var(--typography-body-sm-weight, 400);line-height:var(--typography-body-sm-line-height, 1.25rem);letter-spacing:var(--typography-body-sm-letter-spacing, 0rem)}.c-accordion--sm .c-accordion__content-inner{padding:0rem var(--space-component-padding-sm, .5rem) 0rem var(--space-component-padding-sm, .5rem)}.c-accordion__content--visible .c-accordion--sm .c-accordion__content-inner{padding:0rem var(--space-component-padding-sm, .5rem) var(--space-component-padding-md, .75rem) var(--space-component-padding-sm, .5rem)}.c-accordion__header{display:flex;justify-content:space-between;align-items:center;background:var(--color-action-neutral-background-default);padding:var(--space-component-padding-xl, 1.5rem) var(--space-component-padding-lg, 1rem);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .2s;align-self:stretch;box-sizing:border-box;gap:var(--space-component-gap-md, .5rem)}.c-accordion__header:hover{background:var(--color-action-neutral-background-hover, rgba(0, 0, 0, .04))}.c-accordion__header:focus:not(:focus-visible){outline:none;box-shadow:none}.c-accordion__header:focus-visible{box-shadow:var(--focus-inset);outline:none}.c-accordion__header:active,.c-accordion--expanded .c-accordion__header{background:var(--color-action-neutral-background-pressed, rgba(0, 0, 0, .06))}.c-accordion__title{flex:1;color:var(--color-core-content-default, #070707);font-family:var(--typography-label-lg-default-family, Satoshi);font-size:var(--typography-label-lg-strong-size, 1.125rem);font-style:normal;font-weight:var(--typography-label-lg-strong-weight, 700);line-height:var(--typography-label-lg-strong-line-height, 1.75rem);letter-spacing:var(--typography-label-lg-strong-letter-spacing, 0rem)}.c-accordion__content{display:grid;grid-template-rows:0fr;align-self:stretch;transition:grid-template-rows .3s ease-out,opacity .25s ease-out;opacity:0}.c-accordion__content--visible{grid-template-rows:1fr;opacity:1}.c-accordion__content-inner{overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-component-gap-md, .5rem);padding:0rem var(--space-component-padding-lg, 1rem) 0rem var(--space-component-padding-lg, 1rem);transition:padding .3s ease-out}.c-accordion__content--visible .c-accordion__content-inner{padding:0rem var(--space-component-padding-lg, 1rem) var(--space-component-padding-lg, 1rem) var(--space-component-padding-lg, 1rem)}.c-accordion__text{color:var(--color-core-content-soft, #535858);font-family:var(--typography-body-md-family, Satoshi);font-size:var(--typography-body-md-size, 1rem);font-style:normal;font-weight:var(--typography-body-md-weight, 400);line-height:var(--typography-body-md-line-height, 1.5rem);letter-spacing:var(--typography-body-md-letter-spacing, 0rem)}.c-accordion__arrow{display:contents}.c-accordion__radio{margin:0 var(--space-component-gap-sm, .25rem) 0 0;cursor:pointer;appearance:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;width:1rem;height:1rem;border:2px solid var(--color-core-border-soft, #d6e0df);border-radius:50%;background-color:var(--color-textfield-background-default, #f7f7f7);position:relative;transition:all .2s ease;flex-shrink:0}.c-accordion__radio:hover{border-color:var(--color-core-border-default, #070707)}.c-accordion__radio:focus{outline:none;box-shadow:none}.c-accordion__radio:checked,.c-accordion__radio.c-accordion__radio--checked{background-color:var(--color-action-primary-selected-background-default, #070707)!important;border-color:var(--color-action-primary-selected-background-default, #070707)!important}.c-accordion__radio:checked:after,.c-accordion__radio.c-accordion__radio--checked:after{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:6px;height:6px;background-color:var(--color-action-primary-selected-content-default, #ffffff)!important;border-radius:50%}.c-accordion__choice-trailing{display:contents}.c-accordion__skeleton{display:flex;flex-grow:1;align-items:center;height:28px;max-width:88px}.c-accordion__skeleton span{display:block;width:100%;height:8px;background-color:var(--color-effect-skeleton-default);border-radius:var(--size-border-radius-sm, .25rem)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "lib-icon", inputs: ["size", "icon", "disabled", "name", "color"] }] });
|
|
2578
2582
|
}
|
|
2579
2583
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: AccordionComponent, decorators: [{
|
|
2580
2584
|
type: Component,
|
|
2581
|
-
args: [{ selector: 'lib-accordion', standalone: true, imports: [CommonModule, IconComponent], template: "<div\n class=\"c-accordion\"\n [class.c-accordion--expanded]=\"expanded\"\n [class.c-accordion--sm]=\"size === 'sm'\"\n [class.c-accordion--md]=\"size === 'md'\"\n [class.c-accordion--choice]=\"mode === 'choice'\"\n [class.c-accordion--loading]=\"isLoading\"\n>\n <div\n class=\"c-accordion__header\"\n [attr.role]=\"mode === 'choice' ? 'none' : 'button'\"\n [id]=\"id + '-header'\"\n [tabindex]=\"isLoading ? -1 : 0\"\n [attr.aria-expanded]=\"mode === 'choice' ? null : expanded\"\n [attr.aria-controls]=\"mode === 'choice' ? null : id + '-content'\"\n [attr.aria-disabled]=\"isLoading ? 'true' : null\"\n (click)=\"toggle()\"\n (keydown.enter)=\"toggle()\"\n (keydown.space)=\"toggle()\"\n >\n @if (isLoading) {\n <div class=\"c-accordion__skeleton\">\n <span aria-hidden=\"true\"></span>\n </div>\n } @else {\n <h3 class=\"c-accordion__title\" [id]=\"id + '-title'\">{{ title }}</h3>\n }\n\n <!-- Default arrow icons for accordion mode -->\n <span\n class=\"c-accordion__arrow\"\n *ngIf=\"mode === 'accordion' && !expanded\"\n [class.open]=\"expanded\"\n >\n <lib-icon name=\"caretdown-regular\" size=\"lg\" iconBefore />\n </span>\n <span\n class=\"c-accordion__arrow\"\n *ngIf=\"mode === 'accordion' && expanded\"\n [class.open]=\"expanded\"\n >\n <lib-icon name=\"caretup-regular\" size=\"lg\" iconBefore />\n </span>\n\n <!-- Trailing slot for choice mode -->\n <span class=\"c-accordion__choice-trailing\" *ngIf=\"mode === 'choice'\">\n <ng-content select=\"[choiceTrailing]\"></ng-content>\n </span>\n\n <!-- Radio input for choice mode -->\n <input\n *ngIf=\"mode === 'choice'\"\n type=\"radio\"\n class=\"c-accordion__radio\"\n [class.c-accordion__radio--checked]=\"radioChecked\"\n [id]=\"id + '-radio'\"\n [attr.aria-labelledby]=\"id + '-title'\"\n [name]=\"radioName || ''\"\n [checked]=\"radioChecked\"\n tabindex=\"-1\"\n />\n </div>\n\n <div\n class=\"c-accordion__content\"\n [class.c-accordion__content--visible]=\"expanded\"\n [id]=\"id + '-content'\"\n [attr.role]=\"mode === 'choice' ? 'region' : 'region'\"\n [attr.aria-labelledby]=\"mode === 'choice' ? id + '-radio' : id + '-header'\"\n >\n <div class=\"c-accordion__content-inner\">\n <ng-container *ngIf=\"swapTemplate; else normalContent\">\n <ng-container *ngTemplateOutlet=\"swapTemplate\"></ng-container>\n </ng-container>\n <ng-template #normalContent>\n <div class=\"c-accordion__text\" *ngIf=\"showText\">\n {{ text }}\n </div>\n @if (showSlot) {\n <ng-content></ng-content>\n }\n </ng-template>\n </div>\n </div>\n</div>\n", styles: [".c-accordion{display:flex;flex-direction:column;align-items:stretch;overflow:hidden;border-bottom:var(--size-border-width-sm) solid var(--color-core-border-soft, #d6e0df)}.c-accordion--choice .c-accordion__header{padding:var(--space-component-padding-lg, 1rem)}.c-accordion--loading .c-accordion__header{cursor:not-allowed;pointer-events:none}.c-accordion--sm .c-accordion__header{padding:var(--space-component-padding-md, .75rem) var(--space-component-padding-sm, .5rem)}.c-accordion--sm .c-accordion__title{font-family:var(--typography-label-sm-strong-family, Satoshi);font-size:var(--typography-label-sm-strong-size, .875rem);font-style:normal;font-weight:var(--typography-label-sm-strong-weight, 700);line-height:var(--typography-label-sm-strong-line-height, 1.25rem);letter-spacing:var(--typography-label-sm-strong-letter-spacing, 0rem)}.c-accordion--sm .c-accordion__text{font-size:var(--typography-body-sm-size, .875rem);font-style:normal;font-weight:var(--typography-body-sm-weight, 400);line-height:var(--typography-body-sm-line-height, 1.25rem);letter-spacing:var(--typography-body-sm-letter-spacing, 0rem)}.c-accordion--sm .c-accordion__content-inner{padding:0rem var(--space-component-padding-sm, .5rem) 0rem var(--space-component-padding-sm, .5rem)}.c-accordion__content--visible .c-accordion--sm .c-accordion__content-inner{padding:0rem var(--space-component-padding-sm, .5rem) var(--space-component-padding-md, .75rem) var(--space-component-padding-sm, .5rem)}.c-accordion__header{display:flex;justify-content:space-between;align-items:center;background:var(--color-action-neutral-background-default);padding:var(--space-component-padding-xl, 1.5rem) var(--space-component-padding-lg, 1rem);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .2s;align-self:stretch;box-sizing:border-box;gap:var(--space-component-gap-md, .5rem)}.c-accordion__header:hover{background:var(--color-action-neutral-background-hover, rgba(0, 0, 0, .04))}.c-accordion__header:focus:not(:focus-visible){outline:none;box-shadow:none}.c-accordion__header:focus-visible{box-shadow:var(--focus-inset);outline:none}.c-accordion__header:active,.c-accordion--expanded .c-accordion__header{background:var(--color-action-neutral-background-pressed, rgba(0, 0, 0, .06))}.c-accordion__title{flex:1;color:var(--color-core-content-default, #070707);font-family:var(--typography-label-lg-default-family, Satoshi);font-size:var(--typography-label-lg-strong-size, 1.125rem);font-style:normal;font-weight:var(--typography-label-lg-strong-weight, 700);line-height:var(--typography-label-lg-strong-line-height, 1.75rem);letter-spacing:var(--typography-label-lg-strong-letter-spacing, 0rem)}.c-accordion__content{display:grid;grid-template-rows:0fr;align-self:stretch;transition:grid-template-rows .3s ease-out,opacity .25s ease-out;opacity:0}.c-accordion__content--visible{grid-template-rows:1fr;opacity:1}.c-accordion__content-inner{overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-component-gap-md, .5rem);padding:0rem var(--space-component-padding-lg, 1rem) 0rem var(--space-component-padding-lg, 1rem);transition:padding .3s ease-out}.c-accordion__content--visible .c-accordion__content-inner{padding:0rem var(--space-component-padding-lg, 1rem) var(--space-component-padding-lg, 1rem) var(--space-component-padding-lg, 1rem)}.c-accordion__text{color:var(--color-core-content-soft, #535858);font-family:var(--typography-body-md-family, Satoshi);font-size:var(--typography-body-md-size, 1rem);font-style:normal;font-weight:var(--typography-body-md-weight, 400);line-height:var(--typography-body-md-line-height, 1.5rem);letter-spacing:var(--typography-body-md-letter-spacing, 0rem)}.c-accordion__arrow{display:contents}.c-accordion__radio{margin:0 var(--space-component-gap-sm, .25rem) 0 0;cursor:pointer;appearance:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;width:1rem;height:1rem;border:2px solid var(--color-core-border-soft, #d6e0df);border-radius:50%;background-color:var(--color-textfield-background-default, #f7f7f7);position:relative;transition:all .2s ease;flex-shrink:0}.c-accordion__radio:hover{border-color:var(--color-core-border-default, #070707)}.c-accordion__radio:focus{outline:none;box-shadow:none}.c-accordion__radio:checked,.c-accordion__radio
|
|
2585
|
+
args: [{ selector: 'lib-accordion', standalone: true, imports: [CommonModule, IconComponent], template: "<div\n class=\"c-accordion\"\n [class.c-accordion--expanded]=\"expanded\"\n [class.c-accordion--sm]=\"size === 'sm'\"\n [class.c-accordion--md]=\"size === 'md'\"\n [class.c-accordion--choice]=\"mode === 'choice'\"\n [class.c-accordion--loading]=\"isLoading\"\n>\n <div\n class=\"c-accordion__header\"\n [attr.role]=\"mode === 'choice' ? 'none' : 'button'\"\n [id]=\"id + '-header'\"\n [tabindex]=\"isLoading ? -1 : 0\"\n [attr.aria-expanded]=\"mode === 'choice' ? null : expanded\"\n [attr.aria-controls]=\"mode === 'choice' ? null : id + '-content'\"\n [attr.aria-disabled]=\"isLoading ? 'true' : null\"\n (click)=\"toggle()\"\n (keydown.enter)=\"toggle()\"\n (keydown.space)=\"toggle()\"\n >\n @if (isLoading) {\n <div class=\"c-accordion__skeleton\">\n <span aria-hidden=\"true\"></span>\n </div>\n } @else {\n <h3 class=\"c-accordion__title\" [id]=\"id + '-title'\">{{ title }}</h3>\n }\n\n <!-- Default arrow icons for accordion mode -->\n <span\n class=\"c-accordion__arrow\"\n *ngIf=\"mode === 'accordion' && !expanded\"\n [class.open]=\"expanded\"\n >\n <lib-icon name=\"caretdown-regular\" size=\"lg\" iconBefore />\n </span>\n <span\n class=\"c-accordion__arrow\"\n *ngIf=\"mode === 'accordion' && expanded\"\n [class.open]=\"expanded\"\n >\n <lib-icon name=\"caretup-regular\" size=\"lg\" iconBefore />\n </span>\n\n <!-- Trailing slot for choice mode -->\n <span class=\"c-accordion__choice-trailing\" *ngIf=\"mode === 'choice'\">\n <ng-content select=\"[choiceTrailing]\"></ng-content>\n </span>\n\n <!-- Radio input for choice mode -->\n <input\n *ngIf=\"mode === 'choice'\"\n type=\"radio\"\n class=\"c-accordion__radio\"\n [class.c-accordion__radio--checked]=\"radioChecked\"\n [id]=\"id + '-radio'\"\n [attr.aria-labelledby]=\"id + '-title'\"\n [name]=\"radioName || ''\"\n [checked]=\"radioChecked\"\n tabindex=\"-1\"\n />\n </div>\n\n <div\n class=\"c-accordion__content\"\n [class.c-accordion__content--visible]=\"expanded\"\n [id]=\"id + '-content'\"\n [attr.role]=\"mode === 'choice' ? 'region' : 'region'\"\n [attr.aria-labelledby]=\"mode === 'choice' ? id + '-radio' : id + '-header'\"\n >\n <div class=\"c-accordion__content-inner\">\n <ng-container *ngIf=\"swapTemplate; else normalContent\">\n <ng-container *ngTemplateOutlet=\"swapTemplate\"></ng-container>\n </ng-container>\n <ng-template #normalContent>\n <div class=\"c-accordion__text\" *ngIf=\"showText\">\n {{ text }}\n </div>\n @if (showSlot) {\n <ng-content></ng-content>\n }\n </ng-template>\n </div>\n </div>\n</div>\n", styles: [".c-accordion{display:flex;flex-direction:column;align-items:stretch;overflow:hidden;border-bottom:var(--size-border-width-sm) solid var(--color-core-border-soft, #d6e0df)}.c-accordion--choice .c-accordion__header{padding:var(--space-component-padding-lg, 1rem)}.c-accordion--loading .c-accordion__header{cursor:not-allowed;pointer-events:none}.c-accordion--sm .c-accordion__header{padding:var(--space-component-padding-md, .75rem) var(--space-component-padding-sm, .5rem)}.c-accordion--sm .c-accordion__title{font-family:var(--typography-label-sm-strong-family, Satoshi);font-size:var(--typography-label-sm-strong-size, .875rem);font-style:normal;font-weight:var(--typography-label-sm-strong-weight, 700);line-height:var(--typography-label-sm-strong-line-height, 1.25rem);letter-spacing:var(--typography-label-sm-strong-letter-spacing, 0rem)}.c-accordion--sm .c-accordion__text{font-size:var(--typography-body-sm-size, .875rem);font-style:normal;font-weight:var(--typography-body-sm-weight, 400);line-height:var(--typography-body-sm-line-height, 1.25rem);letter-spacing:var(--typography-body-sm-letter-spacing, 0rem)}.c-accordion--sm .c-accordion__content-inner{padding:0rem var(--space-component-padding-sm, .5rem) 0rem var(--space-component-padding-sm, .5rem)}.c-accordion__content--visible .c-accordion--sm .c-accordion__content-inner{padding:0rem var(--space-component-padding-sm, .5rem) var(--space-component-padding-md, .75rem) var(--space-component-padding-sm, .5rem)}.c-accordion__header{display:flex;justify-content:space-between;align-items:center;background:var(--color-action-neutral-background-default);padding:var(--space-component-padding-xl, 1.5rem) var(--space-component-padding-lg, 1rem);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .2s;align-self:stretch;box-sizing:border-box;gap:var(--space-component-gap-md, .5rem)}.c-accordion__header:hover{background:var(--color-action-neutral-background-hover, rgba(0, 0, 0, .04))}.c-accordion__header:focus:not(:focus-visible){outline:none;box-shadow:none}.c-accordion__header:focus-visible{box-shadow:var(--focus-inset);outline:none}.c-accordion__header:active,.c-accordion--expanded .c-accordion__header{background:var(--color-action-neutral-background-pressed, rgba(0, 0, 0, .06))}.c-accordion__title{flex:1;color:var(--color-core-content-default, #070707);font-family:var(--typography-label-lg-default-family, Satoshi);font-size:var(--typography-label-lg-strong-size, 1.125rem);font-style:normal;font-weight:var(--typography-label-lg-strong-weight, 700);line-height:var(--typography-label-lg-strong-line-height, 1.75rem);letter-spacing:var(--typography-label-lg-strong-letter-spacing, 0rem)}.c-accordion__content{display:grid;grid-template-rows:0fr;align-self:stretch;transition:grid-template-rows .3s ease-out,opacity .25s ease-out;opacity:0}.c-accordion__content--visible{grid-template-rows:1fr;opacity:1}.c-accordion__content-inner{overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-component-gap-md, .5rem);padding:0rem var(--space-component-padding-lg, 1rem) 0rem var(--space-component-padding-lg, 1rem);transition:padding .3s ease-out}.c-accordion__content--visible .c-accordion__content-inner{padding:0rem var(--space-component-padding-lg, 1rem) var(--space-component-padding-lg, 1rem) var(--space-component-padding-lg, 1rem)}.c-accordion__text{color:var(--color-core-content-soft, #535858);font-family:var(--typography-body-md-family, Satoshi);font-size:var(--typography-body-md-size, 1rem);font-style:normal;font-weight:var(--typography-body-md-weight, 400);line-height:var(--typography-body-md-line-height, 1.5rem);letter-spacing:var(--typography-body-md-letter-spacing, 0rem)}.c-accordion__arrow{display:contents}.c-accordion__radio{margin:0 var(--space-component-gap-sm, .25rem) 0 0;cursor:pointer;appearance:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;width:1rem;height:1rem;border:2px solid var(--color-core-border-soft, #d6e0df);border-radius:50%;background-color:var(--color-textfield-background-default, #f7f7f7);position:relative;transition:all .2s ease;flex-shrink:0}.c-accordion__radio:hover{border-color:var(--color-core-border-default, #070707)}.c-accordion__radio:focus{outline:none;box-shadow:none}.c-accordion__radio:checked,.c-accordion__radio.c-accordion__radio--checked{background-color:var(--color-action-primary-selected-background-default, #070707)!important;border-color:var(--color-action-primary-selected-background-default, #070707)!important}.c-accordion__radio:checked:after,.c-accordion__radio.c-accordion__radio--checked:after{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:6px;height:6px;background-color:var(--color-action-primary-selected-content-default, #ffffff)!important;border-radius:50%}.c-accordion__choice-trailing{display:contents}.c-accordion__skeleton{display:flex;flex-grow:1;align-items:center;height:28px;max-width:88px}.c-accordion__skeleton span{display:block;width:100%;height:8px;background-color:var(--color-effect-skeleton-default);border-radius:var(--size-border-radius-sm, .25rem)}\n"] }]
|
|
2582
2586
|
}], propDecorators: { id: [{
|
|
2583
2587
|
type: Input
|
|
2584
2588
|
}], expanded: [{
|
|
@@ -5247,9 +5251,12 @@ class InputUploadComponent {
|
|
|
5247
5251
|
size = 'md';
|
|
5248
5252
|
allowedExtensions = [];
|
|
5249
5253
|
fullWidth = false;
|
|
5254
|
+
maxSizeKb;
|
|
5255
|
+
maxSizeErrorText = '';
|
|
5250
5256
|
emitValue = new EventEmitter();
|
|
5251
5257
|
fileInput;
|
|
5252
5258
|
fileName = '';
|
|
5259
|
+
sizeError = false;
|
|
5253
5260
|
uniqueId = `upload-input-${Math.random().toString(36).substring(2, 10)}`;
|
|
5254
5261
|
onChangeFn = () => { };
|
|
5255
5262
|
onTouchedFn = () => { };
|
|
@@ -5273,6 +5280,17 @@ class InputUploadComponent {
|
|
|
5273
5280
|
onFileSelected(event) {
|
|
5274
5281
|
const input = event.target;
|
|
5275
5282
|
const file = input.files?.[0] ?? null;
|
|
5283
|
+
this.sizeError = false;
|
|
5284
|
+
if (file &&
|
|
5285
|
+
this.maxSizeKb !== undefined &&
|
|
5286
|
+
file.size >= this.maxSizeKb * 1024) {
|
|
5287
|
+
this.sizeError = true;
|
|
5288
|
+
this.fileName = '';
|
|
5289
|
+
input.value = '';
|
|
5290
|
+
this.onChangeFn(null);
|
|
5291
|
+
this.onTouchedFn();
|
|
5292
|
+
return;
|
|
5293
|
+
}
|
|
5276
5294
|
if (file) {
|
|
5277
5295
|
this.fileName = file.name;
|
|
5278
5296
|
}
|
|
@@ -5300,7 +5318,7 @@ class InputUploadComponent {
|
|
|
5300
5318
|
'c-text-input__input',
|
|
5301
5319
|
`c-text-input__input--${this.size}`,
|
|
5302
5320
|
this.fileName === '' ? 'c-text-input__input--no-file' : '',
|
|
5303
|
-
this.error ? 'is-error' : '',
|
|
5321
|
+
this.error || this.sizeError ? 'is-error' : '',
|
|
5304
5322
|
this.success ? 'is-success' : '',
|
|
5305
5323
|
this.disabled ? 'is-disabled' : '',
|
|
5306
5324
|
this.readonly ? 'is-readonly' : '',
|
|
@@ -5311,13 +5329,13 @@ class InputUploadComponent {
|
|
|
5311
5329
|
return this.helperText ? 'search-input-helper' : null;
|
|
5312
5330
|
}
|
|
5313
5331
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: InputUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5314
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.7", type: InputUploadComponent, isStandalone: true, selector: "lib-input-upload", inputs: { label: "label", placeholder: "placeholder", helperText: "helperText", alertText: "alertText", successText: "successText", error: "error", success: "success", disabled: "disabled", readonly: "readonly", required: "required", optionalLabel: "optionalLabel", isLoading: "isLoading", size: "size", allowedExtensions: "allowedExtensions", fullWidth: "fullWidth" }, outputs: { emitValue: "emitValue" }, providers: [
|
|
5332
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.7", type: InputUploadComponent, isStandalone: true, selector: "lib-input-upload", inputs: { label: "label", placeholder: "placeholder", helperText: "helperText", alertText: "alertText", successText: "successText", error: "error", success: "success", disabled: "disabled", readonly: "readonly", required: "required", optionalLabel: "optionalLabel", isLoading: "isLoading", size: "size", allowedExtensions: "allowedExtensions", fullWidth: "fullWidth", maxSizeKb: "maxSizeKb", maxSizeErrorText: "maxSizeErrorText" }, outputs: { emitValue: "emitValue" }, providers: [
|
|
5315
5333
|
{
|
|
5316
5334
|
provide: NG_VALUE_ACCESSOR,
|
|
5317
5335
|
useExisting: forwardRef(() => InputUploadComponent),
|
|
5318
5336
|
multi: true,
|
|
5319
5337
|
},
|
|
5320
|
-
], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div class=\"c-text-input\" [class.c-text-input--full-width]=\"fullWidth\">\n <lib-input-label\n *ngIf=\"label\"\n size=\"sm\"\n [required]=\"required\"\n [text]=\"label\"\n [textOptional]=\"optionalLabel\"\n [isLoading]=\"isLoading\"\n ></lib-input-label>\n\n <div class=\"c-text-input__wrapper\">\n <input\n #fileInput\n type=\"file\"\n [id]=\"uniqueId\"\n style=\"display: none\"\n [attr.accept]=\"acceptString\"\n [disabled]=\"disabled || isLoading\"\n [required]=\"required\"\n (change)=\"onFileSelected($event)\"\n (blur)=\"onBlur()\"\n />\n <label\n [for]=\"uniqueId\"\n [class]=\"inputClass.join(' ')\"\n [attr.aria-invalid]=\"error ? 'true' : null\"\n [attr.aria-describedby]=\"ariaDescribedBy\"\n class=\"c-text-input__upload-label\"\n >\n {{
|
|
5338
|
+
], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div class=\"c-text-input\" [class.c-text-input--full-width]=\"fullWidth\">\n <lib-input-label\n *ngIf=\"label\"\n size=\"sm\"\n [required]=\"required\"\n [text]=\"label\"\n [textOptional]=\"optionalLabel\"\n [isLoading]=\"isLoading\"\n ></lib-input-label>\n\n <div class=\"c-text-input__wrapper\">\n <input\n #fileInput\n type=\"file\"\n [id]=\"uniqueId\"\n style=\"display: none\"\n [attr.accept]=\"acceptString\"\n [disabled]=\"disabled || isLoading\"\n [required]=\"required\"\n (change)=\"onFileSelected($event)\"\n (blur)=\"onBlur()\"\n />\n <label\n [for]=\"uniqueId\"\n [class]=\"inputClass.join(' ')\"\n [attr.aria-invalid]=\"error ? 'true' : null\"\n [attr.aria-describedby]=\"ariaDescribedBy\"\n class=\"c-text-input__upload-label\"\n >\n <span class=\"c-text-input__upload-label-text\">{{\n isLoading ? '' : fileName || placeholder\n }}</span>\n </label>\n <lib-button-icon\n ariaLabel=\"Upload\"\n [disabled]=\"disabled || isLoading\"\n [loading]=\"false\"\n variant=\"neutral\"\n size=\"sm\"\n class=\"c-text-input__toggle\"\n iconName=\"uploadsimple-regular\"\n (click)=\"fileInput.click()\"\n >\n </lib-button-icon>\n </div>\n\n <span\n *ngIf=\"helperText && !error && !sizeError && !success\"\n id=\"password-input-helper\"\n class=\"c-text-input__helper\"\n >\n <lib-helper-text\n [text]=\"helperText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span\n *ngIf=\"(alertText && error) || (sizeError && maxSizeErrorText)\"\n class=\"c-text-input__alert\"\n >\n <lib-helper-text\n variant=\"danger\"\n [text]=\"sizeError ? maxSizeErrorText : alertText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span *ngIf=\"successText && success\" class=\"c-text-input__success\">\n <lib-helper-text\n variant=\"success\"\n [text]=\"successText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n</div>\n", styles: [".c-text-input{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--space-component-gap-sm);max-width:300px}.c-text-input--full-width{max-width:100%}.c-text-input__input{--input-padding-y: var(--space-component-padding-md);--input-padding-x-right: var(--space-component-padding-sm);--input-padding-x-left: var(--space-component-padding-lg);width:100%;height:48px;box-sizing:border-box;border-radius:var(--size-textfield-border-radius);border:var(--size-textfield-border-width) solid var(--color-textfield-border-default);background:var(--color-textfield-background-default);padding:var(--input-padding-y) var(--input-padding-x-right) var(--input-padding-y) var(--input-padding-x-left);align-items:center;gap:var(--space-component-gap-sm);align-self:stretch;color:var(--color-textfield-content-default);font-family:var(--typography-label-md-default-family);font-size:var(--typography-label-md-default-size);font-style:normal;font-weight:var(--typography-label-md-default-weight);line-height:var(--typography-label-md-default-line-height);letter-spacing:var(--typography-label-md-default-letter-spacing)}.c-text-input__input--no-file{color:var(--color-textfield-content-placeholder)}.c-text-input__input:focus-visible{border-width:2px;border-color:var(--color-textfield-border-active);padding:calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-right) - 1px) calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-left) - 1px);box-shadow:none;outline:none}.c-text-input__input--sm{height:32px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: var(--space-component-padding-sm)}.c-text-input__input--md{height:40px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: var(--space-component-padding-md)}.c-text-input__input.is-error{border-color:var(--color-textfield-border-error)}.c-text-input__input.is-success{border-color:var(--color-feedback-success-strong)}.c-text-input__input.is-disabled{background-color:var(--color-textfield-background-disabled);border-color:var(--color-textfield-border-disabled);color:var(--color-textfield-content-disabled)}.c-text-input__input.is-readonly{background-color:var(--color-textfield-background-disabled);border-color:var(--color-textfield-border-disabled)}.c-text-input__input.is-loading{border-color:var(--color-effect-skeleton-soft, #e5eaea);background-color:var(--color-textfield-background-default);color:transparent}.c-text-input__alert{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-danger-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__success{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-success-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper{color:var(--color-core-content-soft);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper.is-error{color:var(--color-textfield-helper-error)}.c-text-input__helper.is-success{color:var(--color-textfield-helper-success)}.c-text-input__helper.is-default{color:var(--color-textfield-helper-default)}.c-text-input__wrapper{display:flex;position:relative;width:100%}.c-text-input__upload-label{display:flex;align-items:center;overflow:hidden;padding-right:calc(var(--space-component-padding-sm) + 32px);cursor:pointer}.c-text-input__upload-label-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.c-text-input__toggle{position:absolute;top:50%;right:var(--space-component-padding-sm);transform:translateY(-50%);background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center;z-index:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: InputLabelComponent, selector: "lib-input-label", inputs: ["text", "required", "size", "disabled", "for", "innerHTML", "isLoading", "textOptional"] }, { kind: "component", type: ButtonIconComponent, selector: "lib-button-icon", inputs: ["ariaLabel", "variant", "size", "iconName", "disabled", "loading", "skeletonActive"], outputs: ["clicked"] }, { kind: "component", type: HelperTextComponent, selector: "lib-helper-text", inputs: ["variant", "text", "extraClass", "disabled", "isLoading"] }] });
|
|
5321
5339
|
}
|
|
5322
5340
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: InputUploadComponent, decorators: [{
|
|
5323
5341
|
type: Component,
|
|
@@ -5325,7 +5343,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImpor
|
|
|
5325
5343
|
CommonModule,
|
|
5326
5344
|
ReactiveFormsModule,
|
|
5327
5345
|
InputLabelComponent,
|
|
5328
|
-
IconComponent,
|
|
5329
5346
|
ButtonIconComponent,
|
|
5330
5347
|
HelperTextComponent,
|
|
5331
5348
|
], providers: [
|
|
@@ -5334,7 +5351,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImpor
|
|
|
5334
5351
|
useExisting: forwardRef(() => InputUploadComponent),
|
|
5335
5352
|
multi: true,
|
|
5336
5353
|
},
|
|
5337
|
-
], template: "<div class=\"c-text-input\" [class.c-text-input--full-width]=\"fullWidth\">\n <lib-input-label\n *ngIf=\"label\"\n size=\"sm\"\n [required]=\"required\"\n [text]=\"label\"\n [textOptional]=\"optionalLabel\"\n [isLoading]=\"isLoading\"\n ></lib-input-label>\n\n <div class=\"c-text-input__wrapper\">\n <input\n #fileInput\n type=\"file\"\n [id]=\"uniqueId\"\n style=\"display: none\"\n [attr.accept]=\"acceptString\"\n [disabled]=\"disabled || isLoading\"\n [required]=\"required\"\n (change)=\"onFileSelected($event)\"\n (blur)=\"onBlur()\"\n />\n <label\n [for]=\"uniqueId\"\n [class]=\"inputClass.join(' ')\"\n [attr.aria-invalid]=\"error ? 'true' : null\"\n [attr.aria-describedby]=\"ariaDescribedBy\"\n class=\"c-text-input__upload-label\"\n >\n {{
|
|
5354
|
+
], template: "<div class=\"c-text-input\" [class.c-text-input--full-width]=\"fullWidth\">\n <lib-input-label\n *ngIf=\"label\"\n size=\"sm\"\n [required]=\"required\"\n [text]=\"label\"\n [textOptional]=\"optionalLabel\"\n [isLoading]=\"isLoading\"\n ></lib-input-label>\n\n <div class=\"c-text-input__wrapper\">\n <input\n #fileInput\n type=\"file\"\n [id]=\"uniqueId\"\n style=\"display: none\"\n [attr.accept]=\"acceptString\"\n [disabled]=\"disabled || isLoading\"\n [required]=\"required\"\n (change)=\"onFileSelected($event)\"\n (blur)=\"onBlur()\"\n />\n <label\n [for]=\"uniqueId\"\n [class]=\"inputClass.join(' ')\"\n [attr.aria-invalid]=\"error ? 'true' : null\"\n [attr.aria-describedby]=\"ariaDescribedBy\"\n class=\"c-text-input__upload-label\"\n >\n <span class=\"c-text-input__upload-label-text\">{{\n isLoading ? '' : fileName || placeholder\n }}</span>\n </label>\n <lib-button-icon\n ariaLabel=\"Upload\"\n [disabled]=\"disabled || isLoading\"\n [loading]=\"false\"\n variant=\"neutral\"\n size=\"sm\"\n class=\"c-text-input__toggle\"\n iconName=\"uploadsimple-regular\"\n (click)=\"fileInput.click()\"\n >\n </lib-button-icon>\n </div>\n\n <span\n *ngIf=\"helperText && !error && !sizeError && !success\"\n id=\"password-input-helper\"\n class=\"c-text-input__helper\"\n >\n <lib-helper-text\n [text]=\"helperText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span\n *ngIf=\"(alertText && error) || (sizeError && maxSizeErrorText)\"\n class=\"c-text-input__alert\"\n >\n <lib-helper-text\n variant=\"danger\"\n [text]=\"sizeError ? maxSizeErrorText : alertText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span *ngIf=\"successText && success\" class=\"c-text-input__success\">\n <lib-helper-text\n variant=\"success\"\n [text]=\"successText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n</div>\n", styles: [".c-text-input{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--space-component-gap-sm);max-width:300px}.c-text-input--full-width{max-width:100%}.c-text-input__input{--input-padding-y: var(--space-component-padding-md);--input-padding-x-right: var(--space-component-padding-sm);--input-padding-x-left: var(--space-component-padding-lg);width:100%;height:48px;box-sizing:border-box;border-radius:var(--size-textfield-border-radius);border:var(--size-textfield-border-width) solid var(--color-textfield-border-default);background:var(--color-textfield-background-default);padding:var(--input-padding-y) var(--input-padding-x-right) var(--input-padding-y) var(--input-padding-x-left);align-items:center;gap:var(--space-component-gap-sm);align-self:stretch;color:var(--color-textfield-content-default);font-family:var(--typography-label-md-default-family);font-size:var(--typography-label-md-default-size);font-style:normal;font-weight:var(--typography-label-md-default-weight);line-height:var(--typography-label-md-default-line-height);letter-spacing:var(--typography-label-md-default-letter-spacing)}.c-text-input__input--no-file{color:var(--color-textfield-content-placeholder)}.c-text-input__input:focus-visible{border-width:2px;border-color:var(--color-textfield-border-active);padding:calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-right) - 1px) calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-left) - 1px);box-shadow:none;outline:none}.c-text-input__input--sm{height:32px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: var(--space-component-padding-sm)}.c-text-input__input--md{height:40px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: var(--space-component-padding-md)}.c-text-input__input.is-error{border-color:var(--color-textfield-border-error)}.c-text-input__input.is-success{border-color:var(--color-feedback-success-strong)}.c-text-input__input.is-disabled{background-color:var(--color-textfield-background-disabled);border-color:var(--color-textfield-border-disabled);color:var(--color-textfield-content-disabled)}.c-text-input__input.is-readonly{background-color:var(--color-textfield-background-disabled);border-color:var(--color-textfield-border-disabled)}.c-text-input__input.is-loading{border-color:var(--color-effect-skeleton-soft, #e5eaea);background-color:var(--color-textfield-background-default);color:transparent}.c-text-input__alert{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-danger-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__success{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-success-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper{color:var(--color-core-content-soft);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper.is-error{color:var(--color-textfield-helper-error)}.c-text-input__helper.is-success{color:var(--color-textfield-helper-success)}.c-text-input__helper.is-default{color:var(--color-textfield-helper-default)}.c-text-input__wrapper{display:flex;position:relative;width:100%}.c-text-input__upload-label{display:flex;align-items:center;overflow:hidden;padding-right:calc(var(--space-component-padding-sm) + 32px);cursor:pointer}.c-text-input__upload-label-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.c-text-input__toggle{position:absolute;top:50%;right:var(--space-component-padding-sm);transform:translateY(-50%);background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center;z-index:1}\n"] }]
|
|
5338
5355
|
}], propDecorators: { label: [{
|
|
5339
5356
|
type: Input
|
|
5340
5357
|
}], placeholder: [{
|
|
@@ -5365,6 +5382,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImpor
|
|
|
5365
5382
|
type: Input
|
|
5366
5383
|
}], fullWidth: [{
|
|
5367
5384
|
type: Input
|
|
5385
|
+
}], maxSizeKb: [{
|
|
5386
|
+
type: Input
|
|
5387
|
+
}], maxSizeErrorText: [{
|
|
5388
|
+
type: Input
|
|
5368
5389
|
}], emitValue: [{
|
|
5369
5390
|
type: Output
|
|
5370
5391
|
}], fileInput: [{
|