cloud-ide-element 1.1.116 → 1.1.117

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.
@@ -8186,11 +8186,11 @@ class CideEleThemeToggleComponent {
8186
8186
  }, 300);
8187
8187
  }
8188
8188
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideEleThemeToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
8189
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.7", type: CideEleThemeToggleComponent, isStandalone: true, selector: "cide-ele-theme-toggle", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"cide-theme-toggle-wrapper\" [class.size-small]=\"size() === 'small'\" [class.size-medium]=\"size() === 'medium'\" [class.size-large]=\"size() === 'large'\">\r\n <button\r\n type=\"button\"\r\n class=\"cide-theme-toggle-button\"\r\n [class.is-dark]=\"isDarkMode()\"\r\n [class.is-animating]=\"isAnimating()\"\r\n (click)=\"toggleTheme()\"\r\n [attr.aria-label]=\"isDarkMode() ? 'Switch to light mode' : 'Switch to dark mode'\"\r\n [attr.aria-pressed]=\"isDarkMode()\">\r\n \r\n <!-- Toggle Track -->\r\n <span class=\"cide-theme-toggle-track\" [class]=\"toggleBgColor()\">\r\n <!-- Sun Icon (Light Mode) -->\r\n <span class=\"cide-theme-toggle-icon sun-icon\" [class.hidden]=\"isDarkMode()\">\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"12\" cy=\"12\" r=\"4\" stroke=\"currentColor\" stroke-width=\"2\" fill=\"currentColor\"/>\r\n <path d=\"M12 2V4M12 20V22M4 12H2M22 12H20M19.07 4.93L17.66 6.34M6.34 17.66L4.93 19.07M19.07 19.07L17.66 17.66M6.34 6.34L4.93 4.93\" \r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg>\r\n </span>\r\n \r\n <!-- Moon Icon (Dark Mode) -->\r\n <span class=\"cide-theme-toggle-icon moon-icon\" [class.hidden]=\"!isDarkMode()\">\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z\" \r\n stroke=\"currentColor\" stroke-width=\"2\" fill=\"currentColor\"/>\r\n </svg>\r\n </span>\r\n </span>\r\n \r\n <!-- Toggle Thumb (Slider) -->\r\n <span class=\"cide-theme-toggle-thumb\" [style.transform]=\"togglePosition()\">\r\n </span>\r\n </button>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".cide-theme-toggle-wrapper{display:inline-flex;align-items:center;justify-content:center}.cide-theme-toggle-button{position:relative;padding:0;border:none;background:transparent;cursor:pointer;outline:none;transition:all .3s cubic-bezier(.4,0,.2,1);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.cide-theme-toggle-button:focus-visible{outline:2px solid rgba(59,130,246,.5);outline-offset:2px;border-radius:20px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-button{width:36px;height:22px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-track{border-radius:11px;padding:0 3px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-icon{width:14px;height:14px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-icon svg{width:12px;height:12px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-thumb{top:1.5px;left:1.5px;width:19px;height:19px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-button{width:52px;height:32px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-track{border-radius:16px;padding:0 4px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-icon{width:20px;height:20px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-icon svg{width:16px;height:16px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-thumb{top:2px;left:2px;width:28px;height:28px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-button{width:68px;height:42px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-track{border-radius:21px;padding:0 5px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-icon{width:26px;height:26px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-icon svg{width:20px;height:20px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-thumb{top:3px;left:3px;width:36px;height:36px}.cide-theme-toggle-track{position:absolute;top:0;left:0;width:100%;height:100%;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:space-between;box-shadow:inset 0 2px 4px #0000001a,0 1px 2px #0000000d}.is-dark .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #0003,0 1px 2px #0000001a}.cide-theme-toggle-icon{display:flex;align-items:center;justify-content:center;color:#fff;transition:all .3s cubic-bezier(.4,0,.2,1);opacity:1}.cide-theme-toggle-icon.hidden{opacity:0;width:0;transform:scale(0)}.cide-theme-toggle-icon svg{filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}.cide-theme-toggle-icon.sun-icon{color:#fbbf24}.cide-theme-toggle-icon.moon-icon{color:#e0e7ff}.cide-theme-toggle-thumb{position:absolute;background:#fff;border-radius:50%;box-shadow:0 2px 4px #0003,0 1px 2px #0000001a;transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:1;background:linear-gradient(180deg,#fff,#f9fafb)}.is-dark .cide-theme-toggle-thumb{background:linear-gradient(180deg,#f3f4f6,#e5e7eb);box-shadow:0 2px 4px #0000004d,0 1px 2px #00000026}.is-animating .cide-theme-toggle-thumb{transition:transform .3s cubic-bezier(.4,0,.2,1)}.cide-theme-toggle-button:hover .cide-theme-toggle-thumb{box-shadow:0 3px 6px #00000040,0 2px 4px #00000026}.is-dark .cide-theme-toggle-button:hover .cide-theme-toggle-thumb{box-shadow:0 3px 6px #0006,0 2px 4px #0003}.cide-theme-toggle-button:hover .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #00000026,0 2px 4px #0000001a}.is-dark .cide-theme-toggle-button:hover .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #00000040,0 2px 4px #00000026}.cide-theme-toggle-button:active .cide-theme-toggle-thumb{transform:scale(.95)}.cide-theme-toggle-button:disabled{opacity:.5;cursor:not-allowed}.cide-theme-toggle-button:disabled:hover .cide-theme-toggle-thumb,.cide-theme-toggle-button:disabled:hover .cide-theme-toggle-track{box-shadow:none}@media (prefers-color-scheme: dark){.cide-theme-toggle-thumb{background:linear-gradient(180deg,#f3f4f6,#e5e7eb)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
8189
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.7", type: CideEleThemeToggleComponent, isStandalone: true, selector: "cide-ele-theme-toggle", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"cide-theme-toggle-wrapper\" [class.size-small]=\"size() === 'small'\" [class.size-medium]=\"size() === 'medium'\" [class.size-large]=\"size() === 'large'\">\n <button\n type=\"button\"\n class=\"cide-theme-toggle-button\"\n [class.is-dark]=\"isDarkMode()\"\n [class.is-animating]=\"isAnimating()\"\n (click)=\"toggleTheme()\"\n [attr.aria-label]=\"isDarkMode() ? 'Switch to light mode' : 'Switch to dark mode'\"\n [attr.aria-pressed]=\"isDarkMode()\">\n \n <!-- Toggle Track -->\n <span class=\"cide-theme-toggle-track\" [class]=\"toggleBgColor()\">\n <!-- Sun Icon (Light Mode) -->\n <span class=\"cide-theme-toggle-icon sun-icon\" [class.hidden]=\"isDarkMode()\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"12\" cy=\"12\" r=\"4\" stroke=\"currentColor\" stroke-width=\"2\" fill=\"currentColor\"/>\n <path d=\"M12 2V4M12 20V22M4 12H2M22 12H20M19.07 4.93L17.66 6.34M6.34 17.66L4.93 19.07M19.07 19.07L17.66 17.66M6.34 6.34L4.93 4.93\" \n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\n </svg>\n </span>\n \n <!-- Moon Icon (Dark Mode) -->\n <span class=\"cide-theme-toggle-icon moon-icon\" [class.hidden]=\"!isDarkMode()\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z\" \n stroke=\"currentColor\" stroke-width=\"2\" fill=\"currentColor\"/>\n </svg>\n </span>\n </span>\n \n <!-- Toggle Thumb (Slider) -->\n <span class=\"cide-theme-toggle-thumb\" [style.transform]=\"togglePosition()\">\n </span>\n </button>\n</div>\n\n\n\n", styles: [".cide-theme-toggle-wrapper{display:inline-flex;align-items:center;justify-content:center}.cide-theme-toggle-button{position:relative;padding:0;border:none;background:transparent;cursor:pointer;outline:none;transition:all .3s cubic-bezier(.4,0,.2,1);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.cide-theme-toggle-button:focus-visible{outline:2px solid rgba(59,130,246,.5);outline-offset:2px;border-radius:20px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-button{width:36px;height:22px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-track{border-radius:11px;padding:0 3px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-icon{width:14px;height:14px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-icon svg{width:12px;height:12px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-thumb{top:1.5px;left:1.5px;width:19px;height:19px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-button{width:52px;height:32px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-track{border-radius:16px;padding:0 4px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-icon{width:20px;height:20px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-icon svg{width:16px;height:16px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-thumb{top:2px;left:2px;width:28px;height:28px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-button{width:68px;height:42px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-track{border-radius:21px;padding:0 5px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-icon{width:26px;height:26px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-icon svg{width:20px;height:20px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-thumb{top:3px;left:3px;width:36px;height:36px}.cide-theme-toggle-track{position:absolute;top:0;left:0;width:100%;height:100%;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:space-between;box-shadow:inset 0 2px 4px #0000001a,0 1px 2px #0000000d}.is-dark .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #0003,0 1px 2px #0000001a}.cide-theme-toggle-icon{display:flex;align-items:center;justify-content:center;color:#fff;transition:all .3s cubic-bezier(.4,0,.2,1);opacity:1}.cide-theme-toggle-icon.hidden{opacity:0;width:0;transform:scale(0)}.cide-theme-toggle-icon svg{filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}.cide-theme-toggle-icon.sun-icon{color:#fbbf24}.cide-theme-toggle-icon.moon-icon{color:#e0e7ff}.cide-theme-toggle-thumb{position:absolute;background:#fff;border-radius:50%;box-shadow:0 2px 4px #0003,0 1px 2px #0000001a;transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:1;background:linear-gradient(180deg,#fff,#f9fafb)}.is-dark .cide-theme-toggle-thumb{background:linear-gradient(180deg,#f3f4f6,#e5e7eb);box-shadow:0 2px 4px #0000004d,0 1px 2px #00000026}.is-animating .cide-theme-toggle-thumb{transition:transform .3s cubic-bezier(.4,0,.2,1)}.cide-theme-toggle-button:hover .cide-theme-toggle-thumb{box-shadow:0 3px 6px #00000040,0 2px 4px #00000026}.is-dark .cide-theme-toggle-button:hover .cide-theme-toggle-thumb{box-shadow:0 3px 6px #0006,0 2px 4px #0003}.cide-theme-toggle-button:hover .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #00000026,0 2px 4px #0000001a}.is-dark .cide-theme-toggle-button:hover .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #00000040,0 2px 4px #00000026}.cide-theme-toggle-button:active .cide-theme-toggle-thumb{transform:scale(.95)}.cide-theme-toggle-button:disabled{opacity:.5;cursor:not-allowed}.cide-theme-toggle-button:disabled:hover .cide-theme-toggle-thumb,.cide-theme-toggle-button:disabled:hover .cide-theme-toggle-track{box-shadow:none}@media (prefers-color-scheme: dark){.cide-theme-toggle-thumb{background:linear-gradient(180deg,#f3f4f6,#e5e7eb)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
8190
8190
  }
8191
8191
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideEleThemeToggleComponent, decorators: [{
8192
8192
  type: Component,
8193
- args: [{ selector: 'cide-ele-theme-toggle', standalone: true, imports: [CommonModule], template: "<div class=\"cide-theme-toggle-wrapper\" [class.size-small]=\"size() === 'small'\" [class.size-medium]=\"size() === 'medium'\" [class.size-large]=\"size() === 'large'\">\r\n <button\r\n type=\"button\"\r\n class=\"cide-theme-toggle-button\"\r\n [class.is-dark]=\"isDarkMode()\"\r\n [class.is-animating]=\"isAnimating()\"\r\n (click)=\"toggleTheme()\"\r\n [attr.aria-label]=\"isDarkMode() ? 'Switch to light mode' : 'Switch to dark mode'\"\r\n [attr.aria-pressed]=\"isDarkMode()\">\r\n \r\n <!-- Toggle Track -->\r\n <span class=\"cide-theme-toggle-track\" [class]=\"toggleBgColor()\">\r\n <!-- Sun Icon (Light Mode) -->\r\n <span class=\"cide-theme-toggle-icon sun-icon\" [class.hidden]=\"isDarkMode()\">\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"12\" cy=\"12\" r=\"4\" stroke=\"currentColor\" stroke-width=\"2\" fill=\"currentColor\"/>\r\n <path d=\"M12 2V4M12 20V22M4 12H2M22 12H20M19.07 4.93L17.66 6.34M6.34 17.66L4.93 19.07M19.07 19.07L17.66 17.66M6.34 6.34L4.93 4.93\" \r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg>\r\n </span>\r\n \r\n <!-- Moon Icon (Dark Mode) -->\r\n <span class=\"cide-theme-toggle-icon moon-icon\" [class.hidden]=\"!isDarkMode()\">\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z\" \r\n stroke=\"currentColor\" stroke-width=\"2\" fill=\"currentColor\"/>\r\n </svg>\r\n </span>\r\n </span>\r\n \r\n <!-- Toggle Thumb (Slider) -->\r\n <span class=\"cide-theme-toggle-thumb\" [style.transform]=\"togglePosition()\">\r\n </span>\r\n </button>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".cide-theme-toggle-wrapper{display:inline-flex;align-items:center;justify-content:center}.cide-theme-toggle-button{position:relative;padding:0;border:none;background:transparent;cursor:pointer;outline:none;transition:all .3s cubic-bezier(.4,0,.2,1);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.cide-theme-toggle-button:focus-visible{outline:2px solid rgba(59,130,246,.5);outline-offset:2px;border-radius:20px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-button{width:36px;height:22px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-track{border-radius:11px;padding:0 3px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-icon{width:14px;height:14px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-icon svg{width:12px;height:12px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-thumb{top:1.5px;left:1.5px;width:19px;height:19px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-button{width:52px;height:32px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-track{border-radius:16px;padding:0 4px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-icon{width:20px;height:20px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-icon svg{width:16px;height:16px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-thumb{top:2px;left:2px;width:28px;height:28px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-button{width:68px;height:42px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-track{border-radius:21px;padding:0 5px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-icon{width:26px;height:26px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-icon svg{width:20px;height:20px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-thumb{top:3px;left:3px;width:36px;height:36px}.cide-theme-toggle-track{position:absolute;top:0;left:0;width:100%;height:100%;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:space-between;box-shadow:inset 0 2px 4px #0000001a,0 1px 2px #0000000d}.is-dark .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #0003,0 1px 2px #0000001a}.cide-theme-toggle-icon{display:flex;align-items:center;justify-content:center;color:#fff;transition:all .3s cubic-bezier(.4,0,.2,1);opacity:1}.cide-theme-toggle-icon.hidden{opacity:0;width:0;transform:scale(0)}.cide-theme-toggle-icon svg{filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}.cide-theme-toggle-icon.sun-icon{color:#fbbf24}.cide-theme-toggle-icon.moon-icon{color:#e0e7ff}.cide-theme-toggle-thumb{position:absolute;background:#fff;border-radius:50%;box-shadow:0 2px 4px #0003,0 1px 2px #0000001a;transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:1;background:linear-gradient(180deg,#fff,#f9fafb)}.is-dark .cide-theme-toggle-thumb{background:linear-gradient(180deg,#f3f4f6,#e5e7eb);box-shadow:0 2px 4px #0000004d,0 1px 2px #00000026}.is-animating .cide-theme-toggle-thumb{transition:transform .3s cubic-bezier(.4,0,.2,1)}.cide-theme-toggle-button:hover .cide-theme-toggle-thumb{box-shadow:0 3px 6px #00000040,0 2px 4px #00000026}.is-dark .cide-theme-toggle-button:hover .cide-theme-toggle-thumb{box-shadow:0 3px 6px #0006,0 2px 4px #0003}.cide-theme-toggle-button:hover .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #00000026,0 2px 4px #0000001a}.is-dark .cide-theme-toggle-button:hover .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #00000040,0 2px 4px #00000026}.cide-theme-toggle-button:active .cide-theme-toggle-thumb{transform:scale(.95)}.cide-theme-toggle-button:disabled{opacity:.5;cursor:not-allowed}.cide-theme-toggle-button:disabled:hover .cide-theme-toggle-thumb,.cide-theme-toggle-button:disabled:hover .cide-theme-toggle-track{box-shadow:none}@media (prefers-color-scheme: dark){.cide-theme-toggle-thumb{background:linear-gradient(180deg,#f3f4f6,#e5e7eb)}}\n"] }]
8193
+ args: [{ selector: 'cide-ele-theme-toggle', standalone: true, imports: [CommonModule], template: "<div class=\"cide-theme-toggle-wrapper\" [class.size-small]=\"size() === 'small'\" [class.size-medium]=\"size() === 'medium'\" [class.size-large]=\"size() === 'large'\">\n <button\n type=\"button\"\n class=\"cide-theme-toggle-button\"\n [class.is-dark]=\"isDarkMode()\"\n [class.is-animating]=\"isAnimating()\"\n (click)=\"toggleTheme()\"\n [attr.aria-label]=\"isDarkMode() ? 'Switch to light mode' : 'Switch to dark mode'\"\n [attr.aria-pressed]=\"isDarkMode()\">\n \n <!-- Toggle Track -->\n <span class=\"cide-theme-toggle-track\" [class]=\"toggleBgColor()\">\n <!-- Sun Icon (Light Mode) -->\n <span class=\"cide-theme-toggle-icon sun-icon\" [class.hidden]=\"isDarkMode()\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"12\" cy=\"12\" r=\"4\" stroke=\"currentColor\" stroke-width=\"2\" fill=\"currentColor\"/>\n <path d=\"M12 2V4M12 20V22M4 12H2M22 12H20M19.07 4.93L17.66 6.34M6.34 17.66L4.93 19.07M19.07 19.07L17.66 17.66M6.34 6.34L4.93 4.93\" \n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\n </svg>\n </span>\n \n <!-- Moon Icon (Dark Mode) -->\n <span class=\"cide-theme-toggle-icon moon-icon\" [class.hidden]=\"!isDarkMode()\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z\" \n stroke=\"currentColor\" stroke-width=\"2\" fill=\"currentColor\"/>\n </svg>\n </span>\n </span>\n \n <!-- Toggle Thumb (Slider) -->\n <span class=\"cide-theme-toggle-thumb\" [style.transform]=\"togglePosition()\">\n </span>\n </button>\n</div>\n\n\n\n", styles: [".cide-theme-toggle-wrapper{display:inline-flex;align-items:center;justify-content:center}.cide-theme-toggle-button{position:relative;padding:0;border:none;background:transparent;cursor:pointer;outline:none;transition:all .3s cubic-bezier(.4,0,.2,1);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.cide-theme-toggle-button:focus-visible{outline:2px solid rgba(59,130,246,.5);outline-offset:2px;border-radius:20px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-button{width:36px;height:22px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-track{border-radius:11px;padding:0 3px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-icon{width:14px;height:14px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-icon svg{width:12px;height:12px}.cide-theme-toggle-wrapper.size-small .cide-theme-toggle-thumb{top:1.5px;left:1.5px;width:19px;height:19px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-button{width:52px;height:32px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-track{border-radius:16px;padding:0 4px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-icon{width:20px;height:20px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-icon svg{width:16px;height:16px}.cide-theme-toggle-wrapper.size-medium .cide-theme-toggle-thumb{top:2px;left:2px;width:28px;height:28px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-button{width:68px;height:42px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-track{border-radius:21px;padding:0 5px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-icon{width:26px;height:26px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-icon svg{width:20px;height:20px}.cide-theme-toggle-wrapper.size-large .cide-theme-toggle-thumb{top:3px;left:3px;width:36px;height:36px}.cide-theme-toggle-track{position:absolute;top:0;left:0;width:100%;height:100%;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:space-between;box-shadow:inset 0 2px 4px #0000001a,0 1px 2px #0000000d}.is-dark .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #0003,0 1px 2px #0000001a}.cide-theme-toggle-icon{display:flex;align-items:center;justify-content:center;color:#fff;transition:all .3s cubic-bezier(.4,0,.2,1);opacity:1}.cide-theme-toggle-icon.hidden{opacity:0;width:0;transform:scale(0)}.cide-theme-toggle-icon svg{filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}.cide-theme-toggle-icon.sun-icon{color:#fbbf24}.cide-theme-toggle-icon.moon-icon{color:#e0e7ff}.cide-theme-toggle-thumb{position:absolute;background:#fff;border-radius:50%;box-shadow:0 2px 4px #0003,0 1px 2px #0000001a;transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:1;background:linear-gradient(180deg,#fff,#f9fafb)}.is-dark .cide-theme-toggle-thumb{background:linear-gradient(180deg,#f3f4f6,#e5e7eb);box-shadow:0 2px 4px #0000004d,0 1px 2px #00000026}.is-animating .cide-theme-toggle-thumb{transition:transform .3s cubic-bezier(.4,0,.2,1)}.cide-theme-toggle-button:hover .cide-theme-toggle-thumb{box-shadow:0 3px 6px #00000040,0 2px 4px #00000026}.is-dark .cide-theme-toggle-button:hover .cide-theme-toggle-thumb{box-shadow:0 3px 6px #0006,0 2px 4px #0003}.cide-theme-toggle-button:hover .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #00000026,0 2px 4px #0000001a}.is-dark .cide-theme-toggle-button:hover .cide-theme-toggle-track{box-shadow:inset 0 2px 4px #00000040,0 2px 4px #00000026}.cide-theme-toggle-button:active .cide-theme-toggle-thumb{transform:scale(.95)}.cide-theme-toggle-button:disabled{opacity:.5;cursor:not-allowed}.cide-theme-toggle-button:disabled:hover .cide-theme-toggle-thumb,.cide-theme-toggle-button:disabled:hover .cide-theme-toggle-track{box-shadow:none}@media (prefers-color-scheme: dark){.cide-theme-toggle-thumb{background:linear-gradient(180deg,#f3f4f6,#e5e7eb)}}\n"] }]
8194
8194
  }] });
8195
8195
 
8196
8196
  /**