@kyndryl-design-system/shidoka-applications 2.16.2 → 2.18.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/common/css/swiper-shidoka.css +1 -1
- package/common/scss/form-input.scss +1 -1
- package/common/scss/shidoka-flatpickr-theme.scss +19 -19
- package/common/scss/utility/swiper-shidoka.scss +2 -2
- package/components/ai/aiLaunchButton/aiLaunchButton.js +3 -3
- package/components/ai/sourcesFeedback/aiSourcesFeedback.js +2 -1
- package/components/ai/sourcesFeedback/aiSourcesFeedback.js.map +1 -1
- package/components/global/header/header.js +2 -2
- package/components/global/header/headerFlyout.js +2 -2
- package/components/global/header/headerFlyouts.js +2 -2
- package/components/global/header/headerLink.js +3 -3
- package/components/global/header/headerNav.js +5 -5
- package/components/global/header/headerPanelLink.js +1 -1
- package/components/global/localNav/localNav.js +1 -1
- package/components/global/localNav/localNavLink.js +2 -2
- package/components/reusable/accordion/accordion.js +1 -1
- package/components/reusable/accordion/accordionItem.js +4 -4
- package/components/reusable/avatar/avatar.js +13 -16
- package/components/reusable/avatar/avatar.js.map +1 -1
- package/components/reusable/button/button.js +21 -21
- package/components/reusable/card/card.js +5 -5
- package/components/reusable/checkbox/checkbox.js +8 -8
- package/components/reusable/checkbox/checkboxGroup.js +5 -5
- package/components/reusable/datePicker/datepicker.js +6 -6
- package/components/reusable/datePicker/index.js +1 -1
- package/components/reusable/daterangepicker/daterangepicker.js +5 -5
- package/components/reusable/daterangepicker/index.js +1 -1
- package/components/reusable/dropdown/dropdown.js +6 -6
- package/components/reusable/dropdown/index.js +1 -1
- package/components/reusable/link/link.js +6 -6
- package/components/reusable/modal/modal.js +1 -1
- package/components/reusable/notification/index.js +1 -1
- package/components/reusable/notification/notification.js +1 -1
- package/components/reusable/numberInput/numberInput.js +5 -5
- package/components/reusable/overflowMenu/overflowMenu.js +1 -1
- package/components/reusable/overflowMenu/overflowMenuItem.js +1 -1
- package/components/reusable/pagination/Pagination.js +1 -1
- package/components/reusable/pagination/index.js +1 -1
- package/components/reusable/pagination/pagination-page-size-dropdown.js +1 -1
- package/components/reusable/progressBar/progressBar.js +4 -4
- package/components/reusable/radioButton/radioButton.js +7 -7
- package/components/reusable/radioButton/radioButtonGroup.js +4 -4
- package/components/reusable/search/search.js +1 -1
- package/components/reusable/sideDrawer/sideDrawer.js +4 -3
- package/components/reusable/sideDrawer/sideDrawer.js.map +1 -1
- package/components/reusable/splitButton/splitButton.js +7 -7
- package/components/reusable/table/table-header.js +2 -2
- package/components/reusable/tabs/tab.js +5 -5
- package/components/reusable/tabs/tabs.js +1 -1
- package/components/reusable/tag/index.js +1 -1
- package/components/reusable/tag/tag.js +1 -1
- package/components/reusable/tag/tag.skeleton.js +1 -1
- package/components/reusable/tag/tagGroup.js +1 -1
- package/components/reusable/textArea/textArea.d.ts.map +1 -1
- package/components/reusable/textArea/textArea.js +4 -4
- package/components/reusable/textArea/textArea.js.map +1 -1
- package/components/reusable/textInput/textInput.js +4 -4
- package/components/reusable/timepicker/index.js +1 -1
- package/components/reusable/timepicker/timepicker.js +5 -5
- package/components/reusable/toggleButton/toggleButton.js +8 -8
- package/components/reusable/tooltip/tooltip.js +1 -1
- package/index.js +1 -1
- package/package.json +1 -1
- package/{shidoka-flatpickr-theme-a5fbea77.js → shidoka-flatpickr-theme-87a9b729.js} +25 -25
- package/{shidoka-flatpickr-theme-a5fbea77.js.map → shidoka-flatpickr-theme-87a9b729.js.map} +1 -1
- package/{tag-0a167058.js → tag-9ae348b5.js} +43 -43
- package/{tag-0a167058.js.map → tag-9ae348b5.js.map} +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
@font-face{font-family:swiper-icons;src:url("data:application/font-woff;charset=utf-8;base64, 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");font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px, 0, 0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:"";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0, 0, 0, 0.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:"";position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:var(--swiper-navigation-top-offset, 50%);width:calc(var(--swiper-navigation-size)/44*27);height:var(--swiper-navigation-size);margin-top:calc(0px - var(--swiper-navigation-size)/2);z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color, var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none !important}.swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset, 10px);right:auto}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset, 10px);left:auto}.swiper-button-lock{display:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none !important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:"prev"}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset, 10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:"next"}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0, 0, 0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none !important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(0.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(0.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(0.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(0.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(0.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, 0.2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none !important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;transform:translate3d(0px, -50%, 0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius, 10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, 0.1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none !important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset, 1%);bottom:var(--swiper-scrollbar-bottom, 4px);top:var(--swiper-scrollbar-top, auto);z-index:50;height:var(--swiper-scrollbar-size, 4px);width:calc(100% - 2*var(--swiper-scrollbar-sides-offset, 1%))}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left, auto);right:var(--swiper-scrollbar-right, 4px);top:var(--swiper-scrollbar-sides-offset, 1%);z-index:50;width:var(--swiper-scrollbar-size, 4px);height:calc(100% - 2*var(--swiper-scrollbar-sides-offset, 1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, 0.5));border-radius:var(--swiper-scrollbar-border-radius, 10px);left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active{pointer-events:auto}.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:"";background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}:root{--kd-current-breakpoint: sm}@media(min-width: 42rem){:root{--kd-current-breakpoint: md}}@media(min-width: 74rem){:root{--kd-current-breakpoint: lg}}@media(min-width: 82rem){:root{--kd-current-breakpoint: xl}}@media(min-width: 99rem){:root{--kd-current-breakpoint: max}}:root{--swiper-navigation-size: 56px;--swiper-fractional-height: 54px;--swiper-bullets-height: 32px;--swiper-tabs-height: 64px;--swiper-scrollbar-size: 8px;--swiper-scrollbar-drag-bg-color: var(--kd-color-background-container-subtle);--swiper-scrollbar-bg-color: var(--kd-color-background-container-soft);--swiper-scrollbar-border-radius: 8px}@media(min-width: 82rem){:root{--swiper-navigation-size: 64px}}.swiper{display:flex;flex-direction:column;gap:16px}.swiper-wrapper,.swiper-pagination{padding:1px}.swiper-full-bleed{margin:0 calc(var(--kd-page-gutter)*-1)}.swiper-slide{box-sizing:border-box;transition:opacity 250ms ease-in-out}@media(min-width: 42rem){.swiper-slide{max-width:calc(100% - var(--swiper-navigation-size)*2 - 84px)}}.swiper-slide.off-screen{opacity:.5;pointer-events:none}.swiper-pagination{position:static;display:flex;justify-content:safe center;gap:16px}@media(min-width: 42rem){.swiper-pagination.tabs{order:-1;gap:24px;overflow-x:auto}}.swiper-pagination kyn-link,.swiper-pagination a{margin-left:40px;margin-right:4px}.swiper-pagination-bullet{border:1px solid var(--kd-color-background-accent-tertiary);background:none;opacity:initial;width:16px;height:16px}.swiper-pagination-bullet-active{background:var(--kd-color-background-container-subtle)}@media(min-width: 42rem){.tabs .swiper-pagination-bullet{width:auto;height:auto;border-radius:initial;border:none;padding:12px;white-space:nowrap;outline-offset:-2px;transition:border-color 150ms ease-out,background-color 150ms ease-out,color 150ms ease-out,outline-color 150ms ease-out;outline:2px solid rgba(0,0,0,0)}.tabs .swiper-pagination-bullet:hover{color:var(--kd-color-text-link-level-hover);border-color:var(--kd-color-border-ui-hover);background-color:var(--kd-color-background-ui-hollow-hover)}.tabs .swiper-pagination-bullet:active{color:var(--kd-color-text-link-level-pressed);border-color:var(--kd-color-border-variants-focus);background-color:var(--kd-color-background-ui-hollow-hover)}.tabs .swiper-pagination-bullet:focus{color:var(--kd-color-text-level-primary);outline-color:var(--kd-color-border-variants-focus)}.tabs .swiper-pagination-bullet-active{color:var(--kd-color-text-level-tertiary);border-bottom:2px solid var(--kd-color-border-level-tertiary);background:var(--kd-color-background-container-default);font-weight:500}}.tabs .swiper-pagination-bullet .tab-text{display:none}@media(min-width: 42rem){.tabs .swiper-pagination-bullet .tab-text{display:inline}}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0}.swiper-pagination-fraction{font-family:var(--kd-font-family-secondary);font-size:var(--kd-font-size-utility-2-sm);line-height:var(--kd-line-height-utility-2-sm);font-weight:var(--kd-font-weight-regular);letter-spacing:var(--kd-letter-spacing-5);justify-content:end;gap:2px;color:var(--kd-color-text-level-secondary)}@media(min-width: 42rem){.swiper-pagination-fraction{font-size:var(--kd-font-size-utility-2-md);line-height:var(--kd-line-height-utility-2-md)}}@media(min-width: 74rem){.swiper-pagination-fraction{font-size:var(--kd-font-size-utility-2-lg);line-height:var(--kd-line-height-utility-2-lg)}}@media(min-width: 82rem){.swiper-pagination-fraction{font-size:var(--kd-font-size-utility-2-xlg);line-height:var(--kd-line-height-utility-2-xlg)}}@media(min-width: 99rem){.swiper-pagination-fraction{font-size:var(--kd-font-size-utility-2-max);line-height:var(--kd-line-height-utility-2-max)}}.swiper-full-bleed .swiper-pagination-fraction{padding-right:var(--kd-page-gutter)}.pagination-with-link{font-family:var(--kd-font-family-secondary);font-size:var(--kd-font-size-utility-2-sm);line-height:var(--kd-line-height-utility-2-sm);font-weight:var(--kd-font-weight-regular);letter-spacing:var(--kd-letter-spacing-5);display:flex;align-items:baseline;gap:40px;padding-right:4px}@media(min-width: 42rem){.pagination-with-link{font-size:var(--kd-font-size-utility-2-md);line-height:var(--kd-line-height-utility-2-md)}}@media(min-width: 74rem){.pagination-with-link{font-size:var(--kd-font-size-utility-2-lg);line-height:var(--kd-line-height-utility-2-lg)}}@media(min-width: 82rem){.pagination-with-link{font-size:var(--kd-font-size-utility-2-xlg);line-height:var(--kd-line-height-utility-2-xlg)}}@media(min-width: 99rem){.pagination-with-link{font-size:var(--kd-font-size-utility-2-max);line-height:var(--kd-line-height-utility-2-max)}}.swiper-button-prev,.swiper-button-next{box-shadow:var(--kd-elevation-level-2);display:none;border-radius:50%;width:var(--swiper-navigation-size);height:var(--swiper-navigation-size);margin-top:calc(0px - var(--swiper-navigation-size)/2 - var(--swiper-fractional-height)/2);color:var(--kd-color-icon-primary);background:var(--kd-color-icon-inverse);outline:2px solid rgba(0,0,0,0);transition:outline-color 150ms ease-out,color 150ms ease-out,box-shadow 150ms ease-out}.swiper-pagination-bullets~.swiper-button-prev,.swiper-pagination-bullets~.swiper-button-next{margin-top:calc(0px - var(--swiper-navigation-size)/2 - var(--swiper-bullets-height)/2)}.swiper-pagination-bullets.tabs~.swiper-button-prev,.swiper-pagination-bullets.tabs~.swiper-button-next{margin-top:calc(0px - var(--swiper-navigation-size)/2 + var(--swiper-tabs-height)/2)}@media(min-width: 42rem){.swiper-button-prev,.swiper-button-next{display:flex}}.swiper-button-prev:focus,.swiper-button-next:focus{outline-color:var(--kd-color-border-ui-hover)}.swiper-button-prev svg,.swiper-button-next svg{width:initial;height:initial}.swiper-button-prev:hover,.swiper-button-next:hover{box-shadow:var(--kd-elevation-level-3);color:var(--kd-color-icon-secondary)}.swiper-button-prev:after,.swiper-button-next:after{display:none}.swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{color:var(--kd-color-icon-disabled)}.swiper-button-next svg{transform:rotate(180deg)}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:static;width:100%}.swiper-full-bleed .swiper-horizontal>.swiper-scrollbar,.swiper-full-bleed .swiper-scrollbar.swiper-scrollbar-horizontal{width:calc(100% - var(--kd-page-gutter)*2);margin-left:var(--kd-page-gutter)}
|
|
1
|
+
@font-face{font-family:swiper-icons;src:url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA");font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px, 0, 0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:"";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0, 0, 0, 0.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:"";position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:var(--swiper-navigation-top-offset, 50%);width:calc(var(--swiper-navigation-size)/44*27);height:var(--swiper-navigation-size);margin-top:calc(0px - var(--swiper-navigation-size)/2);z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color, var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none !important}.swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset, 10px);right:auto}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset, 10px);left:auto}.swiper-button-lock{display:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none !important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:"prev"}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset, 10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:"next"}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0, 0, 0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none !important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(0.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(0.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(0.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(0.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(0.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, 0.2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none !important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;transform:translate3d(0px, -50%, 0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius, 10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, 0.1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none !important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset, 1%);bottom:var(--swiper-scrollbar-bottom, 4px);top:var(--swiper-scrollbar-top, auto);z-index:50;height:var(--swiper-scrollbar-size, 4px);width:calc(100% - 2*var(--swiper-scrollbar-sides-offset, 1%))}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left, auto);right:var(--swiper-scrollbar-right, 4px);top:var(--swiper-scrollbar-sides-offset, 1%);z-index:50;width:var(--swiper-scrollbar-size, 4px);height:calc(100% - 2*var(--swiper-scrollbar-sides-offset, 1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, 0.5));border-radius:var(--swiper-scrollbar-border-radius, 10px);left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active{pointer-events:auto}.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:"";background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}:root{--kd-current-breakpoint: sm}@media(min-width: 42rem){:root{--kd-current-breakpoint: md}}@media(min-width: 74rem){:root{--kd-current-breakpoint: lg}}@media(min-width: 82rem){:root{--kd-current-breakpoint: xl}}@media(min-width: 99rem){:root{--kd-current-breakpoint: max}}:root{--swiper-navigation-size: 56px;--swiper-fractional-height: 54px;--swiper-bullets-height: 32px;--swiper-tabs-height: 64px;--swiper-scrollbar-size: 8px;--swiper-scrollbar-drag-bg-color: var(--kd-color-background-container-subtle);--swiper-scrollbar-bg-color: var(--kd-color-background-container-soft);--swiper-scrollbar-border-radius: 8px}@media(min-width: 82rem){:root{--swiper-navigation-size: 64px}}.swiper{display:flex;flex-direction:column;gap:16px}.swiper-wrapper,.swiper-pagination{padding:1px}.swiper-full-bleed{margin:0 calc(var(--kd-page-gutter)*-1)}.swiper-slide{box-sizing:border-box;transition:opacity 250ms ease-in-out}@media(min-width: 42rem){.swiper-slide{max-width:calc(100% - var(--swiper-navigation-size)*2 - 84px)}}.swiper-slide.off-screen{opacity:.5;pointer-events:none}.swiper-pagination{position:static;display:flex;justify-content:safe center;gap:16px}@media(min-width: 42rem){.swiper-pagination.tabs{order:-1;gap:24px;overflow-x:auto}}.swiper-pagination kyn-link,.swiper-pagination a{margin-left:40px;margin-right:4px}.swiper-pagination-bullet{border:1px solid var(--kd-color-background-accent-tertiary);background:none;opacity:initial;width:16px;height:16px}.swiper-pagination-bullet-active{background:var(--kd-color-background-container-subtle)}@media(min-width: 42rem){.tabs .swiper-pagination-bullet{width:auto;height:auto;border-radius:initial;border:none;padding:12px;white-space:nowrap;outline-offset:-2px;transition:border-color 150ms ease-out,background-color 150ms ease-out,color 150ms ease-out,outline-color 150ms ease-out;outline:2px solid rgba(0,0,0,0)}.tabs .swiper-pagination-bullet:hover{color:var(--kd-color-text-link-level-hover);border-color:var(--kd-color-border-ui-hover);background-color:var(--kd-color-background-ui-hollow-hover)}.tabs .swiper-pagination-bullet:active{color:var(--kd-color-text-link-level-pressed);border-color:var(--kd-color-border-variants-focus);background-color:var(--kd-color-background-ui-hollow-hover)}.tabs .swiper-pagination-bullet:focus-visible{color:var(--kd-color-text-level-primary);outline-color:var(--kd-color-border-variants-focus)}.tabs .swiper-pagination-bullet-active{color:var(--kd-color-text-level-tertiary);border-bottom:2px solid var(--kd-color-border-level-tertiary);background:var(--kd-color-background-container-default);font-weight:500}}.tabs .swiper-pagination-bullet .tab-text{display:none}@media(min-width: 42rem){.tabs .swiper-pagination-bullet .tab-text{display:inline}}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0}.swiper-pagination-fraction{font-family:var(--kd-font-family-secondary);font-size:var(--kd-font-size-utility-2-sm);line-height:var(--kd-line-height-utility-2-sm);font-weight:var(--kd-font-weight-regular);letter-spacing:var(--kd-letter-spacing-5);justify-content:end;gap:2px;color:var(--kd-color-text-level-secondary)}@media(min-width: 42rem){.swiper-pagination-fraction{font-size:var(--kd-font-size-utility-2-md);line-height:var(--kd-line-height-utility-2-md)}}@media(min-width: 74rem){.swiper-pagination-fraction{font-size:var(--kd-font-size-utility-2-lg);line-height:var(--kd-line-height-utility-2-lg)}}@media(min-width: 82rem){.swiper-pagination-fraction{font-size:var(--kd-font-size-utility-2-xlg);line-height:var(--kd-line-height-utility-2-xlg)}}@media(min-width: 99rem){.swiper-pagination-fraction{font-size:var(--kd-font-size-utility-2-max);line-height:var(--kd-line-height-utility-2-max)}}.swiper-full-bleed .swiper-pagination-fraction{padding-right:var(--kd-page-gutter)}.pagination-with-link{font-family:var(--kd-font-family-secondary);font-size:var(--kd-font-size-utility-2-sm);line-height:var(--kd-line-height-utility-2-sm);font-weight:var(--kd-font-weight-regular);letter-spacing:var(--kd-letter-spacing-5);display:flex;align-items:baseline;gap:40px;padding-right:4px}@media(min-width: 42rem){.pagination-with-link{font-size:var(--kd-font-size-utility-2-md);line-height:var(--kd-line-height-utility-2-md)}}@media(min-width: 74rem){.pagination-with-link{font-size:var(--kd-font-size-utility-2-lg);line-height:var(--kd-line-height-utility-2-lg)}}@media(min-width: 82rem){.pagination-with-link{font-size:var(--kd-font-size-utility-2-xlg);line-height:var(--kd-line-height-utility-2-xlg)}}@media(min-width: 99rem){.pagination-with-link{font-size:var(--kd-font-size-utility-2-max);line-height:var(--kd-line-height-utility-2-max)}}.swiper-button-prev,.swiper-button-next{box-shadow:var(--kd-elevation-level-2);display:none;border-radius:50%;width:var(--swiper-navigation-size);height:var(--swiper-navigation-size);margin-top:calc(0px - var(--swiper-navigation-size)/2 - var(--swiper-fractional-height)/2);color:var(--kd-color-icon-primary);background:var(--kd-color-icon-inverse);outline:2px solid rgba(0,0,0,0);transition:outline-color 150ms ease-out,color 150ms ease-out,box-shadow 150ms ease-out}.swiper-pagination-bullets~.swiper-button-prev,.swiper-pagination-bullets~.swiper-button-next{margin-top:calc(0px - var(--swiper-navigation-size)/2 - var(--swiper-bullets-height)/2)}.swiper-pagination-bullets.tabs~.swiper-button-prev,.swiper-pagination-bullets.tabs~.swiper-button-next{margin-top:calc(0px - var(--swiper-navigation-size)/2 + var(--swiper-tabs-height)/2)}@media(min-width: 42rem){.swiper-button-prev,.swiper-button-next{display:flex}}.swiper-button-prev:focus-visible,.swiper-button-next:focus-visible{outline-color:var(--kd-color-border-ui-hover)}.swiper-button-prev svg,.swiper-button-next svg{width:initial;height:initial}.swiper-button-prev:hover,.swiper-button-next:hover{box-shadow:var(--kd-elevation-level-3);color:var(--kd-color-icon-secondary)}.swiper-button-prev:after,.swiper-button-next:after{display:none}.swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{color:var(--kd-color-icon-disabled)}.swiper-button-next svg{transform:rotate(180deg)}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:static;width:100%}.swiper-full-bleed .swiper-horizontal>.swiper-scrollbar,.swiper-full-bleed .swiper-scrollbar.swiper-scrollbar-horizontal{width:calc(100% - var(--kd-page-gutter)*2);margin-left:var(--kd-page-gutter)}
|
|
@@ -292,7 +292,7 @@ $calendar-box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.08),
|
|
|
292
292
|
top: 100%;
|
|
293
293
|
}
|
|
294
294
|
|
|
295
|
-
.flatpickr-calendar:focus {
|
|
295
|
+
.flatpickr-calendar:focus-visible {
|
|
296
296
|
outline: 0;
|
|
297
297
|
}
|
|
298
298
|
|
|
@@ -346,7 +346,7 @@ $calendar-box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.08),
|
|
|
346
346
|
color: $icon-fill;
|
|
347
347
|
fill: $icon-fill;
|
|
348
348
|
|
|
349
|
-
&:focus {
|
|
349
|
+
&:focus-visible {
|
|
350
350
|
outline: 2px solid var(--kd-color-date-and-time-picker-border-focus);
|
|
351
351
|
outline-offset: 2px;
|
|
352
352
|
}
|
|
@@ -531,8 +531,8 @@ $calendar-box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.08),
|
|
|
531
531
|
transform: translate3d(0px, 0px, 0px);
|
|
532
532
|
color: $current-month-year;
|
|
533
533
|
|
|
534
|
-
.flatpickr-monthDropdown-months:focus,
|
|
535
|
-
input.cur-year:focus {
|
|
534
|
+
.flatpickr-monthDropdown-months:focus-visible,
|
|
535
|
+
input.cur-year:focus-visible {
|
|
536
536
|
outline: 2px solid var(--kd-color-date-and-time-picker-border-focus);
|
|
537
537
|
outline-offset: 2px;
|
|
538
538
|
}
|
|
@@ -583,7 +583,7 @@ $calendar-box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.08),
|
|
|
583
583
|
appearance: textfield;
|
|
584
584
|
}
|
|
585
585
|
|
|
586
|
-
.flatpickr-current-month input.cur-year:focus {
|
|
586
|
+
.flatpickr-current-month input.cur-year:focus-visible {
|
|
587
587
|
outline: 0;
|
|
588
588
|
}
|
|
589
589
|
|
|
@@ -619,7 +619,7 @@ $calendar-box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.08),
|
|
|
619
619
|
width: auto;
|
|
620
620
|
}
|
|
621
621
|
|
|
622
|
-
.flatpickr-current-month .flatpickr-monthDropdown-months:focus,
|
|
622
|
+
.flatpickr-current-month .flatpickr-monthDropdown-months:focus-visible,
|
|
623
623
|
.flatpickr-current-month .flatpickr-monthDropdown-months:active {
|
|
624
624
|
outline: none;
|
|
625
625
|
}
|
|
@@ -699,7 +699,7 @@ span.flatpickr-weekday {
|
|
|
699
699
|
width: 316px;
|
|
700
700
|
}
|
|
701
701
|
|
|
702
|
-
.flatpickr-days:focus {
|
|
702
|
+
.flatpickr-days:focus-visible {
|
|
703
703
|
outline: 0;
|
|
704
704
|
}
|
|
705
705
|
|
|
@@ -754,7 +754,7 @@ span.flatpickr-weekday {
|
|
|
754
754
|
justify-content: center;
|
|
755
755
|
text-align: center;
|
|
756
756
|
|
|
757
|
-
&:focus {
|
|
757
|
+
&:focus-visible {
|
|
758
758
|
outline: 2px solid var(--kd-color-date-and-time-picker-border-focus);
|
|
759
759
|
outline-offset: 2px;
|
|
760
760
|
}
|
|
@@ -793,9 +793,9 @@ span.flatpickr-weekday {
|
|
|
793
793
|
.flatpickr-day:hover,
|
|
794
794
|
.flatpickr-day.prevMonthDay:hover,
|
|
795
795
|
.flatpickr-day.nextMonthDay:hover,
|
|
796
|
-
.flatpickr-day:focus,
|
|
797
|
-
.flatpickr-day.prevMonthDay:focus,
|
|
798
|
-
.flatpickr-day.nextMonthDay:focus {
|
|
796
|
+
.flatpickr-day:focus-visible,
|
|
797
|
+
.flatpickr-day.prevMonthDay:focus-visible,
|
|
798
|
+
.flatpickr-day.nextMonthDay:focus-visible {
|
|
799
799
|
background: var(--kd-color-date-and-time-picker-background-hover);
|
|
800
800
|
color: var(--kd-color-date-and-time-picker-text-default);
|
|
801
801
|
border-color: transparent;
|
|
@@ -806,7 +806,7 @@ span.flatpickr-weekday {
|
|
|
806
806
|
}
|
|
807
807
|
|
|
808
808
|
.flatpickr-day.today:hover,
|
|
809
|
-
.flatpickr-day.today:focus {
|
|
809
|
+
.flatpickr-day.today:focus-visible {
|
|
810
810
|
border-color: transparent;
|
|
811
811
|
background: var(--kd-color-date-and-time-picker-background-hover);
|
|
812
812
|
color: var(--kd-color-date-and-time-picker-text-default);
|
|
@@ -817,9 +817,9 @@ span.flatpickr-weekday {
|
|
|
817
817
|
.flatpickr-day.startRange,
|
|
818
818
|
.flatpickr-day.startRange.inRange,
|
|
819
819
|
.flatpickr-day.endRange.inRange,
|
|
820
|
-
.flatpickr-day.selected:focus,
|
|
821
|
-
.flatpickr-day.startRange:focus,
|
|
822
|
-
.flatpickr-day.endRange:focus,
|
|
820
|
+
.flatpickr-day.selected:focus-visible,
|
|
821
|
+
.flatpickr-day.startRange:focus-visible,
|
|
822
|
+
.flatpickr-day.endRange:focus-visible,
|
|
823
823
|
.flatpickr-day.selected:hover,
|
|
824
824
|
.flatpickr-day.startRange:hover,
|
|
825
825
|
.flatpickr-day.endRange:hover,
|
|
@@ -1023,7 +1023,7 @@ span.flatpickr-weekday {
|
|
|
1023
1023
|
background-color: transparent;
|
|
1024
1024
|
}
|
|
1025
1025
|
|
|
1026
|
-
&:focus {
|
|
1026
|
+
&:focus-visible {
|
|
1027
1027
|
outline: 2px solid var(--kd-color-date-and-time-picker-border-focus);
|
|
1028
1028
|
outline-offset: 2px;
|
|
1029
1029
|
}
|
|
@@ -1043,7 +1043,7 @@ span.flatpickr-weekday {
|
|
|
1043
1043
|
font-weight: 500;
|
|
1044
1044
|
}
|
|
1045
1045
|
|
|
1046
|
-
.flatpickr-time input:focus {
|
|
1046
|
+
.flatpickr-time input:focus-visible {
|
|
1047
1047
|
outline: 0;
|
|
1048
1048
|
border: none;
|
|
1049
1049
|
}
|
|
@@ -1075,8 +1075,8 @@ span.flatpickr-weekday {
|
|
|
1075
1075
|
|
|
1076
1076
|
.flatpickr-time input:hover,
|
|
1077
1077
|
.flatpickr-time .flatpickr-am-pm:hover,
|
|
1078
|
-
.flatpickr-time input:focus,
|
|
1079
|
-
.flatpickr-time .flatpickr-am-pm:focus {
|
|
1078
|
+
.flatpickr-time input:focus-visible,
|
|
1079
|
+
.flatpickr-time .flatpickr-am-pm:focus-visible {
|
|
1080
1080
|
background: var(--kd-color-date-and-time-picker-background-container-2);
|
|
1081
1081
|
}
|
|
1082
1082
|
|
|
@@ -103,7 +103,7 @@
|
|
|
103
103
|
background-color: var(--kd-color-background-ui-hollow-hover);
|
|
104
104
|
}
|
|
105
105
|
|
|
106
|
-
&:focus {
|
|
106
|
+
&:focus-visible {
|
|
107
107
|
color: var(--kd-color-text-level-primary);
|
|
108
108
|
outline-color: var(--kd-color-border-variants-focus);
|
|
109
109
|
}
|
|
@@ -184,7 +184,7 @@
|
|
|
184
184
|
display: flex;
|
|
185
185
|
}
|
|
186
186
|
|
|
187
|
-
&:focus {
|
|
187
|
+
&:focus-visible {
|
|
188
188
|
outline-color: var(--kd-color-border-ui-hover);
|
|
189
189
|
}
|
|
190
190
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as i}from"../../../vendor/tslib-53a81efe.js";import{n as t,i as a,t as o,o as s,e as r}from"../../../vendor/lit-446874c7.js";import{i as n,s as e,x}from"../../../vendor/lit-element-c6c02f24.js";import{l as d}from"../../../vendor/lottie-web-9ccae634.js";import"../../../vendor/flatpickr-bbd13d61.js";var k={v:"5.9.0",fr:24,ip:0,op:144,w:500,h:500,nm:"Comp 1",ddd:0,assets:[{id:"comp_0",nm:"Pre-comp 1",fr:24,layers:[{ddd:0,ind:1,ty:4,nm:"outside Outlines",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:0,k:0,ix:10},p:{a:0,k:[251.5,250.25,0],ix:2,l:2},a:{a:0,k:[45,45,0],ix:1,l:2},s:{a:1,k:[{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:0,s:[450,452.557,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:47,s:[479,481.722,100]},{t:142,s:[450,452.557,100]}],ix:6,l:2}},ao:0,shapes:[{ty:"gr",it:[{ind:0,ty:"sh",ix:1,ks:{a:0,k:{i:[[-25.643,-1.465],[-.205,26.176],[26.062,-.052],[-.792,-25.919]],o:[[25.629,1.462],[.168,-24.637],[-26.062,.052],[.735,25.335]],v:[[-4.113,42.672],[42.671,-.001],[-4.052,-42.366],[-42.61,.305]],c:!0},ix:2},nm:"Path 1",mn:"ADBE Vector Shape - Group",hd:!1},{ty:"gs",o:{a:0,k:100,ix:9},w:{a:0,k:4.613,ix:10},g:{p:3,k:{a:0,k:[0,.733,0,.733,.5,.451,.253,.867,1,.169,.506,1],ix:8}},s:{a:0,k:[0,0],ix:4},e:{a:0,k:[63.104,51.891],ix:5},t:1,lc:1,lj:1,ml:4,ml2:{a:0,k:4,ix:13},bm:0,nm:"Gradient Stroke 1",mn:"ADBE Vector Graphic - G-Stroke",hd:!1},{ty:"tr",p:{a:0,k:[45.089,45.216],ix:2},a:{a:0,k:[0,0],ix:1},s:{a:1,k:[{i:{x:[.667,.667],y:[1,1]},o:{x:[.333,.333],y:[0,0]},t:0,s:[100,100]},{t:141,s:[100,100]}],ix:3},r:{a:1,k:[{i:{x:[.667],y:[1]},o:{x:[.167],y:[0]},t:0,s:[0]},{t:141,s:[360]}],ix:6},o:{a:0,k:100,ix:7},sk:{a:0,k:0,ix:4},sa:{a:0,k:0,ix:5},nm:"Transform"}],nm:"Group 1",np:2,cix:2,bm:0,ix:1,mn:"ADBE Vector Group",hd:!1},{ty:"rd",nm:"Round Corners 1",r:{a:0,k:89,ix:1},ix:2,mn:"ADBE Vector Filter - RC",hd:!1}],ip:0,op:144,st:0,bm:1},{ddd:0,ind:3,ty:4,nm:"middle Outlines",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:1,k:[{i:{x:[.667],y:[1]},o:{x:[.167],y:[0]},t:0,s:[0]},{t:141,s:[-360]}],ix:10},p:{a:0,k:[250,250,0],ix:2,l:2},a:{a:0,k:[36.5,38,0],ix:1,l:2},s:{a:1,k:[{i:{x:[.667,.667,.667],y:[1.103,1.103,.962]},o:{x:[.333,.333,.333],y:[0,0,0]},t:0,s:[439,439,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[.139,.139,.051]},t:60,s:[563.515,563.515,100]},{t:141,s:[439,439,100]}],ix:6,l:2}},ao:0,shapes:[{ty:"gr",it:[{ind:0,ty:"sh",ix:1,ks:{a:0,k:{i:[[-19.404,-.066],[.985,17.892],[19.165,-2.6],[3.676,-16.498]],o:[[19.098,.061],[-.705,-16.733],[-17.269,1.417],[-4.43,17.047]],v:[[2.975,36.059],[34.594,3.473],[2.163,-34.435],[-33.781,2.223]],c:!0},ix:2},nm:"Path 1",mn:"ADBE Vector Shape - Group",hd:!1},{ty:"gs",o:{a:0,k:100,ix:9},w:{a:0,k:4.613,ix:10},g:{p:3,k:{a:0,k:[0,.733,0,.733,.5,.451,.253,.867,1,.169,.506,1],ix:8}},s:{a:0,k:[54,21],ix:4},e:{a:0,k:[-5.42,-37.145],ix:5},t:1,lc:1,lj:1,ml:4,ml2:{a:0,k:4,ix:13},bm:0,nm:"Gradient Stroke 1",mn:"ADBE Vector Graphic - G-Stroke",hd:!1},{ty:"tr",p:{a:0,k:[36.506,38.2],ix:2},a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},r:{a:0,k:0,ix:6},o:{a:0,k:100,ix:7},sk:{a:0,k:0,ix:4},sa:{a:0,k:0,ix:5},nm:"Transform"}],nm:"Group 1",np:2,cix:2,bm:0,ix:1,mn:"ADBE Vector Group",hd:!1},{ty:"rd",nm:"Round Corners 1",r:{a:0,k:164,ix:1},ix:2,mn:"ADBE Vector Filter - RC",hd:!1}],ip:0,op:144,st:0,bm:1},{ddd:0,ind:5,ty:4,nm:"center Outlines",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:1,k:[{i:{x:[.667],y:[1]},o:{x:[.167],y:[0]},t:0,s:[0]},{t:141,s:[360]}],ix:10},p:{a:0,k:[251,247.25,0],ix:2,l:2},a:{a:0,k:[35,37,0],ix:1,l:2},s:{a:1,k:[{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:0,s:[439,439,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:72,s:[628,628,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:114,s:[411,411,100]},{t:141,s:[439,439,100]}],ix:6,l:2}},ao:0,shapes:[{ty:"gr",it:[{ind:0,ty:"sh",ix:1,ks:{a:0,k:{i:[[-18.757,-1.921],[-.536,18.549],[17.819,.818],[.763,-18.17]],o:[[17.864,1.567],[.536,-18.549],[-17.819,-.818],[-.763,18.17]],v:[[-8.149,31.191],[30.163,-.028],[-8.337,-30.191],[-30.725,-1.716]],c:!0},ix:2},nm:"Path 1",mn:"ADBE Vector Shape - Group",hd:!1},{ty:"gs",o:{a:0,k:100,ix:9},w:{a:0,k:4.613,ix:10},g:{p:3,k:{a:0,k:[0,.733,0,.733,.5,.451,.253,.867,1,.169,.506,1],ix:8}},s:{a:0,k:[6,-13],ix:4},e:{a:0,k:[-3.06,29.856],ix:5},t:1,lc:1,lj:1,ml:4,ml2:{a:0,k:4,ix:13},bm:0,nm:"Gradient Stroke 1",mn:"ADBE Vector Graphic - G-Stroke",hd:!1},{ty:"tr",p:{a:0,k:[34.839,36.617],ix:2},a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},r:{a:0,k:0,ix:6},o:{a:0,k:100,ix:7},sk:{a:0,k:0,ix:4},sa:{a:0,k:0,ix:5},nm:"Transform"}],nm:"Group 1",np:2,cix:2,bm:0,ix:1,mn:"ADBE Vector Group",hd:!1}],ip:0,op:144,st:0,bm:1}]}],layers:[{ddd:0,ind:1,ty:0,nm:"Pre-comp 1",refId:"comp_0",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:0,k:0,ix:10},p:{a:0,k:[250,250,0],ix:2,l:2},a:{a:0,k:[250,250,0],ix:1,l:2},s:{a:0,k:[100,100,100],ix:6,l:2}},ao:0,w:500,h:500,ip:0,op:144,st:0,bm:0}],markers:[]},
|
|
1
|
+
import{_ as i}from"../../../vendor/tslib-53a81efe.js";import{n as t,i as a,t as o,o as s,e as r}from"../../../vendor/lit-446874c7.js";import{i as n,s as e,x}from"../../../vendor/lit-element-c6c02f24.js";import{l as d}from"../../../vendor/lottie-web-9ccae634.js";import"../../../vendor/flatpickr-bbd13d61.js";var k={v:"5.9.0",fr:24,ip:0,op:144,w:500,h:500,nm:"Comp 1",ddd:0,assets:[{id:"comp_0",nm:"Pre-comp 1",fr:24,layers:[{ddd:0,ind:1,ty:4,nm:"outside Outlines",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:0,k:0,ix:10},p:{a:0,k:[251.5,250.25,0],ix:2,l:2},a:{a:0,k:[45,45,0],ix:1,l:2},s:{a:1,k:[{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:0,s:[450,452.557,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:47,s:[479,481.722,100]},{t:142,s:[450,452.557,100]}],ix:6,l:2}},ao:0,shapes:[{ty:"gr",it:[{ind:0,ty:"sh",ix:1,ks:{a:0,k:{i:[[-25.643,-1.465],[-.205,26.176],[26.062,-.052],[-.792,-25.919]],o:[[25.629,1.462],[.168,-24.637],[-26.062,.052],[.735,25.335]],v:[[-4.113,42.672],[42.671,-.001],[-4.052,-42.366],[-42.61,.305]],c:!0},ix:2},nm:"Path 1",mn:"ADBE Vector Shape - Group",hd:!1},{ty:"gs",o:{a:0,k:100,ix:9},w:{a:0,k:4.613,ix:10},g:{p:3,k:{a:0,k:[0,.733,0,.733,.5,.451,.253,.867,1,.169,.506,1],ix:8}},s:{a:0,k:[0,0],ix:4},e:{a:0,k:[63.104,51.891],ix:5},t:1,lc:1,lj:1,ml:4,ml2:{a:0,k:4,ix:13},bm:0,nm:"Gradient Stroke 1",mn:"ADBE Vector Graphic - G-Stroke",hd:!1},{ty:"tr",p:{a:0,k:[45.089,45.216],ix:2},a:{a:0,k:[0,0],ix:1},s:{a:1,k:[{i:{x:[.667,.667],y:[1,1]},o:{x:[.333,.333],y:[0,0]},t:0,s:[100,100]},{t:141,s:[100,100]}],ix:3},r:{a:1,k:[{i:{x:[.667],y:[1]},o:{x:[.167],y:[0]},t:0,s:[0]},{t:141,s:[360]}],ix:6},o:{a:0,k:100,ix:7},sk:{a:0,k:0,ix:4},sa:{a:0,k:0,ix:5},nm:"Transform"}],nm:"Group 1",np:2,cix:2,bm:0,ix:1,mn:"ADBE Vector Group",hd:!1},{ty:"rd",nm:"Round Corners 1",r:{a:0,k:89,ix:1},ix:2,mn:"ADBE Vector Filter - RC",hd:!1}],ip:0,op:144,st:0,bm:1},{ddd:0,ind:3,ty:4,nm:"middle Outlines",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:1,k:[{i:{x:[.667],y:[1]},o:{x:[.167],y:[0]},t:0,s:[0]},{t:141,s:[-360]}],ix:10},p:{a:0,k:[250,250,0],ix:2,l:2},a:{a:0,k:[36.5,38,0],ix:1,l:2},s:{a:1,k:[{i:{x:[.667,.667,.667],y:[1.103,1.103,.962]},o:{x:[.333,.333,.333],y:[0,0,0]},t:0,s:[439,439,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[.139,.139,.051]},t:60,s:[563.515,563.515,100]},{t:141,s:[439,439,100]}],ix:6,l:2}},ao:0,shapes:[{ty:"gr",it:[{ind:0,ty:"sh",ix:1,ks:{a:0,k:{i:[[-19.404,-.066],[.985,17.892],[19.165,-2.6],[3.676,-16.498]],o:[[19.098,.061],[-.705,-16.733],[-17.269,1.417],[-4.43,17.047]],v:[[2.975,36.059],[34.594,3.473],[2.163,-34.435],[-33.781,2.223]],c:!0},ix:2},nm:"Path 1",mn:"ADBE Vector Shape - Group",hd:!1},{ty:"gs",o:{a:0,k:100,ix:9},w:{a:0,k:4.613,ix:10},g:{p:3,k:{a:0,k:[0,.733,0,.733,.5,.451,.253,.867,1,.169,.506,1],ix:8}},s:{a:0,k:[54,21],ix:4},e:{a:0,k:[-5.42,-37.145],ix:5},t:1,lc:1,lj:1,ml:4,ml2:{a:0,k:4,ix:13},bm:0,nm:"Gradient Stroke 1",mn:"ADBE Vector Graphic - G-Stroke",hd:!1},{ty:"tr",p:{a:0,k:[36.506,38.2],ix:2},a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},r:{a:0,k:0,ix:6},o:{a:0,k:100,ix:7},sk:{a:0,k:0,ix:4},sa:{a:0,k:0,ix:5},nm:"Transform"}],nm:"Group 1",np:2,cix:2,bm:0,ix:1,mn:"ADBE Vector Group",hd:!1},{ty:"rd",nm:"Round Corners 1",r:{a:0,k:164,ix:1},ix:2,mn:"ADBE Vector Filter - RC",hd:!1}],ip:0,op:144,st:0,bm:1},{ddd:0,ind:5,ty:4,nm:"center Outlines",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:1,k:[{i:{x:[.667],y:[1]},o:{x:[.167],y:[0]},t:0,s:[0]},{t:141,s:[360]}],ix:10},p:{a:0,k:[251,247.25,0],ix:2,l:2},a:{a:0,k:[35,37,0],ix:1,l:2},s:{a:1,k:[{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:0,s:[439,439,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:72,s:[628,628,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:114,s:[411,411,100]},{t:141,s:[439,439,100]}],ix:6,l:2}},ao:0,shapes:[{ty:"gr",it:[{ind:0,ty:"sh",ix:1,ks:{a:0,k:{i:[[-18.757,-1.921],[-.536,18.549],[17.819,.818],[.763,-18.17]],o:[[17.864,1.567],[.536,-18.549],[-17.819,-.818],[-.763,18.17]],v:[[-8.149,31.191],[30.163,-.028],[-8.337,-30.191],[-30.725,-1.716]],c:!0},ix:2},nm:"Path 1",mn:"ADBE Vector Shape - Group",hd:!1},{ty:"gs",o:{a:0,k:100,ix:9},w:{a:0,k:4.613,ix:10},g:{p:3,k:{a:0,k:[0,.733,0,.733,.5,.451,.253,.867,1,.169,.506,1],ix:8}},s:{a:0,k:[6,-13],ix:4},e:{a:0,k:[-3.06,29.856],ix:5},t:1,lc:1,lj:1,ml:4,ml2:{a:0,k:4,ix:13},bm:0,nm:"Gradient Stroke 1",mn:"ADBE Vector Graphic - G-Stroke",hd:!1},{ty:"tr",p:{a:0,k:[34.839,36.617],ix:2},a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},r:{a:0,k:0,ix:6},o:{a:0,k:100,ix:7},sk:{a:0,k:0,ix:4},sa:{a:0,k:0,ix:5},nm:"Transform"}],nm:"Group 1",np:2,cix:2,bm:0,ix:1,mn:"ADBE Vector Group",hd:!1}],ip:0,op:144,st:0,bm:1}]}],layers:[{ddd:0,ind:1,ty:0,nm:"Pre-comp 1",refId:"comp_0",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:0,k:0,ix:10},p:{a:0,k:[250,250,0],ix:2,l:2},a:{a:0,k:[250,250,0],ix:1,l:2},s:{a:0,k:[100,100,100],ix:6,l:2}},ao:0,w:500,h:500,ip:0,op:144,st:0,bm:0}],markers:[]},l={v:"5.9.0",fr:24,ip:0,op:144,w:500,h:500,nm:"Comp 1",ddd:0,assets:[{id:"comp_0",nm:"Pre-comp 1",fr:24,layers:[{ddd:0,ind:1,ty:4,nm:"outside Outlines",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:0,k:0,ix:10},p:{a:0,k:[251.5,250.25,0],ix:2,l:2},a:{a:0,k:[45,45,0],ix:1,l:2},s:{a:1,k:[{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:0,s:[450,452.557,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:47,s:[479,481.722,100]},{t:142,s:[450,452.557,100]}],ix:6,l:2}},ao:0,shapes:[{ty:"gr",it:[{ind:0,ty:"sh",ix:1,ks:{a:0,k:{i:[[-25.643,-1.465],[-.205,26.176],[26.062,-.052],[-.792,-25.919]],o:[[25.629,1.462],[.168,-24.637],[-26.062,.052],[.735,25.335]],v:[[-4.113,42.672],[42.671,-.001],[-4.052,-42.366],[-42.61,.305]],c:!0},ix:2},nm:"Path 1",mn:"ADBE Vector Shape - Group",hd:!1},{ty:"gs",o:{a:0,k:100,ix:9},w:{a:0,k:4.613,ix:10},g:{p:3,k:{a:0,k:[0,.765,.765,.765,.5,.811,.811,.811,1,.859,.859,.859],ix:8}},s:{a:0,k:[0,0],ix:4},e:{a:0,k:[63.104,51.891],ix:5},t:1,lc:1,lj:1,ml:4,ml2:{a:0,k:4,ix:13},bm:0,nm:"Gradient Stroke 1",mn:"ADBE Vector Graphic - G-Stroke",hd:!1},{ty:"tr",p:{a:0,k:[45.089,45.216],ix:2},a:{a:0,k:[0,0],ix:1},s:{a:1,k:[{i:{x:[.667,.667],y:[1,1]},o:{x:[.333,.333],y:[0,0]},t:0,s:[100,100]},{t:141,s:[100,100]}],ix:3},r:{a:1,k:[{i:{x:[.667],y:[1]},o:{x:[.167],y:[0]},t:0,s:[0]},{t:141,s:[360]}],ix:6},o:{a:0,k:100,ix:7},sk:{a:0,k:0,ix:4},sa:{a:0,k:0,ix:5},nm:"Transform"}],nm:"Group 1",np:2,cix:2,bm:0,ix:1,mn:"ADBE Vector Group",hd:!1},{ty:"rd",nm:"Round Corners 1",r:{a:0,k:89,ix:1},ix:2,mn:"ADBE Vector Filter - RC",hd:!1}],ip:0,op:144,st:0,bm:1},{ddd:0,ind:3,ty:4,nm:"middle Outlines",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:1,k:[{i:{x:[.667],y:[1]},o:{x:[.167],y:[0]},t:0,s:[0]},{t:141,s:[-360]}],ix:10},p:{a:0,k:[250,250,0],ix:2,l:2},a:{a:0,k:[36.5,38,0],ix:1,l:2},s:{a:1,k:[{i:{x:[.667,.667,.667],y:[1.103,1.103,.962]},o:{x:[.333,.333,.333],y:[0,0,0]},t:0,s:[439,439,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[.139,.139,.051]},t:60,s:[563.515,563.515,100]},{t:141,s:[439,439,100]}],ix:6,l:2}},ao:0,shapes:[{ty:"gr",it:[{ind:0,ty:"sh",ix:1,ks:{a:0,k:{i:[[-19.404,-.066],[.985,17.892],[19.165,-2.6],[3.676,-16.498]],o:[[19.098,.061],[-.705,-16.733],[-17.269,1.417],[-4.43,17.047]],v:[[2.975,36.059],[34.594,3.473],[2.163,-34.435],[-33.781,2.223]],c:!0},ix:2},nm:"Path 1",mn:"ADBE Vector Shape - Group",hd:!1},{ty:"gs",o:{a:0,k:100,ix:9},w:{a:0,k:4.613,ix:10},g:{p:3,k:{a:0,k:[0,.843,.843,.843,.5,.8,.8,.8,1,.757,.757,.757],ix:8}},s:{a:0,k:[54,21],ix:4},e:{a:0,k:[-5.42,-37.145],ix:5},t:1,lc:1,lj:1,ml:4,ml2:{a:0,k:4,ix:13},bm:0,nm:"Gradient Stroke 1",mn:"ADBE Vector Graphic - G-Stroke",hd:!1},{ty:"tr",p:{a:0,k:[36.506,38.2],ix:2},a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},r:{a:0,k:0,ix:6},o:{a:0,k:100,ix:7},sk:{a:0,k:0,ix:4},sa:{a:0,k:0,ix:5},nm:"Transform"}],nm:"Group 1",np:2,cix:2,bm:0,ix:1,mn:"ADBE Vector Group",hd:!1},{ty:"rd",nm:"Round Corners 1",r:{a:0,k:164,ix:1},ix:2,mn:"ADBE Vector Filter - RC",hd:!1}],ip:0,op:144,st:0,bm:1},{ddd:0,ind:5,ty:4,nm:"center Outlines",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:1,k:[{i:{x:[.667],y:[1]},o:{x:[.167],y:[0]},t:0,s:[0]},{t:141,s:[360]}],ix:10},p:{a:0,k:[251,247.25,0],ix:2,l:2},a:{a:0,k:[35,37,0],ix:1,l:2},s:{a:1,k:[{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:0,s:[439,439,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:72,s:[628,628,100]},{i:{x:[.667,.667,.667],y:[1,1,1]},o:{x:[.333,.333,.333],y:[0,0,0]},t:114,s:[411,411,100]},{t:141,s:[439,439,100]}],ix:6,l:2}},ao:0,shapes:[{ty:"gr",it:[{ind:0,ty:"sh",ix:1,ks:{a:0,k:{i:[[-18.757,-1.921],[-.536,18.549],[17.819,.818],[.763,-18.17]],o:[[17.864,1.567],[.536,-18.549],[-17.819,-.818],[-.763,18.17]],v:[[-8.149,31.191],[30.163,-.028],[-8.337,-30.191],[-30.725,-1.716]],c:!0},ix:2},nm:"Path 1",mn:"ADBE Vector Shape - Group",hd:!1},{ty:"gs",o:{a:0,k:100,ix:9},w:{a:0,k:4.613,ix:10},g:{p:2,k:{a:0,k:[0,.906,.906,.906,1,.592,.592,.592],ix:8}},s:{a:0,k:[36.0771,34.5153],ix:4},e:{a:0,k:[17.0993,-4.95431],ix:5},t:1,lc:1,lj:1,ml:4,ml2:{a:0,k:4,ix:13},bm:0,nm:"Gradient Stroke 1",mn:"ADBE Vector Graphic - G-Stroke",hd:!1},{ty:"tr",p:{a:0,k:[34.839,36.617],ix:2},a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},r:{a:0,k:0,ix:6},o:{a:0,k:100,ix:7},sk:{a:0,k:0,ix:4},sa:{a:0,k:0,ix:5},nm:"Transform"}],nm:"Group 1",np:2,cix:2,bm:0,ix:1,mn:"ADBE Vector Group",hd:!1}],ip:0,op:144,st:0,bm:1}]}],layers:[{ddd:0,ind:1,ty:0,nm:"Pre-comp 1",refId:"comp_0",sr:1,ks:{o:{a:0,k:100,ix:11},r:{a:0,k:0,ix:10},p:{a:0,k:[250,250,0],ix:2,l:2},a:{a:0,k:[250,250,0],ix:1,l:2},s:{a:0,k:[100,100,100],ix:6,l:2}},ao:0,w:500,h:500,ip:0,op:144,st:0,bm:0}],markers:[]},p=n`*,
|
|
2
2
|
*::before,
|
|
3
3
|
*::after {
|
|
4
4
|
box-sizing: border-box;
|
|
@@ -30,7 +30,7 @@ import{_ as i}from"../../../vendor/tslib-53a81efe.js";import{n as t,i as a,t as
|
|
|
30
30
|
.ai-launch-button:hover {
|
|
31
31
|
border-color: var(--kd-color-border-variants-ai);
|
|
32
32
|
}
|
|
33
|
-
.ai-launch-button:focus {
|
|
33
|
+
.ai-launch-button:focus-visible {
|
|
34
34
|
outline-color: var(--kd-color-border-button-primary-state-focused);
|
|
35
35
|
outline-offset: -2px;
|
|
36
36
|
}
|
|
@@ -73,5 +73,5 @@ svg {
|
|
|
73
73
|
>
|
|
74
74
|
<div class="container"></div>
|
|
75
75
|
</button>
|
|
76
|
-
`}firstUpdated(){this._initAnimation()}_initAnimation(){this._animation=d.loadAnimation({container:this._containerEl,renderer:"svg",loop:!0,autoplay:!1,animationData:this.disabled?
|
|
76
|
+
`}firstUpdated(){this._initAnimation()}_initAnimation(){this._animation=d.loadAnimation({container:this._containerEl,renderer:"svg",loop:!0,autoplay:!1,animationData:this.disabled?l:k}),this._animation.setSpeed(2),this._animation.goToAndStop(0,!0),this._animation.addEventListener("loopComplete",(()=>{this._shouldStop&&(this._animation.goToAndStop(0,!0),this._shouldStop=!1)}))}_startHoverAnimation(){this.disabled||(this._shouldStop=!1,this._animation.goToAndStop(0,!0),this._animation.setDirection(1),this._animation.play())}_stopHoverAnimation(){this.disabled||(this._shouldStop=!0)}updated(i){i.has("disabled")&&(this._animation.destroy(),this._initAnimation())}_emitClick(){if(!this.disabled){const i=new CustomEvent("on-click");this.dispatchEvent(i)}}};m.styles=p,i([t({type:Boolean})],m.prototype,"disabled",void 0),i([a(".container")],m.prototype,"_containerEl",void 0),i([o()],m.prototype,"_animation",void 0),i([o()],m.prototype,"_shouldStop",void 0),m=i([r("kyn-ai-launch-btn")],m);export{m as AILaunchButton};
|
|
77
77
|
//# sourceMappingURL=aiLaunchButton.js.map
|
|
@@ -35,7 +35,6 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{n as t,t as s,l as
|
|
|
35
35
|
.action-bar {
|
|
36
36
|
display: flex;
|
|
37
37
|
justify-content: space-between;
|
|
38
|
-
margin-bottom: 1rem;
|
|
39
38
|
}
|
|
40
39
|
|
|
41
40
|
.left-div,
|
|
@@ -70,6 +69,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{n as t,t as s,l as
|
|
|
70
69
|
border: 1px solid var(--kd-color-border-variants-light);
|
|
71
70
|
border-radius: 8px;
|
|
72
71
|
padding: 16px;
|
|
72
|
+
margin-top: 1rem;
|
|
73
73
|
}
|
|
74
74
|
|
|
75
75
|
.opened.kyn-sources-body {
|
|
@@ -78,6 +78,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{n as t,t as s,l as
|
|
|
78
78
|
background: var(--kd-color-background-container-ai-default);
|
|
79
79
|
border-radius: 8px;
|
|
80
80
|
padding: 16px;
|
|
81
|
+
margin-top: 1rem;
|
|
81
82
|
}
|
|
82
83
|
|
|
83
84
|
.expand-icon {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"aiSourcesFeedback.js","sources":["../../../../src/components/ai/sourcesFeedback/aiSourcesFeedback.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport {\n customElement,\n property,\n queryAssignedElements,\n state,\n} from 'lit/decorators.js';\nimport { deepmerge } from 'deepmerge-ts';\nimport { classMap } from 'lit-html/directives/class-map.js';\n\nimport stylesheet from './aiSourcesFeedback.scss';\n\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport chevronIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/chevron-down.svg';\nimport thumbsUpIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/thumbs-up.svg';\nimport thumbsDownIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/thumbs-down.svg';\nimport thumbsUpFilledIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/thumbs-up-filled.svg';\nimport thumbsDownFilledIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/thumbs-down-filled.svg';\nimport closeIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/close-simple.svg';\n\nimport '../../reusable/link';\nimport '../../reusable/card';\nimport '../../reusable/button';\n\nconst _defaultTextStrings = {\n sourcesText: 'Sources used',\n foundSources: 'Found sources',\n showMore: 'Show more',\n showLess: 'Show less',\n positiveFeedback: 'Share what you liked',\n negativeFeedback: 'Help us improve',\n};\n\n/**\n * AISourcesFeedback Component.\n *\n * @slot copy - copy button\n * @slot sources - source cards in source panel.\n * @slot feedback-form - Positive feedback form.\n * @fires on-toggle - Emits the `opened` state when the panel item opens/closes.\n * @fires on-feedback-deselected - Emits when thumbs-up or thumbs-down button is deselected.\n */\n\n@customElement('kyn-ai-sources-feedback')\nexport class AISourcesFeedback extends LitElement {\n static override styles = [stylesheet];\n\n /** expandable anchor opened state for Sources used. */\n @property({ type: Boolean })\n sourcesOpened = false;\n\n /** expandable anchor opened state for Feedback buttons. */\n @property({ type: Boolean })\n feedbackOpened = false;\n\n /** expandable anchor disabled state for Sources used.. */\n @property({ type: Boolean })\n sourcesDisabled = false;\n\n /** expandable anchor disabled state for Feedback buttons. */\n @property({ type: Boolean })\n feedbackDisabled = false;\n\n /** Limits visible sources behind a \"Show more\" button. */\n @property({ type: Boolean })\n revealAllSources = false;\n\n /** Text string customization. */\n @property({ type: Object })\n textStrings = _defaultTextStrings;\n\n /** Close button text. */\n @property({ type: String })\n closeText = 'Close';\n\n /** Number of sources visible when limited.\n * @internal\n */\n @state()\n _limitCount = 4;\n\n /** Sources limit visibility.\n * @internal\n */\n @state()\n limitRevealed = false;\n\n /** Internal text strings.\n * @internal\n */\n @state()\n _textStrings = _defaultTextStrings;\n\n /** Selecting Positive or Negative Feedback\n * @internal\n */\n @state()\n _selectedFeedbackType: any = null;\n\n /**\n * Queries slotted sources.\n * @ignore\n */\n @queryAssignedElements({ slot: 'sources' })\n _sourceEls!: any;\n\n /** Sources anchor text\n * @internal\n */\n @state()\n sourcesOriginalText: any;\n\n /** Tracks the number of clicks on thumbs up icon\n * @internal\n */\n @state() thumbsUpClickCount = 0;\n\n /** Tracks the number of clicks on thumbs down icon\n * @internal\n */\n @state() thumbsDownClickCount = 0;\n\n override render() {\n const classesSources: any = classMap({\n 'kyn-sources': true,\n opened: this.sourcesOpened,\n disabled: this.sourcesDisabled,\n });\n const classesFeedback1: any = classMap({\n 'kyn-pos-feedback': true,\n disabled:\n this.feedbackDisabled && this._selectedFeedbackType === 'positive',\n });\n const classesFeedback2: any = classMap({\n 'kyn-neg-feedback': true,\n disabled:\n this.feedbackDisabled && this._selectedFeedbackType === 'positive',\n });\n return html`\n <div class=\"action-bar\">\n <div class=\"left-div\">\n <slot name=\"copy\"></slot>\n\n <div class=\"${classesSources}\">\n <kyn-button\n kind=\"ghost\"\n size=\"small\"\n class=\"kyn-sources-title\"\n iconPosition=\"right\"\n aria-controls=\"kyn-sources-body\"\n aria-expanded=${this.sourcesOpened}\n ?disabled=${this.sourcesDisabled}\n @on-click=\"${(e: Event) => this._handleClick(e, 'sources')}\"\n id=\"kyn-sources-title\"\n >\n ${this._textStrings.sourcesText}\n <span class=\"expand-icon\" slot=\"icon\"\n >${unsafeSVG(chevronIcon)}</span\n >\n </kyn-button>\n </div>\n </div>\n\n <div class=\"right-div\">\n <div class=\"${classesFeedback1}\">\n <kyn-button\n kind=\"ghost\"\n size=\"small\"\n id=\"kyn-feedback-title-positive\"\n class=\"kyn-feedback-title\"\n aria-controls=\"kyn-feedback-body\"\n aria-expanded=${this.feedbackOpened}\n ?disabled=${this.feedbackDisabled}\n description=${this._textStrings.positiveFeedback}\n @on-click=${(e: Event) =>\n this._handleClick(e, 'feedback', 'positive')}\n >\n <span slot=\"icon\">\n ${unsafeSVG(\n this.thumbsUpClickCount % 2 === 0\n ? thumbsUpIcon\n : thumbsUpFilledIcon\n )}\n </span>\n </kyn-button>\n </div>\n\n <div class=\"${classesFeedback2}\">\n <kyn-button\n kind=\"ghost\"\n size=\"small\"\n id=\"kyn-feedback-title-negative\"\n class=\"kyn-feedback-title\"\n aria-controls=\"kyn-feedback-body\"\n aria-expanded=${this.feedbackOpened}\n ?disabled=${this.feedbackDisabled}\n description=${this._textStrings.negativeFeedback}\n @on-click=\"${(e: Event) =>\n this._handleClick(e, 'feedback', 'negative')}\"\n >\n <span slot=\"icon\"\n >${unsafeSVG(\n this.thumbsDownClickCount % 2 === 0\n ? thumbsDownIcon\n : thumbsDownFilledIcon\n )}\n </span>\n </kyn-button>\n </div>\n </div>\n </div>\n\n <div\n class=\"${classMap({\n opened: this.sourcesOpened,\n 'kyn-sources-body': true,\n })}\"\n id=\"kyn-sources-body\"\n role=\"region\"\n aria-labelledby=\"kyn-sources-title\"\n >\n <div class=\"close-container\">\n <kyn-button\n class=\"close\"\n @on-click=${(e: Event) => this._handleClick(e, 'sources')}\n }}\n kind=\"ghost\"\n size=\"small\"\n description=${this.closeText}\n >\n <span slot=\"icon\">${unsafeSVG(closeIcon)}</span>\n </kyn-button>\n </div>\n\n <div class=\"found-sources\">\n ${this._textStrings.foundSources} (${this._sourceEls.length}) :\n </div>\n <div class=\"card-container\">\n <slot name=\"sources\" @slotchange=${this._handleSlotChange}></slot>\n </div>\n ${!this.revealAllSources && this._sourceEls.length > this._limitCount\n ? html`\n <kyn-button\n class=\"reveal-toggle\"\n kind=\"ghost\"\n size=\"small\"\n @on-click=${() =>\n this._toggleLimitRevealed(!this.limitRevealed)}\n >\n ${this.limitRevealed\n ? html`${this._textStrings.showLess}`\n : html`\n ${this._textStrings.showMore}\n (${this._sourceEls.length - this._limitCount})\n `}\n </kyn-button>\n `\n : null}\n </div>\n\n <div\n class=\"${classMap({\n opened: this.feedbackOpened,\n 'kyn-feedback-body': true,\n })}\"\n id=\"kyn-feedback-body\"\n role=\"region\"\n aria-labelledby=\"kyn-feedback-title-${this._selectedFeedbackType\n ? 'positive'\n : 'negative'}\"\n >\n <div class=\"close-container\">\n <kyn-button\n class=\"close\"\n description=${this.closeText}\n @on-click=${(e: Event) =>\n this._handleClick(e, 'feedback', this._selectedFeedbackType)}\n }}\n kind=\"ghost\"\n size=\"small\"\n >\n <span slot=\"icon\">${unsafeSVG(closeIcon)}</span>\n </kyn-button>\n </div>\n\n <slot name=\"feedback-form\"></slot>\n </div>\n `;\n }\n private _handleClick(\n e: Event,\n panel: 'sources' | 'feedback',\n feedbackType?: 'positive' | 'negative'\n ) {\n e.preventDefault();\n\n if (\n (panel === 'sources' && this.sourcesDisabled) ||\n (panel === 'feedback' && this.feedbackDisabled)\n ) {\n return;\n }\n\n const target = e.target as HTMLElement;\n const isFeedbackButton = target.id?.includes('kyn-feedback-title');\n\n if (isFeedbackButton && feedbackType) {\n this._updateFeedbackCounts(feedbackType);\n }\n\n if (panel === 'sources' || this._shouldEmitFeedbackEvent(feedbackType)) {\n this._emitToggleEvent(panel, feedbackType);\n }\n }\n\n private _updateFeedbackCounts(feedbackType: 'positive' | 'negative') {\n // Checks if the feedbackType was already selected before updating the counts.\n const wasSelected =\n (feedbackType === 'positive' && this.thumbsUpClickCount % 2 !== 0) ||\n (feedbackType === 'negative' && this.thumbsDownClickCount % 2 !== 0);\n\n if (feedbackType === 'positive') {\n this.thumbsUpClickCount++;\n this.thumbsDownClickCount -= this.thumbsDownClickCount % 2;\n } else {\n this.thumbsDownClickCount++;\n this.thumbsUpClickCount -= this.thumbsUpClickCount % 2;\n }\n\n if (wasSelected) {\n this.dispatchEvent(\n new CustomEvent('on-feedback-deselected', {\n detail: { feedbackType },\n bubbles: true,\n composed: true,\n })\n );\n }\n }\n\n private _shouldEmitFeedbackEvent(\n feedbackType?: 'positive' | 'negative'\n ): boolean {\n if (!feedbackType) return false;\n const isOddClick = (count: number) => count % 2 !== 0;\n\n return (\n (feedbackType === 'positive' &&\n (isOddClick(this.thumbsUpClickCount) ||\n (this.feedbackOpened && !isOddClick(this.thumbsUpClickCount)))) ||\n (feedbackType === 'negative' &&\n (isOddClick(this.thumbsDownClickCount) ||\n (this.feedbackOpened && !isOddClick(this.thumbsDownClickCount))))\n );\n }\n\n private _emitToggleEvent(\n panel: 'sources' | 'feedback',\n feedbackType?: 'positive' | 'negative'\n ) {\n if (panel === 'sources') {\n this.sourcesOpened = !this.sourcesOpened;\n this.feedbackOpened = false;\n } else if (panel === 'feedback') {\n this.sourcesOpened = false;\n this._toggleFeedbackPanel(feedbackType);\n }\n\n this.dispatchEvent(\n new CustomEvent('on-toggle', {\n detail: {\n sourcesOpened: this.sourcesOpened,\n feedbackOpened: this.feedbackOpened,\n selectedFeedbackType: this._selectedFeedbackType,\n },\n })\n );\n }\n\n private _toggleFeedbackPanel(feedbackType?: 'positive' | 'negative') {\n if (!feedbackType) return;\n\n if (this._selectedFeedbackType === feedbackType && this.feedbackOpened) {\n this.feedbackOpened = false;\n this._selectedFeedbackType = null;\n } else {\n this.feedbackOpened = true;\n this._selectedFeedbackType = feedbackType;\n }\n }\n\n protected _handleSlotChange() {\n this._toggleLimitRevealed(this.limitRevealed);\n }\n\n private _toggleLimitRevealed(revealed: boolean) {\n this.limitRevealed = revealed;\n\n this._sourceEls.forEach((sourceEl: any, index: any) => {\n if (this.revealAllSources || this.limitRevealed) {\n sourceEl.style.display = 'block';\n } else {\n if (index < this._limitCount) {\n sourceEl.style.display = 'block';\n } else {\n sourceEl.style.display = 'none';\n }\n }\n });\n }\n\n override willUpdate(changedProps: any) {\n if (changedProps.has('textStrings')) {\n this._textStrings = deepmerge(_defaultTextStrings, this.textStrings);\n this.sourcesOriginalText = this._textStrings.sourcesText;\n }\n }\n\n protected override updated(changedProps: any): void {\n if (\n changedProps.has('revealAllSources') &&\n changedProps.get('revealAllSources') !== undefined\n ) {\n this._toggleLimitRevealed(false);\n }\n }\n\n override connectedCallback() {\n super.connectedCallback();\n window.addEventListener('resize', () => this.updateSourcesText());\n }\n\n override disconnectedCallback() {\n window.removeEventListener('resize', () => this.updateSourcesText());\n super.disconnectedCallback();\n }\n\n private updateSourcesText() {\n this._textStrings.sourcesText =\n window.innerWidth > 672\n ? this.sourcesOriginalText\n : this.sourcesOriginalText.split(' ')[0];\n this.requestUpdate();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-ai-sources-feedback': AISourcesFeedback;\n }\n}\n"],"names":["_defaultTextStrings","sourcesText","foundSources","showMore","showLess","positiveFeedback","negativeFeedback","AISourcesFeedback","LitElement","constructor","this","sourcesOpened","feedbackOpened","sourcesDisabled","feedbackDisabled","revealAllSources","textStrings","closeText","_limitCount","limitRevealed","_textStrings","_selectedFeedbackType","thumbsUpClickCount","thumbsDownClickCount","render","classesSources","classMap","opened","disabled","classesFeedback1","classesFeedback2","html","e","_handleClick","unsafeSVG","chevronIcon","thumbsUpIcon","thumbsUpFilledIcon","thumbsDownIcon","thumbsDownFilledIcon","closeIcon","_sourceEls","length","_handleSlotChange","_toggleLimitRevealed","panel","feedbackType","preventDefault","_a","target","id","includes","_updateFeedbackCounts","_shouldEmitFeedbackEvent","_emitToggleEvent","wasSelected","dispatchEvent","CustomEvent","detail","bubbles","composed","isOddClick","count","_toggleFeedbackPanel","selectedFeedbackType","revealed","forEach","sourceEl","index","style","display","willUpdate","changedProps","has","deepmerge","sourcesOriginalText","updated","undefined","get","connectedCallback","super","window","addEventListener","updateSourcesText","disconnectedCallback","removeEventListener","innerWidth","split","requestUpdate","styles","stylesheet","__decorate","property","type","Boolean","prototype","Object","String","state","queryAssignedElements","slot","customElement"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"aiSourcesFeedback.js","sources":["../../../../src/components/ai/sourcesFeedback/aiSourcesFeedback.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport {\n customElement,\n property,\n queryAssignedElements,\n state,\n} from 'lit/decorators.js';\nimport { deepmerge } from 'deepmerge-ts';\nimport { classMap } from 'lit-html/directives/class-map.js';\n\nimport stylesheet from './aiSourcesFeedback.scss';\n\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport chevronIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/chevron-down.svg';\nimport thumbsUpIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/thumbs-up.svg';\nimport thumbsDownIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/thumbs-down.svg';\nimport thumbsUpFilledIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/thumbs-up-filled.svg';\nimport thumbsDownFilledIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/thumbs-down-filled.svg';\nimport closeIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/close-simple.svg';\n\nimport '../../reusable/link';\nimport '../../reusable/card';\nimport '../../reusable/button';\n\nconst _defaultTextStrings = {\n sourcesText: 'Sources used',\n foundSources: 'Found sources',\n showMore: 'Show more',\n showLess: 'Show less',\n positiveFeedback: 'Share what you liked',\n negativeFeedback: 'Help us improve',\n};\n\n/**\n * AISourcesFeedback Component.\n *\n * @slot copy - copy button\n * @slot sources - source cards in source panel.\n * @slot feedback-form - Positive feedback form.\n * @fires on-toggle - Emits the `opened` state when the panel item opens/closes.\n * @fires on-feedback-deselected - Emits when thumbs-up or thumbs-down button is deselected.\n */\n\n@customElement('kyn-ai-sources-feedback')\nexport class AISourcesFeedback extends LitElement {\n static override styles = [stylesheet];\n\n /** expandable anchor opened state for Sources used. */\n @property({ type: Boolean })\n sourcesOpened = false;\n\n /** expandable anchor opened state for Feedback buttons. */\n @property({ type: Boolean })\n feedbackOpened = false;\n\n /** expandable anchor disabled state for Sources used.. */\n @property({ type: Boolean })\n sourcesDisabled = false;\n\n /** expandable anchor disabled state for Feedback buttons. */\n @property({ type: Boolean })\n feedbackDisabled = false;\n\n /** Limits visible sources behind a \"Show more\" button. */\n @property({ type: Boolean })\n revealAllSources = false;\n\n /** Text string customization. */\n @property({ type: Object })\n textStrings = _defaultTextStrings;\n\n /** Close button text. */\n @property({ type: String })\n closeText = 'Close';\n\n /** Number of sources visible when limited.\n * @internal\n */\n @state()\n _limitCount = 4;\n\n /** Sources limit visibility.\n * @internal\n */\n @state()\n limitRevealed = false;\n\n /** Internal text strings.\n * @internal\n */\n @state()\n _textStrings = _defaultTextStrings;\n\n /** Selecting Positive or Negative Feedback\n * @internal\n */\n @state()\n _selectedFeedbackType: any = null;\n\n /**\n * Queries slotted sources.\n * @ignore\n */\n @queryAssignedElements({ slot: 'sources' })\n _sourceEls!: any;\n\n /** Sources anchor text\n * @internal\n */\n @state()\n sourcesOriginalText: any;\n\n /** Tracks the number of clicks on thumbs up icon\n * @internal\n */\n @state() thumbsUpClickCount = 0;\n\n /** Tracks the number of clicks on thumbs down icon\n * @internal\n */\n @state() thumbsDownClickCount = 0;\n\n override render() {\n const classesSources: any = classMap({\n 'kyn-sources': true,\n opened: this.sourcesOpened,\n disabled: this.sourcesDisabled,\n });\n const classesFeedback1: any = classMap({\n 'kyn-pos-feedback': true,\n disabled:\n this.feedbackDisabled && this._selectedFeedbackType === 'positive',\n });\n const classesFeedback2: any = classMap({\n 'kyn-neg-feedback': true,\n disabled:\n this.feedbackDisabled && this._selectedFeedbackType === 'positive',\n });\n return html`\n <div class=\"action-bar\">\n <div class=\"left-div\">\n <slot name=\"copy\"></slot>\n\n <div class=\"${classesSources}\">\n <kyn-button\n kind=\"ghost\"\n size=\"small\"\n class=\"kyn-sources-title\"\n iconPosition=\"right\"\n aria-controls=\"kyn-sources-body\"\n aria-expanded=${this.sourcesOpened}\n ?disabled=${this.sourcesDisabled}\n @on-click=\"${(e: Event) => this._handleClick(e, 'sources')}\"\n id=\"kyn-sources-title\"\n >\n ${this._textStrings.sourcesText}\n <span class=\"expand-icon\" slot=\"icon\"\n >${unsafeSVG(chevronIcon)}</span\n >\n </kyn-button>\n </div>\n </div>\n\n <div class=\"right-div\">\n <div class=\"${classesFeedback1}\">\n <kyn-button\n kind=\"ghost\"\n size=\"small\"\n id=\"kyn-feedback-title-positive\"\n class=\"kyn-feedback-title\"\n aria-controls=\"kyn-feedback-body\"\n aria-expanded=${this.feedbackOpened}\n ?disabled=${this.feedbackDisabled}\n description=${this._textStrings.positiveFeedback}\n @on-click=${(e: Event) =>\n this._handleClick(e, 'feedback', 'positive')}\n >\n <span slot=\"icon\">\n ${unsafeSVG(\n this.thumbsUpClickCount % 2 === 0\n ? thumbsUpIcon\n : thumbsUpFilledIcon\n )}\n </span>\n </kyn-button>\n </div>\n\n <div class=\"${classesFeedback2}\">\n <kyn-button\n kind=\"ghost\"\n size=\"small\"\n id=\"kyn-feedback-title-negative\"\n class=\"kyn-feedback-title\"\n aria-controls=\"kyn-feedback-body\"\n aria-expanded=${this.feedbackOpened}\n ?disabled=${this.feedbackDisabled}\n description=${this._textStrings.negativeFeedback}\n @on-click=\"${(e: Event) =>\n this._handleClick(e, 'feedback', 'negative')}\"\n >\n <span slot=\"icon\"\n >${unsafeSVG(\n this.thumbsDownClickCount % 2 === 0\n ? thumbsDownIcon\n : thumbsDownFilledIcon\n )}\n </span>\n </kyn-button>\n </div>\n </div>\n </div>\n\n <div\n class=\"${classMap({\n opened: this.sourcesOpened,\n 'kyn-sources-body': true,\n })}\"\n id=\"kyn-sources-body\"\n role=\"region\"\n aria-labelledby=\"kyn-sources-title\"\n >\n <div class=\"close-container\">\n <kyn-button\n class=\"close\"\n @on-click=${(e: Event) => this._handleClick(e, 'sources')}\n }}\n kind=\"ghost\"\n size=\"small\"\n description=${this.closeText}\n >\n <span slot=\"icon\">${unsafeSVG(closeIcon)}</span>\n </kyn-button>\n </div>\n\n <div class=\"found-sources\">\n ${this._textStrings.foundSources} (${this._sourceEls.length}) :\n </div>\n <div class=\"card-container\">\n <slot name=\"sources\" @slotchange=${this._handleSlotChange}></slot>\n </div>\n ${!this.revealAllSources && this._sourceEls.length > this._limitCount\n ? html`\n <kyn-button\n class=\"reveal-toggle\"\n kind=\"ghost\"\n size=\"small\"\n @on-click=${() =>\n this._toggleLimitRevealed(!this.limitRevealed)}\n >\n ${this.limitRevealed\n ? html`${this._textStrings.showLess}`\n : html`\n ${this._textStrings.showMore}\n (${this._sourceEls.length - this._limitCount})\n `}\n </kyn-button>\n `\n : null}\n </div>\n\n <div\n class=\"${classMap({\n opened: this.feedbackOpened,\n 'kyn-feedback-body': true,\n })}\"\n id=\"kyn-feedback-body\"\n role=\"region\"\n aria-labelledby=\"kyn-feedback-title-${this._selectedFeedbackType\n ? 'positive'\n : 'negative'}\"\n >\n <div class=\"close-container\">\n <kyn-button\n class=\"close\"\n description=${this.closeText}\n @on-click=${(e: Event) =>\n this._handleClick(e, 'feedback', this._selectedFeedbackType)}\n }}\n kind=\"ghost\"\n size=\"small\"\n >\n <span slot=\"icon\">${unsafeSVG(closeIcon)}</span>\n </kyn-button>\n </div>\n\n <slot name=\"feedback-form\"></slot>\n </div>\n `;\n }\n private _handleClick(\n e: Event,\n panel: 'sources' | 'feedback',\n feedbackType?: 'positive' | 'negative'\n ) {\n e.preventDefault();\n\n if (\n (panel === 'sources' && this.sourcesDisabled) ||\n (panel === 'feedback' && this.feedbackDisabled)\n ) {\n return;\n }\n\n const target = e.target as HTMLElement;\n const isFeedbackButton = target.id?.includes('kyn-feedback-title');\n\n if (isFeedbackButton && feedbackType) {\n this._updateFeedbackCounts(feedbackType);\n }\n\n if (panel === 'sources' || this._shouldEmitFeedbackEvent(feedbackType)) {\n this._emitToggleEvent(panel, feedbackType);\n }\n }\n\n private _updateFeedbackCounts(feedbackType: 'positive' | 'negative') {\n // Checks if the feedbackType was already selected before updating the counts.\n const wasSelected =\n (feedbackType === 'positive' && this.thumbsUpClickCount % 2 !== 0) ||\n (feedbackType === 'negative' && this.thumbsDownClickCount % 2 !== 0);\n\n if (feedbackType === 'positive') {\n this.thumbsUpClickCount++;\n this.thumbsDownClickCount -= this.thumbsDownClickCount % 2;\n } else {\n this.thumbsDownClickCount++;\n this.thumbsUpClickCount -= this.thumbsUpClickCount % 2;\n }\n\n if (wasSelected) {\n this.dispatchEvent(\n new CustomEvent('on-feedback-deselected', {\n detail: { feedbackType },\n bubbles: true,\n composed: true,\n })\n );\n }\n }\n\n private _shouldEmitFeedbackEvent(\n feedbackType?: 'positive' | 'negative'\n ): boolean {\n if (!feedbackType) return false;\n const isOddClick = (count: number) => count % 2 !== 0;\n\n return (\n (feedbackType === 'positive' &&\n (isOddClick(this.thumbsUpClickCount) ||\n (this.feedbackOpened && !isOddClick(this.thumbsUpClickCount)))) ||\n (feedbackType === 'negative' &&\n (isOddClick(this.thumbsDownClickCount) ||\n (this.feedbackOpened && !isOddClick(this.thumbsDownClickCount))))\n );\n }\n\n private _emitToggleEvent(\n panel: 'sources' | 'feedback',\n feedbackType?: 'positive' | 'negative'\n ) {\n if (panel === 'sources') {\n this.sourcesOpened = !this.sourcesOpened;\n this.feedbackOpened = false;\n } else if (panel === 'feedback') {\n this.sourcesOpened = false;\n this._toggleFeedbackPanel(feedbackType);\n }\n\n this.dispatchEvent(\n new CustomEvent('on-toggle', {\n detail: {\n sourcesOpened: this.sourcesOpened,\n feedbackOpened: this.feedbackOpened,\n selectedFeedbackType: this._selectedFeedbackType,\n },\n })\n );\n }\n\n private _toggleFeedbackPanel(feedbackType?: 'positive' | 'negative') {\n if (!feedbackType) return;\n\n if (this._selectedFeedbackType === feedbackType && this.feedbackOpened) {\n this.feedbackOpened = false;\n this._selectedFeedbackType = null;\n } else {\n this.feedbackOpened = true;\n this._selectedFeedbackType = feedbackType;\n }\n }\n\n protected _handleSlotChange() {\n this._toggleLimitRevealed(this.limitRevealed);\n }\n\n private _toggleLimitRevealed(revealed: boolean) {\n this.limitRevealed = revealed;\n\n this._sourceEls.forEach((sourceEl: any, index: any) => {\n if (this.revealAllSources || this.limitRevealed) {\n sourceEl.style.display = 'block';\n } else {\n if (index < this._limitCount) {\n sourceEl.style.display = 'block';\n } else {\n sourceEl.style.display = 'none';\n }\n }\n });\n }\n\n override willUpdate(changedProps: any) {\n if (changedProps.has('textStrings')) {\n this._textStrings = deepmerge(_defaultTextStrings, this.textStrings);\n this.sourcesOriginalText = this._textStrings.sourcesText;\n }\n }\n\n protected override updated(changedProps: any): void {\n if (\n changedProps.has('revealAllSources') &&\n changedProps.get('revealAllSources') !== undefined\n ) {\n this._toggleLimitRevealed(false);\n }\n }\n\n override connectedCallback() {\n super.connectedCallback();\n window.addEventListener('resize', () => this.updateSourcesText());\n }\n\n override disconnectedCallback() {\n window.removeEventListener('resize', () => this.updateSourcesText());\n super.disconnectedCallback();\n }\n\n private updateSourcesText() {\n this._textStrings.sourcesText =\n window.innerWidth > 672\n ? this.sourcesOriginalText\n : this.sourcesOriginalText.split(' ')[0];\n this.requestUpdate();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-ai-sources-feedback': AISourcesFeedback;\n }\n}\n"],"names":["_defaultTextStrings","sourcesText","foundSources","showMore","showLess","positiveFeedback","negativeFeedback","AISourcesFeedback","LitElement","constructor","this","sourcesOpened","feedbackOpened","sourcesDisabled","feedbackDisabled","revealAllSources","textStrings","closeText","_limitCount","limitRevealed","_textStrings","_selectedFeedbackType","thumbsUpClickCount","thumbsDownClickCount","render","classesSources","classMap","opened","disabled","classesFeedback1","classesFeedback2","html","e","_handleClick","unsafeSVG","chevronIcon","thumbsUpIcon","thumbsUpFilledIcon","thumbsDownIcon","thumbsDownFilledIcon","closeIcon","_sourceEls","length","_handleSlotChange","_toggleLimitRevealed","panel","feedbackType","preventDefault","_a","target","id","includes","_updateFeedbackCounts","_shouldEmitFeedbackEvent","_emitToggleEvent","wasSelected","dispatchEvent","CustomEvent","detail","bubbles","composed","isOddClick","count","_toggleFeedbackPanel","selectedFeedbackType","revealed","forEach","sourceEl","index","style","display","willUpdate","changedProps","has","deepmerge","sourcesOriginalText","updated","undefined","get","connectedCallback","super","window","addEventListener","updateSourcesText","disconnectedCallback","removeEventListener","innerWidth","split","requestUpdate","styles","stylesheet","__decorate","property","type","Boolean","prototype","Object","String","state","queryAssignedElements","slot","customElement"],"mappings":"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"}
|
|
@@ -43,7 +43,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{n as t,l as o,t as
|
|
|
43
43
|
outline: 2px solid transparent;
|
|
44
44
|
outline-offset: -2px;
|
|
45
45
|
}
|
|
46
|
-
.interactive:focus {
|
|
46
|
+
.interactive:focus-visible {
|
|
47
47
|
outline-color: var(--kd-color-border-variants-focus);
|
|
48
48
|
}
|
|
49
49
|
.interactive:hover {
|
|
@@ -208,7 +208,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{n as t,l as o,t as
|
|
|
208
208
|
background: var(--kd-color-background-menu-state-pressed);
|
|
209
209
|
color: var(--kd-color-text-button-dark-primary);
|
|
210
210
|
}
|
|
211
|
-
.go-back:focus {
|
|
211
|
+
.go-back:focus-visible {
|
|
212
212
|
outline-color: var(--kd-color-border-variants-focus);
|
|
213
213
|
}
|
|
214
214
|
@media (min-width: 42rem) {
|
|
@@ -43,7 +43,7 @@ import{_ as t}from"../../../vendor/tslib-53a81efe.js";import{o as e}from"../../.
|
|
|
43
43
|
outline: 2px solid transparent;
|
|
44
44
|
outline-offset: -2px;
|
|
45
45
|
}
|
|
46
|
-
.interactive:focus {
|
|
46
|
+
.interactive:focus-visible {
|
|
47
47
|
outline-color: var(--kd-color-border-variants-focus);
|
|
48
48
|
}
|
|
49
49
|
.interactive:hover {
|
|
@@ -208,7 +208,7 @@ import{_ as t}from"../../../vendor/tslib-53a81efe.js";import{o as e}from"../../.
|
|
|
208
208
|
background: var(--kd-color-background-menu-state-pressed);
|
|
209
209
|
color: var(--kd-color-text-button-dark-primary);
|
|
210
210
|
}
|
|
211
|
-
.go-back:focus {
|
|
211
|
+
.go-back:focus-visible {
|
|
212
212
|
outline-color: var(--kd-color-border-variants-focus);
|
|
213
213
|
}
|
|
214
214
|
@media (min-width: 42rem) {
|
|
@@ -43,7 +43,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../.
|
|
|
43
43
|
outline: 2px solid transparent;
|
|
44
44
|
outline-offset: -2px;
|
|
45
45
|
}
|
|
46
|
-
.interactive:focus {
|
|
46
|
+
.interactive:focus-visible {
|
|
47
47
|
outline-color: var(--kd-color-border-variants-focus);
|
|
48
48
|
}
|
|
49
49
|
.interactive:hover {
|
|
@@ -208,7 +208,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../.
|
|
|
208
208
|
background: var(--kd-color-background-menu-state-pressed);
|
|
209
209
|
color: var(--kd-color-text-button-dark-primary);
|
|
210
210
|
}
|
|
211
|
-
.go-back:focus {
|
|
211
|
+
.go-back:focus-visible {
|
|
212
212
|
outline-color: var(--kd-color-border-variants-focus);
|
|
213
213
|
}
|
|
214
214
|
@media (min-width: 42rem) {
|
|
@@ -43,7 +43,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../.
|
|
|
43
43
|
outline: 2px solid transparent;
|
|
44
44
|
outline-offset: -2px;
|
|
45
45
|
}
|
|
46
|
-
.interactive:focus {
|
|
46
|
+
.interactive:focus-visible {
|
|
47
47
|
outline-color: var(--kd-color-border-variants-focus);
|
|
48
48
|
}
|
|
49
49
|
.interactive:hover {
|
|
@@ -208,7 +208,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../.
|
|
|
208
208
|
background: var(--kd-color-background-menu-state-pressed);
|
|
209
209
|
color: var(--kd-color-text-button-dark-primary);
|
|
210
210
|
}
|
|
211
|
-
.go-back:focus {
|
|
211
|
+
.go-back:focus-visible {
|
|
212
212
|
outline-color: var(--kd-color-border-variants-focus);
|
|
213
213
|
}
|
|
214
214
|
@media (min-width: 42rem) {
|
|
@@ -241,7 +241,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../.
|
|
|
241
241
|
padding-right: 16px;
|
|
242
242
|
}
|
|
243
243
|
}
|
|
244
|
-
.nav-link:focus {
|
|
244
|
+
.nav-link:focus-visible {
|
|
245
245
|
outline-color: var(--kd-color-border-variants-focus);
|
|
246
246
|
background: var(--kd-color-background-menu-state-focused);
|
|
247
247
|
color: var(--kd-color-text-level-primary);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../../vendor/lit-html-29220869.js";import{t as o,n as i,o as n,e as r}from"../../../vendor/lit-446874c7.js";import{i as a,s as
|
|
1
|
+
import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../../vendor/lit-html-29220869.js";import{t as o,n as i,o as n,e as r}from"../../../vendor/lit-446874c7.js";import{i as a,s as l,x as d}from"../../../vendor/lit-element-c6c02f24.js";import{e as s,m as c}from"../../../vendor/@kyndryl-design-system/shidoka-icons-a6eca21f.js";var m=a`*,
|
|
2
2
|
*::before,
|
|
3
3
|
*::after {
|
|
4
4
|
box-sizing: border-box;
|
|
@@ -43,7 +43,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../.
|
|
|
43
43
|
outline: 2px solid transparent;
|
|
44
44
|
outline-offset: -2px;
|
|
45
45
|
}
|
|
46
|
-
.interactive:focus {
|
|
46
|
+
.interactive:focus-visible {
|
|
47
47
|
outline-color: var(--kd-color-border-variants-focus);
|
|
48
48
|
}
|
|
49
49
|
.interactive:hover {
|
|
@@ -208,7 +208,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../.
|
|
|
208
208
|
background: var(--kd-color-background-menu-state-pressed);
|
|
209
209
|
color: var(--kd-color-text-button-dark-primary);
|
|
210
210
|
}
|
|
211
|
-
.go-back:focus {
|
|
211
|
+
.go-back:focus-visible {
|
|
212
212
|
outline-color: var(--kd-color-border-variants-focus);
|
|
213
213
|
}
|
|
214
214
|
@media (min-width: 42rem) {
|
|
@@ -241,7 +241,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../.
|
|
|
241
241
|
.menu__content {
|
|
242
242
|
top: calc(100% + 12px);
|
|
243
243
|
}
|
|
244
|
-
}`;let u=class extends
|
|
244
|
+
}`;let u=class extends l{constructor(){super(...arguments),this.menuOpen=!1,this.slot="left"}render(){const e={"header-nav":!0,menu:!0,open:this.menuOpen};return d`
|
|
245
245
|
<div class=${n(e)}>
|
|
246
246
|
<button
|
|
247
247
|
class="btn interactive"
|
|
@@ -249,7 +249,7 @@ import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../.
|
|
|
249
249
|
title="Toggle Menu"
|
|
250
250
|
@click=${()=>this._toggleMenuOpen()}
|
|
251
251
|
>
|
|
252
|
-
${this.menuOpen?
|
|
252
|
+
${this.menuOpen?d` <span>${t(s)}</span> `:d` <span>${t(c)}</span> `}
|
|
253
253
|
</button>
|
|
254
254
|
|
|
255
255
|
<div class="menu__content left">
|