diff --git a/assets/css/assistant.css b/assets/css/assistant.css index be72c31..6cd2508 100644 --- a/assets/css/assistant.css +++ b/assets/css/assistant.css @@ -370,28 +370,41 @@ .chat-surface-chart-heatmap { display: grid; gap: 2px; - font-size: 10px; + font-size: 11px; } -.chat-surface-chart-heatmap-col-label, -.chat-surface-chart-heatmap-row-label { - display: flex; - align-items: center; - padding: 2px 4px; - color: var(--vscode-descriptionForeground); +.chat-surface-chart-heatmap-corner { + /* empty top-left cell */ } .chat-surface-chart-heatmap-col-label { - justify-content: center; + text-align: center; + opacity: 0.7; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +.chat-surface-chart-heatmap-row-label { + text-align: right; + padding-right: 4px; + opacity: 0.7; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + max-width: 80px; } .chat-surface-chart-heatmap-cell { + aspect-ratio: 1; + min-width: 14px; + min-height: 14px; + border-radius: 2px; display: flex; align-items: center; justify-content: center; - min-height: 24px; - padding: 4px 2px; - border-radius: 2px; + font-size: 10px; + font-weight: 500; font-variant-numeric: tabular-nums; } diff --git a/lib/bds/desktop/shell_live/chat_editor.ex b/lib/bds/desktop/shell_live/chat_editor.ex index 5ccb365..4af2096 100644 --- a/lib/bds/desktop/shell_live/chat_editor.ex +++ b/lib/bds/desktop/shell_live/chat_editor.ex @@ -738,21 +738,7 @@ defmodule BDS.Desktop.ShellLive.ChatEditor do <% "heatmap" -> %> <% heat = BDS.Desktop.ShellLive.ChatEditor.ChartView.heatmap(@surface.series) %> - <%= if heat.rows == [] do %> -
- <%= for series <- @surface.series do %> -
-
- <%= series.label %> - <%= series.value %> -
-
- -
-
- <% end %> -
- <% else %> + <%= if heat.rows != [] do %>
<%= for col <- heat.columns do %> diff --git a/lib/bds/desktop/shell_live/chat_editor/tool_surfaces.ex b/lib/bds/desktop/shell_live/chat_editor/tool_surfaces.ex index 7e3b2fe..941d4d4 100644 --- a/lib/bds/desktop/shell_live/chat_editor/tool_surfaces.ex +++ b/lib/bds/desktop/shell_live/chat_editor/tool_surfaces.ex @@ -104,7 +104,7 @@ defmodule BDS.Desktop.ShellLive.ChatEditor.ToolSurfaces do id: surface_id, type: "chart", title: map_value(arguments, "title"), - chart_type: map_value(arguments, "chart_type", "bar"), + chart_type: map_value(arguments, "chartType") || map_value(arguments, "chart_type", "bar"), series: series, max_value: Enum.max([0 | Enum.map(series, & &1.value)]) } diff --git a/priv/static/assets/app.css b/priv/static/assets/app.css index f6b3fe0..3866b1c 100644 --- a/priv/static/assets/app.css +++ b/priv/static/assets/app.css @@ -1,2 +1,6383 @@ /*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */ -@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-tracking:initial;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--spacing:.25rem;--container-xs:20rem;--container-2xl:42rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--tracking-wide:.025em;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components{.ui-button{min-height:28px;font:inherit;cursor:pointer;-webkit-user-select:none;user-select:none;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;gap:6px;padding:4px 10px;line-height:1.2;display:inline-flex}.ui-button:hover:not(:disabled){background:var(--vscode-button-hoverBackground,#0e639c)}.ui-button:disabled{opacity:.5;cursor:not-allowed}.ui-button-primary{color:var(--vscode-button-foreground,#fff);background:var(--vscode-button-background,var(--vscode-focusBorder))}.ui-button-primary:hover:not(:disabled){background:var(--vscode-button-hoverBackground,#0e639c)}.ui-button-secondary{color:var(--vscode-button-secondaryForeground,var(--vscode-foreground));background:var(--vscode-button-secondaryBackground,#ffffff14);border-color:var(--vscode-button-border,transparent)}.ui-button-secondary:hover:not(:disabled){background:var(--vscode-button-secondaryHoverBackground,#4a4d51)}.ui-button-danger{color:var(--vscode-errorForeground,#f48771);border-color:var(--vscode-errorForeground,#f48771);background:0 0}@supports (color:color-mix(in lab, red, red)){.ui-button-danger{border-color:color-mix(in srgb,var(--vscode-errorForeground,#f48771)45%,transparent)}}.ui-button-danger:hover:not(:disabled){background:var(--vscode-errorForeground,#f48771)}@supports (color:color-mix(in lab, red, red)){.ui-button-danger:hover:not(:disabled){background:color-mix(in srgb,var(--vscode-errorForeground,#f48771)14%,transparent)}}.ui-button-compact{min-height:24px;padding:3px 8px;font-size:12px}.ui-input,.ui-textarea{border:1px solid var(--vscode-input-border,var(--vscode-panel-border));background:var(--vscode-input-background,#ffffff0f);width:100%;color:var(--vscode-input-foreground,var(--vscode-foreground));font:inherit;border-radius:4px;padding:8px 10px}.ui-textarea{resize:vertical;line-height:1.5}.ui-input:focus,.ui-textarea:focus{outline:1px solid var(--vscode-focusBorder,#007fd4);outline-offset:1px}.ui-input-readonly,.ui-input[readonly]{opacity:.7;cursor:not-allowed}.ui-input-disabled,.ui-input:disabled{opacity:.6;cursor:not-allowed}.ui-tab{color:var(--vscode-tab-inactiveForeground,var(--vscode-foreground));background:0 0;border:none}.ui-tab:hover,.ui-tab-active{color:var(--vscode-tab-activeForeground,var(--vscode-foreground))}.ui-badge{text-transform:uppercase;letter-spacing:.04em;border-radius:999px;align-items:center;padding:2px 8px;font-size:11px;font-weight:500;display:inline-flex}.ui-panel-entry{border:1px solid var(--vscode-panel-border);background-color:var(--vscode-sideBar-background);border-radius:4px}.ui-empty-state{color:var(--vscode-descriptionForeground);flex-direction:column;gap:6px;display:flex}.ui-editor-shell{background:var(--vscode-editor-background);flex-direction:column;height:100%;min-height:0;display:flex;overflow:hidden}.ui-editor-header{border-bottom:1px solid var(--vscode-panel-border);background:var(--vscode-tab-activeBackground);justify-content:space-between;align-items:flex-start;gap:12px;min-height:35px;padding:0 12px;display:flex}.ui-editor-tab-current{background:var(--vscode-tab-activeBackground);max-width:100%;color:var(--vscode-tab-activeForeground);border-radius:4px 4px 0 0;align-items:center;gap:6px;padding:6px 12px;display:inline-flex;overflow:hidden}.ui-editor-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;display:flex}.ui-toolbar{align-items:center;gap:12px;min-height:32px;display:flex}.ui-toolbar-group{align-items:center;gap:8px;min-width:0;display:flex}.ui-field-stack{flex-direction:column;gap:6px;min-width:0;display:flex}.ui-field-stack>label,.ui-field-label{color:var(--vscode-descriptionForeground);text-transform:uppercase;letter-spacing:.5px;font-size:11px;font-weight:500}.ui-field-grid-2,.ui-field-grid-3{gap:16px;display:grid}.ui-dropdown-menu{background:var(--vscode-dropdown-background,var(--vscode-sideBar-background));border:1px solid var(--vscode-dropdown-border,var(--vscode-panel-border));border-radius:6px;overflow:hidden;box-shadow:0 8px 24px #00000059}.ui-dropdown-item{width:100%;color:var(--vscode-dropdown-foreground,var(--vscode-foreground));cursor:pointer;text-align:left;background:0 0;border:none;align-items:flex-start;gap:10px;padding:10px 12px;transition:background .1s;display:flex}.ui-dropdown-item:hover:not(:disabled){background:var(--vscode-list-hoverBackground,#2a2d2e)}.ui-dropdown-item:disabled{opacity:.5;cursor:not-allowed}.ui-section-card{border:1px solid var(--vscode-panel-border);background:var(--vscode-editor-background);border-radius:8px}@supports (color:color-mix(in lab, red, red)){.ui-section-card{background:color-mix(in srgb,var(--vscode-editor-background)84%,var(--vscode-input-background))}}.btn-base{min-height:28px;font:inherit;cursor:pointer;-webkit-user-select:none;user-select:none;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;gap:6px;padding:4px 10px;line-height:1.2;display:inline-flex}.btn-theme-primary{color:var(--vscode-button-foreground,#fff);background:var(--vscode-button-background,var(--vscode-focusBorder))}.btn-theme-primary:hover{background:var(--vscode-button-hoverBackground,#0e639c)}.btn-theme-danger{color:var(--vscode-errorForeground,#f48771);border-color:var(--vscode-errorForeground,#f48771);background:0 0}@supports (color:color-mix(in lab, red, red)){.btn-theme-danger{border-color:color-mix(in srgb,var(--vscode-errorForeground,#f48771)45%,transparent)}}.btn-theme-danger:hover{background:var(--vscode-errorForeground,#f48771)}@supports (color:color-mix(in lab, red, red)){.btn-theme-danger:hover{background:color-mix(in srgb,var(--vscode-errorForeground,#f48771)14%,transparent)}}.panel-entry{border:1px solid var(--vscode-panel-border);background-color:var(--vscode-sideBar-background);border-radius:4px}.monaco-host{min-width:0;min-height:0;overflow:hidden}}@layer utilities{.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.static{position:static}.top-full{top:100%}.right-0{right:calc(var(--spacing)*0)}.z-10{z-index:10}.mt-2{margin-top:calc(var(--spacing)*2)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.table{display:table}.h-6{height:calc(var(--spacing)*6)}.h-8{height:calc(var(--spacing)*8)}.h-9{height:calc(var(--spacing)*9)}.h-12{height:calc(var(--spacing)*12)}.h-\[22px\]{height:22px}.h-\[35px\]{height:35px}.h-full{height:100%}.max-h-\[80vh\]{max-height:80vh}.min-h-0{min-height:calc(var(--spacing)*0)}.min-h-\[8rem\]{min-height:8rem}.min-h-\[16rem\]{min-height:16rem}.w-6{width:calc(var(--spacing)*6)}.w-8{width:calc(var(--spacing)*8)}.w-12{width:calc(var(--spacing)*12)}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-\[240px\]{max-width:240px}.max-w-full{max-width:100%}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:calc(var(--spacing)*0)}.min-w-9{min-width:calc(var(--spacing)*9)}.min-w-56{min-width:calc(var(--spacing)*56)}.min-w-72{min-width:calc(var(--spacing)*72)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.resize{resize:both}.resize-y{resize:vertical}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:calc(var(--spacing)*1)}.gap-1\.5{gap:calc(var(--spacing)*1.5)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.border{border-style:var(--tw-border-style);border-width:1px}.p-4{padding:calc(var(--spacing)*4)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-2{padding-block:calc(var(--spacing)*2)}.py-3{padding-block:calc(var(--spacing)*3)}.py-6{padding-block:calc(var(--spacing)*6)}.pt-2{padding-top:calc(var(--spacing)*2)}.pr-2{padding-right:calc(var(--spacing)*2)}.text-left{text-align:left}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.uppercase{text-transform:uppercase}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.invert{--tw-invert:invert(100%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}@media (min-width:48rem){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-\[minmax\(0\,1fr\)_auto\]{grid-template-columns:minmax(0,1fr) auto}.md\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1fr\)_auto\]{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}}@media (min-width:80rem){.xl\:grid-cols-\[minmax\(0\,2fr\)_minmax\(280px\,1fr\)\]{grid-template-columns:minmax(0,2fr) minmax(280px,1fr)}.xl\:grid-cols-\[minmax\(320px\,1fr\)_minmax\(0\,1\.2fr\)\]{grid-template-columns:minmax(320px,1fr) minmax(0,1.2fr)}}}:root{--accent-color:#007acc;--accent-color-transparent:#007acc40;--vscode-editor-background:#1e1e1e;--vscode-editor-foreground:#ccc;--vscode-sideBar-background:#252526;--vscode-activityBar-background:#333;--vscode-activityBar-foreground:#fff;--vscode-panel-background:#1e1e1e;--vscode-titleBar-activeBackground:#252526;--vscode-titleBar-activeForeground:#ccc;--vscode-statusBar-background:#007acc;--vscode-statusBar-foreground:#fff;--vscode-tab-activeBackground:#1e1e1e;--vscode-tab-inactiveBackground:#2d2d2d;--vscode-tab-activeForeground:#fff;--vscode-tab-inactiveForeground:#969696;--vscode-editorGroupHeader-tabsBackground:#252526;--vscode-editorGroupHeader-tabsBorder:#1e1e1e;--vscode-toolbar-hoverBackground:#5a5d5e4f;--vscode-toolbar-activeBackground:#6366674f;--vscode-foreground:#ccc;--vscode-descriptionForeground:#858585;--vscode-panel-border:#80808059;--vscode-sideBar-border:#80808059;--vscode-tab-border:#252526;--vscode-focusBorder:#007fd4;--vscode-input-background:#ffffff0f;--vscode-input-border:#ffffff1f;--vscode-list-hoverBackground:#2a2d2e;--vscode-list-activeSelectionBackground:#094771;--vscode-list-activeSelectionForeground:#fff;--vscode-activityBarBadge-background:#007acc;--vscode-activityBarBadge-foreground:#fff;--vscode-testing-iconPassed:#73c991;--vscode-editorWarning-foreground:#cca700;--vscode-input-foreground:#ccc;--vscode-input-placeholderForeground:#a6a6a6;--vscode-font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;--vscode-font-size:13px;--panel-1:var(--vscode-editor-background);--panel-2:var(--vscode-sideBar-background);--panel-3:var(--vscode-input-background);--ink:var(--vscode-foreground);--line:var(--vscode-panel-border);--accent:var(--vscode-focusBorder);--accent-soft:var(--vscode-list-hoverBackground);--success:var(--vscode-testing-iconPassed);--sidebar-width:280px;--assistant-width:360px;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--vscode-editor-background);width:100%;height:100%;color:var(--vscode-foreground);margin:0}body{-webkit-user-select:none;user-select:none;font-family:var(--vscode-font-family);font-size:var(--vscode-font-size);overflow:hidden}body>[data-phx-session],body>[data-phx-main]{width:100%;height:100%;min-height:0}button{font-family:var(--vscode-font-family);font-size:var(--vscode-font-size);color:var(--vscode-button-foreground);background-color:var(--vscode-button-background);cursor:pointer;border:none;border-radius:2px;padding:6px 14px}button:hover{background-color:var(--vscode-button-hoverBackground)}button:focus{outline:1px solid var(--vscode-focusBorder);outline-offset:2px}button.secondary{background-color:var(--vscode-button-secondaryBackground)}button.secondary:hover{background-color:#4a4d51}button.compact{padding:4px 8px;font-size:12px}button.primary{background-color:var(--vscode-button-background);font-weight:500}button.primary:hover{background-color:var(--vscode-button-hoverBackground)}button.success{background-color:#28a745}button.success:hover{background-color:#218838}button.danger{background-color:#dc3545}button.danger:hover{background-color:#c82333}button:disabled{opacity:.5;cursor:not-allowed}button svg,button svg *{pointer-events:none}.app{background-color:var(--vscode-editor-background);flex-direction:column;width:100%;height:100%;display:flex}.app-main{flex:1;min-height:0;display:flex;overflow:hidden}.app-content{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.window-titlebar{background-color:var(--vscode-editorGroupHeader-tabsBackground);border-bottom:1px solid var(--vscode-editorGroupHeader-tabsBorder);app-region:drag;-webkit-app-region:drag;height:34px;padding-right:calc(10px + var(--bds-titlebar-overlay-right,0px));flex-shrink:0;justify-content:space-between;align-items:center;display:flex;position:relative}.window-titlebar-menu-bar{app-region:no-drag;-webkit-app-region:no-drag;z-index:2;align-items:center;gap:2px;height:100%;margin-left:6px;display:flex}.window-titlebar-menu-group{align-items:center;height:100%;display:flex;position:relative}.window-titlebar-menu-bar.is-hidden{display:none}.window-titlebar.is-mac .window-titlebar-menu-bar{margin-left:max(var(--bds-titlebar-macos-left-inset,78px),calc(6px + var(--bds-titlebar-overlay-left,0px)))}.window-titlebar-menu-button{height:24px;color:var(--vscode-titleBar-activeForeground);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:0 8px;font-size:12px;line-height:1}.window-titlebar-menu-button:hover,.window-titlebar-action-button:hover,.window-titlebar-menu-button.is-active{background-color:var(--vscode-toolbar-hoverBackground)}.window-titlebar-menu-button:focus,.window-titlebar-menu-button:focus-visible,.window-titlebar-action-button:focus,.window-titlebar-action-button:focus-visible{box-shadow:none;outline:none}.window-titlebar-menu-dropdown{background-color:var(--vscode-menu-background,var(--vscode-editorWidget-background));border:1px solid var(--vscode-menu-border,var(--vscode-panel-border));min-width:210px;box-shadow:var(--vscode-widget-shadow,0 8px 24px #0006);app-region:no-drag;-webkit-app-region:no-drag;z-index:10;border-radius:6px;flex-direction:column;gap:2px;padding:6px;display:flex;position:absolute;top:30px;left:0}.window-titlebar-menu-item{color:var(--vscode-menu-foreground,var(--vscode-foreground));text-align:left;cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:space-between;align-items:center;gap:16px;padding:6px 8px;font-size:12px;display:flex}.window-titlebar-menu-item:focus,.window-titlebar-menu-item:focus-visible{box-shadow:none;background-color:var(--vscode-toolbar-hoverBackground);outline:none}.window-titlebar-menu-item:hover,.window-titlebar-menu-item.is-keyboard-active{background-color:var(--vscode-menu-selectionBackground,var(--vscode-toolbar-hoverBackground))}.window-titlebar-menu-item-accelerator{opacity:.8}.window-titlebar-menu-separator{background-color:var(--vscode-menu-separatorBackground,#ffffff14);height:1px;margin:4px 2px}.window-titlebar-drag-region{flex:1;height:100%}.window-titlebar-title{max-width:45%;height:100%;color:var(--vscode-titleBar-activeForeground);white-space:nowrap;text-overflow:ellipsis;-webkit-user-select:none;user-select:none;pointer-events:none;justify-content:center;align-items:center;font-size:12px;font-weight:500;display:flex;position:absolute;left:50%;overflow:hidden;transform:translate(-50%)}.window-titlebar-actions{app-region:no-drag;-webkit-app-region:no-drag;align-items:center;height:100%;margin-right:6px;display:flex}.window-titlebar-action-button{width:30px;height:30px;color:var(--vscode-foreground);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:0;line-height:0;display:flex}.window-titlebar-sidebar-icon,.window-titlebar-panel-icon,.window-titlebar-assistant-icon{border:1.5px solid;border-radius:2px;width:14px;height:14px;display:block;position:relative;overflow:hidden}.window-titlebar-sidebar-icon:before{content:"";background-color:currentColor;width:1.5px;position:absolute;top:0;bottom:0;left:33.3333%;transform:translate(-50%)}.window-titlebar-panel-icon:before{content:"";background-color:currentColor;height:1.5px;position:absolute;top:66.6667%;left:0;right:0;transform:translateY(-50%)}.window-titlebar-assistant-icon:before{content:"";background-color:currentColor;width:1.5px;position:absolute;top:0;bottom:0;left:66.6667%;transform:translate(-50%)}.window-titlebar-sidebar-pane,.window-titlebar-panel-pane,.window-titlebar-assistant-pane{background-color:currentColor;transition:opacity .12s;position:absolute}.window-titlebar-sidebar-pane{width:33.3333%;height:100%;top:0;left:0}.window-titlebar-panel-pane{width:100%;height:33.3333%;bottom:0;left:0}.window-titlebar-assistant-pane{width:33.3333%;height:100%;top:0;right:0}.window-titlebar-sidebar-icon.is-inactive .window-titlebar-sidebar-pane,.window-titlebar-panel-icon.is-inactive .window-titlebar-panel-pane,.window-titlebar-assistant-icon.is-inactive .window-titlebar-assistant-pane{opacity:0}.panel-shell{border-top:1px solid var(--vscode-panel-border);background:var(--vscode-panel-background);flex-direction:column;height:200px;display:flex}.editor-toolbar-button.is-destructive{color:#f48771}.shell-overlay-backdrop,.gallery-overlay-backdrop{pointer-events:auto;z-index:10000;background:#000000ad;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.shell-overlay-dismiss{background:0 0;border:none;padding:0;position:absolute;inset:0}.gallery-overlay{z-index:1;background:#1e1e1e;border:1px solid #3c3c3c;border-radius:8px;flex-direction:column;width:min(980px,100vw - 48px);max-height:calc(100vh - 48px);display:flex;position:relative;overflow:hidden;box-shadow:0 8px 32px #0006}.insert-modal-media-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;padding:16px;display:grid}.insert-modal-media-item{color:inherit;text-align:left;background:#252526;border:1px solid #3c3c3c;border-radius:8px;flex-direction:column;gap:8px;padding:10px;display:flex}.insert-modal-media-thumb{object-fit:cover;background:#ffffff0a;border-radius:6px;width:100%;min-height:112px}.insert-modal-media-title{color:#fff;font-weight:600}.language-picker-options{flex-direction:column;gap:8px;display:flex}.language-picker-option{width:100%;color:inherit;text-align:left;background:0 0;border:none;border-radius:4px;grid-template-columns:28px 1fr auto;align-items:center;gap:12px;padding:12px 16px;display:grid}.language-picker-label,.language-picker-status,.lightbox-counter{color:#9d9d9d;font-size:12px}.lightbox-counter{margin-top:4px}@media (max-width:720px){.insert-modal-media-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.panel-header{background-color:var(--vscode-sideBar-background);border-bottom:1px solid var(--vscode-panel-border);justify-content:space-between;align-items:center;height:35px;padding:0 8px;display:flex}.panel-tabs{align-items:stretch;height:100%;display:flex}.panel-tab{color:var(--vscode-descriptionForeground);cursor:pointer;background:0 0;border:none;padding:0 12px}.panel-tab.active{color:var(--vscode-tab-activeForeground)}.panel-close{color:var(--vscode-descriptionForeground);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;width:24px;height:24px;padding:0;font-size:18px;display:flex}.panel-close:hover{background-color:var(--vscode-list-hoverBackground);color:var(--vscode-editor-foreground)}.panel-content{flex:1;padding:12px 14px;overflow:auto}.panel-entry,.assistant-card{border-bottom:1px solid var(--vscode-panel-border);flex-direction:column;gap:4px;padding:10px 12px;display:flex}.output-list,.git-log-list,.task-list{flex-direction:column;display:flex}.task-entry-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.task-status{text-transform:uppercase;letter-spacing:.04em;color:var(--vscode-descriptionForeground);font-size:11px}.task-status-running{color:var(--vscode-terminal-ansiGreen,var(--vscode-statusBar-foreground))}.task-status-pending{color:var(--vscode-terminal-ansiYellow,var(--vscode-statusBar-foreground))}.panel-empty-state{justify-content:center;min-height:100%}.status-bar{background:var(--vscode-statusBar-background);height:22px;color:var(--vscode-statusBar-foreground);flex-shrink:0;justify-content:space-between;align-items:center;padding:0 8px;font-size:12px;display:flex}.status-bar-left,.status-bar-right{flex-shrink:0;align-items:center;gap:4px;display:flex}.status-bar-left{flex-shrink:1;min-width:0}.status-shell-controls{flex-shrink:0;align-items:stretch;gap:2px;display:flex}.status-shell-toggle-button{width:22px;height:100%;color:inherit;cursor:pointer;background:0 0;border:none;border-radius:3px;justify-content:center;align-items:center;padding:0;line-height:0;display:flex}.status-shell-toggle-button:hover{background-color:#ffffff1a}.status-shell-toggle-button:focus,.status-shell-toggle-button:focus-visible{outline:none;box-shadow:inset 0 0 0 1px #ffffff73}.status-shell-toggle-button .window-titlebar-sidebar-icon,.status-shell-toggle-button .window-titlebar-panel-icon,.status-shell-toggle-button .window-titlebar-assistant-icon{width:12px;height:12px}.status-bar-item{white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:6px;height:100%;padding:0 8px;display:flex;overflow:hidden}.status-bar-item:hover{background-color:#ffffff1a}.status-bar-task-button{color:inherit;cursor:pointer;background:0 0;border:none}.task-message-text{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.status-bar-item.theme-badge{border:1px solid #ffffff2e;border-radius:3px}.status-bar-item.language-badge{border:1px solid #ffffff2e;border-radius:3px;gap:4px}.status-bar-item.offline-badge{color:inherit;cursor:pointer;opacity:.4;background:0 0;border:none;padding:0 4px;font-size:13px}.status-bar-item.offline-badge.active{opacity:1;background-color:#ffc40047}.project-selector{flex-shrink:0;position:relative}.project-selector-trigger{height:22px;color:var(--vscode-statusBar-foreground);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:6px;padding:0 8px;font-size:12px;display:flex}.project-selector-trigger:hover{background-color:#ffffff1a}.project-selector-trigger:focus{outline:none}.project-icon,.dropdown-arrow,.project-check-icon{flex-shrink:0}.project-name,.project-item-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.project-name{max-width:180px}.dropdown-arrow{opacity:.6}.project-dropdown{z-index:1000;background-color:#252526;border:1px solid #ffffff29;border-radius:4px;min-width:220px;margin-bottom:4px;position:absolute;bottom:100%;left:0;overflow:hidden;box-shadow:0 -4px 12px #0000004d}.project-dropdown-header{text-transform:uppercase;letter-spacing:.5px;color:var(--vscode-descriptionForeground);border-bottom:1px solid #ffffff1f;padding:8px 12px;font-size:11px;font-weight:600}.project-list{max-height:200px;overflow-y:auto}.project-item{width:100%;color:inherit;cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;padding:8px 12px;display:flex}.project-item:hover,.project-item.active{background-color:var(--vscode-list-hoverBackground)}.project-item.active .project-check-icon{color:#89d185}.project-dropdown-footer{border-top:1px solid #ffffff1f;gap:6px;padding:8px;display:grid}.create-project-btn,.existing-project-btn{width:100%;color:inherit;cursor:pointer;background-color:#ffffff1f;border:none;border-radius:4px;justify-content:center;align-items:center;gap:6px;padding:6px 12px;font-size:12px;display:flex}.create-project-btn:hover,.existing-project-btn:hover{background-color:#ffffff2e}.status-bar-language-select{color:inherit;font:inherit;background:0 0;border:none;padding:0}.status-bar-language-select:focus{outline:none}.status-bar-count{opacity:.85;font-size:11px}.status-bar-item.brand{font-weight:600}@media (max-width:960px){.editor-frame{grid-template-columns:minmax(0,1fr)}.editor-meta{border-left:none;border-top:1px solid var(--vscode-panel-border);padding-top:10px;padding-left:0}}.editor-section ul{margin:12px 0 0;padding-left:18px}.editor-toolbar{gap:10px;display:flex}.editor-toolbar button{border:1px solid var(--line);background:var(--panel-3);color:var(--ink);border-radius:999px;padding:9px 14px}.editor-meta{flex-direction:column;gap:12px;display:flex}.editor-meta-card,.assistant-card,.panel-entry{padding:16px}.sidebar-header,.assistant-header,.panel-header{border-bottom:1px solid var(--line);justify-content:space-between;gap:12px;padding:16px 18px;display:flex}.activity-bar{background-color:var(--vscode-activityBar-background);border-right:1px solid var(--vscode-panel-border);flex-direction:column;justify-content:space-between;width:48px;height:100%;display:flex}.activity-bar-top,.activity-bar-bottom{flex-direction:column;align-items:center;padding:4px 0;display:flex}.activity-bar-item{width:48px;height:48px;color:var(--vscode-activityBar-foreground);opacity:.6;cursor:pointer;background:0 0;border:none;border-radius:0;justify-content:center;align-items:center;padding:0;display:flex;position:relative}.activity-bar-item:hover{opacity:1;background:0 0}.activity-bar-item.active{opacity:1}.activity-bar-item.active:before{content:"";background-color:var(--vscode-activityBar-foreground);width:2px;position:absolute;top:0;bottom:0;left:0}.activity-bar-badge{background-color:var(--vscode-activityBarBadge-background);min-width:16px;height:16px;color:var(--vscode-activityBarBadge-foreground);border-radius:8px;justify-content:center;align-items:center;padding:0 4px;font-size:10px;font-weight:600;display:flex;position:absolute;top:8px;right:8px}.activity-bar-item svg,.tab-icon svg{display:block}.sidebar-shell,.assistant-sidebar-shell{min-width:0;display:flex}.sidebar-shell{width:var(--sidebar-width)}.assistant-sidebar-shell{width:var(--assistant-width)}.sidebar,.assistant-sidebar{background:var(--vscode-sideBar-background);flex-direction:column;width:100%;min-width:0;height:100%;display:flex}.sidebar{border-right:1px solid var(--vscode-sideBar-border)}.assistant-sidebar{border-left:1px solid var(--vscode-sideBar-border)}.sidebar-shell.is-hidden,.assistant-sidebar-shell.is-hidden{width:0;overflow:hidden}.sidebar-shell.is-hidden .resizable-panel-divider,.assistant-sidebar-shell.is-hidden .resizable-panel-divider{display:none}.resizable-panel-divider{cursor:col-resize;background:0 0;width:4px;position:relative}.resizable-panel-divider:hover:after{background-color:var(--vscode-focusBorder)}.resizable-panel-divider:after{content:"";background-color:var(--vscode-panel-border);width:1px;position:absolute;top:0;bottom:0;left:1px}.assistant-header{border-bottom:1px solid var(--vscode-panel-border);flex-direction:column;gap:2px;padding:10px 12px;display:flex}.assistant-card span,.panel-entry span,.editor-meta-row span,.editor-subtitle,.sidebar-item span{color:var(--vscode-descriptionForeground)}.sidebar-content,.assistant-content{flex:1;padding:8px 0;overflow:auto}.sidebar-section{padding-bottom:10px}.sidebar-section-header{text-transform:uppercase;letter-spacing:.04em;color:var(--vscode-descriptionForeground);padding:0 12px 6px;font-size:11px}.sidebar-item{cursor:pointer;background:var(--vscode-sideBar-background);width:100%;color:var(--vscode-foreground);border:none;border-radius:4px;flex-direction:column;align-items:flex-start;gap:2px;padding:7px 12px;display:flex}.sidebar-item:hover{background:var(--vscode-list-hoverBackground)}.sidebar-item.selected{outline:1px solid var(--vscode-focusBorder);background:var(--vscode-list-activeSelectionBackground);color:var(--vscode-list-activeSelectionForeground)}.sidebar-badge{color:var(--vscode-testing-iconPassed);background:#6ecb8b29;border-radius:10px;margin-top:2px;padding:1px 6px}.sidebar-content{padding:0;overflow:hidden auto}.sidebar-section{margin-bottom:4px;padding-bottom:0}.sidebar-section-header{text-transform:uppercase;letter-spacing:.5px;color:var(--vscode-sideBar-foreground);justify-content:space-between;align-items:center;padding:8px 12px;font-size:11px;font-weight:600;display:flex}.sidebar-section-title{color:var(--vscode-descriptionForeground);align-items:center;gap:6px;padding:4px 12px;font-size:12px;display:flex}.section-icon{font-size:8px}.section-icon.status-draft{color:var(--vscode-editorWarning-foreground)}.section-icon.status-published{color:var(--vscode-testing-iconPassed)}.section-icon.status-archived{color:var(--vscode-descriptionForeground)}.sidebar-list{flex-direction:column;display:flex}.sidebar-item-row{align-items:stretch;display:flex}.sidebar-item{width:100%;color:inherit;cursor:pointer;text-align:left;background:0 0;border:none;border-left:2px solid #0000;border-radius:0;align-items:flex-start;gap:8px;padding:6px 12px;display:flex}.sidebar-item:hover{background-color:var(--vscode-list-hoverBackground)}.sidebar-item.selected{background-color:var(--vscode-list-activeSelectionBackground);border-left-color:var(--vscode-focusBorder);color:var(--vscode-list-activeSelectionForeground)}.sidebar-post-item{flex-direction:row}.sidebar-item.post-type-picture{background:linear-gradient(90deg,#8b5cf60d 0%,#0000 100%)}.sidebar-item.post-type-aside{background:linear-gradient(90deg,#f59e0b0d 0%,#0000 100%)}.sidebar-item.post-type-quote{background:linear-gradient(90deg,#22c55e0d 0%,#0000 100%)}.sidebar-item.post-type-link{background:linear-gradient(90deg,#3b82f60d 0%,#0000 100%)}.sidebar-item.post-type-video{background:linear-gradient(90deg,#ef44440d 0%,#0000 100%)}.post-type-icon{opacity:.85;flex-shrink:0;font-size:14px;line-height:1.4}.sidebar-item-content{flex-direction:column;flex:1;min-width:0;display:flex}.sidebar-item-title-row{align-items:center;gap:6px;display:flex}.sidebar-item-title{color:var(--vscode-sideBar-foreground);white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.sidebar-item-language-badge{background:var(--vscode-badge-background);border-radius:999px;flex-shrink:0;min-width:18px;padding:1px 5px}@supports (color:color-mix(in lab, red, red)){.sidebar-item-language-badge{background:color-mix(in srgb,var(--vscode-badge-background)82%,transparent)}}.sidebar-item-language-badge{color:var(--vscode-badge-foreground);text-align:center;font-size:10px;font-weight:700}.sidebar-item-meta{color:var(--vscode-descriptionForeground);margin-top:2px;font-size:11px}.media-grid{grid-template-columns:1fr;gap:2px;padding:4px;display:grid}.media-item-row{align-items:stretch;gap:4px;display:flex}.media-item{width:100%;color:inherit;text-align:left;background:0 0;border:none;border-radius:4px;align-items:center;gap:8px;padding:6px 8px;display:flex}.media-item:hover{background-color:var(--vscode-list-hoverBackground)}.media-item.selected{background-color:var(--vscode-list-activeSelectionBackground);color:var(--vscode-list-activeSelectionForeground)}.media-thumbnail{background-color:var(--vscode-input-background);border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:20px;display:flex;overflow:hidden}.media-thumbnail.has-image{position:relative}.media-thumbnail-fallback{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.media-thumbnail-image{object-fit:cover;opacity:0;width:100%;height:100%;transition:opacity .15s;position:absolute;inset:0}.media-thumbnail.is-loaded .media-thumbnail-image{opacity:1}.media-thumbnail.is-loaded .media-thumbnail-fallback{opacity:0}.media-item-info{flex:1;min-width:0}.media-item-name{color:var(--vscode-sideBar-foreground);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.sidebar-item-row .sidebar-item,.media-item-row .media-item{flex:1;min-width:0}.sidebar-actions{gap:4px;display:flex}.sidebar-action{color:var(--vscode-sideBar-foreground);cursor:pointer;opacity:.7;background:0 0;border:none;border-radius:3px;justify-content:center;align-items:center;padding:2px;display:flex}.sidebar-action:hover{opacity:1;background-color:var(--vscode-list-hoverBackground)}.sidebar-action.active{background-color:var(--vscode-list-activeSelectionBackground);opacity:1}.search-box{align-items:center;gap:4px;padding:4px 12px 8px;display:flex;position:relative}.search-box input{background-color:var(--vscode-input-background);border:1px solid var(--vscode-input-border);min-width:0;color:var(--vscode-input-foreground);border-radius:3px;flex:1;padding:6px 28px 6px 8px;font-size:12px}.search-box input::placeholder{color:var(--vscode-input-placeholderForeground)}.search-box input:focus{border-color:var(--vscode-focusBorder);outline:none}.search-box button[type=submit]{color:var(--vscode-descriptionForeground);cursor:pointer;opacity:.7;background:0 0;border:none;padding:4px;position:absolute;right:40px}.search-box button[type=submit]:hover{opacity:1}.search-box .clear-search{color:var(--vscode-descriptionForeground);cursor:pointer;opacity:.7;background:0 0;border:none;padding:4px;font-size:10px;position:absolute;right:16px}.search-box .clear-search:hover{opacity:1}.calendar-view{border-bottom:1px solid var(--vscode-sideBar-border);padding:8px 12px}.calendar-header{text-transform:uppercase;letter-spacing:.5px;color:var(--vscode-descriptionForeground);justify-content:space-between;align-items:center;margin-bottom:8px;font-size:11px;font-weight:600;display:flex}.calendar-header.collapsible-header{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:3px;margin:0 -6px 8px;padding:4px 6px}.calendar-header.collapsible-header:hover{background-color:var(--vscode-list-hoverBackground)}.calendar-header.collapsible-header.collapsed{margin-bottom:0}.calendar-header .collapse-icon{opacity:.7;margin-right:4px;font-size:9px}.calendar-header .clear-filter{color:var(--vscode-descriptionForeground);cursor:pointer;opacity:.7;background:0 0;border:none;padding:2px 4px;font-size:10px}.calendar-header .clear-filter:hover{opacity:1}.calendar-years{flex-direction:column;gap:2px;display:flex}.calendar-year-header{cursor:pointer;color:var(--vscode-sideBar-foreground);text-align:left;background:0 0;border-radius:3px;align-items:center;gap:6px;padding:4px 6px;font-size:12px;display:flex}.calendar-year-header:hover{background-color:var(--vscode-list-hoverBackground)}.calendar-year-header.selected{background-color:var(--vscode-list-activeSelectionBackground)}.calendar-year-header .expand-icon{color:var(--vscode-descriptionForeground);width:10px;font-size:8px}.calendar-year-header .year-label{flex:1}.calendar-year-header .year-count{color:var(--vscode-descriptionForeground);background-color:var(--vscode-badge-background);border-radius:8px;padding:1px 6px;font-size:10px}.calendar-months{flex-direction:column;gap:1px;margin-top:2px;padding-left:16px;display:flex}.calendar-month{cursor:pointer;color:var(--vscode-sideBar-foreground);text-align:left;background:0 0;border-radius:3px;justify-content:space-between;align-items:center;padding:3px 6px;font-size:12px;display:flex}.calendar-month:hover{background-color:var(--vscode-list-hoverBackground)}.calendar-month.selected{background-color:var(--vscode-list-activeSelectionBackground)}.calendar-month .month-count{color:var(--vscode-descriptionForeground);font-size:10px}.calendar-empty{color:var(--vscode-descriptionForeground);text-align:center;padding:8px;font-size:12px}.month-count,.sidebar-section-count{color:var(--vscode-descriptionForeground);font-size:10px}.filter-panel{border-bottom:1px solid var(--vscode-sideBar-border);padding:8px 12px}.filter-section{margin-bottom:12px}.filter-section:last-child{margin-bottom:0}.filter-header{text-transform:uppercase;letter-spacing:.5px;color:var(--vscode-descriptionForeground);align-items:center;margin-bottom:6px;font-size:11px;font-weight:600;display:flex}.filter-header.collapsible-header{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:3px;margin:0 -6px 6px;padding:4px 6px}.filter-header.collapsible-header:hover{background-color:var(--vscode-list-hoverBackground)}.filter-header.collapsible-header.collapsed{margin-bottom:0}.filter-header .collapse-icon{opacity:.7;margin-right:4px;font-size:9px}.filter-header .clear-filter{color:var(--vscode-descriptionForeground);cursor:pointer;opacity:.7;background:0 0;border:none;margin-left:auto;padding:2px 4px;font-size:10px}.filter-header .clear-filter:hover{opacity:1}.filter-chips{flex-wrap:wrap;gap:4px;display:flex}.filter-chip{background-color:var(--vscode-button-secondaryBackground);color:var(--vscode-button-secondaryForeground);cursor:pointer;border:none;border-radius:12px;padding:2px 8px;font-size:11px;transition:background-color .15s,opacity .15s}.filter-chip:hover{background-color:var(--vscode-button-secondaryHoverBackground)}.filter-chip.active{background-color:var(--vscode-button-background);color:var(--vscode-button-foreground)}.filter-chip.has-color{border:1px solid #0000}.filter-chip.has-color:hover{opacity:.85}.filter-chip.has-color.active{box-shadow:0 0 0 2px var(--vscode-focusBorder,#007fd4)}.filter-status{color:var(--vscode-descriptionForeground);background-color:var(--vscode-list-hoverBackground);border-bottom:1px solid var(--vscode-sideBar-border);justify-content:space-between;align-items:center;padding:6px 12px;font-size:11px;display:flex}.filter-status button{color:var(--accent-color);cursor:pointer;background:0 0;border:none;padding:0;font-size:11px}.filter-status button:hover{background:0 0;text-decoration:underline}.sidebar-load-more{justify-content:center;padding:12px 16px;display:flex}.load-more-button{background-color:var(--vscode-button-secondaryBackground);width:100%;color:var(--vscode-button-secondaryForeground);cursor:pointer;border:none;border-radius:4px;padding:8px 16px;font-size:12px;transition:background-color .2s}.load-more-button:hover:not(:disabled){background-color:var(--vscode-button-secondaryHoverBackground)}.filter-section{padding-top:4px}.filter-header{width:100%;color:var(--vscode-foreground);text-align:left;background:0 0;padding:6px 0}.filter-chips{flex-flow:wrap}.filter-chip{background:var(--vscode-input-background);color:var(--vscode-foreground);border-radius:999px;padding:5px 10px}.filter-status{color:var(--vscode-descriptionForeground);justify-content:space-between;align-items:center;gap:12px;font-size:12px;display:flex}.filter-status button,.load-more-button{background:var(--vscode-input-background);color:var(--vscode-foreground);border-radius:6px;padding:6px 10px}.sidebar-load-more{padding-bottom:12px}.load-more-button{width:100%}.media-item-info{flex-direction:column;gap:2px;display:flex}.media-item-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.media-item-size{color:var(--vscode-descriptionForeground);font-size:12px}.chat-list-item{border:none;border-bottom:1px solid var(--vscode-sideBar-border);width:100%;color:inherit;text-align:left;background:0 0;align-items:center;padding:8px 12px;display:flex}.chat-list-item:hover{background:var(--vscode-list-hoverBackground)}.chat-list-item.active{background:var(--vscode-list-activeSelectionBackground);color:var(--vscode-list-activeSelectionForeground)}.chat-item-content{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.chat-item-open{min-width:0;color:inherit;text-align:left;background:0 0;border:none;flex:1;padding:0;display:flex}.chat-item-open:hover{background:0 0}.chat-item-open:focus-visible{outline:1px solid var(--vscode-focusBorder);outline-offset:2px}.chat-item-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.chat-item-date{color:var(--vscode-descriptionForeground);font-size:12px}.sidebar-delete-button{color:var(--vscode-descriptionForeground);cursor:pointer;opacity:1;background:0 0;border:none;flex-shrink:0;padding:0 6px;font-size:16px;line-height:1;transition:opacity .15s,color .15s}.sidebar-item-row:hover .sidebar-delete-button,.sidebar-item-row .sidebar-item.selected~.sidebar-delete-button,.media-item-row:hover .sidebar-delete-button,.media-item-row .media-item.selected~.sidebar-delete-button,.chat-list-item:hover .sidebar-delete-button,.chat-list-item.active .sidebar-delete-button{opacity:1}.sidebar-delete-button:hover{color:var(--vscode-errorForeground)}.sidebar-item-row .sidebar-item.selected~.sidebar-delete-button,.media-item-row .media-item.selected~.sidebar-delete-button{background-color:var(--vscode-list-activeSelectionBackground);color:var(--vscode-list-activeSelectionForeground)}.settings-nav-list{flex-direction:column;gap:6px;padding:0 12px 12px;display:flex}.settings-nav-entry{width:100%;color:inherit;text-align:left;background:0 0;border:none;border-radius:10px;align-items:center;gap:10px;padding:10px 12px;display:flex}.settings-nav-entry:hover{background:var(--vscode-list-hoverBackground)}.settings-nav-entry-icon{text-align:center;flex:0 0 18px;width:18px}.sidebar-empty{color:var(--vscode-descriptionForeground);padding:16px 12px}@media (max-width:820px){.dashboard-stats{grid-template-columns:1fr}.recent-post-item{flex-wrap:wrap;align-items:flex-start}.media-grid{grid-template-columns:1fr}}.tab-bar{background-color:var(--vscode-editorGroupHeader-tabsBackground);border-bottom:1px solid var(--vscode-editorGroupHeader-tabsBorder);flex-shrink:0;align-items:center;height:35px;display:flex;position:relative;overflow:hidden}.tab-bar-tabs{flex:1;align-items:center;height:100%;display:flex;overflow:auto hidden}.tab-bar-tabs::-webkit-scrollbar{height:0;display:none}.tab-bar-empty{height:100%;color:var(--vscode-descriptionForeground);align-items:center;padding:0 12px;font-size:12px;display:flex}.tab{cursor:pointer;background-color:var(--vscode-tab-inactiveBackground);border:none;border-right:1px solid var(--vscode-tab-border);min-width:100px;max-width:180px;height:100%;color:var(--vscode-tab-inactiveForeground);-webkit-user-select:none;user-select:none;flex-shrink:0;align-items:center;gap:4px;padding:0 6px 0 10px;font-size:13px;display:flex;position:relative}.tab-select{min-width:0;height:100%;color:inherit;font:inherit;cursor:inherit;background:0 0;border:none;flex:1;align-items:center;gap:4px;padding:0;display:flex}.tab:hover{background-color:var(--vscode-list-hoverBackground)}.tab.active{background-color:var(--vscode-tab-activeBackground);color:var(--vscode-tab-activeForeground)}.tab.active:after{content:"";background-color:var(--vscode-focusBorder);height:1px;position:absolute;top:0;left:0;right:0}.tab.transient .tab-title{font-style:italic}.tab-actions{flex-shrink:0;align-items:center;gap:2px;margin-left:auto;display:flex}.tab-dirty-indicator{color:var(--vscode-editorWarning-foreground,#e2c08d);font-size:10px;line-height:1}.tab-icon{opacity:.85;flex-shrink:0;justify-content:center;align-items:center;display:flex}.tab-title,.status-bar-item{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.tab-close{width:20px;height:20px;color:var(--vscode-icon-foreground,#c5c5c5);cursor:pointer;opacity:0;background:0 0;border:none;border-radius:3px;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-size:15px;line-height:1;display:flex}.tab:hover .tab-close,.tab.active .tab-close{opacity:.7}.tab-close:hover{background-color:var(--vscode-toolbar-hoverBackground);color:var(--vscode-tab-activeForeground);opacity:1!important}.tab-close:active{background-color:var(--vscode-toolbar-activeBackground,#6366674f)}.tab.dirty .tab-dirty-indicator{display:block}.tab.dirty .tab-close{display:none}.tab.dirty:hover .tab-close{opacity:.7;display:flex}.tab.dirty:hover .tab-dirty-indicator{display:none}.tab:focus-visible{outline:1px solid var(--vscode-focusBorder,#007fd4);outline-offset:-1px}.output-item-details{color:inherit;white-space:pre-wrap;-webkit-user-select:text;user-select:text;background:#ffffff08;border-radius:4px;margin:4px 0 0;padding:8px;font:11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace}.editor-shell{background:var(--vscode-editor-background);flex:1;min-height:0;overflow:auto}.editor-frame{grid-template-columns:minmax(0,1fr) 240px;gap:16px;padding:14px 16px;display:grid}.editor-main,.editor-meta,.panel-shell,.assistant-card{min-width:0}.editor-kicker{text-transform:uppercase;letter-spacing:.04em;color:var(--vscode-descriptionForeground);font-size:11px}.editor-title{margin:10px 0 6px;font-size:24px;font-weight:600}.editor-subtitle{margin:0 0 14px}.editor-toolbar{gap:8px;margin-bottom:14px;display:flex}.editor-toolbar-button{border:1px solid var(--vscode-panel-border);color:var(--vscode-foreground);background:0 0;border-radius:3px;padding:4px 8px}.editor-toolbar-button:hover,.panel-tab:hover{background:var(--vscode-toolbar-hoverBackground)}.editor-section{padding-top:4px}.editor-section h2{margin:0 0 8px;font-size:16px}.editor-list{margin:0;padding-left:18px;line-height:1.5}.editor-list.compact li{margin-bottom:6px}.editor-meta{border-left:1px solid var(--vscode-panel-border);padding-left:16px}.editor-meta-row{border-bottom:1px solid var(--vscode-panel-border);flex-direction:column;gap:3px;padding:10px 0;display:flex}.post-editor .post-editor-markdown-surface,.scripts-monaco.monaco-editor-shell,.templates-monaco.monaco-editor-shell{background:var(--vscode-editor-background);min-height:0;color:var(--vscode-editor-foreground);border-color:var(--vscode-panel-border)}.post-editor .monaco-editor-instance,.scripts-monaco .monaco-editor-instance,.templates-monaco .monaco-editor-instance{background:var(--vscode-editor-background);min-height:0}.monaco-editor-shell .monaco-editor,.monaco-editor-shell .monaco-editor .margin,.monaco-editor-shell .monaco-editor-background,.monaco-editor-shell .monaco-editor .inputarea.ime-input{background-color:var(--vscode-editor-background)!important}.monaco-editor-shell .monaco-editor,.monaco-editor-shell .monaco-editor .view-line{color:var(--vscode-editor-foreground)!important}.monaco-editor-shell .monaco-editor .line-numbers{color:var(--vscode-editorLineNumber-foreground,#858585)!important}.monaco-editor-shell .monaco-editor .current-line,.monaco-editor-shell .monaco-editor .view-overlays .current-line{border-color:var(--vscode-editor-lineHighlightBorder,transparent)!important}.help-doc-view{--doc-bg:var(--panel-1,#1e1e1e);--doc-surface:var(--panel-2,#252526);--doc-border:var(--line,#3c3c3c);--doc-text:var(--vscode-editor-foreground,#d4d4d4);--doc-muted:var(--vscode-descriptionForeground,#9da3ad);--doc-link:var(--vscode-textLink-foreground,#9cdcfe);--doc-code-bg:var(--vscode-textCodeBlock-background,#0003);--doc-hover:var(--vscode-list-hoverBackground,#ffffff0f)}.help-doc-view .misc-editor-content{padding:0;overflow:hidden}.documentation-view,.documentation-scroll{background:var(--doc-bg,var(--vscode-editor-background))}.documentation-view{flex-direction:column;height:100%;min-height:0;display:flex}.documentation-scroll{flex:1;min-height:0;padding:28px 24px 40px;overflow:auto}.documentation-content{max-width:920px;color:var(--doc-text,var(--vscode-editor-foreground));margin:0 auto}.documentation-article,.help-doc-markdown{background:var(--doc-surface);border:1px solid var(--doc-border);border-radius:10px;padding:18px 20px 24px;box-shadow:0 10px 24px #0000002e}.documentation-content.markdown-body>.documentation-article>:first-child{margin-top:0}.documentation-content.markdown-body>.documentation-article>:last-child{margin-bottom:0}.documentation-content.markdown-body h1,.documentation-content.markdown-body h2,.documentation-content.markdown-body h3{color:var(--doc-text);border-bottom:1px solid var(--doc-border);padding-bottom:6px;line-height:1.25}.documentation-content.markdown-body h1{font-size:1.9rem}.documentation-content.markdown-body h2{margin-top:2rem;font-size:1.35rem}.documentation-content.markdown-body h3{margin-top:1.6rem;font-size:1.05rem}.documentation-content.markdown-body p,.documentation-content.markdown-body li,.documentation-content.markdown-body td,.documentation-content.markdown-body th{line-height:1.6}.documentation-content.markdown-body a{color:var(--doc-link);text-underline-offset:.14em;text-decoration-thickness:1px}.documentation-content.markdown-body a:hover{color:var(--doc-text)}.documentation-content.markdown-body hr{border:0;border-top:1px solid var(--doc-border);opacity:.8}.documentation-content.markdown-body code{background:var(--doc-code-bg);border-radius:4px;padding:.12em .4em;font:.92em/1.45 SFMono-Regular,Menlo,Monaco,Consolas,monospace}.documentation-content.markdown-body pre{background:var(--doc-code-bg);border:1px solid var(--doc-border);border-radius:8px;margin:.9rem 0 1.2rem;padding:14px 16px;overflow:auto}.documentation-content.markdown-body pre code{background:0 0;padding:0;font-size:.9em}.documentation-content.markdown-body blockquote{border-left:3px solid var(--doc-border);color:var(--doc-muted);margin:1rem 0;padding:0 0 0 12px}.documentation-content.markdown-body table{border-collapse:collapse;width:100%;margin:1rem 0 1.4rem;display:table}.documentation-content.markdown-body th,.documentation-content.markdown-body td{border:1px solid var(--doc-border);text-align:left;vertical-align:top;padding:8px 10px}.documentation-content.markdown-body th{background:var(--doc-hover);font-weight:700}.documentation-content.markdown-body ul,.documentation-content.markdown-body ol{margin:.85rem 0 1rem;padding-left:1.5rem;display:block}.documentation-content.markdown-body ul{list-style:outside}.documentation-content.markdown-body ol{list-style:decimal}.documentation-content.markdown-body li{margin:.3rem 0}.documentation-content.markdown-body li>ul,.documentation-content.markdown-body li>ol{margin-top:.35rem;margin-bottom:.35rem}.documentation-content.markdown-body strong{color:var(--doc-text)}.documentation-content.markdown-body img{max-width:100%;height:auto}.post-editor,.scripts-view-shell,.templates-view-shell{background-color:var(--vscode-editor-background);flex-direction:column;flex:1;display:flex;overflow:hidden}.post-editor .editor-tab-dirty{color:var(--vscode-notificationsWarningIcon-foreground,var(--vscode-editorWarning-foreground));font-size:10px}.post-editor .editor-tab-meta{color:var(--vscode-descriptionForeground);white-space:nowrap;font-size:11px}.post-editor .quick-actions-wrapper{display:inline-block;position:relative}.post-editor .quick-actions-btn{white-space:nowrap;align-items:center;gap:4px;display:flex}.post-editor .quick-actions-btn-icon{font-size:12px;line-height:1}.post-editor .quick-actions-divider{background:var(--vscode-dropdown-border,#454545);height:1px}.post-editor .quick-action-icon{flex-shrink:0;margin-top:2px;font-size:16px}.post-editor .quick-action-text strong{font-size:13px;font-weight:500}.post-editor .quick-action-text small{opacity:.7;font-size:11px}.post-editor .status-badge,.scripts-view-shell .status-badge,.templates-view-shell .status-badge{text-transform:uppercase;border-radius:10px;padding:2px 8px;font-size:11px;font-weight:500}.post-editor .status-badge.status-draft,.scripts-view-shell .status-badge.status-draft,.templates-view-shell .status-badge.status-draft{color:var(--vscode-notificationsWarningIcon-foreground,var(--vscode-editorWarning-foreground));background-color:#cca70033}.post-editor .status-badge.status-published,.scripts-view-shell .status-badge.status-published,.templates-view-shell .status-badge.status-published{color:var(--vscode-testing-iconPassed);background-color:#73c99133}.post-editor .status-badge.status-archived,.scripts-view-shell .status-badge.status-archived,.templates-view-shell .status-badge.status-archived{color:var(--vscode-descriptionForeground);background-color:#85858533}.post-editor .auto-save-indicator{color:var(--vscode-descriptionForeground);font-size:11px;font-style:italic}.post-editor .metadata-toggle{color:var(--vscode-descriptionForeground);text-transform:uppercase;letter-spacing:.5px;cursor:pointer;background:0 0;border:none;flex-shrink:0;align-items:center;gap:8px;padding:6px 4px;font-size:11px;font-weight:500;transition:color .15s;display:flex}.post-editor .metadata-toggle:hover{color:var(--vscode-foreground)}.post-editor .metadata-toggle-chevron{font-size:10px}.post-editor .editor-header-row.is-collapsed{display:none}.post-editor .editor-media-panel{flex-shrink:0;width:200px}.post-editor .editor-field label,.post-editor .editor-body label,.post-editor .post-editor-links-label{color:var(--vscode-descriptionForeground);text-transform:uppercase;letter-spacing:.5px;font-size:11px;font-weight:500}.post-editor .editor-checkbox-label{text-transform:none;letter-spacing:0;color:var(--vscode-foreground);align-items:center;gap:8px;display:inline-flex}.post-editor .post-editor-input.is-readonly{opacity:.7;cursor:not-allowed}.post-editor .post-editor-excerpt{min-height:96px}.post-editor .tag-input-container{width:100%;position:relative}.post-editor .tag-input-container.is-disabled{opacity:.72}.post-editor .tag-input-wrapper{border:1px solid var(--vscode-input-border,#3c3c3c);background:var(--vscode-input-background,#3c3c3c);cursor:text;border-radius:4px;flex-wrap:wrap;align-items:center;gap:6px;min-height:38px;padding:6px 8px;display:flex}.post-editor .tag-input-wrapper:focus-within{border-color:var(--vscode-focusBorder,#007fd4);outline:none}.post-editor .tag-chip{background:var(--vscode-badge-background,#4d4d4d);border:1px solid var(--vscode-widget-border,#454545);color:var(--vscode-badge-foreground,#fff);white-space:nowrap;border-radius:4px;align-items:center;gap:4px;padding:3px 8px;font-size:.85rem;display:inline-flex}.post-editor .tag-chip.has-color{border-radius:12px;padding:3px 10px}.post-editor .tag-chip-remove{width:16px;height:16px;color:inherit;cursor:pointer;opacity:.6;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;margin-left:2px;padding:0;font-size:1rem;line-height:1;transition:opacity .15s,background .15s;display:inline-flex}.post-editor .tag-chip-remove:hover{opacity:1;background:#0000001a}.post-editor .tag-chip.has-color .tag-chip-remove:hover{background:#0003}.post-editor .tag-input-field{min-width:120px;color:var(--vscode-input-foreground,#ccc);background:0 0;border:none;outline:none;flex:1;padding:2px 4px;font-family:inherit;font-size:.9rem}.post-editor .tag-input-field::placeholder{color:var(--vscode-input-placeholderForeground,#a6a6a6)}.post-editor .tag-input-field:disabled{cursor:not-allowed}.post-editor .tag-suggestions{background:var(--vscode-dropdown-background,#3c3c3c);border:1px solid var(--vscode-widget-border,#454545);z-index:1000;border-radius:6px;max-height:240px;margin-top:4px;padding:4px;position:absolute;top:100%;left:0;right:0;overflow-y:auto;box-shadow:0 4px 16px #00000080,0 0 0 1px #0003}.post-editor .tag-suggestion{width:100%;color:var(--vscode-dropdown-foreground,#f0f0f0);text-align:left;cursor:pointer;background:0 0;border:none;border-radius:4px;align-items:center;gap:8px;padding:8px 12px;font-family:inherit;font-size:.9rem;transition:background .1s;display:flex}.post-editor .tag-suggestion:hover,.post-editor .tag-suggestion.selected{background:var(--vscode-list-hoverBackground,#2a2d2e)}.post-editor .tag-suggestion-color{border-radius:50%;flex-shrink:0;width:12px;height:12px}.post-editor .tag-suggestion-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.post-editor .tag-suggestion.create-new{border-top:1px solid var(--vscode-widget-border,#454545);color:var(--vscode-notificationsInfoIcon-foreground,#75beff);margin-top:4px;padding:12px 8px 6px}.post-editor .tag-suggestion.create-new:first-child{border-top:none;margin-top:0;padding-top:8px}.post-editor .tag-suggestion-icon{border:1px dashed;border-radius:4px;justify-content:center;align-items:center;width:18px;height:18px;font-size:.9rem;font-weight:600;display:inline-flex}.post-editor .editor-language-row select{flex:1;min-width:0}.post-editor .editor-translation-flag{cursor:pointer;background:0 0;border:1px solid #0000;border-radius:999px;flex:none;justify-content:center;align-items:center;width:24px;height:24px;padding:0;font-size:14px;line-height:1;display:inline-flex}.post-editor .editor-translation-flag.status-draft{opacity:.82}.post-editor .editor-translation-flag.status-archived{opacity:.45;filter:grayscale(.35)}.post-editor .editor-translation-flag.active{border-color:var(--vscode-testing-iconQueued,#cca700);background:var(--vscode-testing-iconQueued,#cca700)}@supports (color:color-mix(in lab, red, red)){.post-editor .editor-translation-flag.active{background:color-mix(in srgb,var(--vscode-testing-iconQueued,#cca700)14%,transparent)}}.post-editor .editor-translation-flag:hover{background:var(--vscode-list-hoverBackground)}@supports (color:color-mix(in lab, red, red)){.post-editor .editor-translation-flag:hover{background:color-mix(in srgb,var(--vscode-list-hoverBackground)75%,transparent)}}.post-editor .post-editor-links-panel,.post-editor .post-editor-side-panel{border:1px solid var(--vscode-panel-border);background:var(--vscode-editor-background);border-radius:8px;padding:12px}@supports (color:color-mix(in lab, red, red)){.post-editor .post-editor-links-panel,.post-editor .post-editor-side-panel{background:color-mix(in srgb,var(--vscode-editor-background)82%,white 3%)}}.post-editor .post-editor-side-panel-header{justify-content:space-between;align-items:center;gap:10px;display:flex}.post-editor .post-editor-links-columns{align-items:flex-start;gap:18px;margin-top:10px;display:flex}.post-editor .post-editor-links-columns>div{flex:1;min-width:0}.post-editor .post-editor-empty,.post-editor .post-editor-media-meta{color:var(--vscode-descriptionForeground);font-size:12px}.post-editor .post-editor-media-list{flex-direction:column;gap:8px;margin:10px 0 0;padding:0;list-style:none;display:flex}.post-editor .post-editor-media-item{background:#ffffff08;border-radius:6px;flex-direction:column;gap:2px;padding:8px 10px;display:flex}.post-editor .editor-body{flex-direction:column;flex:1;gap:4px;min-height:320px;display:flex}.post-editor .editor-toolbar{grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin-bottom:8px;display:grid}.post-editor .editor-toolbar-left{justify-content:flex-start;align-items:center;display:flex}.post-editor .editor-toolbar-center{justify-content:center;align-items:center;display:flex}.post-editor .editor-toolbar-right{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:6px;min-width:0;display:flex}.post-editor .editor-mode-toggle{gap:4px;display:flex}.post-editor .editor-mode-toggle button,.post-editor .editor-toolbar-button{cursor:pointer;border:none;border-radius:4px;padding:4px 12px;font-size:12px;transition:background-color .15s}.post-editor .editor-mode-toggle button{background-color:var(--vscode-button-secondaryBackground,#ffffff14);color:var(--vscode-button-secondaryForeground,var(--vscode-foreground))}.post-editor .editor-mode-toggle button:hover,.post-editor .editor-toolbar-button:hover{background-color:var(--vscode-button-secondaryHoverBackground,var(--vscode-toolbar-hoverBackground))}.post-editor .editor-mode-toggle button.active{background-color:var(--vscode-button-background,var(--accent-color));color:var(--vscode-button-foreground,#fff)}.post-editor .editor-toolbar-button{background:var(--vscode-button-secondaryBackground,#ffffff14);color:var(--vscode-button-secondaryForeground,var(--vscode-foreground))}.post-editor .editor-excerpt-panel.is-collapsed{display:none}.post-editor .gallery-button{background-color:var(--vscode-button-secondaryBackground);color:var(--vscode-button-secondaryForeground);cursor:pointer;border:none;border-radius:4px;padding:4px 12px;font-size:12px;transition:background-color .15s}.post-editor .gallery-button:hover{background-color:var(--vscode-button-secondaryHoverBackground)}.post-editor .insert-post-link-button,.post-editor .insert-media-button{background-color:var(--vscode-button-secondaryBackground);color:var(--vscode-button-secondaryForeground);cursor:pointer;border:none;border-radius:4px;padding:4px 8px;font-size:14px;transition:background-color .15s}.post-editor .insert-post-link-button:hover,.post-editor .insert-media-button:hover{background-color:var(--vscode-button-secondaryHoverBackground)}.post-editor .editor-preview{background-color:var(--vscode-input-background);background-color:var(--vscode-input-background);border:none;border:1px solid var(--vscode-panel-border);border-radius:4px;flex:1;min-height:240px;padding:14px;line-height:1.6;position:relative;overflow:auto}.post-editor .editor-preview-frame{background:#fff;border:none;width:100%;min-height:520px}.post-editor .post-editor-markdown-surface{border:1px solid var(--vscode-input-border,var(--vscode-panel-border));background:var(--vscode-input-background);border-radius:4px;flex:1;min-height:380px;position:relative;overflow:hidden}.post-editor .monaco-editor-shell,.scripts-monaco.monaco-editor-shell,.templates-monaco.monaco-editor-shell{position:relative}.monaco-editor-instance{width:100%;height:100%;min-height:100%}.post-editor .monaco-editor-instance{min-height:380px}.scripts-monaco .monaco-editor-instance,.templates-monaco .monaco-editor-instance{min-height:420px}.monaco-editor-input{clip:rect(0,0,0,0);white-space:pre;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.post-editor .editor-footer{border-top:1px solid var(--vscode-panel-border);background-color:var(--vscode-sideBar-background);color:var(--vscode-descriptionForeground);flex-wrap:wrap;align-items:center;gap:16px;padding:8px 16px;font-size:12px;display:flex}@media (max-width:980px){.post-editor .editor-header,.scripts-view-shell .ui-editor-header,.templates-view-shell .ui-editor-header,.post-editor .metadata-toggle-header,.post-editor .editor-toolbar{flex-direction:column;align-items:flex-start;display:flex}.post-editor .editor-header-row,.post-editor .editor-field-row,.post-editor .post-editor-links-columns{flex-direction:column}.post-editor .editor-media-panel{width:100%}.post-editor .editor-toolbar-right,.post-editor .ui-editor-actions,.scripts-view-shell .ui-editor-actions,.templates-view-shell .ui-editor-actions{justify-content:flex-start}}.settings-view,.style-view{flex-direction:column;height:100%;display:flex}.settings-header,.style-view-header{border-bottom:1px solid var(--line,#3c3c3c);justify-content:space-between;align-items:center;gap:16px;padding:18px 20px;display:flex}.settings-search input{width:min(320px,40vw)}.settings-content{flex-direction:column;gap:18px;padding:20px;display:flex;overflow:auto}.setting-section{border:1px solid var(--line,#3c3c3c);background:var(--panel-2,#252526);border-radius:12px}.setting-section-header{border-bottom:1px solid var(--line,#3c3c3c);padding:14px 16px}.setting-section-content{flex-direction:column;gap:14px;padding:16px;display:flex}.setting-row{grid-template-columns:minmax(180px,240px) minmax(0,1fr);align-items:start;gap:16px;display:grid}.setting-label{font-weight:600}.setting-control,.setting-input-group{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.setting-actions{flex-wrap:wrap;gap:10px;padding:0 16px 16px;display:flex}.style-theme-picker{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;padding:20px;display:grid}.style-theme-option{border:1px solid var(--line,#3c3c3c);background:var(--panel-2,#252526);text-align:left;cursor:pointer;border-radius:14px;padding:14px}.style-theme-option.selected{border-color:var(--accent-color);box-shadow:0 0 0 1px var(--accent-color)}.style-theme-swatch{flex-direction:column;gap:12px;display:flex}.style-theme-tones{grid-template-columns:2fr 1fr 1fr;gap:8px;display:grid}.style-theme-tone{border:1px solid #ffffff14;border-radius:10px;height:42px}.style-apply-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:0 20px 20px;display:flex}.style-preview-container{flex:1;min-height:0;padding:0 20px 20px}.style-preview-frame{border:1px solid var(--line,#3c3c3c);background:#fff;border-radius:14px;width:100%;height:100%;min-height:420px}@media (max-width:1100px){.setting-row{grid-template-columns:1fr}}.panel-shell{border-top:1px solid var(--line);min-height:160px;max-height:160px}.panel-shell.is-hidden{display:none}.panel-tabs{gap:2px;display:flex}.panel-tab{color:var(--vscode-tab-inactiveForeground);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;border-radius:0;padding:6px 12px;font-size:12px}.panel-tab:hover{color:var(--vscode-tab-activeForeground);background:0 0}.panel-tab.active{color:var(--vscode-tab-activeForeground);border-bottom-color:var(--vscode-focusBorder);background:0 0}.assistant-content{flex-direction:column;gap:12px;padding:12px;display:flex}.assistant-sidebar-header{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.assistant-sidebar-heading{flex-direction:column;gap:4px;display:flex}.assistant-sidebar-description,.assistant-sidebar-context-text,.assistant-sidebar-message-content{color:var(--vscode-descriptionForeground)}.assistant-sidebar-status{border:1px solid var(--vscode-panel-border);border-radius:999px;padding:2px 8px;font-size:11px;line-height:1.4}.assistant-sidebar-status.is-offline{color:var(--vscode-editor-foreground);background:#ffc4002e;border-color:#ffc40059}.assistant-sidebar-context{border:1px solid var(--vscode-panel-border);background:var(--vscode-editorWidget-background,#0003);border-radius:6px;flex-direction:column;gap:10px;padding:8px;display:flex}.assistant-sidebar-context-row{justify-content:space-between;gap:12px;display:flex}.assistant-sidebar-context-label,.assistant-sidebar-message-role{text-transform:uppercase;letter-spacing:.04em;color:var(--vscode-descriptionForeground);font-size:11px}.assistant-sidebar-context-value{text-align:right;color:var(--vscode-editor-foreground)}.assistant-sidebar-context-text,.assistant-sidebar-message-content{white-space:pre-wrap;margin:0}.assistant-sidebar-prompt-form,.assistant-sidebar-welcome,.assistant-sidebar-transcript{flex-direction:column;gap:10px;display:flex}.assistant-sidebar-prompt{resize:vertical;border:1px solid var(--vscode-input-border);background:var(--vscode-input-background);width:100%;min-height:120px;color:var(--vscode-input-foreground);font:inherit;border-radius:6px;padding:10px}.assistant-sidebar-prompt:focus{outline:1px solid var(--vscode-focusBorder);outline-offset:1px}.assistant-sidebar-start-button{border:1px solid var(--vscode-button-border,transparent);background:var(--vscode-button-background);color:var(--vscode-button-foreground);cursor:pointer;border-radius:999px;align-self:flex-start;padding:7px 14px}.assistant-sidebar-start-button:disabled{cursor:default;opacity:.55}.assistant-card,.assistant-sidebar-message{border:1px solid var(--vscode-panel-border);background:var(--vscode-editorWidget-background,#0003);border-bottom-width:1px;border-radius:6px;flex-direction:column;gap:6px;padding:12px;display:flex}.assistant-sidebar-message.user{background:var(--vscode-list-hoverBackground)}.assistant-sidebar-message.assistant{background:var(--vscode-editorWidget-background,#0003)}.status-bar{background-color:var(--vscode-statusBar-background);height:22px;color:var(--vscode-statusBar-foreground);-webkit-user-select:none;user-select:none;border-top:none;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:0;padding:0 8px;font-size:12px;display:flex}.status-bar-left,.status-bar-right{flex-shrink:0;align-items:center;gap:4px;min-width:0;display:flex}.status-bar-item{white-space:nowrap;text-overflow:ellipsis;background:0 0;border-radius:0;align-items:center;gap:6px;max-width:none;height:100%;padding:0 8px;font-size:12px;display:flex;overflow:hidden}.status-bar-item .task-message-text{text-overflow:ellipsis;white-space:nowrap;max-width:300px;overflow:hidden}.task-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:10px;height:10px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.panel-content{padding:8px}.task-list{gap:4px}.output-list,.git-log-list{gap:6px}.task-entry{background-color:var(--vscode-sideBar-background);border-bottom:none;border-radius:4px;padding:8px}.output-entry{background-color:var(--vscode-sideBar-background);color:var(--vscode-editor-foreground);border-bottom:none;border-radius:4px;padding:8px;font-size:12px}@media (max-width:1100px){.editor-frame{grid-template-columns:1fr}.assistant-sidebar-shell{display:none}.dashboard-grid{grid-template-columns:1fr}}.text-muted{color:var(--vscode-descriptionForeground)}.editor-empty{background-color:var(--vscode-editor-background);flex:1;justify-content:center;align-items:flex-start;padding:40px 20px;display:flex;overflow-y:auto}.dashboard-content{width:100%;max-width:720px}.dashboard-content h1{color:var(--vscode-editor-foreground);margin:0 0 4px;font-size:24px;font-weight:400}.dashboard-content>.text-muted{margin-bottom:24px;display:block}.dashboard-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:24px;display:grid}.stat-card{background-color:var(--vscode-sideBar-background);border-radius:6px;padding:16px}.stat-number{color:var(--vscode-editor-foreground);margin-bottom:4px;font-size:32px;font-weight:600;line-height:1}.stat-label{color:var(--vscode-descriptionForeground);text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;font-size:12px}.stat-breakdown{flex-wrap:wrap;gap:6px;display:flex}.stat-tag{background-color:var(--vscode-input-background);color:var(--vscode-descriptionForeground);border-radius:3px;padding:2px 8px;font-size:11px}.stat-published{color:var(--vscode-testing-iconPassed)}.stat-draft{color:var(--vscode-editorWarning-foreground)}.stat-archived{color:var(--vscode-descriptionForeground)}.dashboard-section{background-color:var(--vscode-sideBar-background);border-radius:6px;margin-bottom:12px;padding:16px}.dashboard-section h4{color:var(--vscode-descriptionForeground);text-transform:uppercase;letter-spacing:.5px;margin:0 0 12px;font-size:11px;font-weight:600}.timeline-chart{align-items:flex-end;gap:4px;height:100px;display:flex}.timeline-bar-container{flex-direction:column;flex:1;align-items:center;height:100%;display:flex}.timeline-bar{background-color:var(--vscode-activityBarBadge-background);border-radius:3px 3px 0 0;width:100%;max-width:40px;min-height:4px;margin-top:auto;transition:opacity .15s;position:relative}.timeline-bar:hover{opacity:.8}.timeline-bar-count{color:var(--vscode-descriptionForeground);font-size:10px;position:absolute;top:-16px;left:50%;transform:translate(-50%)}.timeline-bar-label{color:var(--vscode-descriptionForeground);flex-direction:column;align-items:center;margin-top:4px;font-size:9px;line-height:1.15;display:flex}.timeline-bar-label-month{white-space:nowrap}.timeline-bar-label-year{font-size:8px}.tag-cloud{flex-wrap:wrap;align-items:baseline;gap:6px 10px;line-height:1.6;display:flex}.dashboard-tag{background-color:var(--vscode-input-background);color:var(--vscode-editor-foreground);cursor:default;white-space:nowrap;border-radius:10px;padding:2px 8px;transition:opacity .15s}.dashboard-tag:hover{opacity:.75}.dashboard-tag.has-color{border-radius:12px}.dashboard-tag.has-color:hover{opacity:.85}.tag-cloud-more{font-size:11px}.tag-count{opacity:.5;margin-left:2px;font-size:10px}.dashboard-category{border:1px solid var(--vscode-input-border);font-size:12px}.recent-posts-list{flex-direction:column;display:flex}.recent-post-item{cursor:pointer;text-align:left;width:100%;color:inherit;background:0 0;border:none;border-radius:4px;align-items:center;gap:10px;padding:6px 8px;font-size:12px;display:flex}.recent-post-item:hover{background-color:var(--vscode-list-hoverBackground)}.recent-post-title{color:var(--vscode-editor-foreground);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.recent-post-status{background-color:var(--vscode-input-background);text-transform:uppercase;letter-spacing:.3px;border-radius:3px;padding:1px 6px;font-size:10px}.recent-post-status.status-published{color:var(--vscode-testing-iconPassed)}.recent-post-status.status-draft{color:var(--vscode-editorWarning-foreground)}.recent-post-status.status-archived{color:var(--vscode-descriptionForeground)}.recent-post-date{color:var(--vscode-descriptionForeground);white-space:nowrap}.settings-view-shell,.style-view,.tags-view-shell,.scripts-view-shell,.templates-view-shell,.chat-panel{background:var(--vscode-editor-background);height:100%}.chat-panel{color:var(--vscode-editor-foreground)}.chat-panel-header{border-bottom:1px solid var(--vscode-panel-border);background:var(--vscode-sideBar-background)}.chat-panel-title{flex:1;gap:10px;min-width:0;font-size:14px;font-weight:600;overflow:visible}.chat-panel-title-main{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.chat-panel-header-actions{align-items:center;gap:8px;display:flex}.chat-model-selector-wrap{min-width:0;display:inline-flex;position:relative}.chat-model-selector-button,.chat-model-selector-option{border:1px solid var(--vscode-input-border);background:var(--vscode-input-background);color:var(--vscode-input-foreground)}.chat-model-selector-menu{border:1px solid var(--vscode-dropdown-border,var(--vscode-panel-border));background:var(--vscode-dropdown-background,var(--vscode-sideBar-background));color:var(--vscode-dropdown-foreground,var(--vscode-foreground));z-index:20;position:absolute;top:calc(100% + 4px);left:0;right:auto}.chat-panel .chat-model-selector-button.chat-model-selector-inline{align-items:center;gap:6px;display:inline-flex}.chat-panel .chat-model-selector-caret{font-size:10px;position:static}.chat-messages,.chat-surface-scroll{flex:1;min-height:0;overflow-y:auto}.chat-message{max-width:100%;margin-bottom:16px;display:flex}.chat-message.user{flex-direction:row-reverse}.chat-message-content{border:1px solid var(--vscode-panel-border);background:var(--vscode-sideBar-background);max-width:min(760px,100%);color:var(--vscode-editor-foreground);border-radius:6px;padding:12px 14px}.chat-panel .chat-message.user .chat-message-content{background:var(--vscode-button-background,var(--accent-color,#007acc));color:var(--vscode-button-foreground,var(--vscode-list-activeSelectionForeground,#fff));border:1px solid var(--vscode-button-background,var(--accent-color,#007acc));border-radius:6px;padding:12px 14px;line-height:1.35}.chat-tool-surface-table{border-collapse:collapse;width:100%}.chat-tool-surface-table th,.chat-tool-surface-table td{border-bottom:1px solid var(--vscode-panel-border);text-align:left;padding:6px 8px}.chat-tool-surface-json{border:1px solid var(--vscode-panel-border);background:var(--vscode-textCodeBlock-background);border-radius:4px;padding:10px 12px;overflow:auto}.chat-inline-surface{border:1px solid var(--vscode-panel-border);background:var(--vscode-sideBar-background);border-radius:6px;margin:10px 0;overflow:hidden}.chat-inline-surface-header{cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--vscode-descriptionForeground);align-items:center;gap:8px;padding:8px 12px;font-size:12px;list-style:none;display:flex}.chat-inline-surface-header::-webkit-details-marker{display:none}.chat-inline-surface-header::marker{content:""}.chat-inline-surface-icon{opacity:.7;flex:none;font-size:14px;line-height:1}.chat-inline-surface-title{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--vscode-editor-foreground);flex:1;font-weight:500;overflow:hidden}.chat-inline-surface-dismiss{width:20px;height:20px;color:var(--vscode-descriptionForeground);cursor:pointer;opacity:0;background:0 0;border:none;border-radius:4px;flex:none;justify-content:center;align-items:center;padding:0;font-size:16px;line-height:1;transition:opacity .15s;display:flex}.chat-inline-surface:hover .chat-inline-surface-dismiss{opacity:1}.chat-inline-surface-dismiss:hover{background:var(--vscode-toolbar-hoverBackground);color:var(--vscode-editor-foreground)}.chat-inline-surface-body{padding:0 12px 12px}.chat-inline-surface-body h3{color:var(--vscode-editor-foreground);margin:0 0 8px;font-size:13px;font-weight:600}.chat-surface-chart-type{text-transform:uppercase;letter-spacing:.04em;color:var(--vscode-descriptionForeground);margin:0 0 8px;font-size:11px;display:none}.chat-surface-chart-list{flex-direction:column;gap:6px;display:flex}.chat-surface-chart-row{flex-direction:column;gap:2px;display:flex}.chat-surface-chart-meta{justify-content:space-between;align-items:baseline;font-size:12px;display:flex}.chat-surface-chart-meta span:first-child{color:var(--vscode-editor-foreground)}.chat-surface-chart-meta span:last-child{color:var(--vscode-descriptionForeground);font-variant-numeric:tabular-nums}.chat-surface-chart-bar{background:#ffffff0f;border-radius:3px;height:6px;overflow:hidden}.chat-surface-chart-bar span{background:var(--accent-color);border-radius:3px;min-width:0;height:100%;transition:width .3s;display:block}.chat-surface-card{flex-direction:column;gap:6px;display:flex}.chat-surface-subtitle{color:var(--vscode-descriptionForeground);margin:0;font-size:12px}.chat-surface-body{margin:0;font-size:13px;line-height:1.45}.chat-surface-actions{gap:8px;margin-top:8px;display:flex}.chat-surface-action-button{border:1px solid var(--vscode-input-border);background:var(--vscode-input-background);color:var(--vscode-editor-foreground);cursor:pointer;border-radius:4px;padding:4px 12px;font-size:12px}.chat-surface-action-button:hover{background:var(--vscode-list-hoverBackground)}.chat-surface-metric{flex-direction:column;gap:2px;display:flex}.chat-surface-metric-label{color:var(--vscode-descriptionForeground);font-size:12px}.chat-surface-metric-value{font-variant-numeric:tabular-nums;color:var(--vscode-editor-foreground);font-size:22px;font-weight:600}.chat-surface-list{margin:0;padding:0 0 0 18px;font-size:13px;line-height:1.5}.chat-surface-mindmap{margin:0;padding:0;font-size:13px;list-style:none}.chat-surface-mindmap li{border-bottom:1px solid var(--vscode-panel-border);padding:4px 0}.chat-surface-mindmap li:last-child{border-bottom:none}.chat-surface-mindmap strong{color:var(--vscode-editor-foreground);display:block}.chat-surface-mindmap-children{color:var(--vscode-descriptionForeground);padding-left:12px;font-size:12px;display:block}.chat-surface-tabs{flex-direction:column;display:flex}.chat-surface-tab-list{border-bottom:1px solid var(--vscode-panel-border);gap:0;display:flex}.chat-surface-tab-button{color:var(--vscode-descriptionForeground);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;padding:6px 12px;font-size:12px}.chat-surface-tab-button.active{color:var(--vscode-editor-foreground);border-bottom-color:var(--accent-color)}.chat-surface-tab-button:hover:not(.active){color:var(--vscode-editor-foreground)}.chat-surface-tab-panel{padding:10px 0 0}.chat-surface-form{flex-direction:column;gap:10px;display:flex}.chat-surface-form-field{color:var(--vscode-descriptionForeground);flex-direction:column;gap:4px;font-size:12px;display:flex}.chat-surface-form-field input,.chat-surface-form-field textarea,.chat-surface-form-field select{border:1px solid var(--vscode-input-border);background:var(--vscode-input-background);color:var(--vscode-input-foreground);font:inherit;border-radius:4px;padding:5px 8px}.chat-surface-form-field textarea{resize:vertical;min-height:60px}.chat-surface-form-checkbox{align-items:center;display:flex}.chat-surface-text{white-space:pre-wrap;font-size:13px;line-height:1.45}.chat-tool-surface-table-wrap{overflow-x:auto}.chat-panel .chat-input-container{--chat-input-line-height:22px;--chat-input-min-height:24px;border-top:1px solid var(--vscode-panel-border);background:var(--vscode-sideBar-background);padding:12px 16px}.chat-panel .chat-input-wrapper{border:1px solid var(--vscode-input-border);background:var(--vscode-input-background);border-radius:8px;min-height:40px;padding:6px 8px}.chat-panel .chat-input-wrapper:focus-within{border-color:var(--vscode-focusBorder)}.chat-panel .chat-input{box-sizing:border-box;height:var(--chat-input-min-height);min-height:var(--chat-input-min-height);line-height:var(--chat-input-line-height);resize:vertical;max-height:160px;color:var(--vscode-input-foreground);background:0 0;border:0;outline:none;flex:1;margin:0;padding:6px 8px;overflow-y:hidden}.chat-panel .chat-input:focus{outline:none}.chat-panel .chat-input::placeholder{color:var(--vscode-input-placeholderForeground)}.chat-panel .chat-send-button{background:var(--vscode-button-background);width:22px;max-width:22px;height:22px;max-height:22px;color:var(--vscode-button-foreground);flex:none;padding:0}.chat-panel .chat-send-button:hover:not(:disabled){background:var(--vscode-button-hoverBackground)}.chat-panel .chat-send-button:disabled{opacity:.5}@media (max-width:720px){.chat-panel-header{flex-direction:column;align-items:stretch;padding:10px 12px}.chat-panel-title{flex-wrap:wrap;width:100%}.chat-model-selector-wrap{width:100%}.chat-panel .chat-model-selector-button.chat-model-selector-inline{justify-content:space-between;width:100%}.chat-messages{padding:12px}.chat-message-content{max-width:100%}.chat-panel .chat-input-container{padding:8px 12px}}.colour-picker-wrap{display:inline-flex;position:relative}.colour-picker-trigger{border:1px solid var(--vscode-input-border);cursor:pointer;border-radius:4px;flex-shrink:0;width:28px;height:28px;padding:0}.colour-picker-trigger:hover{opacity:.85}.colour-picker-popover{z-index:30;border:1px solid var(--vscode-dropdown-border,var(--vscode-panel-border));background:var(--vscode-dropdown-background,var(--vscode-sideBar-background));border-radius:6px;width:196px;padding:8px;position:absolute;top:calc(100% + 4px);left:0;box-shadow:0 4px 12px #00000040}.colour-picker-grid{grid-template-columns:repeat(6,1fr);gap:4px;display:grid}.colour-picker-swatch{cursor:pointer;border:2px solid #0000;border-radius:4px;width:24px;height:24px;padding:0;transition:border-color .1s}.colour-picker-swatch:hover{border-color:var(--vscode-focusBorder)}.colour-picker-swatch.selected{border-color:var(--vscode-focusBorder);box-shadow:0 0 0 1px var(--vscode-focusBorder)}.colour-picker-custom{border-top:1px solid var(--vscode-panel-border);align-items:center;gap:6px;margin-top:8px;padding-top:8px;display:flex}.colour-picker-custom label{color:var(--vscode-descriptionForeground);white-space:nowrap;font-size:11px}.colour-picker-custom input{border:1px solid var(--vscode-input-border);background:var(--vscode-input-background);min-width:0;color:var(--vscode-input-foreground);border-radius:3px;flex:1;padding:2px 6px;font-family:monospace;font-size:12px}.overlay-root{pointer-events:none;z-index:10000;position:fixed;inset:0}.overlay-root:empty{display:none}.editor-shared-actions{margin-bottom:14px;position:relative}.ai-suggestions-modal-backdrop,.insert-modal-backdrop,.language-picker-modal-backdrop,.confirm-delete-modal-backdrop,.confirm-dialog-overlay,.gallery-overlay,.lightbox-overlay{pointer-events:auto;background:#000000ad;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.ai-suggestions-modal,.insert-modal,.language-picker-modal,.confirm-delete-modal,.confirm-dialog,.gallery-overlay-content{z-index:1;background:#1e1e1e;border:1px solid #3c3c3c;border-radius:8px;position:relative;box-shadow:0 8px 32px #0006}.ai-suggestions-modal,.language-picker-modal,.confirm-delete-modal,.confirm-dialog{flex-direction:column;width:min(680px,100vw - 32px);max-height:calc(100vh - 48px);display:flex}.insert-modal{flex-direction:column;width:min(680px,100vw - 32px);max-height:calc(100vh - 48px);display:flex;overflow:hidden}.gallery-overlay-content{flex-direction:column;width:min(980px,100vw - 48px);max-height:calc(100vh - 48px);display:flex;overflow:hidden}.ai-suggestions-modal-header,.language-picker-modal-header,.confirm-delete-modal-header,.insert-modal-header,.gallery-overlay-header{border-bottom:1px solid #3c3c3c;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;display:flex}.insert-modal-header{flex-direction:column;align-items:stretch;gap:12px}.insert-modal-header.media-header-only{flex-direction:row;align-items:center}.ai-suggestions-modal-header h2,.language-picker-modal-header h2,.confirm-delete-modal-header h2,.gallery-overlay-header h2,.insert-modal-title,.confirm-dialog h3{color:#fff;margin:0}.ai-suggestions-modal-close,.confirm-delete-modal-close,.gallery-overlay-close,.shared-popover-close,.lightbox-close{color:#c5c5c5;cursor:pointer;background:0 0;border:none;font-size:20px;line-height:1}.ai-suggestions-modal-body,.language-picker-modal-body,.confirm-delete-modal-body{padding:20px;overflow:auto}.ai-suggestions-list{flex-direction:column;gap:16px;display:flex}.ai-suggestion-item{background:#252526;border:1px solid #3c3c3c;border-radius:6px;gap:12px;padding:16px;display:flex}.ai-suggestion-checkbox{cursor:pointer;align-items:flex-start;display:flex;position:relative}.ai-suggestion-checkbox input{opacity:0;position:absolute}.checkmark{background:#1e1e1e;border:2px solid #555;border-radius:4px;justify-content:center;align-items:center;width:20px;height:20px;display:inline-flex}.ai-suggestion-checkbox input:checked+.checkmark,.ai-suggestion-checkbox input:checked~.checkmark{background:#0078d4;border-color:#0078d4}.ai-suggestion-checkbox input:checked+.checkmark:after,.ai-suggestion-checkbox input:checked~.checkmark:after{content:"✓";color:#fff;font-size:12px}.ai-suggestion-content{flex:1;min-width:0}.ai-suggestion-label{align-items:center;gap:8px;margin-bottom:8px;font-weight:600;display:flex}.ai-suggestion-has-value,.language-picker-badge,.insert-modal-similarity-badge{color:#c5c5c5;background:#ffffff14;border-radius:999px;align-items:center;padding:2px 6px;font-size:11px;display:inline-flex}.ai-suggestion-comparison{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px;display:grid}.ai-suggestion-column{background:#ffffff08;border-radius:6px;flex-direction:column;gap:4px;padding:10px 12px;display:flex}.ai-suggestion-column.muted{color:#9d9d9d}.ai-suggestion-column.highlighted{color:#fff;border:1px solid #007acc66}.ai-suggestion-column-label{text-transform:uppercase;letter-spacing:.04em;font-size:11px}.ai-suggestion-arrow{color:#9d9d9d}.ai-suggestion-value{min-height:1.4em}.ai-suggestion-value.loading{color:var(--accent-color);font-style:italic}.ai-suggestions-error{color:#ff6b6b;background:#dc32321f;border:1px solid #dc323259;border-radius:6px;flex-direction:column;gap:4px;margin-bottom:16px;padding:12px 16px;display:flex}.ai-suggestions-modal-footer,.confirm-delete-modal-footer,.confirm-dialog-actions{border-top:1px solid #3c3c3c;justify-content:flex-end;gap:10px;padding:16px 20px;display:flex}.button-cancel,.button-delete,.button-apply,.confirm-dialog-actions button,.insert-modal-submit,.language-picker-row,.shared-popover-entry,.colour-swatch{cursor:pointer}.button-cancel,.confirm-dialog-actions button,.insert-modal-submit{color:#f0f0f0;background:0 0;border:1px solid #4c4c4c;border-radius:4px;padding:8px 14px}.button-apply,.confirm-dialog-actions .primary,.insert-modal-submit{background:#0e639c;border-color:#0e639c}.button-delete{color:#fff;background:#c73c3c;border:none;border-radius:4px;padding:8px 14px}.insert-modal-tabs{margin:0 -20px;display:flex}.insert-modal-tab{color:#9d9d9d;background:0 0;border:none;border-bottom:2px solid #0000;flex:1;padding:10px 16px}.insert-modal-tab.active{color:#fff;background:#252526;border-bottom-color:#0e639c}.insert-modal-search{border-bottom:1px solid #3c3c3c}.insert-modal-input,.shared-popover-input{color:#f0f0f0;width:100%;font:inherit;background:0 0;border:none;padding:14px 20px}.menu-editor-header h2{margin:0}.menu-editor-header p{color:var(--vscode-descriptionForeground);margin:.25rem 0 0}.menu-editor-tree-wrap{border:1px solid var(--vscode-panel-border);background:var(--vscode-editor-background);border-radius:6px;min-height:0;padding:.5rem}.menu-editor-toolbar{border-bottom:1px solid var(--vscode-panel-border);margin-bottom:.5rem;padding-bottom:.4rem}.menu-editor-tool{width:1.8rem;height:1.8rem;color:var(--vscode-foreground);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;padding:0;display:inline-flex}.menu-editor-tool:hover:not(:disabled){background:var(--vscode-toolbar-hoverBackground);border-color:var(--vscode-panel-border)}.menu-editor-tool:disabled{opacity:.45;cursor:not-allowed}.menu-editor-tree-shell{flex:1;min-height:0;overflow:auto}.menu-editor-tree-level{margin:0;padding:0;list-style:none}.menu-editor-tree-item{margin:0;padding:0}.menu-editor-row{--menu-editor-indent:calc(var(--menu-editor-depth)*1rem);padding:.3rem .45rem .3rem calc(.4rem + var(--menu-editor-indent));cursor:pointer;border-radius:4px;align-items:flex-start;gap:.5rem;display:flex;position:relative}.menu-editor-row.is-selected{background:var(--vscode-list-activeSelectionBackground);color:var(--vscode-list-activeSelectionForeground)}.menu-editor-row.is-dragging{opacity:.45}.menu-editor-row.is-drop-before:before,.menu-editor-row.is-drop-after:after{content:"";left:calc(.4rem + var(--menu-editor-indent));background:var(--vscode-focusBorder);height:2px;position:absolute;right:.45rem}.menu-editor-row.is-drop-before:before{top:0}.menu-editor-row.is-drop-after:after{bottom:0}.menu-editor-row.is-drop-inside{box-shadow:inset 0 0 0 1px var(--vscode-focusBorder);background:var(--vscode-list-hoverBackground)}.menu-editor-row-handle{width:1rem;min-width:1rem;color:var(--vscode-descriptionForeground);cursor:grab;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:inline-flex}.menu-editor-row-handle:active{cursor:grabbing}.menu-editor-row-kind{opacity:.9;justify-content:center;align-items:center;width:1rem;min-width:1rem;display:inline-flex}.menu-editor-row-title{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.menu-editor-row-title.is-editing{white-space:normal;text-overflow:clip;overflow:visible}.menu-editor-entry-form{display:block}.menu-editor-inline-input{border:1px solid var(--vscode-focusBorder);background:var(--vscode-input-background);width:100%;color:var(--vscode-input-foreground);border-radius:4px;min-height:1.8rem;padding:.25rem .45rem}.menu-editor-inline-search{border-top:1px solid var(--vscode-panel-border);flex-direction:column;gap:.4rem;max-height:18rem;margin-top:.5rem;padding-top:.5rem;display:flex;overflow:hidden}.menu-editor-inline-search-head{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.menu-editor-inline-search-head strong{font-size:.8rem;display:block}.menu-editor-inline-search-head span{color:var(--vscode-descriptionForeground);font-size:.75rem}.menu-editor-inline-actions{align-items:center;gap:.5rem;display:inline-flex}.menu-editor-inline-action{border:1px solid var(--vscode-button-border,transparent);background:var(--vscode-button-secondaryBackground);color:var(--vscode-button-secondaryForeground);cursor:pointer;border-radius:4px;padding:.2rem .5rem}.menu-editor-inline-action:hover{background:var(--vscode-button-secondaryHoverBackground)}.menu-editor-picker-list{flex-direction:column;gap:.35rem;max-height:16rem;display:flex;overflow-y:auto}.menu-editor-picker-item{border:1px solid var(--vscode-panel-border);background:var(--vscode-input-background);width:100%;color:var(--vscode-input-foreground);text-align:left;cursor:pointer;border-radius:4px;justify-content:space-between;align-items:center;padding:.45rem .55rem;display:flex}.menu-editor-picker-item:hover{border-color:var(--vscode-focusBorder);background:var(--vscode-list-hoverBackground)}.menu-editor-picker-item small,.menu-editor-picker-state{color:var(--vscode-descriptionForeground)}.menu-editor-empty{color:var(--vscode-descriptionForeground);padding:.5rem .25rem}@media (max-width:720px){.menu-editor-inline-search-head{flex-direction:column;align-items:flex-start}.menu-editor-inline-actions{flex-wrap:wrap;justify-content:flex-start;width:100%}}[data-testid=media-editor] .editor-tab-dirty{color:var(--vscode-notificationsWarningIcon-foreground,var(--vscode-editorWarning-foreground));font-size:10px}[data-testid=media-editor] .ui-editor-actions button{padding:4px 10px;font-size:12px}[data-testid=media-editor] .ui-editor-actions button.danger:hover{background-color:var(--vscode-notificationsErrorIcon-foreground)}[data-testid=media-editor] .auto-save-indicator{color:var(--vscode-descriptionForeground);font-size:11px;font-style:italic}[data-testid=media-editor] .quick-actions-wrapper{position:relative}[data-testid=media-editor] .quick-actions-btn{align-items:center;gap:6px;display:inline-flex}[data-testid=media-editor] .quick-actions-btn-icon{font-size:12px;line-height:1}[data-testid=media-editor] .quick-actions-divider{background:var(--vscode-dropdown-border,#454545);height:1px}[data-testid=media-editor] .quick-action-icon{flex-shrink:0;margin-top:2px;font-size:16px}[data-testid=media-editor] .quick-action-text strong{font-size:13px;font-weight:500}[data-testid=media-editor] .quick-action-text small{opacity:.7;font-size:11px}[data-testid=media-editor]>.editor-content.media-editor{flex-direction:row;align-items:stretch;gap:24px}[data-testid=media-editor] .editor-field label{color:var(--vscode-descriptionForeground);text-transform:uppercase;letter-spacing:.5px;font-size:11px;font-weight:500}[data-testid=media-editor] .post-editor-input.disabled,[data-testid=media-editor] .post-editor-input:disabled{opacity:.6;cursor:not-allowed}[data-testid=media-editor] .media-preview{background-color:var(--vscode-input-background);border-radius:8px;flex:1;justify-content:center;align-items:center;min-height:300px;display:flex;overflow:hidden}[data-testid=media-editor] .media-preview-placeholder{color:var(--vscode-descriptionForeground);flex-direction:column;align-items:center;gap:12px;display:flex}[data-testid=media-editor] .media-preview-image{box-sizing:border-box;justify-content:center;align-self:stretch;align-items:center;width:100%;height:100%;min-height:0;padding:16px;display:flex}[data-testid=media-editor] .media-preview-image img{object-fit:contain;border-radius:4px;width:100%;height:100%}[data-testid=media-editor] .media-details{flex-shrink:0;gap:12px;width:320px}[data-testid=media-editor] .media-details textarea{resize:vertical}[data-testid=media-editor] .linked-posts-section label{justify-content:space-between;align-items:center;display:flex}[data-testid=media-editor] .add-link-btn{background:var(--vscode-button-secondaryBackground);color:var(--vscode-button-secondaryForeground);cursor:pointer;border:none;border-radius:3px;padding:2px 8px;font-size:11px}[data-testid=media-editor] .add-link-btn:hover{background:var(--vscode-button-secondaryHoverBackground)}[data-testid=media-editor] .post-picker{background:var(--vscode-dropdown-background);border:1px solid var(--vscode-dropdown-border);border-radius:4px;max-height:250px;margin-top:8px;overflow-y:auto}[data-testid=media-editor] .post-picker-search{border-bottom:1px solid var(--vscode-dropdown-border);background:var(--vscode-dropdown-background);padding:8px;position:sticky;top:0}[data-testid=media-editor] .post-picker-search input{background:var(--vscode-input-background);border:1px solid var(--vscode-input-border);width:100%;color:var(--vscode-input-foreground);border-radius:3px;padding:6px 10px;font-size:12px}[data-testid=media-editor] .post-picker-search input:focus{border-color:var(--vscode-focusBorder);outline:none}[data-testid=media-editor] .post-picker-list{padding:4px}[data-testid=media-editor] .post-picker-item{cursor:pointer;width:100%;color:inherit;text-align:left;white-space:nowrap;text-overflow:ellipsis;background:0 0;border:none;border-radius:3px;padding:6px 8px;font-size:12px;overflow:hidden}[data-testid=media-editor] .post-picker-item:hover{background:var(--vscode-list-hoverBackground)}[data-testid=media-editor] .post-picker-more{color:var(--vscode-descriptionForeground);padding:6px 8px;font-size:11px;font-style:italic}[data-testid=media-editor] .no-posts,[data-testid=media-editor] .no-linked-posts{color:var(--vscode-descriptionForeground);padding:12px 8px;font-size:12px;font-style:italic}[data-testid=media-editor] .linked-posts-list{flex-direction:column;gap:4px;margin-top:8px;display:flex}[data-testid=media-editor] .linked-post-item{background:var(--vscode-sideBar-background);border-radius:4px;justify-content:space-between;align-items:center;padding:6px 8px;display:flex}[data-testid=media-editor] .linked-post-title,[data-testid=media-editor] .linked-post-link{min-width:0;color:inherit;text-align:left;cursor:pointer;white-space:nowrap;text-overflow:ellipsis;background:0 0;border:none;flex:1;padding:0;font-size:12px;overflow:hidden}[data-testid=media-editor] .linked-post-title:hover,[data-testid=media-editor] .linked-post-link:hover{color:var(--vscode-textLink-foreground);text-decoration:underline}[data-testid=media-editor] .linked-post-item .unlink-btn{color:var(--vscode-descriptionForeground);cursor:pointer;opacity:0;background:0 0;border:none;padding:0 4px;font-size:14px;transition:opacity .1s}[data-testid=media-editor] .linked-post-item:hover .unlink-btn{opacity:1}[data-testid=media-editor] .linked-post-item .unlink-btn:hover{color:var(--vscode-errorForeground)}.translation-modal-backdrop{pointer-events:auto;z-index:10001;background:#000000ad;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.translation-modal{background:#1e1e1e;border:1px solid #3c3c3c;border-radius:8px;width:min(640px,100vw - 32px);box-shadow:0 8px 32px #0006}.translation-modal-header,.translation-modal-footer{justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;display:flex}.translation-modal-header{border-bottom:1px solid #3c3c3c}.translation-modal-footer{border-top:1px solid #3c3c3c;justify-content:flex-end;gap:10px}.translation-modal-body{flex-direction:column;gap:14px;padding:20px;display:flex}.translation-modal-close{color:#c5c5c5;cursor:pointer;background:0 0;border:none;font-size:20px;line-height:1}.import-analysis{color:var(--vscode-foreground);flex-direction:column;gap:16px;padding:18px 20px 26px;display:flex}.import-analysis-header{flex-direction:column;gap:8px;display:flex}.import-analysis-header p{color:var(--vscode-descriptionForeground);margin:0;font-size:13px;line-height:1.5}.import-definition-name{border:1px solid var(--vscode-input-border,transparent);background:var(--vscode-input-background);width:min(480px,100%);color:var(--vscode-input-foreground,var(--vscode-foreground));border-radius:6px;padding:10px 12px;font-size:18px;font-weight:600}.import-file-selectors{gap:12px;display:grid}.import-file-row{border:1px solid var(--vscode-panel-border);background:var(--vscode-editor-background);border-radius:8px;grid-template-columns:150px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 14px;display:grid}@supports (color:color-mix(in lab, red, red)){.import-file-row{background:color-mix(in srgb,var(--vscode-editor-background)76%,var(--vscode-input-background))}}.import-file-row label{color:var(--vscode-descriptionForeground);text-transform:uppercase;letter-spacing:.04em;font-size:12px;font-weight:600}.import-file-path{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-family:var(--vscode-editor-font-family,ui-monospace,monospace);font-size:12px;overflow:hidden}.import-file-path.placeholder{color:var(--vscode-descriptionForeground)}.import-analysis button,.import-analysis select{border:1px solid var(--vscode-button-border,transparent);border-radius:6px;font-size:12px}.import-analysis button{background:var(--vscode-button-secondaryBackground,var(--vscode-button-background));color:var(--vscode-button-secondaryForeground,var(--vscode-button-foreground));cursor:pointer;padding:8px 12px}.import-analysis button:hover:not(:disabled){background:var(--vscode-button-secondaryHoverBackground,var(--vscode-button-hoverBackground))}.import-analyze-btn,.import-execute-btn{background:var(--vscode-button-background)!important;color:var(--vscode-button-foreground)!important}.import-analysis button:disabled{opacity:.65;cursor:not-allowed}.import-loading{border:1px solid var(--vscode-panel-border);background:var(--vscode-editor-background);border-radius:10px;align-items:center;gap:12px;padding:16px;display:flex}@supports (color:color-mix(in lab, red, red)){.import-loading{background:color-mix(in srgb,var(--vscode-editor-background)84%,var(--vscode-input-background))}}.import-spinner{border:2px solid var(--vscode-descriptionForeground);border-top-color:var(--vscode-button-background);border-radius:50%;flex-shrink:0;width:18px;height:18px;animation:.8s linear infinite import-spinner-rotate}.import-progress{flex-direction:column;gap:2px;display:flex}.import-progress-step{color:var(--vscode-foreground);font-size:13px}.import-progress-detail{color:var(--vscode-descriptionForeground);font-size:11px}@keyframes import-spinner-rotate{to{transform:rotate(360deg)}}.import-site-info{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.import-site-info-item,.import-stat-card,.import-date-distribution,.import-detail-section,.import-execute-section{border:1px solid var(--vscode-panel-border);background:var(--vscode-editor-background);border-radius:10px}@supports (color:color-mix(in lab, red, red)){.import-site-info-item,.import-stat-card,.import-date-distribution,.import-detail-section,.import-execute-section{background:color-mix(in srgb,var(--vscode-editor-background)84%,var(--vscode-input-background))}}.import-site-info-item{flex-direction:column;gap:6px;padding:14px;display:flex}.info-label{color:var(--vscode-descriptionForeground);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:600}.info-value{overflow-wrap:anywhere;font-size:13px;font-weight:500}.import-stat-cards{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;display:grid}.import-stat-card{padding:14px}.import-stat-card h3,.import-date-distribution h3,.import-detail-section h3,.taxonomy-group h4{margin:0}.import-stat-number{margin-top:10px;font-size:28px;font-weight:700;line-height:1}.import-stat-breakdown,.import-execute-summary,.import-taxonomy-list{flex-wrap:wrap;gap:8px;display:flex}.import-stat-breakdown{margin-top:12px}.import-stat-tag,.import-count-tag,.import-taxonomy-pill,.macro-status-badge{border-radius:999px;align-items:center;gap:4px;padding:4px 9px;font-size:11px;font-weight:600;display:inline-flex}.stat-new,.import-taxonomy-pill.new-tax{color:#75beff;background:#75beff29}.stat-update,.stat-mapped,.import-taxonomy-pill.exists,.import-taxonomy-pill.mapped,.macro-status-badge.mapped,.import-execution-complete{color:#73c991;background:#73c99129}.stat-conflict{color:#ffb169;background:#ffa65729}.stat-duplicate,.stat-missing,.macro-status-badge.unmapped,.import-execution-error{color:#cca700;background:#cca70029}.import-date-distribution,.import-detail-section,.import-execute-section{padding:16px}.import-section-toggle{text-align:left;justify-content:space-between;align-items:center;gap:10px;width:100%;padding:0;font-weight:600;display:flex;color:inherit!important;background:0 0!important;border:none!important;font-size:16px!important}.import-section-toggle:hover{opacity:.9;background:0 0!important}.toggle-icon{color:var(--vscode-descriptionForeground);font-size:12px}.distribution-bars{gap:10px;margin-top:14px;display:grid}.distribution-row{grid-template-columns:56px minmax(0,1fr) 72px;align-items:center;gap:10px;display:grid}.distribution-year,.distribution-count,.slug-cell{font-family:var(--vscode-editor-font-family,ui-monospace,monospace);font-size:11px}.distribution-bar-container{background:var(--vscode-input-background);border-radius:999px;height:10px;overflow:hidden}.distribution-bar{border-radius:inherit;min-width:8px;height:100%}.distribution-bar-posts{background:linear-gradient(90deg,#75beffcc,#75beff59)}.import-execute-section{justify-content:space-between;align-items:center;gap:16px;display:flex}.import-execute-summary{color:var(--vscode-descriptionForeground)}.import-execution-complete,.import-execution-error{border-radius:8px;padding:10px 12px;font-size:12px;font-weight:600}.import-execution-progress{border:1px solid var(--vscode-panel-border);background:var(--vscode-editor-background);border-radius:10px;gap:10px;padding:16px;display:grid}@supports (color:color-mix(in lab, red, red)){.import-execution-progress{background:color-mix(in srgb,var(--vscode-editor-background)84%,var(--vscode-input-background))}}.import-execution-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.import-execution-header h3{margin:0;font-size:14px}.import-progress-bar{background:var(--vscode-input-background);border-radius:999px;height:10px;overflow:hidden}.import-progress-fill{background:linear-gradient(90deg,#75beffd9,#75beff73);height:100%}.import-progress-info{flex-wrap:wrap;align-items:center;gap:12px;font-size:12px;display:flex}.import-phase{font-weight:600}.import-detail,.import-counter{color:var(--vscode-descriptionForeground)}.import-detail-table{border-collapse:collapse;width:100%;margin-top:14px}.import-detail-table th,.import-detail-table td{text-align:left;border-bottom:1px solid var(--vscode-panel-border);vertical-align:middle;padding:10px 8px;font-size:12px}.import-detail-table th{color:var(--vscode-descriptionForeground);text-transform:uppercase;letter-spacing:.04em;font-size:11px}.import-detail-table .status-badge{text-transform:uppercase;letter-spacing:.04em;border-radius:999px;align-items:center;padding:4px 9px;font-size:10px;font-weight:700;display:inline-flex}.import-detail-table .status-badge.new{color:#75beff;background:#75beff29}.import-detail-table .status-badge.update{color:#73c991;background:#73c99129}.import-detail-table .status-badge.conflict{color:#ffb169;background:#ffa65729}.import-detail-table .status-badge.duplicate,.import-detail-table .status-badge.missing{color:#cca700;background:#cca70029}.categories-cell,.existing-match,.mime-type-cell,.post-type-cell{color:var(--vscode-descriptionForeground);font-size:11px}.mime-type-cell,.post-type-cell,.existing-match,.slug-cell{font-family:var(--vscode-editor-font-family,ui-monospace,monospace)}.resolution-select,.taxonomy-mapping-input{background:var(--vscode-dropdown-background,var(--vscode-input-background));min-width:150px;color:var(--vscode-dropdown-foreground,var(--vscode-foreground));border:1px solid var(--vscode-dropdown-border,var(--vscode-panel-border));padding:6px 8px}.taxonomy-analyze-row{border-bottom:1px solid var(--vscode-panel-border);align-items:center;gap:12px;margin-top:12px;padding:0 0 12px;display:flex}.taxonomy-analyze-dropdown{position:relative}.taxonomy-analyze-btn{white-space:nowrap;align-items:center;gap:6px;display:inline-flex}.taxonomy-model-dropdown{background:var(--vscode-dropdown-background,var(--vscode-sideBar-background));border:1px solid var(--vscode-dropdown-border,var(--vscode-panel-border));z-index:20;border-radius:6px;min-width:220px;max-height:280px;position:absolute;top:calc(100% + 6px);left:0;overflow-y:auto;box-shadow:0 10px 24px #0000003d}.taxonomy-model-option{text-align:left;width:100%;display:block;color:var(--vscode-foreground)!important;background:0 0!important;border:none!important;border-radius:0!important;padding:8px 12px!important}.taxonomy-model-option:hover{background:var(--vscode-list-hoverBackground)!important}.taxonomy-analyze-hint{color:var(--vscode-descriptionForeground);font-size:11px}.import-taxonomy-groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:14px;display:grid}.taxonomy-group{flex-direction:column;gap:12px;display:flex}.import-taxonomy-entry,.import-taxonomy-edit-form{flex-wrap:wrap;align-items:center;gap:8px;display:inline-flex}.import-taxonomy-pill{cursor:default;border:none}button.import-taxonomy-pill{cursor:pointer}.mapped-target{background:#73c9911a}.taxonomy-mapping-arrow{color:var(--vscode-descriptionForeground);font-size:12px}.taxonomy-mapping-input{border-radius:6px;min-width:170px}.taxonomy-edit-btn,.taxonomy-clear-btn{justify-content:center;align-items:center;min-width:28px;min-height:28px;display:inline-flex;padding:0 8px!important}.taxonomy-edit-btn.ghost,.taxonomy-clear-btn{border:1px solid var(--vscode-panel-border)!important;color:var(--vscode-descriptionForeground)!important;background:0 0!important}.macros-list{gap:10px;margin-top:14px;display:grid}.macro-item{border:1px solid var(--vscode-panel-border);background:var(--vscode-input-background);border-radius:8px}.macro-item.unmapped{border-left:3px solid #cca700}.macro-header{align-items:center;gap:10px;padding:12px 14px;display:flex}.macro-name,.import-taxonomy-pill{font-family:var(--vscode-editor-font-family,ui-monospace,monospace)}.macro-count{color:var(--vscode-descriptionForeground);margin-left:auto;font-size:11px}.import-empty-state{color:var(--vscode-descriptionForeground);border:1px dashed var(--vscode-panel-border);border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:56px 20px;display:flex}.import-empty-state p{margin:0;font-size:13px}@media (max-width:1100px){.import-site-info,.import-stat-cards,.import-taxonomy-groups{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:780px){.import-analysis{padding:14px}.import-file-row,.distribution-row,.import-execute-section,.import-site-info,.import-stat-cards,.import-taxonomy-groups{grid-template-columns:1fr}.import-execute-section,.import-file-row{align-items:stretch}.import-analysis button,.resolution-select,.taxonomy-mapping-input{width:100%}.taxonomy-analyze-row{flex-direction:column;align-items:stretch}.import-taxonomy-entry,.import-taxonomy-edit-form{flex-direction:column;align-items:stretch;width:100%}}.misc-editor-shell{background:var(--vscode-editor-background)}.misc-editor-header{border-bottom:1px solid var(--vscode-panel-border);background:var(--vscode-tab-activeBackground);padding:12px 16px 8px}.misc-editor-header h2{margin:0;font-size:15px;font-weight:600}.misc-editor-header p{color:var(--vscode-descriptionForeground);margin:2px 0 0;font-size:12px}.misc-editor-actions{flex-shrink:0}.misc-editor-summary{border-bottom:1px solid var(--vscode-panel-border);padding:8px 16px}.misc-editor-content{padding:16px}.misc-summary-pill{background:var(--vscode-input-background);border:1px solid var(--vscode-panel-border);color:var(--vscode-foreground);border-radius:999px;align-items:center;gap:6px;padding:3px 10px;font-size:12px;display:inline-flex}.misc-summary-pill span{color:var(--vscode-descriptionForeground)}.misc-summary-pill strong{font-weight:600}.misc-card{border:1px solid var(--vscode-panel-border);background:var(--vscode-editor-background);border-radius:8px;padding:14px 16px}@supports (color:color-mix(in lab, red, red)){.misc-card{background:color-mix(in srgb,var(--vscode-editor-background)84%,var(--vscode-input-background))}}.misc-card h3{margin:0 0 8px;font-size:13px;font-weight:600}.misc-card p{color:var(--vscode-descriptionForeground);margin:0;font-size:12px}.misc-card ul{margin:6px 0 0;padding-left:18px;font-size:12px;line-height:1.6}.misc-columns{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;display:grid}.misc-list{flex-direction:column;gap:2px;display:flex}.misc-list-item{border-radius:4px;align-items:center;gap:10px;padding:8px 12px;display:flex}.misc-list-item:hover{background:var(--vscode-list-hoverBackground)}.duplicate-pair-row label{cursor:pointer;flex-shrink:0;align-items:center;gap:6px;display:flex}.duplicate-pair-row .linkish{color:var(--vscode-textLink-foreground,#3794ff);cursor:pointer;font:inherit;text-underline-offset:.14em;background:0 0;border:none;padding:0;text-decoration:underline;text-decoration-thickness:1px}.duplicate-pair-row .linkish:hover{color:var(--vscode-foreground)}.metadata-diff-tool{flex-direction:column;gap:12px;display:flex}.metadata-diff-tabs{border-bottom:1px solid var(--vscode-panel-border);gap:2px;display:flex}.metadata-diff-tab{color:var(--vscode-tab-inactiveForeground,var(--vscode-descriptionForeground));font:inherit;cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;align-items:center;gap:6px;padding:7px 14px;font-size:12px;transition:color .12s,border-color .12s;display:inline-flex}.metadata-diff-tab:hover{color:var(--vscode-tab-activeForeground,var(--vscode-foreground))}.metadata-diff-tab.active{color:var(--vscode-tab-activeForeground,var(--vscode-foreground));border-bottom-color:var(--vscode-focusBorder,#007fd4)}.tab-badge{background:var(--vscode-activityBarBadge-background,#007acc);min-width:18px;height:18px;color:var(--vscode-activityBarBadge-foreground,#fff);border-radius:999px;justify-content:center;align-items:center;padding:0 5px;font-size:11px;font-weight:600;display:inline-flex}.metadata-diff-field-pills{flex-wrap:wrap;gap:6px;display:flex}.metadata-diff-field-pill{border:1px solid var(--vscode-panel-border);background:var(--vscode-input-background);border-radius:6px;align-items:stretch;transition:border-color .12s;display:flex;overflow:hidden}.metadata-diff-field-pill.active{border-color:var(--vscode-focusBorder,#007fd4);background:var(--vscode-focusBorder,#007fd4)}@supports (color:color-mix(in lab, red, red)){.metadata-diff-field-pill.active{background:color-mix(in srgb,var(--vscode-focusBorder,#007fd4)12%,transparent)}}.metadata-diff-field-pill-toggle{color:var(--vscode-foreground);font:inherit;cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding:4px 10px;font-size:12px;display:inline-flex}.metadata-diff-field-pill-toggle:hover{background:var(--vscode-list-hoverBackground)}.field-pill-label{font-weight:500}.field-pill-count{color:var(--vscode-descriptionForeground);font-size:11px;font-weight:600}.metadata-diff-field-pill-actions{border-left:1px solid var(--vscode-panel-border);align-items:center;gap:2px;padding:2px 4px;display:flex}.metadata-diff-action-button{min-height:22px!important;padding:2px 8px!important;font-size:11px!important}.metadata-diff-results{flex-direction:column;gap:12px;display:flex}.metadata-diff-empty p{text-align:center;padding:20px 0}.diff-item-list{flex-direction:column;gap:8px;display:flex}.diff-item-card{border:1px solid var(--vscode-panel-border);background:var(--vscode-editor-background);border-radius:8px}@supports (color:color-mix(in lab, red, red)){.diff-item-card{background:color-mix(in srgb,var(--vscode-editor-background)84%,var(--vscode-input-background))}}.diff-item-card{overflow:hidden}.diff-item-card.orphan-file{border-left:3px solid var(--vscode-editorWarning-foreground,#cca700)}.diff-item-header{background:var(--vscode-sideBar-background);justify-content:space-between;align-items:flex-start;gap:12px;padding:10px 14px;display:flex}@supports (color:color-mix(in lab, red, red)){.diff-item-header{background:color-mix(in srgb,var(--vscode-sideBar-background)50%,transparent)}}.diff-item-header{border-bottom:1px solid var(--vscode-panel-border)}.diff-item-header strong{color:var(--vscode-foreground);font-size:13px;font-weight:600}.diff-item-meta{color:var(--vscode-descriptionForeground);margin-top:2px;font-size:11px}.diff-item-fields{padding:8px 14px}.diff-field-row{border-bottom:1px solid var(--vscode-panel-border);grid-template-columns:120px 1fr;gap:8px;padding:5px 0;display:grid}@supports (color:color-mix(in lab, red, red)){.diff-field-row{border-bottom:1px solid color-mix(in srgb,var(--vscode-panel-border)50%,transparent)}}.diff-field-row:last-child{border-bottom:none}.diff-field-name{color:var(--vscode-descriptionForeground);text-transform:uppercase;letter-spacing:.04em;padding-top:3px;font-size:11px;font-weight:600}.diff-field-values{flex-direction:column;gap:3px;display:flex}.diff-field-value{word-break:break-word;align-items:baseline;gap:8px;font-size:12px;line-height:1.4;display:flex}.diff-field-value.db-value{color:var(--vscode-foreground)}.diff-field-value.file-value{color:var(--vscode-foreground);opacity:.82}.diff-source-label{text-transform:uppercase;letter-spacing:.04em;border-radius:3px;flex-shrink:0;min-width:28px;padding:1px 5px;font-size:10px;font-weight:700}.db-value .diff-source-label{background:var(--vscode-focusBorder,#007fd4)}@supports (color:color-mix(in lab, red, red)){.db-value .diff-source-label{background:color-mix(in srgb,var(--vscode-focusBorder,#007fd4)22%,transparent)}}.db-value .diff-source-label{color:var(--vscode-focusBorder,#007fd4)}.file-value .diff-source-label{background:var(--vscode-testing-iconPassed,#73c991)}@supports (color:color-mix(in lab, red, red)){.file-value .diff-source-label{background:color-mix(in srgb,var(--vscode-testing-iconPassed,#73c991)22%,transparent)}}.file-value .diff-source-label{color:var(--vscode-testing-iconPassed,#73c991)}.orphan-files-section{border:1px solid var(--vscode-editorWarning-foreground,#cca700)}@supports (color:color-mix(in lab, red, red)){.orphan-files-section{border:1px solid color-mix(in srgb,var(--vscode-editorWarning-foreground,#cca700)35%,transparent)}}.orphan-files-section{background:var(--vscode-editorWarning-foreground,#cca700);border-radius:8px;padding:14px 16px}@supports (color:color-mix(in lab, red, red)){.orphan-files-section{background:color-mix(in srgb,var(--vscode-editorWarning-foreground,#cca700)5%,var(--vscode-editor-background))}}.orphan-files-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px;display:flex}.orphan-files-header h3{margin:0;font-size:13px;font-weight:600}.orphan-files-actions{align-items:center;gap:8px;display:flex}.orphan-path span{color:var(--vscode-descriptionForeground);font-family:SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:12px}.translation-validation-view{flex-direction:column;gap:16px;display:flex}.translation-validation-summary{background:var(--vscode-input-background);border:1px solid var(--vscode-panel-border);color:var(--vscode-descriptionForeground);border-radius:6px;padding:10px 14px;font-size:12px}.translation-validation-summary p{margin:0}.translation-validation-section h3{margin:0 0 8px;font-size:13px;font-weight:600}.translation-validation-empty{color:var(--vscode-descriptionForeground);font-size:12px}.translation-validation-list{flex-direction:column;gap:8px;display:flex}.translation-validation-card{border:1px solid var(--vscode-panel-border);background:var(--vscode-editor-background);border-radius:6px;padding:10px 14px}@supports (color:color-mix(in lab, red, red)){.translation-validation-card{background:color-mix(in srgb,var(--vscode-editor-background)84%,var(--vscode-input-background))}}.translation-validation-card-db{border-left:3px solid var(--vscode-focusBorder,#007fd4)}.translation-validation-card-file{border-left:3px solid var(--vscode-testing-iconPassed,#73c991)}.translation-validation-card-title{margin:0 0 6px;font-size:13px;font-weight:600}.translation-validation-card-meta{grid-template-columns:auto 1fr;gap:3px 12px;margin:0;font-size:12px;display:grid}.translation-validation-card-meta dt{color:var(--vscode-descriptionForeground);font-weight:500}.translation-validation-card-meta dd{margin:0}.translation-validation-actions{border-top:1px solid var(--vscode-panel-border);gap:8px;padding-top:8px;display:flex}.git-diff-view{flex-direction:column;gap:12px;height:100%;min-height:0;display:flex}.git-diff-empty{color:var(--vscode-descriptionForeground);text-align:center;padding:24px 0}.git-diff-toolbar{flex-shrink:0;align-items:center;gap:10px;display:flex}.git-diff-toolbar label{color:var(--vscode-descriptionForeground);flex-shrink:0;font-size:12px;font-weight:500}.git-diff-toolbar select{flex:1;min-width:0}.git-diff-editor{border:1px solid var(--vscode-panel-border);border-radius:4px;flex:1;min-height:0;overflow:hidden}@media (min-width:768px){.ui-field-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.ui-field-grid-3{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false} \ No newline at end of file +@layer properties; +@layer theme, base, components, utilities; +@layer theme { + :root, :host { + --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; + --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', + monospace; + --spacing: 0.25rem; + --container-xs: 20rem; + --container-2xl: 42rem; + --text-xs: 0.75rem; + --text-xs--line-height: calc(1 / 0.75); + --text-sm: 0.875rem; + --text-sm--line-height: calc(1.25 / 0.875); + --tracking-wide: 0.025em; + --default-font-family: var(--font-sans); + --default-mono-font-family: var(--font-mono); + } +} +@layer base { + *, ::after, ::before, ::backdrop, ::file-selector-button { + box-sizing: border-box; + margin: 0; + padding: 0; + border: 0 solid; + } + html, :host { + line-height: 1.5; + -webkit-text-size-adjust: 100%; + tab-size: 4; + font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'); + font-feature-settings: var(--default-font-feature-settings, normal); + font-variation-settings: var(--default-font-variation-settings, normal); + -webkit-tap-highlight-color: transparent; + } + hr { + height: 0; + color: inherit; + border-top-width: 1px; + } + abbr:where([title]) { + -webkit-text-decoration: underline dotted; + text-decoration: underline dotted; + } + h1, h2, h3, h4, h5, h6 { + font-size: inherit; + font-weight: inherit; + } + a { + color: inherit; + -webkit-text-decoration: inherit; + text-decoration: inherit; + } + b, strong { + font-weight: bolder; + } + code, kbd, samp, pre { + font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace); + font-feature-settings: var(--default-mono-font-feature-settings, normal); + font-variation-settings: var(--default-mono-font-variation-settings, normal); + font-size: 1em; + } + small { + font-size: 80%; + } + sub, sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; + } + sub { + bottom: -0.25em; + } + sup { + top: -0.5em; + } + table { + text-indent: 0; + border-color: inherit; + border-collapse: collapse; + } + :-moz-focusring { + outline: auto; + } + progress { + vertical-align: baseline; + } + summary { + display: list-item; + } + ol, ul, menu { + list-style: none; + } + img, svg, video, canvas, audio, iframe, embed, object { + display: block; + vertical-align: middle; + } + img, video { + max-width: 100%; + height: auto; + } + button, input, select, optgroup, textarea, ::file-selector-button { + font: inherit; + font-feature-settings: inherit; + font-variation-settings: inherit; + letter-spacing: inherit; + color: inherit; + border-radius: 0; + background-color: transparent; + opacity: 1; + } + :where(select:is([multiple], [size])) optgroup { + font-weight: bolder; + } + :where(select:is([multiple], [size])) optgroup option { + padding-inline-start: 20px; + } + ::file-selector-button { + margin-inline-end: 4px; + } + ::placeholder { + opacity: 1; + } + @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) { + ::placeholder { + color: currentcolor; + @supports (color: color-mix(in lab, red, red)) { + color: color-mix(in oklab, currentcolor 50%, transparent); + } + } + } + textarea { + resize: vertical; + } + ::-webkit-search-decoration { + -webkit-appearance: none; + } + ::-webkit-date-and-time-value { + min-height: 1lh; + text-align: inherit; + } + ::-webkit-datetime-edit { + display: inline-flex; + } + ::-webkit-datetime-edit-fields-wrapper { + padding: 0; + } + ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field { + padding-block: 0; + } + ::-webkit-calendar-picker-indicator { + line-height: 1; + } + :-moz-ui-invalid { + box-shadow: none; + } + button, input:where([type='button'], [type='reset'], [type='submit']), ::file-selector-button { + appearance: button; + } + ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { + height: auto; + } + [hidden]:where(:not([hidden='until-found'])) { + display: none !important; + } +} +@layer utilities { + .visible { + visibility: visible; + } + .absolute { + position: absolute; + } + .relative { + position: relative; + } + .static { + position: static; + } + .top-full { + top: 100%; + } + .right-0 { + right: calc(var(--spacing) * 0); + } + .z-10 { + z-index: 10; + } + .mt-2 { + margin-top: calc(var(--spacing) * 2); + } + .block { + display: block; + } + .flex { + display: flex; + } + .grid { + display: grid; + } + .hidden { + display: none; + } + .inline { + display: inline; + } + .inline-flex { + display: inline-flex; + } + .table { + display: table; + } + .h-6 { + height: calc(var(--spacing) * 6); + } + .h-8 { + height: calc(var(--spacing) * 8); + } + .h-9 { + height: calc(var(--spacing) * 9); + } + .h-12 { + height: calc(var(--spacing) * 12); + } + .h-\[22px\] { + height: 22px; + } + .h-\[35px\] { + height: 35px; + } + .h-full { + height: 100%; + } + .max-h-\[80vh\] { + max-height: 80vh; + } + .min-h-0 { + min-height: calc(var(--spacing) * 0); + } + .min-h-\[8rem\] { + min-height: 8rem; + } + .min-h-\[16rem\] { + min-height: 16rem; + } + .w-6 { + width: calc(var(--spacing) * 6); + } + .w-8 { + width: calc(var(--spacing) * 8); + } + .w-12 { + width: calc(var(--spacing) * 12); + } + .w-full { + width: 100%; + } + .max-w-2xl { + max-width: var(--container-2xl); + } + .max-w-\[240px\] { + max-width: 240px; + } + .max-w-full { + max-width: 100%; + } + .max-w-xs { + max-width: var(--container-xs); + } + .min-w-0 { + min-width: calc(var(--spacing) * 0); + } + .min-w-9 { + min-width: calc(var(--spacing) * 9); + } + .min-w-56 { + min-width: calc(var(--spacing) * 56); + } + .min-w-72 { + min-width: calc(var(--spacing) * 72); + } + .flex-1 { + flex: 1; + } + .shrink-0 { + flex-shrink: 0; + } + .transform { + transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); + } + .resize { + resize: both; + } + .resize-y { + resize: vertical; + } + .flex-col { + flex-direction: column; + } + .flex-wrap { + flex-wrap: wrap; + } + .items-center { + align-items: center; + } + .items-end { + align-items: flex-end; + } + .items-start { + align-items: flex-start; + } + .items-stretch { + align-items: stretch; + } + .justify-between { + justify-content: space-between; + } + .justify-center { + justify-content: center; + } + .justify-end { + justify-content: flex-end; + } + .gap-1 { + gap: calc(var(--spacing) * 1); + } + .gap-1\.5 { + gap: calc(var(--spacing) * 1.5); + } + .gap-2 { + gap: calc(var(--spacing) * 2); + } + .gap-3 { + gap: calc(var(--spacing) * 3); + } + .gap-4 { + gap: calc(var(--spacing) * 4); + } + .truncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + .overflow-auto { + overflow: auto; + } + .overflow-hidden { + overflow: hidden; + } + .overflow-x-auto { + overflow-x: auto; + } + .overflow-y-auto { + overflow-y: auto; + } + .rounded { + border-radius: 0.25rem; + } + .border { + border-style: var(--tw-border-style); + border-width: 1px; + } + .p-4 { + padding: calc(var(--spacing) * 4); + } + .px-3 { + padding-inline: calc(var(--spacing) * 3); + } + .px-4 { + padding-inline: calc(var(--spacing) * 4); + } + .py-2 { + padding-block: calc(var(--spacing) * 2); + } + .py-3 { + padding-block: calc(var(--spacing) * 3); + } + .py-6 { + padding-block: calc(var(--spacing) * 6); + } + .pt-2 { + padding-top: calc(var(--spacing) * 2); + } + .pr-2 { + padding-right: calc(var(--spacing) * 2); + } + .text-left { + text-align: left; + } + .text-sm { + font-size: var(--text-sm); + line-height: var(--tw-leading, var(--text-sm--line-height)); + } + .text-xs { + font-size: var(--text-xs); + line-height: var(--tw-leading, var(--text-xs--line-height)); + } + .tracking-wide { + --tw-tracking: var(--tracking-wide); + letter-spacing: var(--tracking-wide); + } + .uppercase { + text-transform: uppercase; + } + .outline { + outline-style: var(--tw-outline-style); + outline-width: 1px; + } + .blur { + --tw-blur: blur(8px); + filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); + } + .invert { + --tw-invert: invert(100%); + filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); + } + .md\:grid-cols-2 { + @media (width >= 48rem) { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + } + .md\:grid-cols-\[minmax\(0\,1fr\)_auto\] { + @media (width >= 48rem) { + grid-template-columns: minmax(0,1fr) auto; + } + } + .md\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1fr\)_auto\] { + @media (width >= 48rem) { + grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto; + } + } + .xl\:grid-cols-\[minmax\(0\,2fr\)_minmax\(280px\,1fr\)\] { + @media (width >= 80rem) { + grid-template-columns: minmax(0,2fr) minmax(280px,1fr); + } + } + .xl\:grid-cols-\[minmax\(320px\,1fr\)_minmax\(0\,1\.2fr\)\] { + @media (width >= 80rem) { + grid-template-columns: minmax(320px,1fr) minmax(0,1.2fr); + } + } +} +:root { + --accent-color: #007acc; + --accent-color-transparent: rgba(0, 122, 204, 0.25); + --vscode-editor-background: #1e1e1e; + --vscode-editor-foreground: #cccccc; + --vscode-sideBar-background: #252526; + --vscode-activityBar-background: #333333; + --vscode-activityBar-foreground: #ffffff; + --vscode-panel-background: #1e1e1e; + --vscode-titleBar-activeBackground: #252526; + --vscode-titleBar-activeForeground: #cccccc; + --vscode-statusBar-background: #007acc; + --vscode-statusBar-foreground: #ffffff; + --vscode-tab-activeBackground: #1e1e1e; + --vscode-tab-inactiveBackground: #2d2d2d; + --vscode-tab-activeForeground: #ffffff; + --vscode-tab-inactiveForeground: #969696; + --vscode-editorGroupHeader-tabsBackground: #252526; + --vscode-editorGroupHeader-tabsBorder: #1e1e1e; + --vscode-toolbar-hoverBackground: rgba(90, 93, 94, 0.31); + --vscode-toolbar-activeBackground: rgba(99, 102, 103, 0.31); + --vscode-foreground: #cccccc; + --vscode-descriptionForeground: #858585; + --vscode-panel-border: #80808059; + --vscode-sideBar-border: #80808059; + --vscode-tab-border: #252526; + --vscode-focusBorder: #007fd4; + --vscode-input-background: rgba(255, 255, 255, 0.06); + --vscode-input-border: rgba(255, 255, 255, 0.12); + --vscode-list-hoverBackground: #2a2d2e; + --vscode-list-activeSelectionBackground: #094771; + --vscode-list-activeSelectionForeground: #ffffff; + --vscode-activityBarBadge-background: #007acc; + --vscode-activityBarBadge-foreground: #ffffff; + --vscode-testing-iconPassed: #73c991; + --vscode-editorWarning-foreground: #cca700; + --vscode-input-foreground: #cccccc; + --vscode-input-placeholderForeground: #a6a6a6; + --vscode-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + --vscode-font-size: 13px; + --panel-1: var(--vscode-editor-background); + --panel-2: var(--vscode-sideBar-background); + --panel-3: var(--vscode-input-background); + --ink: var(--vscode-foreground); + --line: var(--vscode-panel-border); + --accent: var(--vscode-focusBorder); + --accent-soft: var(--vscode-list-hoverBackground); + --success: var(--vscode-testing-iconPassed); + --sidebar-width: 280px; + --assistant-width: 360px; + color-scheme: dark; +} +* { + box-sizing: border-box; +} +html, body { + margin: 0; + width: 100%; + height: 100%; + background: var(--vscode-editor-background); + color: var(--vscode-foreground); +} +body { + overflow: hidden; + user-select: none; + font-family: var(--vscode-font-family); + font-size: var(--vscode-font-size); +} +body > [data-phx-session], body > [data-phx-main] { + width: 100%; + height: 100%; + min-height: 0; +} +button { + font-family: var(--vscode-font-family); + font-size: var(--vscode-font-size); + color: var(--vscode-button-foreground); + background-color: var(--vscode-button-background); + border: none; + padding: 6px 14px; + cursor: pointer; + border-radius: 2px; +} +button:hover { + background-color: var(--vscode-button-hoverBackground); +} +button:focus { + outline: 1px solid var(--vscode-focusBorder); + outline-offset: 2px; +} +button.secondary { + background-color: var(--vscode-button-secondaryBackground); +} +button.secondary:hover { + background-color: #4a4d51; +} +button.compact { + padding: 4px 8px; + font-size: 12px; +} +button.primary { + background-color: var(--vscode-button-background); + font-weight: 500; +} +button.primary:hover { + background-color: var(--vscode-button-hoverBackground); +} +button.success { + background-color: #28a745; +} +button.success:hover { + background-color: #218838; +} +button.danger { + background-color: #dc3545; +} +button.danger:hover { + background-color: #c82333; +} +button:disabled { + opacity: 0.5; + cursor: not-allowed; +} +button svg, button svg * { + pointer-events: none; +} +.app { + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + background-color: var(--vscode-editor-background); +} +.app-main { + flex: 1; + display: flex; + overflow: hidden; + min-height: 0; +} +.app-content { + flex: 1; + display: flex; + flex-direction: column; + overflow: hidden; + min-width: 0; +} +.window-titlebar { + position: relative; + height: 34px; + display: flex; + align-items: center; + justify-content: space-between; + background-color: var(--vscode-editorGroupHeader-tabsBackground); + border-bottom: 1px solid var(--vscode-editorGroupHeader-tabsBorder); + flex-shrink: 0; + app-region: drag; + -webkit-app-region: drag; + padding-right: calc(10px + var(--bds-titlebar-overlay-right, 0px)); +} +.window-titlebar-menu-bar { + display: flex; + align-items: center; + height: 100%; + margin-left: 6px; + gap: 2px; + app-region: no-drag; + -webkit-app-region: no-drag; + z-index: 2; +} +.window-titlebar-menu-group { + position: relative; + display: flex; + align-items: center; + height: 100%; +} +.window-titlebar-menu-bar.is-hidden { + display: none; +} +.window-titlebar.is-mac .window-titlebar-menu-bar { + margin-left: max(var(--bds-titlebar-macos-left-inset, 78px), calc(6px + var(--bds-titlebar-overlay-left, 0px))); +} +.window-titlebar-menu-button { + height: 24px; + border: none; + background: transparent; + color: var(--vscode-titleBar-activeForeground); + padding: 0 8px; + border-radius: 4px; + font-size: 12px; + line-height: 1; + cursor: pointer; +} +.window-titlebar-menu-button:hover, .window-titlebar-action-button:hover { + background-color: var(--vscode-toolbar-hoverBackground); +} +.window-titlebar-menu-button.is-active { + background-color: var(--vscode-toolbar-hoverBackground); +} +.window-titlebar-menu-button:focus, .window-titlebar-menu-button:focus-visible, .window-titlebar-action-button:focus, .window-titlebar-action-button:focus-visible { + outline: none; + box-shadow: none; +} +.window-titlebar-menu-dropdown { + position: absolute; + top: 30px; + left: 0; + min-width: 210px; + padding: 6px; + display: flex; + flex-direction: column; + gap: 2px; + background-color: var(--vscode-menu-background, var(--vscode-editorWidget-background)); + border: 1px solid var(--vscode-menu-border, var(--vscode-panel-border)); + border-radius: 6px; + box-shadow: var(--vscode-widget-shadow, 0 8px 24px rgba(0, 0, 0, 0.4)); + app-region: no-drag; + -webkit-app-region: no-drag; + z-index: 10; +} +.window-titlebar-menu-item { + border: none; + background: transparent; + color: var(--vscode-menu-foreground, var(--vscode-foreground)); + display: flex; + align-items: center; + justify-content: space-between; + gap: 16px; + text-align: left; + border-radius: 4px; + padding: 6px 8px; + font-size: 12px; + cursor: pointer; +} +.window-titlebar-menu-item:focus, .window-titlebar-menu-item:focus-visible { + outline: none; + box-shadow: none; + background-color: var(--vscode-toolbar-hoverBackground); +} +.window-titlebar-menu-item:hover, .window-titlebar-menu-item.is-keyboard-active { + background-color: var(--vscode-menu-selectionBackground, var(--vscode-toolbar-hoverBackground)); +} +.window-titlebar-menu-item-accelerator { + opacity: 0.8; +} +.window-titlebar-menu-separator { + height: 1px; + margin: 4px 2px; + background-color: var(--vscode-menu-separatorBackground, rgba(255, 255, 255, 0.08)); +} +.window-titlebar-drag-region { + flex: 1; + height: 100%; +} +.window-titlebar-title { + position: absolute; + left: 50%; + transform: translateX(-50%); + max-width: 45%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; + color: var(--vscode-titleBar-activeForeground); + font-size: 12px; + font-weight: 500; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + user-select: none; + pointer-events: none; +} +.window-titlebar-actions { + height: 100%; + display: flex; + align-items: center; + margin-right: 6px; + app-region: no-drag; + -webkit-app-region: no-drag; +} +.window-titlebar-action-button { + display: flex; + align-items: center; + justify-content: center; + width: 30px; + height: 30px; + padding: 0; + line-height: 0; + background: transparent; + border: none; + color: var(--vscode-foreground); + cursor: pointer; + border-radius: 4px; +} +.window-titlebar-sidebar-icon, .window-titlebar-panel-icon, .window-titlebar-assistant-icon { + width: 14px; + height: 14px; + border: 1.5px solid currentColor; + border-radius: 2px; + display: block; + position: relative; + overflow: hidden; +} +.window-titlebar-sidebar-icon::before { + content: ""; + position: absolute; + top: 0; + bottom: 0; + left: 33.3333%; + width: 1.5px; + transform: translateX(-50%); + background-color: currentColor; +} +.window-titlebar-panel-icon::before { + content: ""; + position: absolute; + left: 0; + right: 0; + top: 66.6667%; + height: 1.5px; + transform: translateY(-50%); + background-color: currentColor; +} +.window-titlebar-assistant-icon::before { + content: ""; + position: absolute; + top: 0; + bottom: 0; + left: 66.6667%; + width: 1.5px; + transform: translateX(-50%); + background-color: currentColor; +} +.window-titlebar-sidebar-pane, .window-titlebar-panel-pane, .window-titlebar-assistant-pane { + position: absolute; + background-color: currentColor; + transition: opacity 120ms ease; +} +.window-titlebar-sidebar-pane { + left: 0; + top: 0; + width: 33.3333%; + height: 100%; +} +.window-titlebar-panel-pane { + left: 0; + bottom: 0; + width: 100%; + height: 33.3333%; +} +.window-titlebar-assistant-pane { + right: 0; + top: 0; + width: 33.3333%; + height: 100%; +} +.window-titlebar-sidebar-icon.is-inactive .window-titlebar-sidebar-pane, .window-titlebar-panel-icon.is-inactive .window-titlebar-panel-pane, .window-titlebar-assistant-icon.is-inactive .window-titlebar-assistant-pane { + opacity: 0; +} +.panel-shell { + height: 200px; + border-top: 1px solid var(--vscode-panel-border); + background: var(--vscode-panel-background); + display: flex; + flex-direction: column; +} +.panel-shell.is-hidden { + display: none; +} +.editor-toolbar-button.is-destructive { + color: #f48771; +} +.shell-overlay-backdrop, .gallery-overlay-backdrop { + position: fixed; + inset: 0; + background: rgba(0, 0, 0, 0.68); + display: flex; + align-items: center; + justify-content: center; + pointer-events: auto; + z-index: 10000; +} +.shell-overlay-dismiss { + position: absolute; + inset: 0; + border: none; + background: transparent; + padding: 0; +} +.gallery-overlay { + position: relative; + width: min(980px, calc(100vw - 48px)); + max-height: calc(100vh - 48px); + display: flex; + flex-direction: column; + overflow: hidden; + background: #1e1e1e; + border: 1px solid #3c3c3c; + border-radius: 8px; + box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4); + z-index: 1; +} +.insert-modal-media-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); + gap: 12px; + padding: 16px; +} +.insert-modal-media-item { + display: flex; + flex-direction: column; + gap: 8px; + border: 1px solid #3c3c3c; + border-radius: 8px; + background: #252526; + color: inherit; + padding: 10px; + text-align: left; +} +.insert-modal-media-thumb { + width: 100%; + min-height: 112px; + border-radius: 6px; + object-fit: cover; + background: rgba(255, 255, 255, 0.04); +} +.insert-modal-media-title { + font-weight: 600; + color: #ffffff; +} +.language-picker-options { + display: flex; + flex-direction: column; + gap: 8px; +} +.language-picker-option { + width: 100%; + display: grid; + grid-template-columns: 28px 1fr auto; + gap: 12px; + align-items: center; + border: none; + border-radius: 4px; + padding: 12px 16px; + background: transparent; + color: inherit; + text-align: left; +} +.language-picker-label, .language-picker-status, .lightbox-counter { + color: #9d9d9d; + font-size: 12px; +} +.lightbox-counter { + margin-top: 4px; +} +@media (max-width: 720px) { + .insert-modal-media-grid { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } +} +.panel-header { + height: 35px; + display: flex; + align-items: center; + justify-content: space-between; + padding: 0 8px; + background-color: var(--vscode-sideBar-background); + border-bottom: 1px solid var(--vscode-panel-border); +} +.panel-tabs { + display: flex; + align-items: stretch; + height: 100%; +} +.panel-tab { + border: none; + background: transparent; + color: var(--vscode-descriptionForeground); + padding: 0 12px; + cursor: pointer; +} +.panel-tab.active { + color: var(--vscode-tab-activeForeground); +} +.panel-close { + background: transparent; + border: none; + color: var(--vscode-descriptionForeground); + font-size: 18px; + width: 24px; + height: 24px; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + border-radius: 4px; + padding: 0; +} +.panel-close:hover { + background-color: var(--vscode-list-hoverBackground); + color: var(--vscode-editor-foreground); +} +.panel-content { + flex: 1; + overflow: auto; + padding: 12px 14px; +} +.panel-entry, .assistant-card { + display: flex; + flex-direction: column; + gap: 4px; + padding: 10px 12px; + border-bottom: 1px solid var(--vscode-panel-border); +} +.output-list, .git-log-list { + display: flex; + flex-direction: column; +} +.task-list { + display: flex; + flex-direction: column; +} +.task-entry-header { + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; +} +.task-status { + font-size: 11px; + text-transform: uppercase; + letter-spacing: 0.04em; + color: var(--vscode-descriptionForeground); +} +.task-status-running { + color: var(--vscode-terminal-ansiGreen, var(--vscode-statusBar-foreground)); +} +.task-status-pending { + color: var(--vscode-terminal-ansiYellow, var(--vscode-statusBar-foreground)); +} +.panel-empty-state { + min-height: 100%; + justify-content: center; +} +.status-bar { + height: 22px; + background: var(--vscode-statusBar-background); + color: var(--vscode-statusBar-foreground); + display: flex; + align-items: center; + justify-content: space-between; + padding: 0 8px; + font-size: 12px; + flex-shrink: 0; +} +.status-bar-left, .status-bar-right { + display: flex; + align-items: center; + gap: 4px; + flex-shrink: 0; +} +.status-bar-left { + flex-shrink: 1; + min-width: 0; +} +.status-shell-controls { + display: flex; + align-items: stretch; + gap: 2px; + flex-shrink: 0; +} +.status-shell-toggle-button { + display: flex; + align-items: center; + justify-content: center; + width: 22px; + height: 100%; + padding: 0; + line-height: 0; + background: transparent; + border: none; + color: inherit; + cursor: pointer; + border-radius: 3px; +} +.status-shell-toggle-button:hover { + background-color: rgba(255, 255, 255, 0.1); +} +.status-shell-toggle-button:focus, .status-shell-toggle-button:focus-visible { + outline: none; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.45); +} +.status-shell-toggle-button .window-titlebar-sidebar-icon, .status-shell-toggle-button .window-titlebar-panel-icon, .status-shell-toggle-button .window-titlebar-assistant-icon { + width: 12px; + height: 12px; +} +.status-bar-item { + display: flex; + align-items: center; + gap: 6px; + padding: 0 8px; + height: 100%; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} +.status-bar-item:hover { + background-color: rgba(255, 255, 255, 0.1); +} +.status-bar-task-button { + border: none; + background: transparent; + color: inherit; + cursor: pointer; +} +.task-message-text { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + min-width: 0; +} +.status-bar-item.theme-badge { + border: 1px solid rgba(255, 255, 255, 0.18); + border-radius: 3px; +} +.status-bar-item.language-badge { + border: 1px solid rgba(255, 255, 255, 0.18); + border-radius: 3px; + gap: 4px; +} +.status-bar-item.offline-badge { + border: none; + background: transparent; + color: inherit; + cursor: pointer; + opacity: 0.4; + font-size: 13px; + padding: 0 4px; +} +.status-bar-item.offline-badge.active { + background-color: rgba(255, 196, 0, 0.28); + opacity: 1; +} +.project-selector { + position: relative; + flex-shrink: 0; +} +.project-selector-trigger { + display: flex; + align-items: center; + gap: 6px; + padding: 0 8px; + height: 22px; + background: transparent; + border: none; + color: var(--vscode-statusBar-foreground); + cursor: pointer; + font-size: 12px; + text-align: left; +} +.project-selector-trigger:hover { + background-color: rgba(255, 255, 255, 0.1); +} +.project-selector-trigger:focus { + outline: none; +} +.project-icon, .dropdown-arrow, .project-check-icon { + flex-shrink: 0; +} +.project-name, .project-item-name { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.project-name { + max-width: 180px; +} +.dropdown-arrow { + opacity: 0.6; +} +.project-dropdown { + position: absolute; + left: 0; + bottom: 100%; + min-width: 220px; + margin-bottom: 4px; + background-color: #252526; + border: 1px solid rgba(255, 255, 255, 0.16); + border-radius: 4px; + box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.3); + z-index: 1000; + overflow: hidden; +} +.project-dropdown-header { + padding: 8px 12px; + font-size: 11px; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.5px; + color: var(--vscode-descriptionForeground); + border-bottom: 1px solid rgba(255, 255, 255, 0.12); +} +.project-list { + max-height: 200px; + overflow-y: auto; +} +.project-item { + display: flex; + align-items: center; + width: 100%; + gap: 8px; + padding: 8px 12px; + border: none; + background: transparent; + color: inherit; + cursor: pointer; +} +.project-item:hover, .project-item.active { + background-color: var(--vscode-list-hoverBackground); +} +.project-item.active .project-check-icon { + color: #89d185; +} +.project-dropdown-footer { + padding: 8px; + border-top: 1px solid rgba(255, 255, 255, 0.12); + display: grid; + gap: 6px; +} +.create-project-btn, .existing-project-btn { + display: flex; + align-items: center; + justify-content: center; + gap: 6px; + width: 100%; + padding: 6px 12px; + background-color: rgba(255, 255, 255, 0.12); + color: inherit; + border: none; + border-radius: 4px; + font-size: 12px; + cursor: pointer; +} +.create-project-btn:hover, .existing-project-btn:hover { + background-color: rgba(255, 255, 255, 0.18); +} +.status-bar-language-select { + background: transparent; + border: none; + color: inherit; + font: inherit; + padding: 0; +} +.status-bar-language-select:focus { + outline: none; +} +.status-bar-count { + font-size: 11px; + opacity: 0.85; +} +.status-bar-item.brand { + font-weight: 600; +} +@media (max-width: 960px) { + .editor-frame { + grid-template-columns: minmax(0, 1fr); + } + .editor-meta { + border-left: none; + border-top: 1px solid var(--vscode-panel-border); + padding-left: 0; + padding-top: 10px; + } +} +.editor-section ul { + margin: 12px 0 0; + padding-left: 18px; +} +.editor-toolbar { + display: flex; + gap: 10px; +} +.editor-toolbar button { + padding: 9px 14px; + border: 1px solid var(--line); + border-radius: 999px; + background: var(--panel-3); + color: var(--ink); +} +.editor-meta { + display: flex; + flex-direction: column; + gap: 12px; +} +.editor-meta-card, .assistant-card, .panel-entry { + padding: 16px; +} +.sidebar-header, .assistant-header, .panel-header { + display: flex; + justify-content: space-between; + gap: 12px; + padding: 16px 18px; + border-bottom: 1px solid var(--line); +} +.activity-bar { + width: 48px; + height: 100%; + background-color: var(--vscode-activityBar-background); + display: flex; + flex-direction: column; + justify-content: space-between; + border-right: 1px solid var(--vscode-panel-border); +} +.activity-bar-top, .activity-bar-bottom { + display: flex; + flex-direction: column; + align-items: center; + padding: 4px 0; +} +.activity-bar-item { + width: 48px; + height: 48px; + display: flex; + align-items: center; + justify-content: center; + background: transparent; + border: none; + color: var(--vscode-activityBar-foreground); + opacity: 0.6; + cursor: pointer; + position: relative; + padding: 0; + border-radius: 0; +} +.activity-bar-item:hover { + opacity: 1; + background: transparent; +} +.activity-bar-item.active { + opacity: 1; +} +.activity-bar-item.active::before { + content: ""; + position: absolute; + left: 0; + top: 0; + bottom: 0; + width: 2px; + background-color: var(--vscode-activityBar-foreground); +} +.activity-bar-badge { + position: absolute; + top: 8px; + right: 8px; + min-width: 16px; + height: 16px; + padding: 0 4px; + font-size: 10px; + font-weight: 600; + background-color: var(--vscode-activityBarBadge-background); + color: var(--vscode-activityBarBadge-foreground); + border-radius: 8px; + display: flex; + align-items: center; + justify-content: center; +} +.activity-bar-item svg, .tab-icon svg { + display: block; +} +.sidebar-shell, .assistant-sidebar-shell { + display: flex; + min-width: 0; +} +.sidebar-shell { + width: var(--sidebar-width); +} +.assistant-sidebar-shell { + width: var(--assistant-width); +} +.sidebar, .assistant-sidebar { + width: 100%; + height: 100%; + background: var(--vscode-sideBar-background); + display: flex; + flex-direction: column; + min-width: 0; +} +.sidebar { + border-right: 1px solid var(--vscode-sideBar-border); +} +.assistant-sidebar { + border-left: 1px solid var(--vscode-sideBar-border); +} +.sidebar-shell.is-hidden, .assistant-sidebar-shell.is-hidden { + width: 0; + overflow: hidden; +} +.sidebar-shell.is-hidden .resizable-panel-divider, .assistant-sidebar-shell.is-hidden .resizable-panel-divider { + display: none; +} +.resizable-panel-divider { + width: 4px; + cursor: col-resize; + background: transparent; + position: relative; +} +.resizable-panel-divider:hover::after { + background-color: var(--vscode-focusBorder); +} +.resizable-panel-divider::after { + content: ""; + position: absolute; + top: 0; + bottom: 0; + left: 1px; + width: 1px; + background-color: var(--vscode-panel-border); +} +.assistant-header { + padding: 10px 12px; + border-bottom: 1px solid var(--vscode-panel-border); +} +.assistant-header { + display: flex; + flex-direction: column; + gap: 2px; +} +.assistant-card span, .panel-entry span, .editor-meta-row span, .editor-subtitle, .sidebar-item span { + color: var(--vscode-descriptionForeground); +} +.sidebar-content, .assistant-content { + flex: 1; + overflow: auto; + padding: 8px 0; +} +.sidebar-section { + padding-bottom: 10px; +} +.sidebar-section-header { + padding: 0 12px 6px; + font-size: 11px; + text-transform: uppercase; + letter-spacing: 0.04em; + color: var(--vscode-descriptionForeground); +} +.sidebar-item { + width: 100%; + display: flex; + flex-direction: column; + align-items: flex-start; + gap: 2px; + padding: 7px 12px; + border: none; + cursor: pointer; + border-radius: 4px; + background: var(--vscode-sideBar-background); + color: var(--vscode-foreground); +} +.sidebar-item:hover { + background: var(--vscode-list-hoverBackground); +} +.sidebar-item.selected { + outline: 1px solid var(--vscode-focusBorder); + background: var(--vscode-list-activeSelectionBackground); + color: var(--vscode-list-activeSelectionForeground); +} +.sidebar-badge { + margin-top: 2px; + padding: 1px 6px; + border-radius: 10px; + background: rgba(110, 203, 139, 0.16); + color: var(--vscode-testing-iconPassed); +} +.sidebar-content { + overflow-y: auto; + overflow-x: hidden; + padding: 0; +} +.sidebar-section { + margin-bottom: 4px; + padding-bottom: 0; +} +.sidebar-section-header { + display: flex; + align-items: center; + justify-content: space-between; + padding: 8px 12px; + font-size: 11px; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.5px; + color: var(--vscode-sideBar-foreground); +} +.sidebar-section-title { + display: flex; + align-items: center; + gap: 6px; + padding: 4px 12px; + font-size: 12px; + color: var(--vscode-descriptionForeground); +} +.section-icon { + font-size: 8px; +} +.section-icon.status-draft { + color: var(--vscode-editorWarning-foreground); +} +.section-icon.status-published { + color: var(--vscode-testing-iconPassed); +} +.section-icon.status-archived { + color: var(--vscode-descriptionForeground); +} +.sidebar-list { + display: flex; + flex-direction: column; +} +.sidebar-item-row { + display: flex; + align-items: stretch; +} +.sidebar-item { + width: 100%; + display: flex; + align-items: flex-start; + gap: 8px; + padding: 6px 12px 6px 12px; + border: none; + border-left: 2px solid transparent; + border-radius: 0; + background: transparent; + color: inherit; + cursor: pointer; + text-align: left; +} +.sidebar-item:hover { + background-color: var(--vscode-list-hoverBackground); +} +.sidebar-item.selected { + background-color: var(--vscode-list-activeSelectionBackground); + border-left-color: var(--vscode-focusBorder); + color: var(--vscode-list-activeSelectionForeground); +} +.sidebar-post-item { + flex-direction: row; +} +.sidebar-item.post-type-picture { + background: linear-gradient(90deg, rgba(139, 92, 246, 0.05) 0%, transparent 100%); +} +.sidebar-item.post-type-aside { + background: linear-gradient(90deg, rgba(245, 158, 11, 0.05) 0%, transparent 100%); +} +.sidebar-item.post-type-quote { + background: linear-gradient(90deg, rgba(34, 197, 94, 0.05) 0%, transparent 100%); +} +.sidebar-item.post-type-link { + background: linear-gradient(90deg, rgba(59, 130, 246, 0.05) 0%, transparent 100%); +} +.sidebar-item.post-type-video { + background: linear-gradient(90deg, rgba(239, 68, 68, 0.05) 0%, transparent 100%); +} +.post-type-icon { + font-size: 14px; + line-height: 1.4; + flex-shrink: 0; + opacity: 0.85; +} +.sidebar-item-content { + display: flex; + flex: 1; + min-width: 0; + flex-direction: column; +} +.sidebar-item-title-row { + display: flex; + align-items: center; + gap: 6px; +} +.sidebar-item-title { + font-size: 13px; + color: var(--vscode-sideBar-foreground); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.sidebar-item-language-badge { + flex-shrink: 0; + min-width: 18px; + padding: 1px 5px; + border-radius: 999px; + background: var(--vscode-badge-background); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-badge-background) 82%, transparent); + } + color: var(--vscode-badge-foreground); + font-size: 10px; + font-weight: 700; + text-align: center; +} +.sidebar-item-meta { + font-size: 11px; + color: var(--vscode-descriptionForeground); + margin-top: 2px; +} +.media-grid { + display: grid; + grid-template-columns: 1fr; + gap: 2px; + padding: 4px; +} +.media-item-row { + display: flex; + align-items: stretch; + gap: 4px; +} +.media-item { + display: flex; + align-items: center; + gap: 8px; + width: 100%; + padding: 6px 8px; + border: none; + border-radius: 4px; + background: transparent; + color: inherit; + text-align: left; +} +.media-item:hover { + background-color: var(--vscode-list-hoverBackground); +} +.media-item.selected { + background-color: var(--vscode-list-activeSelectionBackground); + color: var(--vscode-list-activeSelectionForeground); +} +.media-thumbnail { + width: 40px; + height: 40px; + display: flex; + align-items: center; + justify-content: center; + background-color: var(--vscode-input-background); + border-radius: 4px; + flex-shrink: 0; + overflow: hidden; + font-size: 20px; +} +.media-thumbnail.has-image { + position: relative; +} +.media-thumbnail-fallback { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + height: 100%; +} +.media-thumbnail-image { + position: absolute; + inset: 0; + width: 100%; + height: 100%; + object-fit: cover; + opacity: 0; + transition: opacity 0.15s ease; +} +.media-thumbnail.is-loaded .media-thumbnail-image { + opacity: 1; +} +.media-thumbnail.is-loaded .media-thumbnail-fallback { + opacity: 0; +} +.media-item-info { + flex: 1; + min-width: 0; +} +.media-item-name { + font-size: 12px; + color: var(--vscode-sideBar-foreground); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.media-item-size { + font-size: 10px; + color: var(--vscode-descriptionForeground); +} +.sidebar-item-row .sidebar-item, .media-item-row .media-item { + flex: 1; + min-width: 0; +} +.sidebar-actions { + display: flex; + gap: 4px; +} +.sidebar-action { + background: transparent; + border: none; + padding: 2px; + color: var(--vscode-sideBar-foreground); + cursor: pointer; + opacity: 0.7; + display: flex; + align-items: center; + justify-content: center; + border-radius: 3px; +} +.sidebar-action:hover { + opacity: 1; + background-color: var(--vscode-list-hoverBackground); +} +.sidebar-action.active { + background-color: var(--vscode-list-activeSelectionBackground); + opacity: 1; +} +.search-box { + display: flex; + align-items: center; + gap: 4px; + padding: 4px 12px 8px; + position: relative; +} +.search-box input { + flex: 1; + min-width: 0; + padding: 6px 28px 6px 8px; + font-size: 12px; + background-color: var(--vscode-input-background); + border: 1px solid var(--vscode-input-border); + color: var(--vscode-input-foreground); + border-radius: 3px; +} +.search-box input::placeholder { + color: var(--vscode-input-placeholderForeground); +} +.search-box input:focus { + outline: none; + border-color: var(--vscode-focusBorder); +} +.search-box button[type="submit"] { + position: absolute; + right: 40px; + background: transparent; + border: none; + padding: 4px; + color: var(--vscode-descriptionForeground); + cursor: pointer; + opacity: 0.7; +} +.search-box button[type="submit"]:hover { + opacity: 1; +} +.search-box .clear-search { + position: absolute; + right: 16px; + background: transparent; + border: none; + padding: 4px; + color: var(--vscode-descriptionForeground); + cursor: pointer; + font-size: 10px; + opacity: 0.7; +} +.search-box .clear-search:hover { + opacity: 1; +} +.calendar-view { + padding: 8px 12px; + border-bottom: 1px solid var(--vscode-sideBar-border); +} +.calendar-header { + display: flex; + align-items: center; + justify-content: space-between; + font-size: 11px; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.5px; + color: var(--vscode-descriptionForeground); + margin-bottom: 8px; +} +.calendar-header.collapsible-header { + cursor: pointer; + padding: 4px 6px; + margin: 0 -6px 8px -6px; + border-radius: 3px; + user-select: none; +} +.calendar-header.collapsible-header:hover { + background-color: var(--vscode-list-hoverBackground); +} +.calendar-header.collapsible-header.collapsed { + margin-bottom: 0; +} +.calendar-header .collapse-icon { + font-size: 9px; + margin-right: 4px; + opacity: 0.7; +} +.calendar-header .clear-filter { + background: transparent; + border: none; + color: var(--vscode-descriptionForeground); + cursor: pointer; + font-size: 10px; + padding: 2px 4px; + opacity: 0.7; +} +.calendar-header .clear-filter:hover { + opacity: 1; +} +.calendar-years { + display: flex; + flex-direction: column; + gap: 2px; +} +.calendar-year-header { + display: flex; + align-items: center; + gap: 6px; + padding: 4px 6px; + cursor: pointer; + border-radius: 3px; + font-size: 12px; + color: var(--vscode-sideBar-foreground); + background: transparent; + text-align: left; +} +.calendar-year-header:hover { + background-color: var(--vscode-list-hoverBackground); +} +.calendar-year-header.selected { + background-color: var(--vscode-list-activeSelectionBackground); +} +.calendar-year-header .expand-icon { + font-size: 8px; + color: var(--vscode-descriptionForeground); + width: 10px; +} +.calendar-year-header .year-label { + flex: 1; +} +.calendar-year-header .year-count { + font-size: 10px; + color: var(--vscode-descriptionForeground); + background-color: var(--vscode-badge-background); + padding: 1px 6px; + border-radius: 8px; +} +.calendar-months { + display: flex; + flex-direction: column; + gap: 1px; + padding-left: 16px; + margin-top: 2px; +} +.calendar-month { + display: flex; + align-items: center; + justify-content: space-between; + padding: 3px 6px; + cursor: pointer; + border-radius: 3px; + font-size: 12px; + color: var(--vscode-sideBar-foreground); + background: transparent; + text-align: left; +} +.calendar-month:hover { + background-color: var(--vscode-list-hoverBackground); +} +.calendar-month.selected { + background-color: var(--vscode-list-activeSelectionBackground); +} +.calendar-month .month-count { + font-size: 10px; + color: var(--vscode-descriptionForeground); +} +.calendar-empty { + font-size: 12px; + color: var(--vscode-descriptionForeground); + padding: 8px; + text-align: center; +} +.month-count, .sidebar-section-count { + font-size: 10px; + color: var(--vscode-descriptionForeground); +} +.filter-panel { + padding: 8px 12px; + border-bottom: 1px solid var(--vscode-sideBar-border); +} +.filter-section { + margin-bottom: 12px; +} +.filter-section:last-child { + margin-bottom: 0; +} +.filter-header { + display: flex; + align-items: center; + font-size: 11px; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.5px; + color: var(--vscode-descriptionForeground); + margin-bottom: 6px; +} +.filter-header.collapsible-header { + cursor: pointer; + padding: 4px 6px; + margin: 0 -6px 6px -6px; + border-radius: 3px; + user-select: none; +} +.filter-header.collapsible-header:hover { + background-color: var(--vscode-list-hoverBackground); +} +.filter-header.collapsible-header.collapsed { + margin-bottom: 0; +} +.filter-header .collapse-icon { + font-size: 9px; + margin-right: 4px; + opacity: 0.7; +} +.filter-header .clear-filter { + background: transparent; + border: none; + color: var(--vscode-descriptionForeground); + cursor: pointer; + font-size: 10px; + padding: 2px 4px; + margin-left: auto; + opacity: 0.7; +} +.filter-header .clear-filter:hover { + opacity: 1; +} +.filter-chips { + display: flex; + flex-wrap: wrap; + gap: 4px; +} +.filter-chip { + background-color: var(--vscode-button-secondaryBackground); + color: var(--vscode-button-secondaryForeground); + border: none; + padding: 2px 8px; + font-size: 11px; + border-radius: 12px; + cursor: pointer; + transition: background-color 0.15s, opacity 0.15s; +} +.filter-chip:hover { + background-color: var(--vscode-button-secondaryHoverBackground); +} +.filter-chip.active { + background-color: var(--vscode-button-background); + color: var(--vscode-button-foreground); +} +.filter-chip.has-color { + border: 1px solid transparent; +} +.filter-chip.has-color:hover { + opacity: 0.85; +} +.filter-chip.has-color.active { + box-shadow: 0 0 0 2px var(--vscode-focusBorder, #007fd4); +} +.filter-status { + display: flex; + align-items: center; + justify-content: space-between; + padding: 6px 12px; + font-size: 11px; + color: var(--vscode-descriptionForeground); + background-color: var(--vscode-list-hoverBackground); + border-bottom: 1px solid var(--vscode-sideBar-border); +} +.filter-status button { + background: transparent; + border: none; + color: var(--accent-color); + cursor: pointer; + font-size: 11px; + padding: 0; +} +.filter-status button:hover { + text-decoration: underline; + background: transparent; +} +.sidebar-load-more { + padding: 12px 16px; + display: flex; + justify-content: center; +} +.load-more-button { + width: 100%; + padding: 8px 16px; + background-color: var(--vscode-button-secondaryBackground); + color: var(--vscode-button-secondaryForeground); + border: none; + border-radius: 4px; + font-size: 12px; + cursor: pointer; + transition: background-color 0.2s; +} +.load-more-button:hover:not(:disabled) { + background-color: var(--vscode-button-secondaryHoverBackground); +} +.filter-section { + padding-top: 4px; +} +.filter-header { + width: 100%; + padding: 6px 0; + background: transparent; + color: var(--vscode-foreground); + text-align: left; +} +.filter-chips { + flex-direction: row; + flex-wrap: wrap; +} +.filter-chip { + padding: 5px 10px; + border-radius: 999px; + background: var(--vscode-input-background); + color: var(--vscode-foreground); +} +.filter-status { + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; + color: var(--vscode-descriptionForeground); + font-size: 12px; +} +.filter-status button, .load-more-button { + padding: 6px 10px; + border-radius: 6px; + background: var(--vscode-input-background); + color: var(--vscode-foreground); +} +.sidebar-load-more { + padding-bottom: 12px; +} +.load-more-button { + width: 100%; +} +.media-item-info { + display: flex; + flex-direction: column; + gap: 2px; +} +.media-item-name { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.media-item-size { + color: var(--vscode-descriptionForeground); + font-size: 12px; +} +.chat-list-item { + display: flex; + align-items: center; + width: 100%; + padding: 8px 12px; + border: none; + border-bottom: 1px solid var(--vscode-sideBar-border); + background: transparent; + color: inherit; + text-align: left; +} +.chat-list-item:hover { + background: var(--vscode-list-hoverBackground); +} +.chat-list-item.active { + background: var(--vscode-list-activeSelectionBackground); + color: var(--vscode-list-activeSelectionForeground); +} +.chat-item-content { + display: flex; + flex: 1; + min-width: 0; + flex-direction: column; + gap: 2px; +} +.chat-item-open { + display: flex; + flex: 1; + min-width: 0; + padding: 0; + border: none; + background: transparent; + color: inherit; + text-align: left; +} +.chat-item-open:hover { + background: transparent; +} +.chat-item-open:focus-visible { + outline: 1px solid var(--vscode-focusBorder); + outline-offset: 2px; +} +.chat-item-title { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.chat-item-date { + color: var(--vscode-descriptionForeground); + font-size: 12px; +} +.sidebar-delete-button { + background: transparent; + border: none; + color: var(--vscode-descriptionForeground); + cursor: pointer; + font-size: 16px; + line-height: 1; + padding: 0 6px; + flex-shrink: 0; + opacity: 1; + transition: opacity 0.15s, color 0.15s; +} +.sidebar-item-row:hover .sidebar-delete-button, .sidebar-item-row .sidebar-item.selected ~ .sidebar-delete-button, .media-item-row:hover .sidebar-delete-button, .media-item-row .media-item.selected ~ .sidebar-delete-button, .chat-list-item:hover .sidebar-delete-button, .chat-list-item.active .sidebar-delete-button { + opacity: 1; +} +.sidebar-delete-button:hover { + color: var(--vscode-errorForeground); +} +.sidebar-item-row .sidebar-item.selected ~ .sidebar-delete-button, .media-item-row .media-item.selected ~ .sidebar-delete-button { + background-color: var(--vscode-list-activeSelectionBackground); + color: var(--vscode-list-activeSelectionForeground); +} +.settings-nav-list { + display: flex; + flex-direction: column; + gap: 6px; + padding: 0 12px 12px; +} +.settings-nav-entry { + display: flex; + align-items: center; + gap: 10px; + width: 100%; + padding: 10px 12px; + border: none; + border-radius: 10px; + background: transparent; + color: inherit; + text-align: left; +} +.settings-nav-entry:hover { + background: var(--vscode-list-hoverBackground); +} +.settings-nav-entry-icon { + width: 18px; + flex: 0 0 18px; + text-align: center; +} +.sidebar-empty { + padding: 16px 12px; + color: var(--vscode-descriptionForeground); +} +@media (max-width: 820px) { + .dashboard-stats { + grid-template-columns: 1fr; + } + .recent-post-item { + align-items: flex-start; + flex-wrap: wrap; + } + .media-grid { + grid-template-columns: 1fr; + } +} +.tab-bar { + display: flex; + align-items: center; + background-color: var(--vscode-editorGroupHeader-tabsBackground); + border-bottom: 1px solid var(--vscode-editorGroupHeader-tabsBorder); + height: 35px; + overflow: hidden; + flex-shrink: 0; + position: relative; +} +.tab-bar-tabs { + display: flex; + align-items: center; + height: 100%; + overflow-x: auto; + overflow-y: hidden; + flex: 1; +} +.tab-bar-tabs::-webkit-scrollbar { + height: 0; + display: none; +} +.tab-bar-empty { + display: flex; + align-items: center; + height: 100%; + padding: 0 12px; + color: var(--vscode-descriptionForeground); + font-size: 12px; +} +.tab { + display: flex; + align-items: center; + gap: 4px; + padding: 0 6px 0 10px; + height: 100%; + min-width: 100px; + max-width: 180px; + cursor: pointer; + background-color: var(--vscode-tab-inactiveBackground); + border: none; + border-right: 1px solid var(--vscode-tab-border); + color: var(--vscode-tab-inactiveForeground); + font-size: 13px; + user-select: none; + position: relative; + flex-shrink: 0; +} +.tab-select { + display: flex; + align-items: center; + gap: 4px; + min-width: 0; + flex: 1; + height: 100%; + padding: 0; + background: transparent; + border: none; + color: inherit; + font: inherit; + cursor: inherit; +} +.tab:hover { + background-color: var(--vscode-list-hoverBackground); +} +.tab.active { + background-color: var(--vscode-tab-activeBackground); + color: var(--vscode-tab-activeForeground); +} +.tab.active::after { + content: ""; + position: absolute; + top: 0; + left: 0; + right: 0; + height: 1px; + background-color: var(--vscode-focusBorder); +} +.tab.transient .tab-title { + font-style: italic; +} +.tab-actions { + display: flex; + align-items: center; + gap: 2px; + margin-left: auto; + flex-shrink: 0; +} +.tab-dirty-indicator { + color: var(--vscode-editorWarning-foreground, #e2c08d); + font-size: 10px; + line-height: 1; +} +.tab-icon { + display: flex; + align-items: center; + justify-content: center; + flex-shrink: 0; + opacity: 0.85; +} +.tab-title, .status-bar-item { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.tab-close { + width: 20px; + height: 20px; + display: flex; + align-items: center; + justify-content: center; + font-size: 15px; + line-height: 1; + color: var(--vscode-icon-foreground, #c5c5c5); + border-radius: 3px; + cursor: pointer; + flex-shrink: 0; + border: none; + background: transparent; + padding: 0; + opacity: 0; +} +.tab:hover .tab-close { + opacity: 0.7; +} +.tab.active .tab-close { + opacity: 0.7; +} +.tab-close:hover { + opacity: 1 !important; + background-color: var(--vscode-toolbar-hoverBackground); + color: var(--vscode-tab-activeForeground); +} +.tab-close:active { + background-color: var(--vscode-toolbar-activeBackground, rgba(99, 102, 103, 0.31)); +} +.tab.dirty .tab-dirty-indicator { + display: block; +} +.tab.dirty .tab-close { + display: none; +} +.tab.dirty:hover .tab-close { + display: flex; + opacity: 0.7; +} +.tab.dirty:hover .tab-dirty-indicator { + display: none; +} +.tab:focus-visible { + outline: 1px solid var(--vscode-focusBorder, #007fd4); + outline-offset: -1px; +} +.output-item-details { + margin: 4px 0 0; + padding: 8px; + border-radius: 4px; + background: rgba(255, 255, 255, 0.03); + color: inherit; + font: 11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; + white-space: pre-wrap; + user-select: text; +} +.editor-shell { + flex: 1; + min-height: 0; + overflow: auto; + background: var(--vscode-editor-background); +} +.editor-frame { + display: grid; + grid-template-columns: minmax(0, 1fr) 240px; + gap: 16px; + padding: 14px 16px; +} +.editor-main, .editor-meta, .panel-shell, .assistant-card { + min-width: 0; +} +.editor-kicker { + font-size: 11px; + text-transform: uppercase; + letter-spacing: 0.04em; + color: var(--vscode-descriptionForeground); +} +.editor-title { + margin: 10px 0 6px; + font-size: 24px; + font-weight: 600; +} +.editor-subtitle { + margin: 0 0 14px; +} +.editor-toolbar { + display: flex; + gap: 8px; + margin-bottom: 14px; +} +.editor-toolbar-button { + border: 1px solid var(--vscode-panel-border); + background: transparent; + color: var(--vscode-foreground); + padding: 4px 8px; + border-radius: 3px; +} +.editor-toolbar-button:hover, .panel-tab:hover { + background: var(--vscode-toolbar-hoverBackground); +} +.editor-section { + padding-top: 4px; +} +.editor-section h2 { + margin: 0 0 8px; + font-size: 16px; +} +.editor-list { + margin: 0; + padding-left: 18px; + line-height: 1.5; +} +.editor-list.compact li { + margin-bottom: 6px; +} +.editor-meta { + border-left: 1px solid var(--vscode-panel-border); + padding-left: 16px; +} +.editor-meta-row { + display: flex; + flex-direction: column; + gap: 3px; + padding: 10px 0; + border-bottom: 1px solid var(--vscode-panel-border); +} +.post-editor .post-editor-markdown-surface, .scripts-monaco.monaco-editor-shell, .templates-monaco.monaco-editor-shell { + min-height: 0; + background: var(--vscode-editor-background); + color: var(--vscode-editor-foreground); + border-color: var(--vscode-panel-border); +} +.post-editor .monaco-editor-instance, .scripts-monaco .monaco-editor-instance, .templates-monaco .monaco-editor-instance { + min-height: 0; + background: var(--vscode-editor-background); +} +.monaco-editor-shell .monaco-editor, .monaco-editor-shell .monaco-editor .margin, .monaco-editor-shell .monaco-editor-background, .monaco-editor-shell .monaco-editor .inputarea.ime-input { + background-color: var(--vscode-editor-background) !important; +} +.monaco-editor-shell .monaco-editor, .monaco-editor-shell .monaco-editor .view-line { + color: var(--vscode-editor-foreground) !important; +} +.monaco-editor-shell .monaco-editor .line-numbers { + color: var(--vscode-editorLineNumber-foreground, #858585) !important; +} +.monaco-editor-shell .monaco-editor .current-line, .monaco-editor-shell .monaco-editor .view-overlays .current-line { + border-color: var(--vscode-editor-lineHighlightBorder, transparent) !important; +} +.help-doc-view { + --doc-bg: var(--panel-1, #1e1e1e); + --doc-surface: var(--panel-2, #252526); + --doc-border: var(--line, #3c3c3c); + --doc-text: var(--vscode-editor-foreground, #d4d4d4); + --doc-muted: var(--vscode-descriptionForeground, #9da3ad); + --doc-link: var(--vscode-textLink-foreground, #9cdcfe); + --doc-code-bg: var(--vscode-textCodeBlock-background, rgba(0, 0, 0, 0.2)); + --doc-hover: var(--vscode-list-hoverBackground, rgba(255, 255, 255, 0.06)); +} +.help-doc-view .misc-editor-content { + padding: 0; + overflow: hidden; +} +.documentation-view, .documentation-scroll { + background: var(--doc-bg, var(--vscode-editor-background)); +} +.documentation-view { + display: flex; + flex-direction: column; + min-height: 0; + height: 100%; +} +.documentation-scroll { + flex: 1; + min-height: 0; + overflow: auto; + padding: 28px 24px 40px; +} +.documentation-content { + max-width: 920px; + margin: 0 auto; + color: var(--doc-text, var(--vscode-editor-foreground)); +} +.documentation-article, .help-doc-markdown { + background: var(--doc-surface); + padding: 18px 20px 24px; + border: 1px solid var(--doc-border); + border-radius: 10px; + box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18); +} +.documentation-content.markdown-body > .documentation-article > :first-child { + margin-top: 0; +} +.documentation-content.markdown-body > .documentation-article > :last-child { + margin-bottom: 0; +} +.documentation-content.markdown-body h1, .documentation-content.markdown-body h2, .documentation-content.markdown-body h3 { + color: var(--doc-text); + border-bottom: 1px solid var(--doc-border); + padding-bottom: 6px; + line-height: 1.25; +} +.documentation-content.markdown-body h1 { + font-size: 1.9rem; +} +.documentation-content.markdown-body h2 { + margin-top: 2rem; + font-size: 1.35rem; +} +.documentation-content.markdown-body h3 { + margin-top: 1.6rem; + font-size: 1.05rem; +} +.documentation-content.markdown-body p, .documentation-content.markdown-body li, .documentation-content.markdown-body td, .documentation-content.markdown-body th { + line-height: 1.6; +} +.documentation-content.markdown-body a { + color: var(--doc-link); + text-decoration-thickness: 1px; + text-underline-offset: 0.14em; +} +.documentation-content.markdown-body a:hover { + color: var(--doc-text); +} +.documentation-content.markdown-body hr { + border: 0; + border-top: 1px solid var(--doc-border); + opacity: 0.8; +} +.documentation-content.markdown-body code { + background: var(--doc-code-bg); + padding: 0.12em 0.4em; + border-radius: 4px; + font: 0.92em/1.45 "SFMono-Regular", Menlo, Monaco, Consolas, monospace; +} +.documentation-content.markdown-body pre { + margin: 0.9rem 0 1.2rem; + background: var(--doc-code-bg); + border: 1px solid var(--doc-border); + border-radius: 8px; + padding: 14px 16px; + overflow: auto; +} +.documentation-content.markdown-body pre code { + padding: 0; + background: transparent; + font-size: 0.9em; +} +.documentation-content.markdown-body blockquote { + margin: 1rem 0; + padding: 0 0 0 12px; + border-left: 3px solid var(--doc-border); + color: var(--doc-muted); +} +.documentation-content.markdown-body table { + width: 100%; + margin: 1rem 0 1.4rem; + border-collapse: collapse; + display: table; +} +.documentation-content.markdown-body th, .documentation-content.markdown-body td { + border: 1px solid var(--doc-border); + padding: 8px 10px; + text-align: left; + vertical-align: top; +} +.documentation-content.markdown-body th { + background: var(--doc-hover); + font-weight: 700; +} +.documentation-content.markdown-body ul, .documentation-content.markdown-body ol { + margin: 0.85rem 0 1rem; + padding-left: 1.5rem; + display: block; +} +.documentation-content.markdown-body ul { + list-style: disc; +} +.documentation-content.markdown-body ol { + list-style: decimal; +} +.documentation-content.markdown-body li { + margin: 0.3rem 0; +} +.documentation-content.markdown-body li > ul, .documentation-content.markdown-body li > ol { + margin-top: 0.35rem; + margin-bottom: 0.35rem; +} +.documentation-content.markdown-body strong { + color: var(--doc-text); +} +.documentation-content.markdown-body img { + max-width: 100%; + height: auto; +} +.post-editor, .scripts-view-shell, .templates-view-shell { + flex: 1; + display: flex; + flex-direction: column; + background-color: var(--vscode-editor-background); + overflow: hidden; +} +.post-editor .editor-tab-dirty { + color: var(--vscode-notificationsWarningIcon-foreground, var(--vscode-editorWarning-foreground)); + font-size: 10px; +} +.post-editor .editor-tab-meta { + color: var(--vscode-descriptionForeground); + font-size: 11px; + white-space: nowrap; +} +.post-editor .quick-actions-wrapper { + position: relative; + display: inline-block; +} +.post-editor .quick-actions-btn { + display: flex; + align-items: center; + gap: 4px; + white-space: nowrap; +} +.post-editor .quick-actions-btn-icon { + font-size: 12px; + line-height: 1; +} +.post-editor .quick-actions-divider { + height: 1px; + background: var(--vscode-dropdown-border, #454545); +} +.post-editor .quick-action-icon { + font-size: 16px; + flex-shrink: 0; + margin-top: 2px; +} +.post-editor .quick-action-text strong { + font-size: 13px; + font-weight: 500; +} +.post-editor .quick-action-text small { + font-size: 11px; + opacity: 0.7; +} +.post-editor .status-badge, .scripts-view-shell .status-badge, .templates-view-shell .status-badge { + padding: 2px 8px; + border-radius: 10px; + font-size: 11px; + font-weight: 500; + text-transform: uppercase; +} +.post-editor .status-badge.status-draft, .scripts-view-shell .status-badge.status-draft, .templates-view-shell .status-badge.status-draft { + background-color: rgba(204, 167, 0, 0.2); + color: var(--vscode-notificationsWarningIcon-foreground, var(--vscode-editorWarning-foreground)); +} +.post-editor .status-badge.status-published, .scripts-view-shell .status-badge.status-published, .templates-view-shell .status-badge.status-published { + background-color: rgba(115, 201, 145, 0.2); + color: var(--vscode-testing-iconPassed); +} +.post-editor .status-badge.status-archived, .scripts-view-shell .status-badge.status-archived, .templates-view-shell .status-badge.status-archived { + background-color: rgba(133, 133, 133, 0.2); + color: var(--vscode-descriptionForeground); +} +.post-editor .auto-save-indicator { + font-size: 11px; + color: var(--vscode-descriptionForeground); + font-style: italic; +} +.post-editor .metadata-toggle { + display: flex; + align-items: center; + gap: 8px; + padding: 6px 4px; + background: none; + border: none; + color: var(--vscode-descriptionForeground); + font-size: 11px; + font-weight: 500; + text-transform: uppercase; + letter-spacing: 0.5px; + cursor: pointer; + transition: color 0.15s; + flex-shrink: 0; +} +.post-editor .metadata-toggle:hover { + color: var(--vscode-foreground); +} +.post-editor .metadata-toggle-chevron { + font-size: 10px; +} +.post-editor .editor-header-row.is-collapsed { + display: none; +} +.post-editor .editor-media-panel { + width: 200px; + flex-shrink: 0; +} +.post-editor .editor-field label, .post-editor .editor-body label, .post-editor .post-editor-links-label { + font-size: 11px; + font-weight: 500; + color: var(--vscode-descriptionForeground); + text-transform: uppercase; + letter-spacing: 0.5px; +} +.post-editor .editor-checkbox-label { + display: inline-flex; + align-items: center; + gap: 8px; + text-transform: none; + letter-spacing: 0; + color: var(--vscode-foreground); +} +.post-editor .post-editor-input.is-readonly { + opacity: 0.7; + cursor: not-allowed; +} +.post-editor .post-editor-excerpt { + min-height: 96px; +} +.post-editor .tag-input-container { + position: relative; + width: 100%; +} +.post-editor .tag-input-container.is-disabled { + opacity: 0.72; +} +.post-editor .tag-input-wrapper { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 6px; + padding: 6px 8px; + min-height: 38px; + border: 1px solid var(--vscode-input-border, #3c3c3c); + border-radius: 4px; + background: var(--vscode-input-background, #3c3c3c); + cursor: text; +} +.post-editor .tag-input-wrapper:focus-within { + border-color: var(--vscode-focusBorder, #007fd4); + outline: none; +} +.post-editor .tag-chip { + display: inline-flex; + align-items: center; + gap: 4px; + padding: 3px 8px; + font-size: 0.85rem; + background: var(--vscode-badge-background, #4d4d4d); + border: 1px solid var(--vscode-widget-border, #454545); + border-radius: 4px; + color: var(--vscode-badge-foreground, #ffffff); + white-space: nowrap; +} +.post-editor .tag-chip.has-color { + border-radius: 12px; + padding: 3px 10px; +} +.post-editor .tag-chip-remove { + display: inline-flex; + align-items: center; + justify-content: center; + width: 16px; + height: 16px; + padding: 0; + margin-left: 2px; + border: none; + background: transparent; + color: inherit; + font-size: 1rem; + line-height: 1; + cursor: pointer; + opacity: 0.6; + border-radius: 50%; + transition: opacity 0.15s, background 0.15s; +} +.post-editor .tag-chip-remove:hover { + opacity: 1; + background: rgba(0, 0, 0, 0.1); +} +.post-editor .tag-chip.has-color .tag-chip-remove:hover { + background: rgba(0, 0, 0, 0.2); +} +.post-editor .tag-input-field { + flex: 1; + min-width: 120px; + padding: 2px 4px; + border: none; + background: transparent; + color: var(--vscode-input-foreground, #cccccc); + font-family: inherit; + font-size: 0.9rem; + outline: none; +} +.post-editor .tag-input-field::placeholder { + color: var(--vscode-input-placeholderForeground, #a6a6a6); +} +.post-editor .tag-input-field:disabled { + cursor: not-allowed; +} +.post-editor .tag-suggestions { + position: absolute; + top: 100%; + left: 0; + right: 0; + margin-top: 4px; + padding: 4px; + background: var(--vscode-dropdown-background, #3c3c3c); + border: 1px solid var(--vscode-widget-border, #454545); + border-radius: 6px; + box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(0, 0, 0, 0.2); + z-index: 1000; + max-height: 240px; + overflow-y: auto; +} +.post-editor .tag-suggestion { + display: flex; + align-items: center; + gap: 8px; + width: 100%; + padding: 8px 12px; + border: none; + background: transparent; + color: var(--vscode-dropdown-foreground, #f0f0f0); + font-family: inherit; + font-size: 0.9rem; + text-align: left; + cursor: pointer; + border-radius: 4px; + transition: background 0.1s; +} +.post-editor .tag-suggestion:hover, .post-editor .tag-suggestion.selected { + background: var(--vscode-list-hoverBackground, #2a2d2e); +} +.post-editor .tag-suggestion-color { + width: 12px; + height: 12px; + border-radius: 50%; + flex-shrink: 0; +} +.post-editor .tag-suggestion-name { + flex: 1; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.post-editor .tag-suggestion.create-new { + border-top: 1px solid var(--vscode-widget-border, #454545); + margin-top: 4px; + padding: 6px 8px; + padding-top: 12px; + color: var(--vscode-notificationsInfoIcon-foreground, #75beff); +} +.post-editor .tag-suggestion.create-new:first-child { + border-top: none; + margin-top: 0; + padding-top: 8px; +} +.post-editor .tag-suggestion-icon { + display: inline-flex; + align-items: center; + justify-content: center; + width: 18px; + height: 18px; + border: 1px dashed currentColor; + border-radius: 4px; + font-size: 0.9rem; + font-weight: 600; +} +.post-editor .editor-language-row select { + flex: 1; + min-width: 0; +} +.post-editor .editor-translation-flag { + display: inline-flex; + align-items: center; + justify-content: center; + width: 24px; + height: 24px; + padding: 0; + border: 1px solid transparent; + border-radius: 999px; + background: transparent; + font-size: 14px; + line-height: 1; + cursor: pointer; + flex: 0 0 auto; +} +.post-editor .editor-translation-flag.status-draft { + opacity: 0.82; +} +.post-editor .editor-translation-flag.status-archived { + opacity: 0.45; + filter: grayscale(0.35); +} +.post-editor .editor-translation-flag.active { + border-color: var(--vscode-testing-iconQueued, #cca700); + background: var(--vscode-testing-iconQueued, #cca700); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-testing-iconQueued, #cca700) 14%, transparent); + } +} +.post-editor .editor-translation-flag:hover { + background: var(--vscode-list-hoverBackground); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-list-hoverBackground) 75%, transparent); + } +} +.post-editor .post-editor-links-panel, .post-editor .post-editor-side-panel { + padding: 12px; + border: 1px solid var(--vscode-panel-border); + border-radius: 8px; + background: var(--vscode-editor-background); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-editor-background) 82%, white 3%); + } +} +.post-editor .post-editor-side-panel-header { + display: flex; + align-items: center; + justify-content: space-between; + gap: 10px; +} +.post-editor .post-editor-links-columns { + display: flex; + gap: 18px; + align-items: flex-start; + margin-top: 10px; +} +.post-editor .post-editor-links-columns > div { + flex: 1; + min-width: 0; +} +.post-editor .post-editor-empty, .post-editor .post-editor-media-meta { + color: var(--vscode-descriptionForeground); + font-size: 12px; +} +.post-editor .post-editor-media-list { + list-style: none; + margin: 10px 0 0; + padding: 0; + display: flex; + flex-direction: column; + gap: 8px; +} +.post-editor .post-editor-media-item { + display: flex; + flex-direction: column; + gap: 2px; + padding: 8px 10px; + border-radius: 6px; + background: rgba(255, 255, 255, 0.03); +} +.post-editor .editor-body { + flex: 1; + display: flex; + flex-direction: column; + gap: 4px; + min-height: 320px; +} +.post-editor .editor-toolbar { + display: grid; + grid-template-columns: 1fr auto 1fr; + align-items: center; + gap: 8px; + margin-bottom: 8px; +} +.post-editor .editor-toolbar-left { + display: flex; + align-items: center; + justify-content: flex-start; +} +.post-editor .editor-toolbar-center { + display: flex; + align-items: center; + justify-content: center; +} +.post-editor .editor-toolbar-right { + display: flex; + align-items: center; + justify-content: flex-end; + gap: 6px; + min-width: 0; + flex-wrap: wrap; +} +.post-editor .editor-mode-toggle { + display: flex; + gap: 4px; +} +.post-editor .editor-mode-toggle button, .post-editor .editor-toolbar-button { + padding: 4px 12px; + font-size: 12px; + border-radius: 4px; + border: none; + cursor: pointer; + transition: background-color 0.15s; +} +.post-editor .editor-mode-toggle button { + background-color: var(--vscode-button-secondaryBackground, rgba(255, 255, 255, 0.08)); + color: var(--vscode-button-secondaryForeground, var(--vscode-foreground)); +} +.post-editor .editor-mode-toggle button:hover, .post-editor .editor-toolbar-button:hover { + background-color: var(--vscode-button-secondaryHoverBackground, var(--vscode-toolbar-hoverBackground)); +} +.post-editor .editor-mode-toggle button.active { + background-color: var(--vscode-button-background, var(--accent-color)); + color: var(--vscode-button-foreground, #ffffff); +} +.post-editor .editor-toolbar-button { + background: var(--vscode-button-secondaryBackground, rgba(255, 255, 255, 0.08)); + color: var(--vscode-button-secondaryForeground, var(--vscode-foreground)); +} +.post-editor .editor-excerpt-panel.is-collapsed { + display: none; +} +.post-editor .gallery-button { + padding: 4px 12px; + font-size: 12px; + border-radius: 4px; + background-color: var(--vscode-button-secondaryBackground); + color: var(--vscode-button-secondaryForeground); + border: none; + cursor: pointer; + transition: background-color 0.15s; +} +.post-editor .gallery-button:hover { + background-color: var(--vscode-button-secondaryHoverBackground); +} +.post-editor .insert-post-link-button, .post-editor .insert-media-button { + padding: 4px 8px; + font-size: 14px; + border-radius: 4px; + background-color: var(--vscode-button-secondaryBackground); + color: var(--vscode-button-secondaryForeground); + border: none; + cursor: pointer; + transition: background-color 0.15s; +} +.post-editor .insert-post-link-button:hover, .post-editor .insert-media-button:hover { + background-color: var(--vscode-button-secondaryHoverBackground); +} +.post-editor .editor-preview { + flex: 1; + background-color: var(--vscode-input-background); + border-radius: 4px; + overflow: hidden; + position: relative; + min-height: 240px; + padding: 0; + border: none; +} +.post-editor .editor-preview { + flex: 1; + min-height: 240px; + padding: 14px; + background-color: var(--vscode-input-background); + border: 1px solid var(--vscode-panel-border); + border-radius: 4px; + overflow: auto; + line-height: 1.6; +} +.post-editor .editor-preview-frame { + width: 100%; + min-height: 520px; + border: none; + background: #ffffff; +} +.post-editor .post-editor-markdown-surface { + position: relative; + flex: 1; + min-height: 380px; + border: 1px solid var(--vscode-input-border, var(--vscode-panel-border)); + border-radius: 4px; + background: var(--vscode-input-background); + overflow: hidden; +} +.post-editor .monaco-editor-shell, .scripts-monaco.monaco-editor-shell, .templates-monaco.monaco-editor-shell { + position: relative; +} +.monaco-editor-instance { + width: 100%; + height: 100%; + min-height: 100%; +} +.post-editor .monaco-editor-instance { + min-height: 380px; +} +.scripts-monaco .monaco-editor-instance, .templates-monaco .monaco-editor-instance { + min-height: 420px; +} +.monaco-editor-input { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: pre; + border: 0; +} +.post-editor .editor-footer { + display: flex; + align-items: center; + gap: 16px; + padding: 8px 16px; + border-top: 1px solid var(--vscode-panel-border); + background-color: var(--vscode-sideBar-background); + color: var(--vscode-descriptionForeground); + font-size: 12px; + flex-wrap: wrap; +} +@media (max-width: 980px) { + .post-editor .editor-header, .scripts-view-shell .ui-editor-header, .templates-view-shell .ui-editor-header, .post-editor .metadata-toggle-header, .post-editor .editor-toolbar { + display: flex; + flex-direction: column; + align-items: flex-start; + } + .post-editor .editor-header-row, .post-editor .editor-field-row, .post-editor .post-editor-links-columns { + flex-direction: column; + } + .post-editor .editor-media-panel { + width: 100%; + } + .post-editor .editor-toolbar-right, .post-editor .ui-editor-actions, .scripts-view-shell .ui-editor-actions, .templates-view-shell .ui-editor-actions { + justify-content: flex-start; + } +} +.settings-view, .style-view { + height: 100%; + display: flex; + flex-direction: column; +} +.settings-header, .style-view-header { + padding: 18px 20px; + border-bottom: 1px solid var(--line, #3c3c3c); + display: flex; + align-items: center; + justify-content: space-between; + gap: 16px; +} +.settings-search input { + width: min(320px, 40vw); +} +.settings-content { + padding: 20px; + overflow: auto; + display: flex; + flex-direction: column; + gap: 18px; +} +.setting-section { + border: 1px solid var(--line, #3c3c3c); + border-radius: 12px; + background: var(--panel-2, #252526); +} +.setting-section-header { + padding: 14px 16px; + border-bottom: 1px solid var(--line, #3c3c3c); +} +.setting-section-content { + padding: 16px; + display: flex; + flex-direction: column; + gap: 14px; +} +.setting-row { + display: grid; + grid-template-columns: minmax(180px, 240px) minmax(0, 1fr); + gap: 16px; + align-items: start; +} +.setting-label { + font-weight: 600; +} +.setting-control, .setting-input-group { + display: flex; + flex-wrap: wrap; + gap: 10px; + align-items: center; +} +.setting-actions { + padding: 0 16px 16px; + display: flex; + gap: 10px; + flex-wrap: wrap; +} +.style-theme-picker { + padding: 20px; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); + gap: 14px; +} +.style-theme-option { + border: 1px solid var(--line, #3c3c3c); + background: var(--panel-2, #252526); + border-radius: 14px; + padding: 14px; + text-align: left; + cursor: pointer; +} +.style-theme-option.selected { + border-color: var(--accent-color); + box-shadow: 0 0 0 1px var(--accent-color); +} +.style-theme-swatch { + display: flex; + flex-direction: column; + gap: 12px; +} +.style-theme-tones { + display: grid; + grid-template-columns: 2fr 1fr 1fr; + gap: 8px; +} +.style-theme-tone { + height: 42px; + border-radius: 10px; + border: 1px solid rgba(255, 255, 255, 0.08); +} +.style-apply-row { + padding: 0 20px 20px; + display: flex; + gap: 12px; + align-items: center; + justify-content: space-between; + flex-wrap: wrap; +} +.style-preview-container { + padding: 0 20px 20px; + flex: 1; + min-height: 0; +} +.style-preview-frame { + width: 100%; + height: 100%; + min-height: 420px; + border: 1px solid var(--line, #3c3c3c); + border-radius: 14px; + background: #ffffff; +} +@media (max-width: 1100px) { + .setting-row { + grid-template-columns: 1fr; + } +} +.panel-shell { + min-height: 160px; + max-height: 160px; + border-top: 1px solid var(--line); +} +.panel-shell.is-hidden { + display: none; +} +.panel-tabs { + display: flex; + gap: 8px; +} +.panel-tabs { + display: flex; + gap: 2px; +} +.panel-tab { + background: transparent; + border: none; + padding: 6px 12px; + font-size: 12px; + color: var(--vscode-tab-inactiveForeground); + cursor: pointer; + border-bottom: 2px solid transparent; + border-radius: 0; +} +.panel-tab:hover { + color: var(--vscode-tab-activeForeground); + background: transparent; +} +.panel-tab.active { + color: var(--vscode-tab-activeForeground); + border-bottom-color: var(--vscode-focusBorder); + background: transparent; +} +.assistant-content { + display: flex; + flex-direction: column; + gap: 12px; + padding: 12px; +} +.assistant-sidebar-header { + display: flex; + align-items: flex-start; + justify-content: space-between; + gap: 12px; +} +.assistant-sidebar-heading { + display: flex; + flex-direction: column; + gap: 4px; +} +.assistant-sidebar-description, .assistant-sidebar-context-text, .assistant-sidebar-message-content { + color: var(--vscode-descriptionForeground); +} +.assistant-sidebar-status { + border-radius: 999px; + border: 1px solid var(--vscode-panel-border); + padding: 2px 8px; + font-size: 11px; + line-height: 1.4; +} +.assistant-sidebar-status.is-offline { + background: rgba(255, 196, 0, 0.18); + border-color: rgba(255, 196, 0, 0.35); + color: var(--vscode-editor-foreground); +} +.assistant-sidebar-context { + display: flex; + flex-direction: column; + gap: 10px; + padding: 8px; + border: 1px solid var(--vscode-panel-border); + border-radius: 6px; + background: var(--vscode-editorWidget-background, rgba(0, 0, 0, 0.2)); +} +.assistant-sidebar-context-row { + display: flex; + justify-content: space-between; + gap: 12px; +} +.assistant-sidebar-context-label, .assistant-sidebar-message-role { + font-size: 11px; + text-transform: uppercase; + letter-spacing: 0.04em; + color: var(--vscode-descriptionForeground); +} +.assistant-sidebar-context-value { + text-align: right; + color: var(--vscode-editor-foreground); +} +.assistant-sidebar-context-text, .assistant-sidebar-message-content { + margin: 0; + white-space: pre-wrap; +} +.assistant-sidebar-prompt-form, .assistant-sidebar-welcome, .assistant-sidebar-transcript { + display: flex; + flex-direction: column; + gap: 10px; +} +.assistant-sidebar-prompt { + width: 100%; + min-height: 120px; + resize: vertical; + border: 1px solid var(--vscode-input-border); + border-radius: 6px; + background: var(--vscode-input-background); + color: var(--vscode-input-foreground); + padding: 10px; + font: inherit; +} +.assistant-sidebar-prompt:focus { + outline: 1px solid var(--vscode-focusBorder); + outline-offset: 1px; +} +.assistant-sidebar-start-button { + align-self: flex-start; + border: 1px solid var(--vscode-button-border, transparent); + border-radius: 999px; + background: var(--vscode-button-background); + color: var(--vscode-button-foreground); + padding: 7px 14px; + cursor: pointer; +} +.assistant-sidebar-start-button:disabled { + cursor: default; + opacity: 0.55; +} +.assistant-card, .assistant-sidebar-message { + display: flex; + flex-direction: column; + gap: 6px; + padding: 12px; + border: 1px solid var(--vscode-panel-border); + border-radius: 6px; + border-bottom-width: 1px; + background: var(--vscode-editorWidget-background, rgba(0, 0, 0, 0.2)); +} +.assistant-sidebar-message.user { + background: var(--vscode-list-hoverBackground); +} +.assistant-sidebar-message.assistant { + background: var(--vscode-editorWidget-background, rgba(0, 0, 0, 0.2)); +} +.status-bar { + height: 22px; + display: flex; + align-items: center; + justify-content: space-between; + background-color: var(--vscode-statusBar-background); + color: var(--vscode-statusBar-foreground); + font-size: 12px; + padding: 0 8px; + user-select: none; + flex-wrap: nowrap; + gap: 0; + border-top: none; +} +.status-bar-left, .status-bar-right { + display: flex; + align-items: center; + gap: 4px; + flex-shrink: 0; + min-width: 0; +} +.status-bar-item { + display: flex; + align-items: center; + gap: 6px; + padding: 0 8px; + height: 100%; + max-width: none; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + border-radius: 0; + background: transparent; + font-size: 12px; +} +.status-bar-item .task-message-text { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + max-width: 300px; +} +.task-spinner { + width: 10px; + height: 10px; + border: 2px solid rgba(255, 255, 255, 0.3); + border-top-color: white; + border-radius: 50%; + animation: spin 0.8s linear infinite; +} +@keyframes spin { + to { + transform: rotate(360deg); + } +} +.panel-content { + padding: 8px; +} +.task-list { + gap: 4px; +} +.output-list, .git-log-list { + gap: 6px; +} +.task-entry { + padding: 8px; + border-bottom: none; + border-radius: 4px; + background-color: var(--vscode-sideBar-background); +} +.output-entry { + padding: 8px; + border-bottom: none; + border-radius: 4px; + background-color: var(--vscode-sideBar-background); + font-size: 12px; + color: var(--vscode-editor-foreground); +} +@media (max-width: 1100px) { + .editor-frame { + grid-template-columns: 1fr; + } + .assistant-sidebar-shell { + display: none; + } + .dashboard-grid { + grid-template-columns: 1fr; + } +} +.text-muted { + color: var(--vscode-descriptionForeground); +} +.editor-empty { + flex: 1; + display: flex; + align-items: flex-start; + justify-content: center; + background-color: var(--vscode-editor-background); + overflow-y: auto; + padding: 40px 20px; +} +.dashboard-content { + max-width: 720px; + width: 100%; +} +.dashboard-content h1 { + font-size: 24px; + font-weight: 400; + margin: 0 0 4px; + color: var(--vscode-editor-foreground); +} +.dashboard-content > .text-muted { + margin-bottom: 24px; + display: block; +} +.dashboard-stats { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 12px; + margin-bottom: 24px; +} +.stat-card { + padding: 16px; + background-color: var(--vscode-sideBar-background); + border-radius: 6px; +} +.stat-number { + font-size: 32px; + font-weight: 600; + color: var(--vscode-editor-foreground); + line-height: 1; + margin-bottom: 4px; +} +.stat-label { + font-size: 12px; + color: var(--vscode-descriptionForeground); + text-transform: uppercase; + letter-spacing: 0.5px; + margin-bottom: 10px; +} +.stat-breakdown { + display: flex; + flex-wrap: wrap; + gap: 6px; +} +.stat-tag { + font-size: 11px; + padding: 2px 8px; + border-radius: 3px; + background-color: var(--vscode-input-background); + color: var(--vscode-descriptionForeground); +} +.stat-published { + color: var(--vscode-testing-iconPassed); +} +.stat-draft { + color: var(--vscode-editorWarning-foreground); +} +.stat-archived { + color: var(--vscode-descriptionForeground); +} +.dashboard-section { + background-color: var(--vscode-sideBar-background); + border-radius: 6px; + padding: 16px; + margin-bottom: 12px; +} +.dashboard-section h4 { + font-size: 11px; + font-weight: 600; + color: var(--vscode-descriptionForeground); + text-transform: uppercase; + letter-spacing: 0.5px; + margin: 0 0 12px; +} +.timeline-chart { + display: flex; + align-items: flex-end; + gap: 4px; + height: 100px; +} +.timeline-bar-container { + flex: 1; + display: flex; + flex-direction: column; + align-items: center; + height: 100%; +} +.timeline-bar { + width: 100%; + max-width: 40px; + background-color: var(--vscode-activityBarBadge-background); + border-radius: 3px 3px 0 0; + margin-top: auto; + min-height: 4px; + position: relative; + transition: opacity 0.15s; +} +.timeline-bar:hover { + opacity: 0.8; +} +.timeline-bar-count { + position: absolute; + top: -16px; + left: 50%; + transform: translateX(-50%); + font-size: 10px; + color: var(--vscode-descriptionForeground); +} +.timeline-bar-label { + display: flex; + flex-direction: column; + align-items: center; + font-size: 9px; + color: var(--vscode-descriptionForeground); + margin-top: 4px; + line-height: 1.15; +} +.timeline-bar-label-month { + white-space: nowrap; +} +.timeline-bar-label-year { + font-size: 8px; +} +.tag-cloud { + display: flex; + flex-wrap: wrap; + gap: 6px 10px; + align-items: baseline; + line-height: 1.6; +} +.dashboard-tag { + padding: 2px 8px; + border-radius: 10px; + background-color: var(--vscode-input-background); + color: var(--vscode-editor-foreground); + cursor: default; + transition: opacity 0.15s; + white-space: nowrap; +} +.dashboard-tag:hover { + opacity: 0.75; +} +.dashboard-tag.has-color { + border-radius: 12px; +} +.dashboard-tag.has-color:hover { + opacity: 0.85; +} +.tag-cloud-more { + font-size: 11px; +} +.tag-count { + font-size: 10px; + opacity: 0.5; + margin-left: 2px; +} +.dashboard-category { + font-size: 12px; + border: 1px solid var(--vscode-input-border); +} +.recent-posts-list { + display: flex; + flex-direction: column; +} +.recent-post-item { + display: flex; + align-items: center; + gap: 10px; + padding: 6px 8px; + border-radius: 4px; + cursor: pointer; + font-size: 12px; + width: 100%; + border: none; + background: transparent; + text-align: left; + color: inherit; +} +.recent-post-item:hover { + background-color: var(--vscode-list-hoverBackground); +} +.recent-post-title { + flex: 1; + color: var(--vscode-editor-foreground); + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.recent-post-status { + font-size: 10px; + padding: 1px 6px; + border-radius: 3px; + background-color: var(--vscode-input-background); + text-transform: uppercase; + letter-spacing: 0.3px; +} +.recent-post-status.status-published { + color: var(--vscode-testing-iconPassed); +} +.recent-post-status.status-draft { + color: var(--vscode-editorWarning-foreground); +} +.recent-post-status.status-archived { + color: var(--vscode-descriptionForeground); +} +.recent-post-date { + color: var(--vscode-descriptionForeground); + white-space: nowrap; +} +.settings-view-shell, .style-view, .tags-view-shell, .scripts-view-shell, .templates-view-shell, .chat-panel { + height: 100%; + background: var(--vscode-editor-background); +} +.chat-panel { + color: var(--vscode-editor-foreground); +} +.chat-panel-header { + border-bottom: 1px solid var(--vscode-panel-border); + background: var(--vscode-sideBar-background); +} +.chat-panel-title { + flex: 1; + min-width: 0; + gap: 10px; + overflow: visible; + font-size: 14px; + font-weight: 600; +} +.chat-panel-title-main { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.chat-panel-header-actions { + display: flex; + align-items: center; + gap: 8px; +} +.chat-model-selector-wrap { + position: relative; + display: inline-flex; + min-width: 0; +} +.chat-model-selector-button, .chat-model-selector-option { + border: 1px solid var(--vscode-input-border); + background: var(--vscode-input-background); + color: var(--vscode-input-foreground); +} +.chat-model-selector-menu { + position: absolute; + top: calc(100% + 4px); + left: 0; + right: auto; + border: 1px solid var(--vscode-dropdown-border, var(--vscode-panel-border)); + background: var(--vscode-dropdown-background, var(--vscode-sideBar-background)); + color: var(--vscode-dropdown-foreground, var(--vscode-foreground)); + z-index: 20; +} +.chat-panel .chat-model-selector-button.chat-model-selector-inline { + display: inline-flex; + align-items: center; + gap: 6px; +} +.chat-panel .chat-model-selector-caret { + position: static; + font-size: 10px; +} +.chat-messages, .chat-surface-scroll { + flex: 1; + min-height: 0; + overflow-y: auto; +} +.chat-message { + display: flex; + max-width: 100%; + margin-bottom: 16px; +} +.chat-message.user { + flex-direction: row-reverse; +} +.chat-message-content { + max-width: min(760px, 100%); + border: 1px solid var(--vscode-panel-border); + border-radius: 6px; + padding: 12px 14px; + background: var(--vscode-sideBar-background); + color: var(--vscode-editor-foreground); +} +.chat-panel .chat-message.user .chat-message-content { + background: var(--vscode-button-background, var(--accent-color, #007acc)); + color: var(--vscode-button-foreground, var(--vscode-list-activeSelectionForeground, #ffffff)); + border: 1px solid var(--vscode-button-background, var(--accent-color, #007acc)); + border-radius: 6px; + padding: 12px 14px; + line-height: 1.35; +} +.chat-tool-surface-table { + width: 100%; + border-collapse: collapse; +} +.chat-tool-surface-table th, .chat-tool-surface-table td { + border-bottom: 1px solid var(--vscode-panel-border); + padding: 6px 8px; + text-align: left; +} +.chat-tool-surface-json { + overflow: auto; + padding: 10px 12px; + border: 1px solid var(--vscode-panel-border); + border-radius: 4px; + background: var(--vscode-textCodeBlock-background); +} +.chat-inline-surface { + margin: 10px 0; + border: 1px solid var(--vscode-panel-border); + border-radius: 6px; + background: var(--vscode-sideBar-background); + overflow: hidden; +} +.chat-inline-surface-header { + display: flex; + align-items: center; + gap: 8px; + padding: 8px 12px; + cursor: pointer; + user-select: none; + list-style: none; + font-size: 12px; + color: var(--vscode-descriptionForeground); +} +.chat-inline-surface-header::-webkit-details-marker { + display: none; +} +.chat-inline-surface-header::marker { + content: ""; +} +.chat-inline-surface-icon { + flex: 0 0 auto; + font-size: 14px; + line-height: 1; + opacity: 0.7; +} +.chat-inline-surface-title { + flex: 1; + min-width: 0; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + font-weight: 500; + color: var(--vscode-editor-foreground); +} +.chat-inline-surface-dismiss { + flex: 0 0 auto; + display: flex; + align-items: center; + justify-content: center; + width: 20px; + height: 20px; + padding: 0; + border: none; + border-radius: 4px; + background: transparent; + color: var(--vscode-descriptionForeground); + font-size: 16px; + line-height: 1; + cursor: pointer; + opacity: 0; + transition: opacity 0.15s; +} +.chat-inline-surface:hover .chat-inline-surface-dismiss { + opacity: 1; +} +.chat-inline-surface-dismiss:hover { + background: var(--vscode-toolbar-hoverBackground); + color: var(--vscode-editor-foreground); +} +.chat-inline-surface-body { + padding: 0 12px 12px; +} +.chat-inline-surface-body h3 { + margin: 0 0 8px; + font-size: 13px; + font-weight: 600; + color: var(--vscode-editor-foreground); +} +.chat-surface-chart-type { + margin: 0 0 8px; + font-size: 11px; + text-transform: uppercase; + letter-spacing: 0.04em; + color: var(--vscode-descriptionForeground); + display: none; +} +.chat-surface-chart-list { + display: flex; + flex-direction: column; + gap: 6px; +} +.chat-surface-chart-row { + display: flex; + flex-direction: column; + gap: 2px; +} +.chat-surface-chart-meta { + display: flex; + justify-content: space-between; + align-items: baseline; + font-size: 12px; +} +.chat-surface-chart-meta span:first-child { + color: var(--vscode-editor-foreground); +} +.chat-surface-chart-meta span:last-child { + color: var(--vscode-descriptionForeground); + font-variant-numeric: tabular-nums; +} +.chat-surface-chart-bar { + height: 6px; + border-radius: 3px; + background: rgba(255, 255, 255, 0.06); + overflow: hidden; +} +.chat-surface-chart-bar span { + display: block; + height: 100%; + border-radius: 3px; + background: var(--accent-color); + min-width: 0; + transition: width 0.3s ease; +} +.chat-surface-chart-bar-stacked { + display: flex; +} +.chat-surface-chart-bar-segment { + display: block; + height: 100%; + min-width: 0; + transition: width 0.3s ease; +} +.chat-surface-chart-legend { + display: flex; + flex-wrap: wrap; + gap: 10px; + margin-top: 8px; + font-size: 11px; +} +.chat-surface-chart-legend-item { + display: inline-flex; + align-items: center; + gap: 4px; + color: var(--vscode-descriptionForeground); +} +.chat-surface-chart-legend-swatch { + display: inline-block; + width: 10px; + height: 10px; + border-radius: 2px; +} +.chat-surface-chart-pie { + display: flex; + flex-direction: column; + align-items: center; + gap: 8px; +} +.chat-surface-chart-pie-svg { + width: 140px; + height: 140px; +} +.chat-surface-chart-pie-slice { + stroke: var(--vscode-editor-background, #1e1e1e); + stroke-width: 1; +} +.chat-surface-chart-donut-hole { + fill: var(--vscode-editor-background, #1e1e1e); +} +.chat-surface-chart-donut-total { + fill: var(--vscode-editor-foreground); + font-size: 16px; + font-weight: 600; +} +.chat-surface-chart-line-svg { + width: 100%; + height: auto; +} +.chat-surface-chart-line-grid { + stroke: rgba(255, 255, 255, 0.08); + stroke-width: 1; +} +.chat-surface-chart-line-y-label, .chat-surface-chart-line-x-label { + fill: var(--vscode-descriptionForeground); + font-size: 9px; +} +.chat-surface-chart-line-path { + stroke: var(--accent-color); + stroke-width: 2; +} +.chat-surface-chart-area-fill { + fill: var(--accent-color); + opacity: 0.18; +} +.chat-surface-chart-line-dot { + fill: var(--accent-color); +} +.chat-surface-chart-heatmap { + display: grid; + gap: 2px; + font-size: 11px; +} +.chat-surface-chart-heatmap-col-label { + text-align: center; + opacity: 0.7; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.chat-surface-chart-heatmap-row-label { + text-align: right; + padding-right: 4px; + opacity: 0.7; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + max-width: 80px; +} +.chat-surface-chart-heatmap-cell { + aspect-ratio: 1; + min-width: 14px; + min-height: 14px; + border-radius: 2px; + display: flex; + align-items: center; + justify-content: center; + font-size: 10px; + font-weight: 500; + font-variant-numeric: tabular-nums; +} +.chat-surface-card { + display: flex; + flex-direction: column; + gap: 6px; +} +.chat-surface-subtitle { + margin: 0; + font-size: 12px; + color: var(--vscode-descriptionForeground); +} +.chat-surface-body { + margin: 0; + font-size: 13px; + line-height: 1.45; +} +.chat-surface-actions { + display: flex; + gap: 8px; + margin-top: 8px; +} +.chat-surface-action-button { + padding: 4px 12px; + border: 1px solid var(--vscode-input-border); + border-radius: 4px; + background: var(--vscode-input-background); + color: var(--vscode-editor-foreground); + font-size: 12px; + cursor: pointer; +} +.chat-surface-action-button:hover { + background: var(--vscode-list-hoverBackground); +} +.chat-surface-metric { + display: flex; + flex-direction: column; + gap: 2px; +} +.chat-surface-metric-label { + font-size: 12px; + color: var(--vscode-descriptionForeground); +} +.chat-surface-metric-value { + font-size: 22px; + font-weight: 600; + font-variant-numeric: tabular-nums; + color: var(--vscode-editor-foreground); +} +.chat-surface-list { + margin: 0; + padding: 0 0 0 18px; + font-size: 13px; + line-height: 1.5; +} +.chat-surface-mindmap { + margin: 0; + padding: 0; + list-style: none; + font-size: 13px; +} +.chat-surface-mindmap li { + padding: 4px 0; + border-bottom: 1px solid var(--vscode-panel-border); +} +.chat-surface-mindmap li:last-child { + border-bottom: none; +} +.chat-surface-mindmap strong { + display: block; + color: var(--vscode-editor-foreground); +} +.chat-surface-mindmap-children { + display: block; + font-size: 12px; + color: var(--vscode-descriptionForeground); + padding-left: 12px; +} +.chat-surface-tabs { + display: flex; + flex-direction: column; +} +.chat-surface-tab-list { + display: flex; + gap: 0; + border-bottom: 1px solid var(--vscode-panel-border); +} +.chat-surface-tab-button { + padding: 6px 12px; + border: none; + border-bottom: 2px solid transparent; + background: transparent; + color: var(--vscode-descriptionForeground); + font-size: 12px; + cursor: pointer; +} +.chat-surface-tab-button.active { + color: var(--vscode-editor-foreground); + border-bottom-color: var(--accent-color); +} +.chat-surface-tab-button:hover:not(.active) { + color: var(--vscode-editor-foreground); +} +.chat-surface-tab-panel { + padding: 10px 0 0; +} +.chat-surface-form { + display: flex; + flex-direction: column; + gap: 10px; +} +.chat-surface-form-field { + display: flex; + flex-direction: column; + gap: 4px; + font-size: 12px; + color: var(--vscode-descriptionForeground); +} +.chat-surface-form-field input, .chat-surface-form-field textarea, .chat-surface-form-field select { + padding: 5px 8px; + border: 1px solid var(--vscode-input-border); + border-radius: 4px; + background: var(--vscode-input-background); + color: var(--vscode-input-foreground); + font: inherit; +} +.chat-surface-form-field textarea { + min-height: 60px; + resize: vertical; +} +.chat-surface-form-checkbox { + display: flex; + align-items: center; +} +.chat-surface-text { + font-size: 13px; + line-height: 1.45; + white-space: pre-wrap; +} +.chat-tool-surface-table-wrap { + overflow-x: auto; +} +.chat-panel .chat-input-container { + --chat-input-line-height: 22px; + --chat-input-min-height: 24px; + border-top: 1px solid var(--vscode-panel-border); + padding: 12px 16px; + background: var(--vscode-sideBar-background); +} +.chat-panel .chat-input-wrapper { + min-height: 40px; + border: 1px solid var(--vscode-input-border); + border-radius: 8px; + padding: 6px 8px; + background: var(--vscode-input-background); +} +.chat-panel .chat-input-wrapper:focus-within { + border-color: var(--vscode-focusBorder); +} +.chat-panel .chat-input { + flex: 1; + box-sizing: border-box; + height: var(--chat-input-min-height); + min-height: var(--chat-input-min-height); + margin: 0; + padding: 6px 8px; + line-height: var(--chat-input-line-height); + max-height: 160px; + resize: vertical; + border: 0; + outline: none; + background: transparent; + color: var(--vscode-input-foreground); + overflow-y: hidden; +} +.chat-panel .chat-input:focus { + outline: none; +} +.chat-panel .chat-input::placeholder { + color: var(--vscode-input-placeholderForeground); +} +.chat-panel .chat-send-button { + flex: 0 0 auto; + width: 22px; + height: 22px; + max-width: 22px; + max-height: 22px; + padding: 0; + background: var(--vscode-button-background); + color: var(--vscode-button-foreground); +} +.chat-panel .chat-send-button:hover:not(:disabled) { + background: var(--vscode-button-hoverBackground); +} +.chat-panel .chat-send-button:disabled { + opacity: 0.5; +} +@media (max-width: 720px) { + .chat-panel-header { + align-items: stretch; + flex-direction: column; + padding: 10px 12px; + } + .chat-panel-title { + width: 100%; + flex-wrap: wrap; + } + .chat-model-selector-wrap { + width: 100%; + } + .chat-panel .chat-model-selector-button.chat-model-selector-inline { + justify-content: space-between; + width: 100%; + } + .chat-messages { + padding: 12px; + } + .chat-message-content { + max-width: 100%; + } + .chat-panel .chat-input-container { + padding: 8px 12px; + } +} +.colour-picker-wrap { + position: relative; + display: inline-flex; +} +.colour-picker-trigger { + width: 28px; + height: 28px; + border-radius: 4px; + border: 1px solid var(--vscode-input-border); + cursor: pointer; + padding: 0; + flex-shrink: 0; +} +.colour-picker-trigger:hover { + opacity: 0.85; +} +.colour-picker-popover { + position: absolute; + top: calc(100% + 4px); + left: 0; + z-index: 30; + padding: 8px; + border: 1px solid var(--vscode-dropdown-border, var(--vscode-panel-border)); + border-radius: 6px; + background: var(--vscode-dropdown-background, var(--vscode-sideBar-background)); + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); + width: 196px; +} +.colour-picker-grid { + display: grid; + grid-template-columns: repeat(6, 1fr); + gap: 4px; +} +.colour-picker-swatch { + width: 24px; + height: 24px; + border-radius: 4px; + border: 2px solid transparent; + cursor: pointer; + padding: 0; + transition: border-color 0.1s; +} +.colour-picker-swatch:hover { + border-color: var(--vscode-focusBorder); +} +.colour-picker-swatch.selected { + border-color: var(--vscode-focusBorder); + box-shadow: 0 0 0 1px var(--vscode-focusBorder); +} +.colour-picker-custom { + display: flex; + align-items: center; + gap: 6px; + margin-top: 8px; + padding-top: 8px; + border-top: 1px solid var(--vscode-panel-border); +} +.colour-picker-custom label { + font-size: 11px; + color: var(--vscode-descriptionForeground); + white-space: nowrap; +} +.colour-picker-custom input { + flex: 1; + min-width: 0; + font-size: 12px; + padding: 2px 6px; + border: 1px solid var(--vscode-input-border); + border-radius: 3px; + background: var(--vscode-input-background); + color: var(--vscode-input-foreground); + font-family: monospace; +} +.overlay-root { + position: fixed; + inset: 0; + pointer-events: none; + z-index: 10000; +} +.overlay-root:empty { + display: none; +} +.editor-shared-actions { + position: relative; + margin-bottom: 14px; +} +.ai-suggestions-modal-backdrop, .insert-modal-backdrop, .language-picker-modal-backdrop, .confirm-delete-modal-backdrop, .confirm-dialog-overlay, .gallery-overlay, .lightbox-overlay { + position: fixed; + inset: 0; + background: rgba(0, 0, 0, 0.68); + display: flex; + align-items: center; + justify-content: center; + pointer-events: auto; +} +.ai-suggestions-modal, .insert-modal, .language-picker-modal, .confirm-delete-modal, .confirm-dialog, .gallery-overlay-content { + position: relative; + z-index: 1; + background: #1e1e1e; + border: 1px solid #3c3c3c; + border-radius: 8px; + box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4); +} +.ai-suggestions-modal, .language-picker-modal, .confirm-delete-modal, .confirm-dialog { + width: min(680px, calc(100vw - 32px)); + max-height: calc(100vh - 48px); + display: flex; + flex-direction: column; +} +.insert-modal { + width: min(680px, calc(100vw - 32px)); + max-height: calc(100vh - 48px); + display: flex; + flex-direction: column; + overflow: hidden; +} +.gallery-overlay-content { + width: min(980px, calc(100vw - 48px)); + max-height: calc(100vh - 48px); + display: flex; + flex-direction: column; + overflow: hidden; +} +.ai-suggestions-modal-header, .language-picker-modal-header, .confirm-delete-modal-header, .insert-modal-header, .gallery-overlay-header { + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; + padding: 16px 20px; + border-bottom: 1px solid #3c3c3c; +} +.insert-modal-header { + flex-direction: column; + align-items: stretch; + gap: 12px; +} +.insert-modal-header.media-header-only { + flex-direction: row; + align-items: center; +} +.ai-suggestions-modal-header h2, .language-picker-modal-header h2, .confirm-delete-modal-header h2, .gallery-overlay-header h2, .insert-modal-title, .confirm-dialog h3 { + margin: 0; + color: #ffffff; +} +.ai-suggestions-modal-close, .confirm-delete-modal-close, .gallery-overlay-close, .shared-popover-close, .lightbox-close { + border: none; + background: transparent; + color: #c5c5c5; + cursor: pointer; + font-size: 20px; + line-height: 1; +} +.ai-suggestions-modal-body, .language-picker-modal-body, .confirm-delete-modal-body { + padding: 20px; + overflow: auto; +} +.ai-suggestions-list { + display: flex; + flex-direction: column; + gap: 16px; +} +.ai-suggestion-item { + display: flex; + gap: 12px; + padding: 16px; + border: 1px solid #3c3c3c; + border-radius: 6px; + background: #252526; +} +.ai-suggestion-checkbox { + position: relative; + display: flex; + align-items: flex-start; + cursor: pointer; +} +.ai-suggestion-checkbox input { + position: absolute; + opacity: 0; +} +.checkmark { + width: 20px; + height: 20px; + border: 2px solid #555555; + border-radius: 4px; + display: inline-flex; + align-items: center; + justify-content: center; + background: #1e1e1e; +} +.ai-suggestion-checkbox input:checked + .checkmark, .ai-suggestion-checkbox input:checked ~ .checkmark { + background: #0078d4; + border-color: #0078d4; +} +.ai-suggestion-checkbox input:checked + .checkmark::after, .ai-suggestion-checkbox input:checked ~ .checkmark::after { + content: "✓"; + color: #ffffff; + font-size: 12px; +} +.ai-suggestion-content { + flex: 1; + min-width: 0; +} +.ai-suggestion-label { + display: flex; + align-items: center; + gap: 8px; + margin-bottom: 8px; + font-weight: 600; +} +.ai-suggestion-has-value, .language-picker-badge, .insert-modal-similarity-badge { + display: inline-flex; + align-items: center; + padding: 2px 6px; + border-radius: 999px; + background: rgba(255, 255, 255, 0.08); + color: #c5c5c5; + font-size: 11px; +} +.ai-suggestion-comparison { + display: grid; + grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); + gap: 12px; + align-items: center; +} +.ai-suggestion-column { + display: flex; + flex-direction: column; + gap: 4px; + padding: 10px 12px; + border-radius: 6px; + background: rgba(255, 255, 255, 0.03); +} +.ai-suggestion-column.muted { + color: #9d9d9d; +} +.ai-suggestion-column.highlighted { + border: 1px solid rgba(0, 122, 204, 0.4); + color: #ffffff; +} +.ai-suggestion-column-label { + font-size: 11px; + text-transform: uppercase; + letter-spacing: 0.04em; +} +.ai-suggestion-arrow { + color: #9d9d9d; +} +.ai-suggestion-value { + min-height: 1.4em; +} +.ai-suggestion-value.loading { + color: var(--accent-color); + font-style: italic; +} +.ai-suggestions-error { + display: flex; + flex-direction: column; + gap: 4px; + padding: 12px 16px; + margin-bottom: 16px; + border-radius: 6px; + background: rgba(220, 50, 50, 0.12); + border: 1px solid rgba(220, 50, 50, 0.35); + color: #ff6b6b; +} +.ai-suggestions-modal-footer, .confirm-delete-modal-footer, .confirm-dialog-actions { + display: flex; + justify-content: flex-end; + gap: 10px; + padding: 16px 20px; + border-top: 1px solid #3c3c3c; +} +.button-cancel, .button-delete, .button-apply, .confirm-dialog-actions button, .insert-modal-submit, .language-picker-row, .shared-popover-entry, .colour-swatch { + cursor: pointer; +} +.button-cancel, .confirm-dialog-actions button, .insert-modal-submit { + border: 1px solid #4c4c4c; + border-radius: 4px; + padding: 8px 14px; + background: transparent; + color: #f0f0f0; +} +.button-apply, .confirm-dialog-actions .primary, .insert-modal-submit { + background: #0e639c; + border-color: #0e639c; +} +.button-delete { + border: none; + border-radius: 4px; + padding: 8px 14px; + background: #c73c3c; + color: #ffffff; +} +.insert-modal-tabs { + display: flex; + margin: 0 -20px; +} +.insert-modal-tab { + flex: 1; + border: none; + border-bottom: 2px solid transparent; + background: transparent; + color: #9d9d9d; + padding: 10px 16px; +} +.insert-modal-tab.active { + color: #ffffff; + border-bottom-color: #0e639c; + background: #252526; +} +.insert-modal-search { + border-bottom: 1px solid #3c3c3c; +} +.insert-modal-input, .shared-popover-input { + width: 100%; + border: none; + background: transparent; + color: #f0f0f0; + padding: 14px 20px; + font: inherit; +} +.menu-editor-header h2 { + margin: 0; +} +.menu-editor-header p { + margin: 0.25rem 0 0; + color: var(--vscode-descriptionForeground); +} +.menu-editor-tree-wrap { + border: 1px solid var(--vscode-panel-border); + border-radius: 6px; + background: var(--vscode-editor-background); + padding: 0.5rem; + min-height: 0; +} +.menu-editor-toolbar { + margin-bottom: 0.5rem; + padding-bottom: 0.4rem; + border-bottom: 1px solid var(--vscode-panel-border); +} +.menu-editor-tool { + width: 1.8rem; + height: 1.8rem; + display: inline-flex; + align-items: center; + justify-content: center; + border: 1px solid transparent; + border-radius: 4px; + background: transparent; + color: var(--vscode-foreground); + cursor: pointer; + padding: 0; +} +.menu-editor-tool:hover:not(:disabled) { + background: var(--vscode-toolbar-hoverBackground); + border-color: var(--vscode-panel-border); +} +.menu-editor-tool:disabled { + opacity: 0.45; + cursor: not-allowed; +} +.menu-editor-tree-shell { + flex: 1; + min-height: 0; + overflow: auto; +} +.menu-editor-tree-level { + list-style: none; + margin: 0; + padding: 0; +} +.menu-editor-tree-item { + margin: 0; + padding: 0; +} +.menu-editor-row { + --menu-editor-indent: calc(var(--menu-editor-depth) * 1rem); + display: flex; + align-items: flex-start; + gap: 0.5rem; + padding: 0.3rem 0.45rem 0.3rem calc(0.4rem + var(--menu-editor-indent)); + border-radius: 4px; + cursor: pointer; + position: relative; +} +.menu-editor-row.is-selected { + background: var(--vscode-list-activeSelectionBackground); + color: var(--vscode-list-activeSelectionForeground); +} +.menu-editor-row.is-dragging { + opacity: 0.45; +} +.menu-editor-row.is-drop-before::before, .menu-editor-row.is-drop-after::after { + content: ""; + position: absolute; + left: calc(0.4rem + var(--menu-editor-indent)); + right: 0.45rem; + height: 2px; + background: var(--vscode-focusBorder); +} +.menu-editor-row.is-drop-before::before { + top: 0; +} +.menu-editor-row.is-drop-after::after { + bottom: 0; +} +.menu-editor-row.is-drop-inside { + box-shadow: inset 0 0 0 1px var(--vscode-focusBorder); + background: var(--vscode-list-hoverBackground); +} +.menu-editor-row-handle { + display: inline-flex; + align-items: center; + justify-content: center; + width: 1rem; + min-width: 1rem; + color: var(--vscode-descriptionForeground); + cursor: grab; + user-select: none; +} +.menu-editor-row-handle:active { + cursor: grabbing; +} +.menu-editor-row-kind { + display: inline-flex; + align-items: center; + justify-content: center; + width: 1rem; + min-width: 1rem; + opacity: 0.9; +} +.menu-editor-row-title { + flex: 1; + min-width: 0; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.menu-editor-row-title.is-editing { + white-space: normal; + overflow: visible; + text-overflow: clip; +} +.menu-editor-entry-form { + display: block; +} +.menu-editor-inline-input { + width: 100%; + border: 1px solid var(--vscode-focusBorder); + border-radius: 4px; + background: var(--vscode-input-background); + color: var(--vscode-input-foreground); + padding: 0.25rem 0.45rem; + min-height: 1.8rem; +} +.menu-editor-inline-search { + margin-top: 0.5rem; + border-top: 1px solid var(--vscode-panel-border); + padding-top: 0.5rem; + display: flex; + flex-direction: column; + gap: 0.4rem; + max-height: 18rem; + overflow: hidden; +} +.menu-editor-inline-search-head { + display: flex; + align-items: center; + justify-content: space-between; + gap: 0.75rem; +} +.menu-editor-inline-search-head strong { + display: block; + font-size: 0.8rem; +} +.menu-editor-inline-search-head span { + color: var(--vscode-descriptionForeground); + font-size: 0.75rem; +} +.menu-editor-inline-actions { + display: inline-flex; + align-items: center; + gap: 0.5rem; +} +.menu-editor-inline-action { + border: 1px solid var(--vscode-button-border, transparent); + border-radius: 4px; + background: var(--vscode-button-secondaryBackground); + color: var(--vscode-button-secondaryForeground); + padding: 0.2rem 0.5rem; + cursor: pointer; +} +.menu-editor-inline-action:hover { + background: var(--vscode-button-secondaryHoverBackground); +} +.menu-editor-picker-list { + display: flex; + flex-direction: column; + gap: 0.35rem; + max-height: 16rem; + overflow-y: auto; +} +.menu-editor-picker-item { + display: flex; + justify-content: space-between; + align-items: center; + width: 100%; + border: 1px solid var(--vscode-panel-border); + border-radius: 4px; + background: var(--vscode-input-background); + color: var(--vscode-input-foreground); + padding: 0.45rem 0.55rem; + text-align: left; + cursor: pointer; +} +.menu-editor-picker-item:hover { + border-color: var(--vscode-focusBorder); + background: var(--vscode-list-hoverBackground); +} +.menu-editor-picker-item small, .menu-editor-picker-state { + color: var(--vscode-descriptionForeground); +} +.menu-editor-empty { + color: var(--vscode-descriptionForeground); + padding: 0.5rem 0.25rem; +} +@media (max-width: 720px) { + .menu-editor-inline-search-head { + flex-direction: column; + align-items: flex-start; + } + .menu-editor-inline-actions { + width: 100%; + justify-content: flex-start; + flex-wrap: wrap; + } +} +[data-testid="media-editor"] .editor-tab-dirty { + color: var(--vscode-notificationsWarningIcon-foreground, var(--vscode-editorWarning-foreground)); + font-size: 10px; +} +[data-testid="media-editor"] .ui-editor-actions button { + padding: 4px 10px; + font-size: 12px; +} +[data-testid="media-editor"] .ui-editor-actions button.danger:hover { + background-color: var(--vscode-notificationsErrorIcon-foreground); +} +[data-testid="media-editor"] .auto-save-indicator { + font-size: 11px; + color: var(--vscode-descriptionForeground); + font-style: italic; +} +[data-testid="media-editor"] .quick-actions-wrapper { + position: relative; +} +[data-testid="media-editor"] .quick-actions-btn { + display: inline-flex; + align-items: center; + gap: 6px; +} +[data-testid="media-editor"] .quick-actions-btn-icon { + font-size: 12px; + line-height: 1; +} +[data-testid="media-editor"] .quick-actions-divider { + height: 1px; + background: var(--vscode-dropdown-border, #454545); +} +[data-testid="media-editor"] .quick-action-icon { + font-size: 16px; + flex-shrink: 0; + margin-top: 2px; +} +[data-testid="media-editor"] .quick-action-text strong { + font-size: 13px; + font-weight: 500; +} +[data-testid="media-editor"] .quick-action-text small { + font-size: 11px; + opacity: 0.7; +} +[data-testid="media-editor"] > .editor-content.media-editor { + flex-direction: row; + align-items: stretch; + gap: 24px; +} +[data-testid="media-editor"] .editor-field label { + font-size: 11px; + font-weight: 500; + color: var(--vscode-descriptionForeground); + text-transform: uppercase; + letter-spacing: 0.5px; +} +[data-testid="media-editor"] .post-editor-input.disabled, [data-testid="media-editor"] .post-editor-input:disabled { + opacity: 0.6; + cursor: not-allowed; +} +[data-testid="media-editor"] .media-preview { + flex: 1; + display: flex; + align-items: center; + justify-content: center; + background-color: var(--vscode-input-background); + border-radius: 8px; + min-height: 300px; + overflow: hidden; +} +[data-testid="media-editor"] .media-preview-placeholder { + display: flex; + flex-direction: column; + align-items: center; + gap: 12px; + color: var(--vscode-descriptionForeground); +} +[data-testid="media-editor"] .media-preview-image { + display: flex; + align-items: center; + justify-content: center; + align-self: stretch; + width: 100%; + height: 100%; + min-height: 0; + padding: 16px; + box-sizing: border-box; +} +[data-testid="media-editor"] .media-preview-image img { + width: 100%; + height: 100%; + object-fit: contain; + border-radius: 4px; +} +[data-testid="media-editor"] .media-details { + width: 320px; + gap: 12px; + flex-shrink: 0; +} +[data-testid="media-editor"] .media-details textarea { + resize: vertical; +} +[data-testid="media-editor"] .linked-posts-section label { + display: flex; + justify-content: space-between; + align-items: center; +} +[data-testid="media-editor"] .add-link-btn { + background: var(--vscode-button-secondaryBackground); + border: none; + color: var(--vscode-button-secondaryForeground); + padding: 2px 8px; + border-radius: 3px; + cursor: pointer; + font-size: 11px; +} +[data-testid="media-editor"] .add-link-btn:hover { + background: var(--vscode-button-secondaryHoverBackground); +} +[data-testid="media-editor"] .post-picker { + background: var(--vscode-dropdown-background); + border: 1px solid var(--vscode-dropdown-border); + border-radius: 4px; + margin-top: 8px; + max-height: 250px; + overflow-y: auto; +} +[data-testid="media-editor"] .post-picker-search { + padding: 8px; + border-bottom: 1px solid var(--vscode-dropdown-border); + position: sticky; + top: 0; + background: var(--vscode-dropdown-background); +} +[data-testid="media-editor"] .post-picker-search input { + width: 100%; + padding: 6px 10px; + background: var(--vscode-input-background); + border: 1px solid var(--vscode-input-border); + border-radius: 3px; + color: var(--vscode-input-foreground); + font-size: 12px; +} +[data-testid="media-editor"] .post-picker-search input:focus { + outline: none; + border-color: var(--vscode-focusBorder); +} +[data-testid="media-editor"] .post-picker-list { + padding: 4px; +} +[data-testid="media-editor"] .post-picker-item { + width: 100%; + padding: 6px 8px; + cursor: pointer; + border: none; + border-radius: 3px; + background: transparent; + color: inherit; + font-size: 12px; + text-align: left; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +[data-testid="media-editor"] .post-picker-item:hover { + background: var(--vscode-list-hoverBackground); +} +[data-testid="media-editor"] .post-picker-more { + padding: 6px 8px; + color: var(--vscode-descriptionForeground); + font-size: 11px; + font-style: italic; +} +[data-testid="media-editor"] .no-posts, [data-testid="media-editor"] .no-linked-posts { + padding: 12px 8px; + color: var(--vscode-descriptionForeground); + font-size: 12px; + font-style: italic; +} +[data-testid="media-editor"] .linked-posts-list { + margin-top: 8px; + display: flex; + flex-direction: column; + gap: 4px; +} +[data-testid="media-editor"] .linked-post-item { + display: flex; + align-items: center; + justify-content: space-between; + padding: 6px 8px; + background: var(--vscode-sideBar-background); + border-radius: 4px; +} +[data-testid="media-editor"] .linked-post-title, [data-testid="media-editor"] .linked-post-link { + flex: 1; + min-width: 0; + border: none; + background: transparent; + padding: 0; + color: inherit; + text-align: left; + cursor: pointer; + font-size: 12px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +[data-testid="media-editor"] .linked-post-title:hover, [data-testid="media-editor"] .linked-post-link:hover { + color: var(--vscode-textLink-foreground); + text-decoration: underline; +} +[data-testid="media-editor"] .linked-post-item .unlink-btn { + background: none; + border: none; + color: var(--vscode-descriptionForeground); + cursor: pointer; + padding: 0 4px; + font-size: 14px; + opacity: 0; + transition: opacity 0.1s; +} +[data-testid="media-editor"] .linked-post-item:hover .unlink-btn { + opacity: 1; +} +[data-testid="media-editor"] .linked-post-item .unlink-btn:hover { + color: var(--vscode-errorForeground); +} +.translation-modal-backdrop { + position: fixed; + inset: 0; + background: rgba(0, 0, 0, 0.68); + display: flex; + align-items: center; + justify-content: center; + pointer-events: auto; + z-index: 10001; +} +.translation-modal { + width: min(640px, calc(100vw - 32px)); + background: #1e1e1e; + border: 1px solid #3c3c3c; + border-radius: 8px; + box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4); +} +.translation-modal-header, .translation-modal-footer { + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; + padding: 16px 20px; +} +.translation-modal-header { + border-bottom: 1px solid #3c3c3c; +} +.translation-modal-footer { + border-top: 1px solid #3c3c3c; + justify-content: flex-end; + gap: 10px; +} +.translation-modal-body { + padding: 20px; + display: flex; + flex-direction: column; + gap: 14px; +} +.translation-modal-close { + border: none; + background: transparent; + color: #c5c5c5; + cursor: pointer; + font-size: 20px; + line-height: 1; +} +.import-analysis { + display: flex; + flex-direction: column; + gap: 16px; + padding: 18px 20px 26px; + color: var(--vscode-foreground); +} +.import-analysis-header { + display: flex; + flex-direction: column; + gap: 8px; +} +.import-analysis-header p { + margin: 0; + color: var(--vscode-descriptionForeground); + font-size: 13px; + line-height: 1.5; +} +.import-definition-name { + width: min(480px, 100%); + border: 1px solid var(--vscode-input-border, transparent); + background: var(--vscode-input-background); + color: var(--vscode-input-foreground, var(--vscode-foreground)); + border-radius: 6px; + padding: 10px 12px; + font-size: 18px; + font-weight: 600; +} +.import-file-selectors { + display: grid; + gap: 12px; +} +.import-file-row { + display: grid; + grid-template-columns: 150px minmax(0, 1fr) auto; + gap: 12px; + align-items: center; + padding: 12px 14px; + border: 1px solid var(--vscode-panel-border); + border-radius: 8px; + background: var(--vscode-editor-background); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-editor-background) 76%, var(--vscode-input-background)); + } +} +.import-file-row label { + font-size: 12px; + font-weight: 600; + color: var(--vscode-descriptionForeground); + text-transform: uppercase; + letter-spacing: 0.04em; +} +.import-file-path { + min-width: 0; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + font-family: var(--vscode-editor-font-family, ui-monospace, monospace); + font-size: 12px; +} +.import-file-path.placeholder { + color: var(--vscode-descriptionForeground); +} +.import-analysis button, .import-analysis select { + border: 1px solid var(--vscode-button-border, transparent); + border-radius: 6px; + font-size: 12px; +} +.import-analysis button { + background: var(--vscode-button-secondaryBackground, var(--vscode-button-background)); + color: var(--vscode-button-secondaryForeground, var(--vscode-button-foreground)); + padding: 8px 12px; + cursor: pointer; +} +.import-analysis button:hover:not(:disabled) { + background: var(--vscode-button-secondaryHoverBackground, var(--vscode-button-hoverBackground)); +} +.import-analyze-btn, .import-execute-btn { + background: var(--vscode-button-background) !important; + color: var(--vscode-button-foreground) !important; +} +.import-analysis button:disabled { + opacity: 0.65; + cursor: not-allowed; +} +.import-loading { + display: flex; + align-items: center; + gap: 12px; + padding: 16px; + border: 1px solid var(--vscode-panel-border); + border-radius: 10px; + background: var(--vscode-editor-background); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-editor-background) 84%, var(--vscode-input-background)); + } +} +.import-spinner { + width: 18px; + height: 18px; + border: 2px solid var(--vscode-descriptionForeground); + border-top-color: var(--vscode-button-background); + border-radius: 50%; + animation: import-spinner-rotate 0.8s linear infinite; + flex-shrink: 0; +} +.import-progress { + display: flex; + flex-direction: column; + gap: 2px; +} +.import-progress-step { + font-size: 13px; + color: var(--vscode-foreground); +} +.import-progress-detail { + font-size: 11px; + color: var(--vscode-descriptionForeground); +} +@keyframes import-spinner-rotate { + to { + transform: rotate(360deg); + } +} +.import-site-info { + display: grid; + grid-template-columns: repeat(4, minmax(0, 1fr)); + gap: 12px; +} +.import-site-info-item, .import-stat-card, .import-date-distribution, .import-detail-section, .import-execute-section { + border: 1px solid var(--vscode-panel-border); + border-radius: 10px; + background: var(--vscode-editor-background); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-editor-background) 84%, var(--vscode-input-background)); + } +} +.import-site-info-item { + display: flex; + flex-direction: column; + gap: 6px; + padding: 14px; +} +.info-label { + font-size: 11px; + font-weight: 600; + color: var(--vscode-descriptionForeground); + text-transform: uppercase; + letter-spacing: 0.05em; +} +.info-value { + font-size: 13px; + font-weight: 500; + overflow-wrap: anywhere; +} +.import-stat-cards { + display: grid; + grid-template-columns: repeat(5, minmax(0, 1fr)); + gap: 12px; +} +.import-stat-card { + padding: 14px; +} +.import-stat-card h3, .import-date-distribution h3, .import-detail-section h3, .taxonomy-group h4 { + margin: 0; +} +.import-stat-number { + margin-top: 10px; + font-size: 28px; + font-weight: 700; + line-height: 1; +} +.import-stat-breakdown, .import-execute-summary, .import-taxonomy-list { + display: flex; + flex-wrap: wrap; + gap: 8px; +} +.import-stat-breakdown { + margin-top: 12px; +} +.import-stat-tag, .import-count-tag, .import-taxonomy-pill, .macro-status-badge { + display: inline-flex; + align-items: center; + gap: 4px; + padding: 4px 9px; + border-radius: 999px; + font-size: 11px; + font-weight: 600; +} +.stat-new, .import-taxonomy-pill.new-tax { + background: rgba(117, 190, 255, 0.16); + color: #75beff; +} +.stat-update, .stat-mapped, .import-taxonomy-pill.exists, .import-taxonomy-pill.mapped, .macro-status-badge.mapped, .import-execution-complete { + background: rgba(115, 201, 145, 0.16); + color: #73c991; +} +.stat-conflict { + background: rgba(255, 166, 87, 0.16); + color: #ffb169; +} +.stat-duplicate, .stat-missing, .macro-status-badge.unmapped, .import-execution-error { + background: rgba(204, 167, 0, 0.16); + color: #cca700; +} +.import-date-distribution, .import-detail-section, .import-execute-section { + padding: 16px; +} +.import-section-toggle { + width: 100%; + display: flex; + align-items: center; + justify-content: space-between; + gap: 10px; + padding: 0; + border: none !important; + background: transparent !important; + color: inherit !important; + font-size: 16px !important; + font-weight: 600; + text-align: left; +} +.import-section-toggle:hover { + background: transparent !important; + opacity: 0.9; +} +.toggle-icon { + font-size: 12px; + color: var(--vscode-descriptionForeground); +} +.distribution-bars { + display: grid; + gap: 10px; + margin-top: 14px; +} +.distribution-row { + display: grid; + grid-template-columns: 56px minmax(0, 1fr) 72px; + gap: 10px; + align-items: center; +} +.distribution-year, .distribution-count, .slug-cell { + font-family: var(--vscode-editor-font-family, ui-monospace, monospace); + font-size: 11px; +} +.distribution-bar-container { + height: 10px; + border-radius: 999px; + overflow: hidden; + background: var(--vscode-input-background); +} +.distribution-bar { + height: 100%; + min-width: 8px; + border-radius: inherit; +} +.distribution-bar-posts { + background: linear-gradient(90deg, rgba(117, 190, 255, 0.8), rgba(117, 190, 255, 0.35)); +} +.import-execute-section { + display: flex; + align-items: center; + justify-content: space-between; + gap: 16px; +} +.import-execute-summary { + color: var(--vscode-descriptionForeground); +} +.import-execution-complete, .import-execution-error { + padding: 10px 12px; + border-radius: 8px; + font-size: 12px; + font-weight: 600; +} +.import-execution-progress { + display: grid; + gap: 10px; + padding: 16px; + border: 1px solid var(--vscode-panel-border); + border-radius: 10px; + background: var(--vscode-editor-background); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-editor-background) 84%, var(--vscode-input-background)); + } +} +.import-execution-header { + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; +} +.import-execution-header h3 { + margin: 0; + font-size: 14px; +} +.import-progress-bar { + height: 10px; + border-radius: 999px; + overflow: hidden; + background: var(--vscode-input-background); +} +.import-progress-fill { + height: 100%; + background: linear-gradient(90deg, rgba(117, 190, 255, 0.85), rgba(117, 190, 255, 0.45)); +} +.import-progress-info { + display: flex; + align-items: center; + gap: 12px; + flex-wrap: wrap; + font-size: 12px; +} +.import-phase { + font-weight: 600; +} +.import-detail, .import-counter { + color: var(--vscode-descriptionForeground); +} +.import-detail-table { + width: 100%; + border-collapse: collapse; + margin-top: 14px; +} +.import-detail-table th, .import-detail-table td { + padding: 10px 8px; + text-align: left; + border-bottom: 1px solid var(--vscode-panel-border); + vertical-align: middle; + font-size: 12px; +} +.import-detail-table th { + font-size: 11px; + color: var(--vscode-descriptionForeground); + text-transform: uppercase; + letter-spacing: 0.04em; +} +.import-detail-table .status-badge { + display: inline-flex; + align-items: center; + border-radius: 999px; + padding: 4px 9px; + font-size: 10px; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.04em; +} +.import-detail-table .status-badge.new { + background: rgba(117, 190, 255, 0.16); + color: #75beff; +} +.import-detail-table .status-badge.update { + background: rgba(115, 201, 145, 0.16); + color: #73c991; +} +.import-detail-table .status-badge.conflict { + background: rgba(255, 166, 87, 0.16); + color: #ffb169; +} +.import-detail-table .status-badge.duplicate, .import-detail-table .status-badge.missing { + background: rgba(204, 167, 0, 0.16); + color: #cca700; +} +.categories-cell, .existing-match, .mime-type-cell, .post-type-cell { + font-size: 11px; + color: var(--vscode-descriptionForeground); +} +.mime-type-cell, .post-type-cell, .existing-match, .slug-cell { + font-family: var(--vscode-editor-font-family, ui-monospace, monospace); +} +.resolution-select, .taxonomy-mapping-input { + min-width: 150px; + background: var(--vscode-dropdown-background, var(--vscode-input-background)); + color: var(--vscode-dropdown-foreground, var(--vscode-foreground)); + border: 1px solid var(--vscode-dropdown-border, var(--vscode-panel-border)); + padding: 6px 8px; +} +.taxonomy-analyze-row { + display: flex; + align-items: center; + gap: 12px; + padding: 0 0 12px; + margin-top: 12px; + border-bottom: 1px solid var(--vscode-panel-border); +} +.taxonomy-analyze-dropdown { + position: relative; +} +.taxonomy-analyze-btn { + display: inline-flex; + align-items: center; + gap: 6px; + white-space: nowrap; +} +.taxonomy-model-dropdown { + position: absolute; + top: calc(100% + 6px); + left: 0; + min-width: 220px; + max-height: 280px; + overflow-y: auto; + background: var(--vscode-dropdown-background, var(--vscode-sideBar-background)); + border: 1px solid var(--vscode-dropdown-border, var(--vscode-panel-border)); + border-radius: 6px; + box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24); + z-index: 20; +} +.taxonomy-model-option { + width: 100%; + display: block; + border: none !important; + border-radius: 0 !important; + background: transparent !important; + color: var(--vscode-foreground) !important; + text-align: left; + padding: 8px 12px !important; +} +.taxonomy-model-option:hover { + background: var(--vscode-list-hoverBackground) !important; +} +.taxonomy-analyze-hint { + font-size: 11px; + color: var(--vscode-descriptionForeground); +} +.import-taxonomy-groups { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 16px; + margin-top: 14px; +} +.taxonomy-group { + display: flex; + flex-direction: column; + gap: 12px; +} +.import-taxonomy-entry, .import-taxonomy-edit-form { + display: inline-flex; + align-items: center; + gap: 8px; +} +.import-taxonomy-entry, .import-taxonomy-edit-form { + flex-wrap: wrap; +} +.import-taxonomy-pill { + border: none; + cursor: default; +} +button.import-taxonomy-pill { + cursor: pointer; +} +.mapped-target { + background: rgba(115, 201, 145, 0.1); +} +.taxonomy-mapping-arrow { + color: var(--vscode-descriptionForeground); + font-size: 12px; +} +.taxonomy-mapping-input { + min-width: 170px; + border-radius: 6px; +} +.taxonomy-edit-btn, .taxonomy-clear-btn { + min-width: 28px; + min-height: 28px; + padding: 0 8px !important; + display: inline-flex; + align-items: center; + justify-content: center; +} +.taxonomy-edit-btn.ghost, .taxonomy-clear-btn { + background: transparent !important; + border: 1px solid var(--vscode-panel-border) !important; + color: var(--vscode-descriptionForeground) !important; +} +.macros-list { + display: grid; + gap: 10px; + margin-top: 14px; +} +.macro-item { + border: 1px solid var(--vscode-panel-border); + border-radius: 8px; + background: var(--vscode-input-background); +} +.macro-item.unmapped { + border-left: 3px solid #cca700; +} +.macro-header { + display: flex; + align-items: center; + gap: 10px; + padding: 12px 14px; +} +.macro-name, .import-taxonomy-pill { + font-family: var(--vscode-editor-font-family, ui-monospace, monospace); +} +.macro-count { + margin-left: auto; + font-size: 11px; + color: var(--vscode-descriptionForeground); +} +.import-empty-state { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 12px; + padding: 56px 20px; + color: var(--vscode-descriptionForeground); + border: 1px dashed var(--vscode-panel-border); + border-radius: 12px; +} +.import-empty-state p { + margin: 0; + font-size: 13px; +} +@media (max-width: 1100px) { + .import-site-info, .import-stat-cards, .import-taxonomy-groups { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } +} +@media (max-width: 780px) { + .import-analysis { + padding: 14px; + } + .import-file-row, .distribution-row, .import-execute-section, .import-site-info, .import-stat-cards, .import-taxonomy-groups { + grid-template-columns: 1fr; + } + .import-execute-section { + align-items: stretch; + } + .import-file-row { + align-items: stretch; + } + .import-analysis button, .resolution-select, .taxonomy-mapping-input { + width: 100%; + } + .taxonomy-analyze-row { + flex-direction: column; + align-items: stretch; + } + .import-taxonomy-entry, .import-taxonomy-edit-form { + width: 100%; + flex-direction: column; + align-items: stretch; + } +} +.misc-editor-shell { + background: var(--vscode-editor-background); +} +.misc-editor-header { + padding: 12px 16px 8px; + border-bottom: 1px solid var(--vscode-panel-border); + background: var(--vscode-tab-activeBackground); +} +.misc-editor-header h2 { + margin: 0; + font-size: 15px; + font-weight: 600; +} +.misc-editor-header p { + margin: 2px 0 0; + font-size: 12px; + color: var(--vscode-descriptionForeground); +} +.misc-editor-actions { + flex-shrink: 0; +} +.misc-editor-summary { + padding: 8px 16px; + border-bottom: 1px solid var(--vscode-panel-border); +} +.misc-editor-content { + padding: 16px; +} +.misc-summary-pill { + display: inline-flex; + align-items: center; + gap: 6px; + padding: 3px 10px; + border-radius: 999px; + font-size: 12px; + background: var(--vscode-input-background); + border: 1px solid var(--vscode-panel-border); + color: var(--vscode-foreground); +} +.misc-summary-pill span { + color: var(--vscode-descriptionForeground); +} +.misc-summary-pill strong { + font-weight: 600; +} +.misc-card { + padding: 14px 16px; + border: 1px solid var(--vscode-panel-border); + border-radius: 8px; + background: var(--vscode-editor-background); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-editor-background) 84%, var(--vscode-input-background)); + } +} +.misc-card h3 { + margin: 0 0 8px; + font-size: 13px; + font-weight: 600; +} +.misc-card p { + margin: 0; + color: var(--vscode-descriptionForeground); + font-size: 12px; +} +.misc-card ul { + margin: 6px 0 0; + padding-left: 18px; + font-size: 12px; + line-height: 1.6; +} +.misc-columns { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 12px; +} +.misc-list { + display: flex; + flex-direction: column; + gap: 2px; +} +.misc-list-item { + display: flex; + align-items: center; + gap: 10px; + padding: 8px 12px; + border-radius: 4px; +} +.misc-list-item:hover { + background: var(--vscode-list-hoverBackground); +} +.duplicate-pair-row label { + display: flex; + align-items: center; + gap: 6px; + flex-shrink: 0; + cursor: pointer; +} +.duplicate-pair-row .linkish { + background: none; + border: none; + color: var(--vscode-textLink-foreground, #3794ff); + cursor: pointer; + padding: 0; + font: inherit; + text-decoration: underline; + text-decoration-thickness: 1px; + text-underline-offset: 0.14em; +} +.duplicate-pair-row .linkish:hover { + color: var(--vscode-foreground); +} +.metadata-diff-tool { + display: flex; + flex-direction: column; + gap: 12px; +} +.metadata-diff-tabs { + display: flex; + gap: 2px; + border-bottom: 1px solid var(--vscode-panel-border); +} +.metadata-diff-tab { + display: inline-flex; + align-items: center; + gap: 6px; + padding: 7px 14px; + border: none; + border-bottom: 2px solid transparent; + background: transparent; + color: var(--vscode-tab-inactiveForeground, var(--vscode-descriptionForeground)); + font: inherit; + font-size: 12px; + cursor: pointer; + transition: color 0.12s, border-color 0.12s; +} +.metadata-diff-tab:hover { + color: var(--vscode-tab-activeForeground, var(--vscode-foreground)); +} +.metadata-diff-tab.active { + color: var(--vscode-tab-activeForeground, var(--vscode-foreground)); + border-bottom-color: var(--vscode-focusBorder, #007fd4); +} +.tab-badge { + display: inline-flex; + align-items: center; + justify-content: center; + min-width: 18px; + height: 18px; + padding: 0 5px; + border-radius: 999px; + font-size: 11px; + font-weight: 600; + background: var(--vscode-activityBarBadge-background, #007acc); + color: var(--vscode-activityBarBadge-foreground, #ffffff); +} +.metadata-diff-field-pills { + display: flex; + flex-wrap: wrap; + gap: 6px; +} +.metadata-diff-field-pill { + display: flex; + align-items: stretch; + border-radius: 6px; + border: 1px solid var(--vscode-panel-border); + background: var(--vscode-input-background); + overflow: hidden; + transition: border-color 0.12s; +} +.metadata-diff-field-pill.active { + border-color: var(--vscode-focusBorder, #007fd4); + background: var(--vscode-focusBorder, #007fd4); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-focusBorder, #007fd4) 12%, transparent); + } +} +.metadata-diff-field-pill-toggle { + display: inline-flex; + align-items: center; + gap: 6px; + padding: 4px 10px; + border: none; + background: transparent; + color: var(--vscode-foreground); + font: inherit; + font-size: 12px; + cursor: pointer; +} +.metadata-diff-field-pill-toggle:hover { + background: var(--vscode-list-hoverBackground); +} +.field-pill-label { + font-weight: 500; +} +.field-pill-count { + font-size: 11px; + font-weight: 600; + color: var(--vscode-descriptionForeground); +} +.metadata-diff-field-pill-actions { + display: flex; + align-items: center; + gap: 2px; + padding: 2px 4px; + border-left: 1px solid var(--vscode-panel-border); +} +.metadata-diff-action-button { + font-size: 11px !important; + padding: 2px 8px !important; + min-height: 22px !important; +} +.metadata-diff-results { + display: flex; + flex-direction: column; + gap: 12px; +} +.metadata-diff-empty p { + text-align: center; + padding: 20px 0; +} +.diff-item-list { + display: flex; + flex-direction: column; + gap: 8px; +} +.diff-item-card { + border: 1px solid var(--vscode-panel-border); + border-radius: 8px; + background: var(--vscode-editor-background); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-editor-background) 84%, var(--vscode-input-background)); + } + overflow: hidden; +} +.diff-item-card.orphan-file { + border-left: 3px solid var(--vscode-editorWarning-foreground, #cca700); +} +.diff-item-header { + display: flex; + align-items: flex-start; + justify-content: space-between; + gap: 12px; + padding: 10px 14px; + background: var(--vscode-sideBar-background); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-sideBar-background) 50%, transparent); + } + border-bottom: 1px solid var(--vscode-panel-border); +} +.diff-item-header strong { + font-size: 13px; + font-weight: 600; + color: var(--vscode-foreground); +} +.diff-item-meta { + font-size: 11px; + color: var(--vscode-descriptionForeground); + margin-top: 2px; +} +.diff-item-fields { + padding: 8px 14px; +} +.diff-field-row { + display: grid; + grid-template-columns: 120px 1fr; + gap: 8px; + padding: 5px 0; + border-bottom: 1px solid var(--vscode-panel-border); + @supports (color: color-mix(in lab, red, red)) { + border-bottom: 1px solid color-mix(in srgb, var(--vscode-panel-border) 50%, transparent); + } +} +.diff-field-row:last-child { + border-bottom: none; +} +.diff-field-name { + font-size: 11px; + font-weight: 600; + color: var(--vscode-descriptionForeground); + text-transform: uppercase; + letter-spacing: 0.04em; + padding-top: 3px; +} +.diff-field-values { + display: flex; + flex-direction: column; + gap: 3px; +} +.diff-field-value { + display: flex; + align-items: baseline; + gap: 8px; + font-size: 12px; + line-height: 1.4; + word-break: break-word; +} +.diff-field-value.db-value { + color: var(--vscode-foreground); +} +.diff-field-value.file-value { + color: var(--vscode-foreground); + opacity: 0.82; +} +.diff-source-label { + flex-shrink: 0; + min-width: 28px; + font-size: 10px; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.04em; + padding: 1px 5px; + border-radius: 3px; +} +.db-value .diff-source-label { + background: var(--vscode-focusBorder, #007fd4); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-focusBorder, #007fd4) 22%, transparent); + } + color: var(--vscode-focusBorder, #007fd4); +} +.file-value .diff-source-label { + background: var(--vscode-testing-iconPassed, #73c991); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-testing-iconPassed, #73c991) 22%, transparent); + } + color: var(--vscode-testing-iconPassed, #73c991); +} +.orphan-files-section { + border: 1px solid var(--vscode-editorWarning-foreground, #cca700); + @supports (color: color-mix(in lab, red, red)) { + border: 1px solid color-mix(in srgb, var(--vscode-editorWarning-foreground, #cca700) 35%, transparent); + } + border-radius: 8px; + padding: 14px 16px; + background: var(--vscode-editorWarning-foreground, #cca700); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-editorWarning-foreground, #cca700) 5%, var(--vscode-editor-background)); + } +} +.orphan-files-header { + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; + margin-bottom: 10px; +} +.orphan-files-header h3 { + margin: 0; + font-size: 13px; + font-weight: 600; +} +.orphan-files-actions { + display: flex; + align-items: center; + gap: 8px; +} +.orphan-path span { + font-family: "SFMono-Regular", Menlo, Monaco, Consolas, monospace; + font-size: 12px; + color: var(--vscode-descriptionForeground); +} +.translation-validation-view { + display: flex; + flex-direction: column; + gap: 16px; +} +.translation-validation-summary { + padding: 10px 14px; + border-radius: 6px; + background: var(--vscode-input-background); + border: 1px solid var(--vscode-panel-border); + font-size: 12px; + color: var(--vscode-descriptionForeground); +} +.translation-validation-summary p { + margin: 0; +} +.translation-validation-section h3 { + margin: 0 0 8px; + font-size: 13px; + font-weight: 600; +} +.translation-validation-empty { + color: var(--vscode-descriptionForeground); + font-size: 12px; +} +.translation-validation-list { + display: flex; + flex-direction: column; + gap: 8px; +} +.translation-validation-card { + padding: 10px 14px; + border: 1px solid var(--vscode-panel-border); + border-radius: 6px; + background: var(--vscode-editor-background); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-editor-background) 84%, var(--vscode-input-background)); + } +} +.translation-validation-card-db { + border-left: 3px solid var(--vscode-focusBorder, #007fd4); +} +.translation-validation-card-file { + border-left: 3px solid var(--vscode-testing-iconPassed, #73c991); +} +.translation-validation-card-title { + margin: 0 0 6px; + font-size: 13px; + font-weight: 600; +} +.translation-validation-card-meta { + display: grid; + grid-template-columns: auto 1fr; + gap: 3px 12px; + margin: 0; + font-size: 12px; +} +.translation-validation-card-meta dt { + color: var(--vscode-descriptionForeground); + font-weight: 500; +} +.translation-validation-card-meta dd { + margin: 0; +} +.translation-validation-actions { + display: flex; + gap: 8px; + padding-top: 8px; + border-top: 1px solid var(--vscode-panel-border); +} +.git-diff-view { + display: flex; + flex-direction: column; + gap: 12px; + min-height: 0; + height: 100%; +} +.git-diff-empty { + color: var(--vscode-descriptionForeground); + text-align: center; + padding: 24px 0; +} +.git-diff-toolbar { + display: flex; + align-items: center; + gap: 10px; + flex-shrink: 0; +} +.git-diff-toolbar label { + font-size: 12px; + font-weight: 500; + color: var(--vscode-descriptionForeground); + flex-shrink: 0; +} +.git-diff-toolbar select { + flex: 1; + min-width: 0; +} +.git-diff-editor { + flex: 1; + min-height: 0; + overflow: hidden; + border: 1px solid var(--vscode-panel-border); + border-radius: 4px; +} +@layer components { + .ui-button { + display: inline-flex; + align-items: center; + justify-content: center; + gap: 6px; + min-height: 28px; + padding: 4px 10px; + border: 1px solid transparent; + border-radius: 4px; + font: inherit; + line-height: 1.2; + cursor: pointer; + user-select: none; + } + .ui-button:hover:not(:disabled) { + background: var(--vscode-button-hoverBackground, #0e639c); + } + .ui-button:disabled { + opacity: 0.5; + cursor: not-allowed; + } + .ui-button-primary { + color: var(--vscode-button-foreground, #ffffff); + background: var(--vscode-button-background, var(--vscode-focusBorder)); + } + .ui-button-primary:hover:not(:disabled) { + background: var(--vscode-button-hoverBackground, #0e639c); + } + .ui-button-secondary { + color: var(--vscode-button-secondaryForeground, var(--vscode-foreground)); + background: var(--vscode-button-secondaryBackground, rgba(255, 255, 255, 0.08)); + border-color: var(--vscode-button-border, transparent); + } + .ui-button-secondary:hover:not(:disabled) { + background: var(--vscode-button-secondaryHoverBackground, #4a4d51); + } + .ui-button-danger { + color: var(--vscode-errorForeground, #f48771); + background: transparent; + border-color: var(--vscode-errorForeground, #f48771); + @supports (color: color-mix(in lab, red, red)) { + border-color: color-mix(in srgb, var(--vscode-errorForeground, #f48771) 45%, transparent); + } + } + .ui-button-danger:hover:not(:disabled) { + background: var(--vscode-errorForeground, #f48771); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-errorForeground, #f48771) 14%, transparent); + } + } + .ui-button-compact { + min-height: 24px; + padding: 3px 8px; + font-size: 12px; + } + .ui-input, .ui-textarea { + width: 100%; + padding: 8px 10px; + border: 1px solid var(--vscode-input-border, var(--vscode-panel-border)); + border-radius: 4px; + background: var(--vscode-input-background, rgba(255, 255, 255, 0.06)); + color: var(--vscode-input-foreground, var(--vscode-foreground)); + font: inherit; + } + .ui-textarea { + line-height: 1.5; + resize: vertical; + } + .ui-input:focus, .ui-textarea:focus { + outline: 1px solid var(--vscode-focusBorder, #007fd4); + outline-offset: 1px; + } + .ui-input-readonly, .ui-input[readonly] { + opacity: 0.7; + cursor: not-allowed; + } + .ui-input-disabled, .ui-input:disabled { + opacity: 0.6; + cursor: not-allowed; + } + .ui-tab { + border: none; + color: var(--vscode-tab-inactiveForeground, var(--vscode-foreground)); + background: transparent; + } + .ui-tab:hover { + color: var(--vscode-tab-activeForeground, var(--vscode-foreground)); + } + .ui-tab-active { + color: var(--vscode-tab-activeForeground, var(--vscode-foreground)); + } + .ui-badge { + display: inline-flex; + align-items: center; + padding: 2px 8px; + border-radius: 999px; + font-size: 11px; + font-weight: 500; + text-transform: uppercase; + letter-spacing: 0.04em; + } + .ui-panel-entry { + border: 1px solid var(--vscode-panel-border); + border-radius: 4px; + background-color: var(--vscode-sideBar-background); + } + .ui-empty-state { + display: flex; + flex-direction: column; + gap: 6px; + color: var(--vscode-descriptionForeground); + } + .ui-editor-shell { + height: 100%; + min-height: 0; + display: flex; + flex-direction: column; + overflow: hidden; + background: var(--vscode-editor-background); + } + .ui-editor-header { + display: flex; + align-items: flex-start; + justify-content: space-between; + gap: 12px; + min-height: 35px; + padding: 0 12px; + border-bottom: 1px solid var(--vscode-panel-border); + background: var(--vscode-tab-activeBackground); + } + .ui-editor-tab-current { + display: inline-flex; + max-width: 100%; + align-items: center; + gap: 6px; + overflow: hidden; + padding: 6px 12px; + border-radius: 4px 4px 0 0; + background: var(--vscode-tab-activeBackground); + color: var(--vscode-tab-activeForeground); + } + .ui-editor-actions { + display: flex; + align-items: center; + justify-content: flex-end; + gap: 8px; + flex-wrap: wrap; + } + .ui-toolbar { + display: flex; + align-items: center; + gap: 12px; + min-height: 32px; + } + .ui-toolbar-group { + display: flex; + align-items: center; + gap: 8px; + min-width: 0; + } + .ui-field-stack { + display: flex; + flex-direction: column; + gap: 6px; + min-width: 0; + } + .ui-field-stack > label, .ui-field-label { + font-size: 11px; + font-weight: 500; + color: var(--vscode-descriptionForeground); + text-transform: uppercase; + letter-spacing: 0.5px; + } + .ui-field-grid-2, .ui-field-grid-3 { + display: grid; + gap: 16px; + } + .ui-dropdown-menu { + background: var(--vscode-dropdown-background, var(--vscode-sideBar-background)); + border: 1px solid var(--vscode-dropdown-border, var(--vscode-panel-border)); + border-radius: 6px; + box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35); + overflow: hidden; + } + .ui-dropdown-item { + display: flex; + align-items: flex-start; + gap: 10px; + width: 100%; + padding: 10px 12px; + border: none; + background: transparent; + color: var(--vscode-dropdown-foreground, var(--vscode-foreground)); + cursor: pointer; + text-align: left; + transition: background 0.1s; + } + .ui-dropdown-item:hover:not(:disabled) { + background: var(--vscode-list-hoverBackground, #2a2d2e); + } + .ui-dropdown-item:disabled { + opacity: 0.5; + cursor: not-allowed; + } + .ui-section-card { + border: 1px solid var(--vscode-panel-border); + border-radius: 8px; + background: var(--vscode-editor-background); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-editor-background) 84%, var(--vscode-input-background)); + } + } + .btn-base { + display: inline-flex; + align-items: center; + justify-content: center; + gap: 6px; + min-height: 28px; + padding: 4px 10px; + border: 1px solid transparent; + border-radius: 4px; + font: inherit; + line-height: 1.2; + cursor: pointer; + user-select: none; + } + .btn-theme-primary { + color: var(--vscode-button-foreground, #ffffff); + background: var(--vscode-button-background, var(--vscode-focusBorder)); + } + .btn-theme-primary:hover { + background: var(--vscode-button-hoverBackground, #0e639c); + } + .btn-theme-danger { + color: var(--vscode-errorForeground, #f48771); + background: transparent; + border-color: var(--vscode-errorForeground, #f48771); + @supports (color: color-mix(in lab, red, red)) { + border-color: color-mix(in srgb, var(--vscode-errorForeground, #f48771) 45%, transparent); + } + } + .btn-theme-danger:hover { + background: var(--vscode-errorForeground, #f48771); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--vscode-errorForeground, #f48771) 14%, transparent); + } + } + .panel-entry { + border: 1px solid var(--vscode-panel-border); + border-radius: 4px; + background-color: var(--vscode-sideBar-background); + } + .monaco-host { + min-width: 0; + min-height: 0; + overflow: hidden; + } +} +@media (min-width: 768px) { + .ui-field-grid-2 { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + .ui-field-grid-3 { + grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; + } +} +@property --tw-rotate-x { + syntax: "*"; + inherits: false; +} +@property --tw-rotate-y { + syntax: "*"; + inherits: false; +} +@property --tw-rotate-z { + syntax: "*"; + inherits: false; +} +@property --tw-skew-x { + syntax: "*"; + inherits: false; +} +@property --tw-skew-y { + syntax: "*"; + inherits: false; +} +@property --tw-border-style { + syntax: "*"; + inherits: false; + initial-value: solid; +} +@property --tw-tracking { + syntax: "*"; + inherits: false; +} +@property --tw-outline-style { + syntax: "*"; + inherits: false; + initial-value: solid; +} +@property --tw-blur { + syntax: "*"; + inherits: false; +} +@property --tw-brightness { + syntax: "*"; + inherits: false; +} +@property --tw-contrast { + syntax: "*"; + inherits: false; +} +@property --tw-grayscale { + syntax: "*"; + inherits: false; +} +@property --tw-hue-rotate { + syntax: "*"; + inherits: false; +} +@property --tw-invert { + syntax: "*"; + inherits: false; +} +@property --tw-opacity { + syntax: "*"; + inherits: false; +} +@property --tw-saturate { + syntax: "*"; + inherits: false; +} +@property --tw-sepia { + syntax: "*"; + inherits: false; +} +@property --tw-drop-shadow { + syntax: "*"; + inherits: false; +} +@property --tw-drop-shadow-color { + syntax: "*"; + inherits: false; +} +@property --tw-drop-shadow-alpha { + syntax: ""; + inherits: false; + initial-value: 100%; +} +@property --tw-drop-shadow-size { + syntax: "*"; + inherits: false; +} +@keyframes spin { + to { + transform: rotate(360deg); + } +} +@layer properties { + @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) { + *, ::before, ::after, ::backdrop { + --tw-rotate-x: initial; + --tw-rotate-y: initial; + --tw-rotate-z: initial; + --tw-skew-x: initial; + --tw-skew-y: initial; + --tw-border-style: solid; + --tw-tracking: initial; + --tw-outline-style: solid; + --tw-blur: initial; + --tw-brightness: initial; + --tw-contrast: initial; + --tw-grayscale: initial; + --tw-hue-rotate: initial; + --tw-invert: initial; + --tw-opacity: initial; + --tw-saturate: initial; + --tw-sepia: initial; + --tw-drop-shadow: initial; + --tw-drop-shadow-color: initial; + --tw-drop-shadow-alpha: 100%; + --tw-drop-shadow-size: initial; + } + } +} diff --git a/priv/static/assets/app.js b/priv/static/assets/app.js index 4946634..0488d1d 100644 --- a/priv/static/assets/app.js +++ b/priv/static/assets/app.js @@ -1,26 +1,9751 @@ -(()=>{var Me=e=>typeof e=="function"?e:function(){return e},ps=typeof self<"u"?self:null,Te=typeof window<"u"?window:null,K=ps||Te||globalThis,ms="2.0.0",z={connecting:0,open:1,closing:2,closed:3},gs=1e4,vs=1e3,B={closed:"closed",errored:"errored",joined:"joined",joining:"joining",leaving:"leaving"},se={close:"phx_close",error:"phx_error",join:"phx_join",reply:"phx_reply",leave:"phx_leave"},St={longpoll:"longpoll",websocket:"websocket"},bs={complete:4},kt="base64url.bearer.phx.",Ge=class{constructor(e,t,i,s){this.channel=e,this.event=t,this.payload=i||function(){return{}},this.receivedResp=null,this.timeout=s,this.timeoutTimer=null,this.recHooks=[],this.sent=!1}resend(e){this.timeout=e,this.reset(),this.send()}send(){this.hasReceived("timeout")||(this.startTimeout(),this.sent=!0,this.channel.socket.push({topic:this.channel.topic,event:this.event,payload:this.payload(),ref:this.ref,join_ref:this.channel.joinRef()}))}receive(e,t){return this.hasReceived(e)&&t(this.receivedResp.response),this.recHooks.push({status:e,callback:t}),this}reset(){this.cancelRefEvent(),this.ref=null,this.refEvent=null,this.receivedResp=null,this.sent=!1}matchReceive({status:e,response:t,_ref:i}){this.recHooks.filter(s=>s.status===e).forEach(s=>s.callback(t))}cancelRefEvent(){this.refEvent&&this.channel.off(this.refEvent)}cancelTimeout(){clearTimeout(this.timeoutTimer),this.timeoutTimer=null}startTimeout(){this.timeoutTimer&&this.cancelTimeout(),this.ref=this.channel.socket.makeRef(),this.refEvent=this.channel.replyEventName(this.ref),this.channel.on(this.refEvent,e=>{this.cancelRefEvent(),this.cancelTimeout(),this.receivedResp=e,this.matchReceive(e)}),this.timeoutTimer=setTimeout(()=>{this.trigger("timeout",{})},this.timeout)}hasReceived(e){return this.receivedResp&&this.receivedResp.status===e}trigger(e,t){this.channel.trigger(this.refEvent,{status:e,response:t})}},ei=class{constructor(e,t){this.callback=e,this.timerCalc=t,this.timer=null,this.tries=0}reset(){this.tries=0,clearTimeout(this.timer)}scheduleTimeout(){clearTimeout(this.timer),this.timer=setTimeout(()=>{this.tries=this.tries+1,this.callback()},this.timerCalc(this.tries+1))}},ws=class{constructor(e,t,i){this.state=B.closed,this.topic=e,this.params=Me(t||{}),this.socket=i,this.bindings=[],this.bindingRef=0,this.timeout=this.socket.timeout,this.joinedOnce=!1,this.joinPush=new Ge(this,se.join,this.params,this.timeout),this.pushBuffer=[],this.stateChangeRefs=[],this.rejoinTimer=new ei(()=>{this.socket.isConnected()&&this.rejoin()},this.socket.rejoinAfterMs),this.stateChangeRefs.push(this.socket.onError(()=>this.rejoinTimer.reset())),this.stateChangeRefs.push(this.socket.onOpen(()=>{this.rejoinTimer.reset(),this.isErrored()&&this.rejoin()})),this.joinPush.receive("ok",()=>{this.state=B.joined,this.rejoinTimer.reset(),this.pushBuffer.forEach(s=>s.send()),this.pushBuffer=[]}),this.joinPush.receive("error",()=>{this.state=B.errored,this.socket.isConnected()&&this.rejoinTimer.scheduleTimeout()}),this.onClose(()=>{this.rejoinTimer.reset(),this.socket.hasLogger()&&this.socket.log("channel",`close ${this.topic} ${this.joinRef()}`),this.state=B.closed,this.socket.remove(this)}),this.onError(s=>{this.socket.hasLogger()&&this.socket.log("channel",`error ${this.topic}`,s),this.isJoining()&&this.joinPush.reset(),this.state=B.errored,this.socket.isConnected()&&this.rejoinTimer.scheduleTimeout()}),this.joinPush.receive("timeout",()=>{this.socket.hasLogger()&&this.socket.log("channel",`timeout ${this.topic} (${this.joinRef()})`,this.joinPush.timeout),new Ge(this,se.leave,Me({}),this.timeout).send(),this.state=B.errored,this.joinPush.reset(),this.socket.isConnected()&&this.rejoinTimer.scheduleTimeout()}),this.on(se.reply,(s,n)=>{this.trigger(this.replyEventName(n),s)})}join(e=this.timeout){if(this.joinedOnce)throw new Error("tried to join multiple times. 'join' can only be called a single time per channel instance");return this.timeout=e,this.joinedOnce=!0,this.rejoin(),this.joinPush}onClose(e){this.on(se.close,e)}onError(e){return this.on(se.error,t=>e(t))}on(e,t){let i=this.bindingRef++;return this.bindings.push({event:e,ref:i,callback:t}),i}off(e,t){this.bindings=this.bindings.filter(i=>!(i.event===e&&(typeof t>"u"||t===i.ref)))}canPush(){return this.socket.isConnected()&&this.isJoined()}push(e,t,i=this.timeout){if(t=t||{},!this.joinedOnce)throw new Error(`tried to push '${e}' to '${this.topic}' before joining. Use channel.join() before pushing events`);let s=new Ge(this,e,function(){return t},i);return this.canPush()?s.send():(s.startTimeout(),this.pushBuffer.push(s)),s}leave(e=this.timeout){this.rejoinTimer.reset(),this.joinPush.cancelTimeout(),this.state=B.leaving;let t=()=>{this.socket.hasLogger()&&this.socket.log("channel",`leave ${this.topic}`),this.trigger(se.close,"leave")},i=new Ge(this,se.leave,Me({}),e);return i.receive("ok",()=>t()).receive("timeout",()=>t()),i.send(),this.canPush()||i.trigger("ok",{}),i}onMessage(e,t,i){return t}isMember(e,t,i,s){return this.topic!==e?!1:s&&s!==this.joinRef()?(this.socket.hasLogger()&&this.socket.log("channel","dropping outdated message",{topic:e,event:t,payload:i,joinRef:s}),!1):!0}joinRef(){return this.joinPush.ref}rejoin(e=this.timeout){this.isLeaving()||(this.socket.leaveOpenTopic(this.topic),this.state=B.joining,this.joinPush.resend(e))}trigger(e,t,i,s){let n=this.onMessage(e,t,i,s);if(t&&!n)throw new Error("channel onMessage callbacks must return the payload, modified or unmodified");let r=this.bindings.filter(o=>o.event===e);for(let o=0;oh.abort(),n);a.signal=h.signal}return K.fetch(t,a).then(l=>l.text()).then(l=>this.parseJSON(l)).then(l=>o&&o(l)).catch(l=>{l.name==="AbortError"&&r?r():o&&o(null)}),h}static xdomainRequest(e,t,i,s,n,r,o){return e.timeout=n,e.open(t,i),e.onload=()=>{let a=this.parseJSON(e.responseText);o&&o(a)},r&&(e.ontimeout=r),e.onprogress=()=>{},e.send(s),e}static xhrRequest(e,t,i,s,n,r,o,a){e.open(t,i,!0),e.timeout=r;for(let[h,l]of Object.entries(s))e.setRequestHeader(h,l);return e.onerror=()=>a&&a(null),e.onreadystatechange=()=>{if(e.readyState===bs.complete&&a){let h=this.parseJSON(e.responseText);a(h)}},o&&(e.ontimeout=o),e.send(n),e}static parseJSON(e){if(!e||e==="")return null;try{return JSON.parse(e)}catch{return console&&console.log("failed to parse JSON response",e),null}}static serialize(e,t){let i=[];for(var s in e){if(!Object.prototype.hasOwnProperty.call(e,s))continue;let n=t?`${t}[${s}]`:s,r=e[s];typeof r=="object"?i.push(this.serialize(r,n)):i.push(encodeURIComponent(n)+"="+encodeURIComponent(r))}return i.join("&")}static appendParams(e,t){if(Object.keys(t).length===0)return e;let i=e.match(/\?/)?"&":"?";return`${e}${i}${this.serialize(t)}`}},ys=e=>{let t="",i=new Uint8Array(e),s=i.byteLength;for(let n=0;nthis.poll(),0)}normalizeEndpoint(e){return e.replace("ws://","http://").replace("wss://","https://").replace(new RegExp("(.*)/"+St.websocket),"$1/"+St.longpoll)}endpointURL(){return Ze.appendParams(this.pollEndpoint,{token:this.token})}closeAndRetry(e,t,i){this.close(e,t,i),this.readyState=z.connecting}ontimeout(){this.onerror("timeout"),this.closeAndRetry(1005,"timeout",!1)}isActive(){return this.readyState===z.open||this.readyState===z.connecting}poll(){let e={Accept:"application/json"};this.authToken&&(e["X-Phoenix-AuthToken"]=this.authToken),this.ajax("GET",e,null,()=>this.ontimeout(),t=>{if(t){var{status:i,token:s,messages:n}=t;if(i===410&&this.token!==null){this.onerror(410),this.closeAndRetry(3410,"session_gone",!1);return}this.token=s}else i=0;switch(i){case 200:n.forEach(r=>{setTimeout(()=>this.onmessage({data:r}),0)}),this.poll();break;case 204:this.poll();break;case 410:this.readyState=z.open,this.onopen({}),this.poll();break;case 403:this.onerror(403),this.close(1008,"forbidden",!1);break;case 0:case 500:this.onerror(500),this.closeAndRetry(1011,"internal server error",500);break;default:throw new Error(`unhandled poll status ${i}`)}})}send(e){typeof e!="string"&&(e=ys(e)),this.currentBatch?this.currentBatch.push(e):this.awaitingBatchAck?this.batchBuffer.push(e):(this.currentBatch=[e],this.currentBatchTimer=setTimeout(()=>{this.batchSend(this.currentBatch),this.currentBatch=null},0))}batchSend(e){this.awaitingBatchAck=!0,this.ajax("POST",{"Content-Type":"application/x-ndjson"},e.join(` -`),()=>this.onerror("timeout"),t=>{this.awaitingBatchAck=!1,!t||t.status!==200?(this.onerror(t&&t.status),this.closeAndRetry(1011,"internal server error",!1)):this.batchBuffer.length>0&&(this.batchSend(this.batchBuffer),this.batchBuffer=[])})}close(e,t,i){for(let n of this.reqs)n.abort();this.readyState=z.closed;let s=Object.assign({code:1e3,reason:void 0,wasClean:!0},{code:e,reason:t,wasClean:i});this.batchBuffer=[],clearTimeout(this.currentBatchTimer),this.currentBatchTimer=null,typeof CloseEvent<"u"?this.onclose(new CloseEvent("close",s)):this.onclose(s)}ajax(e,t,i,s,n){let r,o=()=>{this.reqs.delete(r),s()};r=Ze.request(e,this.endpointURL(),t,i,this.timeout,o,a=>{this.reqs.delete(r),this.isActive()&&n(a)}),this.reqs.add(r)}};var Ye={HEADER_LENGTH:1,META_LENGTH:4,KINDS:{push:0,reply:1,broadcast:2},encode(e,t){if(e.payload.constructor===ArrayBuffer)return t(this.binaryEncode(e));{let i=[e.join_ref,e.ref,e.topic,e.event,e.payload];return t(JSON.stringify(i))}},decode(e,t){if(e.constructor===ArrayBuffer)return t(this.binaryDecode(e));{let[i,s,n,r,o]=JSON.parse(e);return t({join_ref:i,ref:s,topic:n,event:r,payload:o})}},binaryEncode(e){let{join_ref:t,ref:i,event:s,topic:n,payload:r}=e,o=this.META_LENGTH+t.length+i.length+n.length+s.length,a=new ArrayBuffer(this.HEADER_LENGTH+o),h=new DataView(a),l=0;h.setUint8(l++,this.KINDS.push),h.setUint8(l++,t.length),h.setUint8(l++,i.length),h.setUint8(l++,n.length),h.setUint8(l++,s.length),Array.from(t,p=>h.setUint8(l++,p.charCodeAt(0))),Array.from(i,p=>h.setUint8(l++,p.charCodeAt(0))),Array.from(n,p=>h.setUint8(l++,p.charCodeAt(0))),Array.from(s,p=>h.setUint8(l++,p.charCodeAt(0)));var d=new Uint8Array(a.byteLength+r.byteLength);return d.set(new Uint8Array(a),0),d.set(new Uint8Array(r),a.byteLength),d.buffer},binaryDecode(e){let t=new DataView(e),i=t.getUint8(0),s=new TextDecoder;switch(i){case this.KINDS.push:return this.decodePush(e,t,s);case this.KINDS.reply:return this.decodeReply(e,t,s);case this.KINDS.broadcast:return this.decodeBroadcast(e,t,s)}},decodePush(e,t,i){let s=t.getUint8(1),n=t.getUint8(2),r=t.getUint8(3),o=this.HEADER_LENGTH+this.META_LENGTH-1,a=i.decode(e.slice(o,o+s));o=o+s;let h=i.decode(e.slice(o,o+n));o=o+n;let l=i.decode(e.slice(o,o+r));o=o+r;let d=e.slice(o,e.byteLength);return{join_ref:a,ref:null,topic:h,event:l,payload:d}},decodeReply(e,t,i){let s=t.getUint8(1),n=t.getUint8(2),r=t.getUint8(3),o=t.getUint8(4),a=this.HEADER_LENGTH+this.META_LENGTH,h=i.decode(e.slice(a,a+s));a=a+s;let l=i.decode(e.slice(a,a+n));a=a+n;let d=i.decode(e.slice(a,a+r));a=a+r;let p=i.decode(e.slice(a,a+o));a=a+o;let m=e.slice(a,e.byteLength),g={status:p,response:m};return{join_ref:h,ref:l,topic:d,event:se.reply,payload:g}},decodeBroadcast(e,t,i){let s=t.getUint8(1),n=t.getUint8(2),r=this.HEADER_LENGTH+2,o=i.decode(e.slice(r,r+s));r=r+s;let a=i.decode(e.slice(r,r+n));r=r+n;let h=e.slice(r,e.byteLength);return{join_ref:null,ref:null,topic:o,event:a,payload:h}}},ti=class{constructor(e,t={}){this.stateChangeCallbacks={open:[],close:[],error:[],message:[]},this.channels=[],this.sendBuffer=[],this.ref=0,this.fallbackRef=null,this.timeout=t.timeout||gs,this.transport=t.transport||K.WebSocket||Ce,this.primaryPassedHealthCheck=!1,this.longPollFallbackMs=t.longPollFallbackMs,this.fallbackTimer=null,this.sessionStore=t.sessionStorage||K&&K.sessionStorage,this.establishedConnections=0,this.defaultEncoder=Ye.encode.bind(Ye),this.defaultDecoder=Ye.decode.bind(Ye),this.closeWasClean=!0,this.disconnecting=!1,this.binaryType=t.binaryType||"arraybuffer",this.connectClock=1,this.pageHidden=!1,this.transport!==Ce?(this.encode=t.encode||this.defaultEncoder,this.decode=t.decode||this.defaultDecoder):(this.encode=this.defaultEncoder,this.decode=this.defaultDecoder);let i=null;Te&&Te.addEventListener&&(Te.addEventListener("pagehide",s=>{this.conn&&(this.disconnect(),i=this.connectClock)}),Te.addEventListener("pageshow",s=>{i===this.connectClock&&(i=null,this.connect())}),Te.addEventListener("visibilitychange",()=>{document.visibilityState==="hidden"?this.pageHidden=!0:(this.pageHidden=!1,!this.isConnected()&&!this.closeWasClean&&this.teardown(()=>this.connect()))})),this.heartbeatIntervalMs=t.heartbeatIntervalMs||3e4,this.rejoinAfterMs=s=>t.rejoinAfterMs?t.rejoinAfterMs(s):[1e3,2e3,5e3][s-1]||1e4,this.reconnectAfterMs=s=>t.reconnectAfterMs?t.reconnectAfterMs(s):[10,50,100,150,200,250,500,1e3,2e3][s-1]||5e3,this.logger=t.logger||null,!this.logger&&t.debug&&(this.logger=(s,n,r)=>{console.log(`${s}: ${n}`,r)}),this.longpollerTimeout=t.longpollerTimeout||2e4,this.params=Me(t.params||{}),this.endPoint=`${e}/${St.websocket}`,this.vsn=t.vsn||ms,this.heartbeatTimeoutTimer=null,this.heartbeatTimer=null,this.pendingHeartbeatRef=null,this.reconnectTimer=new ei(()=>{if(this.pageHidden){this.log("Not reconnecting as page is hidden!"),this.teardown();return}this.teardown(()=>this.connect())},this.reconnectAfterMs),this.authToken=t.authToken}getLongPollTransport(){return Ce}replaceTransport(e){this.connectClock++,this.closeWasClean=!0,clearTimeout(this.fallbackTimer),this.reconnectTimer.reset(),this.conn&&(this.conn.close(),this.conn=null),this.transport=e}protocol(){return location.protocol.match(/^https/)?"wss":"ws"}endPointURL(){let e=Ze.appendParams(Ze.appendParams(this.endPoint,this.params()),{vsn:this.vsn});return e.charAt(0)!=="/"?e:e.charAt(1)==="/"?`${this.protocol()}:${e}`:`${this.protocol()}://${location.host}${e}`}disconnect(e,t,i){this.connectClock++,this.disconnecting=!0,this.closeWasClean=!0,clearTimeout(this.fallbackTimer),this.reconnectTimer.reset(),this.teardown(()=>{this.disconnecting=!1,e&&e()},t,i)}connect(e){e&&(console&&console.log("passing params to connect is deprecated. Instead pass :params to the Socket constructor"),this.params=Me(e)),!(this.conn&&!this.disconnecting)&&(this.longPollFallbackMs&&this.transport!==Ce?this.connectWithFallback(Ce,this.longPollFallbackMs):this.transportConnect())}log(e,t,i){this.logger&&this.logger(e,t,i)}hasLogger(){return this.logger!==null}onOpen(e){let t=this.makeRef();return this.stateChangeCallbacks.open.push([t,e]),t}onClose(e){let t=this.makeRef();return this.stateChangeCallbacks.close.push([t,e]),t}onError(e){let t=this.makeRef();return this.stateChangeCallbacks.error.push([t,e]),t}onMessage(e){let t=this.makeRef();return this.stateChangeCallbacks.message.push([t,e]),t}ping(e){if(!this.isConnected())return!1;let t=this.makeRef(),i=Date.now();this.push({topic:"phoenix",event:"heartbeat",payload:{},ref:t});let s=this.onMessage(n=>{n.ref===t&&(this.off([s]),e(Date.now()-i))});return!0}transportName(e){switch(e){case Ce:return"LongPoll";default:return e.name}}transportConnect(){this.connectClock++,this.closeWasClean=!1;let e;this.authToken&&(e=["phoenix",`${kt}${btoa(this.authToken).replace(/=/g,"")}`]),this.conn=new this.transport(this.endPointURL(),e),this.conn.binaryType=this.binaryType,this.conn.timeout=this.longpollerTimeout,this.conn.onopen=()=>this.onConnOpen(),this.conn.onerror=t=>this.onConnError(t),this.conn.onmessage=t=>this.onConnMessage(t),this.conn.onclose=t=>this.onConnClose(t)}getSession(e){return this.sessionStore&&this.sessionStore.getItem(e)}storeSession(e,t){this.sessionStore&&this.sessionStore.setItem(e,t)}connectWithFallback(e,t=2500){clearTimeout(this.fallbackTimer);let i=!1,s=!0,n,r,o=this.transportName(e),a=h=>{this.log("transport",`falling back to ${o}...`,h),this.off([n,r]),s=!1,this.replaceTransport(e),this.transportConnect()};if(this.getSession(`phx:fallback:${o}`))return a("memorized");this.fallbackTimer=setTimeout(a,t),r=this.onError(h=>{this.log("transport","error",h),s&&!i&&(clearTimeout(this.fallbackTimer),a(h))}),this.fallbackRef&&this.off([this.fallbackRef]),this.fallbackRef=this.onOpen(()=>{if(i=!0,!s){let h=this.transportName(e);return this.primaryPassedHealthCheck||this.storeSession(`phx:fallback:${h}`,"true"),this.log("transport",`established ${h} fallback`)}clearTimeout(this.fallbackTimer),this.fallbackTimer=setTimeout(a,t),this.ping(h=>{this.log("transport","connected to primary after",h),this.primaryPassedHealthCheck=!0,clearTimeout(this.fallbackTimer)})}),this.transportConnect()}clearHeartbeats(){clearTimeout(this.heartbeatTimer),clearTimeout(this.heartbeatTimeoutTimer)}onConnOpen(){this.hasLogger()&&this.log("transport",`${this.transportName(this.transport)} connected to ${this.endPointURL()}`),this.closeWasClean=!1,this.disconnecting=!1,this.establishedConnections++,this.flushSendBuffer(),this.reconnectTimer.reset(),this.resetHeartbeat(),this.stateChangeCallbacks.open.forEach(([,e])=>e())}heartbeatTimeout(){this.pendingHeartbeatRef&&(this.pendingHeartbeatRef=null,this.hasLogger()&&this.log("transport","heartbeat timeout. Attempting to re-establish connection"),this.triggerChanError(),this.closeWasClean=!1,this.teardown(()=>this.reconnectTimer.scheduleTimeout(),vs,"heartbeat timeout"))}resetHeartbeat(){this.conn&&this.conn.skipHeartbeat||(this.pendingHeartbeatRef=null,this.clearHeartbeats(),this.heartbeatTimer=setTimeout(()=>this.sendHeartbeat(),this.heartbeatIntervalMs))}teardown(e,t,i){if(!this.conn)return e&&e();let s=this.conn;this.waitForBufferDone(s,()=>{t?s.close(t,i||""):s.close(),this.waitForSocketClosed(s,()=>{this.conn===s&&(this.conn.onopen=function(){},this.conn.onerror=function(){},this.conn.onmessage=function(){},this.conn.onclose=function(){},this.conn=null),e&&e()})})}waitForBufferDone(e,t,i=1){if(i===5||!e.bufferedAmount){t();return}setTimeout(()=>{this.waitForBufferDone(e,t,i+1)},150*i)}waitForSocketClosed(e,t,i=1){if(i===5||e.readyState===z.closed){t();return}setTimeout(()=>{this.waitForSocketClosed(e,t,i+1)},150*i)}onConnClose(e){this.conn&&(this.conn.onclose=()=>{});let t=e&&e.code;this.hasLogger()&&this.log("transport","close",e),this.triggerChanError(),this.clearHeartbeats(),!this.closeWasClean&&t!==1e3&&this.reconnectTimer.scheduleTimeout(),this.stateChangeCallbacks.close.forEach(([,i])=>i(e))}onConnError(e){this.hasLogger()&&this.log("transport",e);let t=this.transport,i=this.establishedConnections;this.stateChangeCallbacks.error.forEach(([,s])=>{s(e,t,i)}),(t===this.transport||i>0)&&this.triggerChanError()}triggerChanError(){this.channels.forEach(e=>{e.isErrored()||e.isLeaving()||e.isClosed()||e.trigger(se.error)})}connectionState(){switch(this.conn&&this.conn.readyState){case z.connecting:return"connecting";case z.open:return"open";case z.closing:return"closing";default:return"closed"}}isConnected(){return this.connectionState()==="open"}remove(e){this.off(e.stateChangeRefs),this.channels=this.channels.filter(t=>t!==e)}off(e){for(let t in this.stateChangeCallbacks)this.stateChangeCallbacks[t]=this.stateChangeCallbacks[t].filter(([i])=>e.indexOf(i)===-1)}channel(e,t={}){let i=new ws(e,t,this);return this.channels.push(i),i}push(e){if(this.hasLogger()){let{topic:t,event:i,payload:s,ref:n,join_ref:r}=e;this.log("push",`${t} ${i} (${r}, ${n})`,s)}this.isConnected()?this.encode(e,t=>this.conn.send(t)):this.sendBuffer.push(()=>this.encode(e,t=>this.conn.send(t)))}makeRef(){let e=this.ref+1;return e===this.ref?this.ref=0:this.ref=e,this.ref.toString()}sendHeartbeat(){this.pendingHeartbeatRef&&!this.isConnected()||(this.pendingHeartbeatRef=this.makeRef(),this.push({topic:"phoenix",event:"heartbeat",payload:{},ref:this.pendingHeartbeatRef}),this.heartbeatTimeoutTimer=setTimeout(()=>this.heartbeatTimeout(),this.heartbeatIntervalMs))}flushSendBuffer(){this.isConnected()&&this.sendBuffer.length>0&&(this.sendBuffer.forEach(e=>e()),this.sendBuffer=[])}onConnMessage(e){this.decode(e.data,t=>{let{topic:i,event:s,payload:n,ref:r,join_ref:o}=t;r&&r===this.pendingHeartbeatRef&&(this.clearHeartbeats(),this.pendingHeartbeatRef=null,this.heartbeatTimer=setTimeout(()=>this.sendHeartbeat(),this.heartbeatIntervalMs)),this.hasLogger()&&this.log("receive",`${n.status||""} ${i} ${s} ${r&&"("+r+")"||""}`,n);for(let a=0;ai.topic===e&&(i.isJoined()||i.isJoining()));t&&(this.hasLogger()&&this.log("transport",`leaving duplicate topic "${e}"`),t.leave())}};var xi="consecutive-reloads",Es=10,Ss=5e3,ks=1e4,As=3e4,Ri=["phx-click-loading","phx-change-loading","phx-submit-loading","phx-keydown-loading","phx-keyup-loading","phx-blur-loading","phx-focus-loading","phx-hook-loading"],At="phx-drop-target-active",Z="data-phx-component",Le="data-phx-view",Ct="data-phx-link",Cs="track-static",Ts="data-phx-link-state",De="data-phx-ref-loading",W="data-phx-ref-src",D="data-phx-ref-lock",ii="phx-pending-refs",Ii="track-uploads",oe="data-phx-upload-ref",Ft="data-phx-preflighted-refs",_s="data-phx-done-refs",Qe="drop-target",It="data-phx-active-refs",ot="phx:live-file:updated",Li="data-phx-skip",Di="data-phx-id",si="data-phx-prune",ni="phx-connected",me="phx-loading",_e="phx-error",ri="phx-client-error",He="phx-server-error",ye="data-phx-parent-id",Ut="data-phx-main",re="data-phx-root-id",Lt="viewport-top",Dt="viewport-bottom",Ps="viewport-overrun-target",xs="trigger-action",ct="phx-has-focused",Rs=["text","textarea","number","email","password","search","tel","url","date","time","datetime-local","color","range"],Oi=["checkbox","radio"],We="phx-has-submitted",Q="data-phx-session",qe=`[${Q}]`,Ot="data-phx-sticky",we="data-phx-static",Mt="data-phx-readonly",Re="data-phx-disabled",oi="disable-with",dt="data-phx-disable-with-restore",Ne="hook",Is="debounce",Ls="throttle",ut="update",at="stream",$e="data-phx-stream",Bt="data-phx-portal",Ee="data-phx-teleported",fe="data-phx-teleported-src",ht="data-phx-runtime-hook",Ds="data-phx-pid",Os="key",G="phxPrivate",ai="auto-recover",et="phx:live-socket:debug",Tt="phx:live-socket:profiling",_t="phx:live-socket:latency-sim",tt="phx:nav-history-position",Ms="progress",hi="mounted",li="__phoenix_reload_status__",Hs=1,ci=3,Ns=200,$s=500,Fs="phx-",Us=3e4,Fe="debounce-trigger",Ue="throttled",di="debounce-prev-key",Bs={debounce:300,throttle:300},ui=[De,W,D],V="s",Pt="r",$="c",I="k",Y="kc",fi="e",pi="r",mi="t",de="p",Pe="stream",js=class{constructor(e,t,i){let{chunk_size:s,chunk_timeout:n}=t;this.liveSocket=i,this.entry=e,this.offset=0,this.chunkSize=s,this.chunkTimeout=n,this.chunkTimer=null,this.errored=!1,this.uploadChannel=i.channel(`lvu:${e.ref}`,{token:e.metadata()})}error(e){this.errored||(this.uploadChannel.leave(),this.errored=!0,clearTimeout(this.chunkTimer),this.entry.error(e))}upload(){this.uploadChannel.onError(e=>this.error(e)),this.uploadChannel.join().receive("ok",e=>this.readNextChunk()).receive("error",e=>this.error(e))}isDone(){return this.offset>=this.entry.file.size}readNextChunk(){let e=new window.FileReader,t=this.entry.file.slice(this.offset,this.chunkSize+this.offset);e.onload=i=>{if(i.target.error===null)this.offset+=i.target.result.byteLength,this.pushChunk(i.target.result);else return P("Read error: "+i.target.error)},e.readAsArrayBuffer(t)}pushChunk(e){this.uploadChannel.isJoined()&&this.uploadChannel.push("chunk",e,this.chunkTimeout).receive("ok",()=>{this.entry.progress(this.offset/this.entry.file.size*100),this.isDone()||(this.chunkTimer=setTimeout(()=>this.readNextChunk(),this.liveSocket.getLatencySim()||0))}).receive("error",({reason:t})=>this.error(t))}},P=(e,t)=>console.error&&console.error(e,t),ne=e=>{let t=typeof e;return t==="number"||t==="string"&&/^(0|[1-9]\d*)$/.test(e)};function Vs(){let e=new Set,t=document.querySelectorAll("*[id]");for(let i=0,s=t.length;i{let s=document.getElementById(i);s&&s.parentElement&&s.parentElement.getAttribute("phx-update")!=="stream"&&t.add(`The stream container with id "${s.parentElement.id}" is missing the phx-update="stream" attribute. Ensure it is set for streams to work properly.`)}),t.forEach(i=>console.error(i))}var qs=(e,t,i,s)=>{e.liveSocket.isDebugEnabled()&&console.log(`${e.id} ${t}: ${i} - `,s)},Be=e=>typeof e=="function"?e:function(){return e},lt=e=>JSON.parse(JSON.stringify(e)),be=(e,t,i)=>{do{if(e.matches(`[${t}]`)&&!e.disabled)return e;e=e.parentElement||e.parentNode}while(e!==null&&e.nodeType===1&&!(i&&i.isSameNode(e)||e.matches(qe)));return null},xe=e=>e!==null&&typeof e=="object"&&!(e instanceof Array),Js=(e,t)=>JSON.stringify(e)===JSON.stringify(t),gi=e=>{for(let t in e)return!1;return!0},Ie=(e,t)=>e&&t(e),Xs=function(e,t,i,s){e.forEach(n=>{new js(n,i.config,s).upload()})},Ks=e=>{if(e.dataTransfer.types){for(let t=0;t{let s=this.getHashTargetEl(window.location.hash);s?s.scrollIntoView():t.type==="redirect"&&window.scroll(0,0)})}}else this.redirect(i)},setCookie(e,t,i){let s=typeof i=="number"?` max-age=${i};`:"";document.cookie=`${e}=${t};${s} path=/`},getCookie(e){return document.cookie.replace(new RegExp(`(?:(?:^|.*;s*)${e}s*=s*([^;]*).*$)|^.*$`),"$1")},deleteCookie(e){document.cookie=`${e}=; max-age=-1; path=/`},redirect(e,t,i=s=>{window.location.href=s}){t&&this.setCookie("__phoenix_flash__",t,60),i(e)},localKey(e,t){return`${e}-${t}`},getHashTargetEl(e){let t=e.toString().substring(1);if(t!=="")return document.getElementById(t)||document.querySelector(`a[name="${t}"]`)}},U=zs,ve={byId(e){return document.getElementById(e)||P(`no id found for ${e}`)},removeClass(e,t){e.classList.remove(t),e.classList.length===0&&e.removeAttribute("class")},all(e,t,i){if(!e)return[];let s=Array.from(e.querySelectorAll(t));return i&&s.forEach(i),s},childNodeLength(e){let t=document.createElement("template");return t.innerHTML=e,t.content.childElementCount},isUploadInput(e){return e.type==="file"&&e.getAttribute(oe)!==null},isAutoUpload(e){return e.hasAttribute("data-phx-auto-upload")},findUploadInputs(e){let t=e.id,i=this.all(document,`input[type="file"][${oe}][form="${t}"]`);return this.all(e,`input[type="file"][${oe}]`).concat(i)},findComponentNodeList(e,t,i=document){return this.all(i,`[${Le}="${e}"][${Z}="${t}"]`)},isPhxDestroyed(e){return!!(e.id&&ve.private(e,"destroyed"))},wantsNewTab(e){let t=e.ctrlKey||e.shiftKey||e.metaKey||e.button&&e.button===1,i=e.target instanceof HTMLAnchorElement&&e.target.hasAttribute("download"),s=e.target.hasAttribute("target")&&e.target.getAttribute("target").toLowerCase()==="_blank",n=e.target.hasAttribute("target")&&!e.target.getAttribute("target").startsWith("_");return t||s||i||n},isUnloadableFormSubmit(e){return e.target&&e.target.getAttribute("method")==="dialog"||e.submitter&&e.submitter.getAttribute("formmethod")==="dialog"?!1:!e.defaultPrevented&&!this.wantsNewTab(e)},isNewPageClick(e,t){let i=e.target instanceof HTMLAnchorElement?e.target.getAttribute("href"):null,s;if(e.defaultPrevented||i===null||this.wantsNewTab(e)||i.startsWith("mailto:")||i.startsWith("tel:")||e.target.isContentEditable)return!1;try{s=new URL(i)}catch{try{s=new URL(i,t)}catch{return!0}}return s.host===t.host&&s.protocol===t.protocol&&s.pathname===t.pathname&&s.search===t.search?s.hash===""&&!s.href.endsWith("#"):s.protocol.startsWith("http")},markPhxChildDestroyed(e){this.isPhxChild(e)&&e.setAttribute(Q,""),this.putPrivate(e,"destroyed",!0)},findPhxChildrenInFragment(e,t){let i=document.createElement("template");return i.innerHTML=e,this.findPhxChildren(i.content,t)},isIgnored(e,t){return(e.getAttribute(t)||e.getAttribute("data-phx-update"))==="ignore"},isPhxUpdate(e,t,i){return e.getAttribute&&i.indexOf(e.getAttribute(t))>=0},findPhxSticky(e){return this.all(e,`[${Ot}]`)},findPhxChildren(e,t){return this.all(e,`${qe}[${ye}="${t}"]`)},findExistingParentCIDs(e,t){let i=new Set,s=new Set;return t.forEach(n=>{this.all(document,`[${Le}="${e}"][${Z}="${n}"]`).forEach(r=>{i.add(n),this.all(r,`[${Le}="${e}"][${Z}]`).map(o=>parseInt(o.getAttribute(Z))).forEach(o=>s.add(o))})}),s.forEach(n=>i.delete(n)),i},private(e,t){return e[G]&&e[G][t]},deletePrivate(e,t){e[G]&&delete e[G][t]},putPrivate(e,t,i){e[G]||(e[G]={}),e[G][t]=i},updatePrivate(e,t,i,s){let n=this.private(e,t);n===void 0?this.putPrivate(e,t,s(i)):this.putPrivate(e,t,s(n))},syncPendingAttrs(e,t){e.hasAttribute(W)&&(Ri.forEach(i=>{e.classList.contains(i)&&t.classList.add(i)}),ui.filter(i=>e.hasAttribute(i)).forEach(i=>{t.setAttribute(i,e.getAttribute(i))}))},copyPrivates(e,t){t[G]&&(e[G]=t[G])},putTitle(e){let t=document.querySelector("title");if(t){let{prefix:i,suffix:s,default:n}=t.dataset,r=typeof e!="string"||e.trim()==="";if(r&&typeof n!="string")return;let o=r?n:e;document.title=`${i||""}${o||""}${s||""}`}else document.title=e},debounce(e,t,i,s,n,r,o,a){let h=e.getAttribute(i),l=e.getAttribute(n);h===""&&(h=s),l===""&&(l=r);let d=h||l;switch(d){case null:return a();case"blur":this.incCycle(e,"debounce-blur-cycle",()=>{o()&&a()}),this.once(e,"debounce-blur")&&e.addEventListener("blur",()=>this.triggerCycle(e,"debounce-blur-cycle"));return;default:let p=parseInt(d),m=()=>l?this.deletePrivate(e,Ue):a(),g=this.incCycle(e,Fe,m);if(isNaN(p))return P(`invalid throttle/debounce value: ${d}`);if(l){let v=!1;if(t.type==="keydown"){let w=this.private(e,di);this.putPrivate(e,di,t.key),v=w!==t.key}if(!v&&this.private(e,Ue))return!1;{a();let w=setTimeout(()=>{o()&&this.triggerCycle(e,Fe)},p);this.putPrivate(e,Ue,w)}}else setTimeout(()=>{o()&&this.triggerCycle(e,Fe,g)},p);let u=e.form;u&&this.once(u,"bind-debounce")&&u.addEventListener("submit",()=>{Array.from(new FormData(u).entries(),([v])=>{let w=u.elements.namedItem(v),O=w instanceof RadioNodeList?w[0]:w;O&&(this.incCycle(O,Fe),this.deletePrivate(O,Ue))})}),this.once(e,"bind-debounce")&&e.addEventListener("blur",()=>{clearTimeout(this.private(e,Ue)),this.triggerCycle(e,Fe)})}},triggerCycle(e,t,i){let[s,n]=this.private(e,t);i||(i=s),i===s&&(this.incCycle(e,t),n())},once(e,t){return this.private(e,t)===!0?!1:(this.putPrivate(e,t,!0),!0)},incCycle(e,t,i=function(){}){let[s]=this.private(e,t)||[0,i];return s++,this.putPrivate(e,t,[s,i]),s},maintainPrivateHooks(e,t,i,s){e.hasAttribute&&e.hasAttribute("data-phx-hook")&&!t.hasAttribute("data-phx-hook")&&t.setAttribute("data-phx-hook",e.getAttribute("data-phx-hook")),t.hasAttribute&&(t.hasAttribute(i)||t.hasAttribute(s))&&t.setAttribute("data-phx-hook","Phoenix.InfiniteScroll")},putCustomElHook(e,t){e.isConnected?e.setAttribute("data-phx-hook",""):console.error(` +(() => { + // ../deps/phoenix/priv/static/phoenix.mjs + var closure = (value) => { + if (typeof value === "function") { + return value; + } else { + let closure22 = function() { + return value; + }; + return closure22; + } + }; + var globalSelf = typeof self !== "undefined" ? self : null; + var phxWindow = typeof window !== "undefined" ? window : null; + var global = globalSelf || phxWindow || globalThis; + var DEFAULT_VSN = "2.0.0"; + var SOCKET_STATES = { connecting: 0, open: 1, closing: 2, closed: 3 }; + var DEFAULT_TIMEOUT = 1e4; + var WS_CLOSE_NORMAL = 1e3; + var CHANNEL_STATES = { + closed: "closed", + errored: "errored", + joined: "joined", + joining: "joining", + leaving: "leaving" + }; + var CHANNEL_EVENTS = { + close: "phx_close", + error: "phx_error", + join: "phx_join", + reply: "phx_reply", + leave: "phx_leave" + }; + var TRANSPORTS = { + longpoll: "longpoll", + websocket: "websocket" + }; + var XHR_STATES = { + complete: 4 + }; + var AUTH_TOKEN_PREFIX = "base64url.bearer.phx."; + var Push = class { + constructor(channel, event, payload, timeout) { + this.channel = channel; + this.event = event; + this.payload = payload || function() { + return {}; + }; + this.receivedResp = null; + this.timeout = timeout; + this.timeoutTimer = null; + this.recHooks = []; + this.sent = false; + } + /** + * + * @param {number} timeout + */ + resend(timeout) { + this.timeout = timeout; + this.reset(); + this.send(); + } + /** + * + */ + send() { + if (this.hasReceived("timeout")) { + return; + } + this.startTimeout(); + this.sent = true; + this.channel.socket.push({ + topic: this.channel.topic, + event: this.event, + payload: this.payload(), + ref: this.ref, + join_ref: this.channel.joinRef() + }); + } + /** + * + * @param {*} status + * @param {*} callback + */ + receive(status, callback) { + if (this.hasReceived(status)) { + callback(this.receivedResp.response); + } + this.recHooks.push({ status, callback }); + return this; + } + /** + * @private + */ + reset() { + this.cancelRefEvent(); + this.ref = null; + this.refEvent = null; + this.receivedResp = null; + this.sent = false; + } + /** + * @private + */ + matchReceive({ status, response, _ref }) { + this.recHooks.filter((h) => h.status === status).forEach((h) => h.callback(response)); + } + /** + * @private + */ + cancelRefEvent() { + if (!this.refEvent) { + return; + } + this.channel.off(this.refEvent); + } + /** + * @private + */ + cancelTimeout() { + clearTimeout(this.timeoutTimer); + this.timeoutTimer = null; + } + /** + * @private + */ + startTimeout() { + if (this.timeoutTimer) { + this.cancelTimeout(); + } + this.ref = this.channel.socket.makeRef(); + this.refEvent = this.channel.replyEventName(this.ref); + this.channel.on(this.refEvent, (payload) => { + this.cancelRefEvent(); + this.cancelTimeout(); + this.receivedResp = payload; + this.matchReceive(payload); + }); + this.timeoutTimer = setTimeout(() => { + this.trigger("timeout", {}); + }, this.timeout); + } + /** + * @private + */ + hasReceived(status) { + return this.receivedResp && this.receivedResp.status === status; + } + /** + * @private + */ + trigger(status, response) { + this.channel.trigger(this.refEvent, { status, response }); + } + }; + var Timer = class { + constructor(callback, timerCalc) { + this.callback = callback; + this.timerCalc = timerCalc; + this.timer = null; + this.tries = 0; + } + reset() { + this.tries = 0; + clearTimeout(this.timer); + } + /** + * Cancels any previous scheduleTimeout and schedules callback + */ + scheduleTimeout() { + clearTimeout(this.timer); + this.timer = setTimeout(() => { + this.tries = this.tries + 1; + this.callback(); + }, this.timerCalc(this.tries + 1)); + } + }; + var Channel = class { + constructor(topic, params, socket) { + this.state = CHANNEL_STATES.closed; + this.topic = topic; + this.params = closure(params || {}); + this.socket = socket; + this.bindings = []; + this.bindingRef = 0; + this.timeout = this.socket.timeout; + this.joinedOnce = false; + this.joinPush = new Push(this, CHANNEL_EVENTS.join, this.params, this.timeout); + this.pushBuffer = []; + this.stateChangeRefs = []; + this.rejoinTimer = new Timer(() => { + if (this.socket.isConnected()) { + this.rejoin(); + } + }, this.socket.rejoinAfterMs); + this.stateChangeRefs.push(this.socket.onError(() => this.rejoinTimer.reset())); + this.stateChangeRefs.push( + this.socket.onOpen(() => { + this.rejoinTimer.reset(); + if (this.isErrored()) { + this.rejoin(); + } + }) + ); + this.joinPush.receive("ok", () => { + this.state = CHANNEL_STATES.joined; + this.rejoinTimer.reset(); + this.pushBuffer.forEach((pushEvent) => pushEvent.send()); + this.pushBuffer = []; + }); + this.joinPush.receive("error", () => { + this.state = CHANNEL_STATES.errored; + if (this.socket.isConnected()) { + this.rejoinTimer.scheduleTimeout(); + } + }); + this.onClose(() => { + this.rejoinTimer.reset(); + if (this.socket.hasLogger()) this.socket.log("channel", `close ${this.topic} ${this.joinRef()}`); + this.state = CHANNEL_STATES.closed; + this.socket.remove(this); + }); + this.onError((reason) => { + if (this.socket.hasLogger()) this.socket.log("channel", `error ${this.topic}`, reason); + if (this.isJoining()) { + this.joinPush.reset(); + } + this.state = CHANNEL_STATES.errored; + if (this.socket.isConnected()) { + this.rejoinTimer.scheduleTimeout(); + } + }); + this.joinPush.receive("timeout", () => { + if (this.socket.hasLogger()) this.socket.log("channel", `timeout ${this.topic} (${this.joinRef()})`, this.joinPush.timeout); + let leavePush = new Push(this, CHANNEL_EVENTS.leave, closure({}), this.timeout); + leavePush.send(); + this.state = CHANNEL_STATES.errored; + this.joinPush.reset(); + if (this.socket.isConnected()) { + this.rejoinTimer.scheduleTimeout(); + } + }); + this.on(CHANNEL_EVENTS.reply, (payload, ref) => { + this.trigger(this.replyEventName(ref), payload); + }); + } + /** + * Join the channel + * @param {integer} timeout + * @returns {Push} + */ + join(timeout = this.timeout) { + if (this.joinedOnce) { + throw new Error("tried to join multiple times. 'join' can only be called a single time per channel instance"); + } else { + this.timeout = timeout; + this.joinedOnce = true; + this.rejoin(); + return this.joinPush; + } + } + /** + * Hook into channel close + * @param {Function} callback + */ + onClose(callback) { + this.on(CHANNEL_EVENTS.close, callback); + } + /** + * Hook into channel errors + * @param {Function} callback + */ + onError(callback) { + return this.on(CHANNEL_EVENTS.error, (reason) => callback(reason)); + } + /** + * Subscribes on channel events + * + * Subscription returns a ref counter, which can be used later to + * unsubscribe the exact event listener + * + * @example + * const ref1 = channel.on("event", do_stuff) + * const ref2 = channel.on("event", do_other_stuff) + * channel.off("event", ref1) + * // Since unsubscription, do_stuff won't fire, + * // while do_other_stuff will keep firing on the "event" + * + * @param {string} event + * @param {Function} callback + * @returns {integer} ref + */ + on(event, callback) { + let ref = this.bindingRef++; + this.bindings.push({ event, ref, callback }); + return ref; + } + /** + * Unsubscribes off of channel events + * + * Use the ref returned from a channel.on() to unsubscribe one + * handler, or pass nothing for the ref to unsubscribe all + * handlers for the given event. + * + * @example + * // Unsubscribe the do_stuff handler + * const ref1 = channel.on("event", do_stuff) + * channel.off("event", ref1) + * + * // Unsubscribe all handlers from event + * channel.off("event") + * + * @param {string} event + * @param {integer} ref + */ + off(event, ref) { + this.bindings = this.bindings.filter((bind) => { + return !(bind.event === event && (typeof ref === "undefined" || ref === bind.ref)); + }); + } + /** + * @private + */ + canPush() { + return this.socket.isConnected() && this.isJoined(); + } + /** + * Sends a message `event` to phoenix with the payload `payload`. + * Phoenix receives this in the `handle_in(event, payload, socket)` + * function. if phoenix replies or it times out (default 10000ms), + * then optionally the reply can be received. + * + * @example + * channel.push("event") + * .receive("ok", payload => console.log("phoenix replied:", payload)) + * .receive("error", err => console.log("phoenix errored", err)) + * .receive("timeout", () => console.log("timed out pushing")) + * @param {string} event + * @param {Object} payload + * @param {number} [timeout] + * @returns {Push} + */ + push(event, payload, timeout = this.timeout) { + payload = payload || {}; + if (!this.joinedOnce) { + throw new Error(`tried to push '${event}' to '${this.topic}' before joining. Use channel.join() before pushing events`); + } + let pushEvent = new Push(this, event, function() { + return payload; + }, timeout); + if (this.canPush()) { + pushEvent.send(); + } else { + pushEvent.startTimeout(); + this.pushBuffer.push(pushEvent); + } + return pushEvent; + } + /** Leaves the channel + * + * Unsubscribes from server events, and + * instructs channel to terminate on server + * + * Triggers onClose() hooks + * + * To receive leave acknowledgements, use the `receive` + * hook to bind to the server ack, ie: + * + * @example + * channel.leave().receive("ok", () => alert("left!") ) + * + * @param {integer} timeout + * @returns {Push} + */ + leave(timeout = this.timeout) { + this.rejoinTimer.reset(); + this.joinPush.cancelTimeout(); + this.state = CHANNEL_STATES.leaving; + let onClose = () => { + if (this.socket.hasLogger()) this.socket.log("channel", `leave ${this.topic}`); + this.trigger(CHANNEL_EVENTS.close, "leave"); + }; + let leavePush = new Push(this, CHANNEL_EVENTS.leave, closure({}), timeout); + leavePush.receive("ok", () => onClose()).receive("timeout", () => onClose()); + leavePush.send(); + if (!this.canPush()) { + leavePush.trigger("ok", {}); + } + return leavePush; + } + /** + * Overridable message hook + * + * Receives all events for specialized message handling + * before dispatching to the channel callbacks. + * + * Must return the payload, modified or unmodified + * @param {string} event + * @param {Object} payload + * @param {integer} ref + * @returns {Object} + */ + onMessage(_event, payload, _ref) { + return payload; + } + /** + * @private + */ + isMember(topic, event, payload, joinRef) { + if (this.topic !== topic) { + return false; + } + if (joinRef && joinRef !== this.joinRef()) { + if (this.socket.hasLogger()) this.socket.log("channel", "dropping outdated message", { topic, event, payload, joinRef }); + return false; + } else { + return true; + } + } + /** + * @private + */ + joinRef() { + return this.joinPush.ref; + } + /** + * @private + */ + rejoin(timeout = this.timeout) { + if (this.isLeaving()) { + return; + } + this.socket.leaveOpenTopic(this.topic); + this.state = CHANNEL_STATES.joining; + this.joinPush.resend(timeout); + } + /** + * @private + */ + trigger(event, payload, ref, joinRef) { + let handledPayload = this.onMessage(event, payload, ref, joinRef); + if (payload && !handledPayload) { + throw new Error("channel onMessage callbacks must return the payload, modified or unmodified"); + } + let eventBindings = this.bindings.filter((bind) => bind.event === event); + for (let i = 0; i < eventBindings.length; i++) { + let bind = eventBindings[i]; + bind.callback(handledPayload, ref, joinRef || this.joinRef()); + } + } + /** + * @private + */ + replyEventName(ref) { + return `chan_reply_${ref}`; + } + /** + * @private + */ + isClosed() { + return this.state === CHANNEL_STATES.closed; + } + /** + * @private + */ + isErrored() { + return this.state === CHANNEL_STATES.errored; + } + /** + * @private + */ + isJoined() { + return this.state === CHANNEL_STATES.joined; + } + /** + * @private + */ + isJoining() { + return this.state === CHANNEL_STATES.joining; + } + /** + * @private + */ + isLeaving() { + return this.state === CHANNEL_STATES.leaving; + } + }; + var Ajax = class { + static request(method, endPoint, headers, body, timeout, ontimeout, callback) { + if (global.XDomainRequest) { + let req = new global.XDomainRequest(); + return this.xdomainRequest(req, method, endPoint, body, timeout, ontimeout, callback); + } else if (global.XMLHttpRequest) { + let req = new global.XMLHttpRequest(); + return this.xhrRequest(req, method, endPoint, headers, body, timeout, ontimeout, callback); + } else if (global.fetch && global.AbortController) { + return this.fetchRequest(method, endPoint, headers, body, timeout, ontimeout, callback); + } else { + throw new Error("No suitable XMLHttpRequest implementation found"); + } + } + static fetchRequest(method, endPoint, headers, body, timeout, ontimeout, callback) { + let options = { + method, + headers, + body + }; + let controller = null; + if (timeout) { + controller = new AbortController(); + const _timeoutId = setTimeout(() => controller.abort(), timeout); + options.signal = controller.signal; + } + global.fetch(endPoint, options).then((response) => response.text()).then((data) => this.parseJSON(data)).then((data) => callback && callback(data)).catch((err) => { + if (err.name === "AbortError" && ontimeout) { + ontimeout(); + } else { + callback && callback(null); + } + }); + return controller; + } + static xdomainRequest(req, method, endPoint, body, timeout, ontimeout, callback) { + req.timeout = timeout; + req.open(method, endPoint); + req.onload = () => { + let response = this.parseJSON(req.responseText); + callback && callback(response); + }; + if (ontimeout) { + req.ontimeout = ontimeout; + } + req.onprogress = () => { + }; + req.send(body); + return req; + } + static xhrRequest(req, method, endPoint, headers, body, timeout, ontimeout, callback) { + req.open(method, endPoint, true); + req.timeout = timeout; + for (let [key, value] of Object.entries(headers)) { + req.setRequestHeader(key, value); + } + req.onerror = () => callback && callback(null); + req.onreadystatechange = () => { + if (req.readyState === XHR_STATES.complete && callback) { + let response = this.parseJSON(req.responseText); + callback(response); + } + }; + if (ontimeout) { + req.ontimeout = ontimeout; + } + req.send(body); + return req; + } + static parseJSON(resp) { + if (!resp || resp === "") { + return null; + } + try { + return JSON.parse(resp); + } catch { + console && console.log("failed to parse JSON response", resp); + return null; + } + } + static serialize(obj, parentKey) { + let queryStr = []; + for (var key in obj) { + if (!Object.prototype.hasOwnProperty.call(obj, key)) { + continue; + } + let paramKey = parentKey ? `${parentKey}[${key}]` : key; + let paramVal = obj[key]; + if (typeof paramVal === "object") { + queryStr.push(this.serialize(paramVal, paramKey)); + } else { + queryStr.push(encodeURIComponent(paramKey) + "=" + encodeURIComponent(paramVal)); + } + } + return queryStr.join("&"); + } + static appendParams(url, params) { + if (Object.keys(params).length === 0) { + return url; + } + let prefix = url.match(/\?/) ? "&" : "?"; + return `${url}${prefix}${this.serialize(params)}`; + } + }; + var arrayBufferToBase64 = (buffer) => { + let binary = ""; + let bytes = new Uint8Array(buffer); + let len = bytes.byteLength; + for (let i = 0; i < len; i++) { + binary += String.fromCharCode(bytes[i]); + } + return btoa(binary); + }; + var LongPoll = class { + constructor(endPoint, protocols) { + if (protocols && protocols.length === 2 && protocols[1].startsWith(AUTH_TOKEN_PREFIX)) { + this.authToken = atob(protocols[1].slice(AUTH_TOKEN_PREFIX.length)); + } + this.endPoint = null; + this.token = null; + this.skipHeartbeat = true; + this.reqs = /* @__PURE__ */ new Set(); + this.awaitingBatchAck = false; + this.currentBatch = null; + this.currentBatchTimer = null; + this.batchBuffer = []; + this.onopen = function() { + }; + this.onerror = function() { + }; + this.onmessage = function() { + }; + this.onclose = function() { + }; + this.pollEndpoint = this.normalizeEndpoint(endPoint); + this.readyState = SOCKET_STATES.connecting; + setTimeout(() => this.poll(), 0); + } + normalizeEndpoint(endPoint) { + return endPoint.replace("ws://", "http://").replace("wss://", "https://").replace(new RegExp("(.*)/" + TRANSPORTS.websocket), "$1/" + TRANSPORTS.longpoll); + } + endpointURL() { + return Ajax.appendParams(this.pollEndpoint, { token: this.token }); + } + closeAndRetry(code, reason, wasClean) { + this.close(code, reason, wasClean); + this.readyState = SOCKET_STATES.connecting; + } + ontimeout() { + this.onerror("timeout"); + this.closeAndRetry(1005, "timeout", false); + } + isActive() { + return this.readyState === SOCKET_STATES.open || this.readyState === SOCKET_STATES.connecting; + } + poll() { + const headers = { "Accept": "application/json" }; + if (this.authToken) { + headers["X-Phoenix-AuthToken"] = this.authToken; + } + this.ajax("GET", headers, null, () => this.ontimeout(), (resp) => { + if (resp) { + var { status, token, messages } = resp; + if (status === 410 && this.token !== null) { + this.onerror(410); + this.closeAndRetry(3410, "session_gone", false); + return; + } + this.token = token; + } else { + status = 0; + } + switch (status) { + case 200: + messages.forEach((msg) => { + setTimeout(() => this.onmessage({ data: msg }), 0); + }); + this.poll(); + break; + case 204: + this.poll(); + break; + case 410: + this.readyState = SOCKET_STATES.open; + this.onopen({}); + this.poll(); + break; + case 403: + this.onerror(403); + this.close(1008, "forbidden", false); + break; + case 0: + case 500: + this.onerror(500); + this.closeAndRetry(1011, "internal server error", 500); + break; + default: + throw new Error(`unhandled poll status ${status}`); + } + }); + } + // we collect all pushes within the current event loop by + // setTimeout 0, which optimizes back-to-back procedural + // pushes against an empty buffer + send(body) { + if (typeof body !== "string") { + body = arrayBufferToBase64(body); + } + if (this.currentBatch) { + this.currentBatch.push(body); + } else if (this.awaitingBatchAck) { + this.batchBuffer.push(body); + } else { + this.currentBatch = [body]; + this.currentBatchTimer = setTimeout(() => { + this.batchSend(this.currentBatch); + this.currentBatch = null; + }, 0); + } + } + batchSend(messages) { + this.awaitingBatchAck = true; + this.ajax("POST", { "Content-Type": "application/x-ndjson" }, messages.join("\n"), () => this.onerror("timeout"), (resp) => { + this.awaitingBatchAck = false; + if (!resp || resp.status !== 200) { + this.onerror(resp && resp.status); + this.closeAndRetry(1011, "internal server error", false); + } else if (this.batchBuffer.length > 0) { + this.batchSend(this.batchBuffer); + this.batchBuffer = []; + } + }); + } + close(code, reason, wasClean) { + for (let req of this.reqs) { + req.abort(); + } + this.readyState = SOCKET_STATES.closed; + let opts = Object.assign({ code: 1e3, reason: void 0, wasClean: true }, { code, reason, wasClean }); + this.batchBuffer = []; + clearTimeout(this.currentBatchTimer); + this.currentBatchTimer = null; + if (typeof CloseEvent !== "undefined") { + this.onclose(new CloseEvent("close", opts)); + } else { + this.onclose(opts); + } + } + ajax(method, headers, body, onCallerTimeout, callback) { + let req; + let ontimeout = () => { + this.reqs.delete(req); + onCallerTimeout(); + }; + req = Ajax.request(method, this.endpointURL(), headers, body, this.timeout, ontimeout, (resp) => { + this.reqs.delete(req); + if (this.isActive()) { + callback(resp); + } + }); + this.reqs.add(req); + } + }; + var serializer_default = { + HEADER_LENGTH: 1, + META_LENGTH: 4, + KINDS: { push: 0, reply: 1, broadcast: 2 }, + encode(msg, callback) { + if (msg.payload.constructor === ArrayBuffer) { + return callback(this.binaryEncode(msg)); + } else { + let payload = [msg.join_ref, msg.ref, msg.topic, msg.event, msg.payload]; + return callback(JSON.stringify(payload)); + } + }, + decode(rawPayload, callback) { + if (rawPayload.constructor === ArrayBuffer) { + return callback(this.binaryDecode(rawPayload)); + } else { + let [join_ref, ref, topic, event, payload] = JSON.parse(rawPayload); + return callback({ join_ref, ref, topic, event, payload }); + } + }, + // private + binaryEncode(message) { + let { join_ref, ref, event, topic, payload } = message; + let metaLength = this.META_LENGTH + join_ref.length + ref.length + topic.length + event.length; + let header = new ArrayBuffer(this.HEADER_LENGTH + metaLength); + let view = new DataView(header); + let offset = 0; + view.setUint8(offset++, this.KINDS.push); + view.setUint8(offset++, join_ref.length); + view.setUint8(offset++, ref.length); + view.setUint8(offset++, topic.length); + view.setUint8(offset++, event.length); + Array.from(join_ref, (char) => view.setUint8(offset++, char.charCodeAt(0))); + Array.from(ref, (char) => view.setUint8(offset++, char.charCodeAt(0))); + Array.from(topic, (char) => view.setUint8(offset++, char.charCodeAt(0))); + Array.from(event, (char) => view.setUint8(offset++, char.charCodeAt(0))); + var combined = new Uint8Array(header.byteLength + payload.byteLength); + combined.set(new Uint8Array(header), 0); + combined.set(new Uint8Array(payload), header.byteLength); + return combined.buffer; + }, + binaryDecode(buffer) { + let view = new DataView(buffer); + let kind = view.getUint8(0); + let decoder = new TextDecoder(); + switch (kind) { + case this.KINDS.push: + return this.decodePush(buffer, view, decoder); + case this.KINDS.reply: + return this.decodeReply(buffer, view, decoder); + case this.KINDS.broadcast: + return this.decodeBroadcast(buffer, view, decoder); + } + }, + decodePush(buffer, view, decoder) { + let joinRefSize = view.getUint8(1); + let topicSize = view.getUint8(2); + let eventSize = view.getUint8(3); + let offset = this.HEADER_LENGTH + this.META_LENGTH - 1; + let joinRef = decoder.decode(buffer.slice(offset, offset + joinRefSize)); + offset = offset + joinRefSize; + let topic = decoder.decode(buffer.slice(offset, offset + topicSize)); + offset = offset + topicSize; + let event = decoder.decode(buffer.slice(offset, offset + eventSize)); + offset = offset + eventSize; + let data = buffer.slice(offset, buffer.byteLength); + return { join_ref: joinRef, ref: null, topic, event, payload: data }; + }, + decodeReply(buffer, view, decoder) { + let joinRefSize = view.getUint8(1); + let refSize = view.getUint8(2); + let topicSize = view.getUint8(3); + let eventSize = view.getUint8(4); + let offset = this.HEADER_LENGTH + this.META_LENGTH; + let joinRef = decoder.decode(buffer.slice(offset, offset + joinRefSize)); + offset = offset + joinRefSize; + let ref = decoder.decode(buffer.slice(offset, offset + refSize)); + offset = offset + refSize; + let topic = decoder.decode(buffer.slice(offset, offset + topicSize)); + offset = offset + topicSize; + let event = decoder.decode(buffer.slice(offset, offset + eventSize)); + offset = offset + eventSize; + let data = buffer.slice(offset, buffer.byteLength); + let payload = { status: event, response: data }; + return { join_ref: joinRef, ref, topic, event: CHANNEL_EVENTS.reply, payload }; + }, + decodeBroadcast(buffer, view, decoder) { + let topicSize = view.getUint8(1); + let eventSize = view.getUint8(2); + let offset = this.HEADER_LENGTH + 2; + let topic = decoder.decode(buffer.slice(offset, offset + topicSize)); + offset = offset + topicSize; + let event = decoder.decode(buffer.slice(offset, offset + eventSize)); + offset = offset + eventSize; + let data = buffer.slice(offset, buffer.byteLength); + return { join_ref: null, ref: null, topic, event, payload: data }; + } + }; + var Socket = class { + constructor(endPoint, opts = {}) { + this.stateChangeCallbacks = { open: [], close: [], error: [], message: [] }; + this.channels = []; + this.sendBuffer = []; + this.ref = 0; + this.fallbackRef = null; + this.timeout = opts.timeout || DEFAULT_TIMEOUT; + this.transport = opts.transport || global.WebSocket || LongPoll; + this.primaryPassedHealthCheck = false; + this.longPollFallbackMs = opts.longPollFallbackMs; + this.fallbackTimer = null; + this.sessionStore = opts.sessionStorage || global && global.sessionStorage; + this.establishedConnections = 0; + this.defaultEncoder = serializer_default.encode.bind(serializer_default); + this.defaultDecoder = serializer_default.decode.bind(serializer_default); + this.closeWasClean = true; + this.disconnecting = false; + this.binaryType = opts.binaryType || "arraybuffer"; + this.connectClock = 1; + this.pageHidden = false; + if (this.transport !== LongPoll) { + this.encode = opts.encode || this.defaultEncoder; + this.decode = opts.decode || this.defaultDecoder; + } else { + this.encode = this.defaultEncoder; + this.decode = this.defaultDecoder; + } + let awaitingConnectionOnPageShow = null; + if (phxWindow && phxWindow.addEventListener) { + phxWindow.addEventListener("pagehide", (_e) => { + if (this.conn) { + this.disconnect(); + awaitingConnectionOnPageShow = this.connectClock; + } + }); + phxWindow.addEventListener("pageshow", (_e) => { + if (awaitingConnectionOnPageShow === this.connectClock) { + awaitingConnectionOnPageShow = null; + this.connect(); + } + }); + phxWindow.addEventListener("visibilitychange", () => { + if (document.visibilityState === "hidden") { + this.pageHidden = true; + } else { + this.pageHidden = false; + if (!this.isConnected() && !this.closeWasClean) { + this.teardown(() => this.connect()); + } + } + }); + } + this.heartbeatIntervalMs = opts.heartbeatIntervalMs || 3e4; + this.rejoinAfterMs = (tries) => { + if (opts.rejoinAfterMs) { + return opts.rejoinAfterMs(tries); + } else { + return [1e3, 2e3, 5e3][tries - 1] || 1e4; + } + }; + this.reconnectAfterMs = (tries) => { + if (opts.reconnectAfterMs) { + return opts.reconnectAfterMs(tries); + } else { + return [10, 50, 100, 150, 200, 250, 500, 1e3, 2e3][tries - 1] || 5e3; + } + }; + this.logger = opts.logger || null; + if (!this.logger && opts.debug) { + this.logger = (kind, msg, data) => { + console.log(`${kind}: ${msg}`, data); + }; + } + this.longpollerTimeout = opts.longpollerTimeout || 2e4; + this.params = closure(opts.params || {}); + this.endPoint = `${endPoint}/${TRANSPORTS.websocket}`; + this.vsn = opts.vsn || DEFAULT_VSN; + this.heartbeatTimeoutTimer = null; + this.heartbeatTimer = null; + this.pendingHeartbeatRef = null; + this.reconnectTimer = new Timer(() => { + if (this.pageHidden) { + this.log("Not reconnecting as page is hidden!"); + this.teardown(); + return; + } + this.teardown(() => this.connect()); + }, this.reconnectAfterMs); + this.authToken = opts.authToken; + } + /** + * Returns the LongPoll transport reference + */ + getLongPollTransport() { + return LongPoll; + } + /** + * Disconnects and replaces the active transport + * + * @param {Function} newTransport - The new transport class to instantiate + * + */ + replaceTransport(newTransport) { + this.connectClock++; + this.closeWasClean = true; + clearTimeout(this.fallbackTimer); + this.reconnectTimer.reset(); + if (this.conn) { + this.conn.close(); + this.conn = null; + } + this.transport = newTransport; + } + /** + * Returns the socket protocol + * + * @returns {string} + */ + protocol() { + return location.protocol.match(/^https/) ? "wss" : "ws"; + } + /** + * The fully qualified socket url + * + * @returns {string} + */ + endPointURL() { + let uri = Ajax.appendParams( + Ajax.appendParams(this.endPoint, this.params()), + { vsn: this.vsn } + ); + if (uri.charAt(0) !== "/") { + return uri; + } + if (uri.charAt(1) === "/") { + return `${this.protocol()}:${uri}`; + } + return `${this.protocol()}://${location.host}${uri}`; + } + /** + * Disconnects the socket + * + * See https://developer.mozilla.org/en-US/docs/Web/API/CloseEvent#Status_codes for valid status codes. + * + * @param {Function} callback - Optional callback which is called after socket is disconnected. + * @param {integer} code - A status code for disconnection (Optional). + * @param {string} reason - A textual description of the reason to disconnect. (Optional) + */ + disconnect(callback, code, reason) { + this.connectClock++; + this.disconnecting = true; + this.closeWasClean = true; + clearTimeout(this.fallbackTimer); + this.reconnectTimer.reset(); + this.teardown(() => { + this.disconnecting = false; + callback && callback(); + }, code, reason); + } + /** + * + * @param {Object} params - The params to send when connecting, for example `{user_id: userToken}` + * + * Passing params to connect is deprecated; pass them in the Socket constructor instead: + * `new Socket("/socket", {params: {user_id: userToken}})`. + */ + connect(params) { + if (params) { + console && console.log("passing params to connect is deprecated. Instead pass :params to the Socket constructor"); + this.params = closure(params); + } + if (this.conn && !this.disconnecting) { + return; + } + if (this.longPollFallbackMs && this.transport !== LongPoll) { + this.connectWithFallback(LongPoll, this.longPollFallbackMs); + } else { + this.transportConnect(); + } + } + /** + * Logs the message. Override `this.logger` for specialized logging. noops by default + * @param {string} kind + * @param {string} msg + * @param {Object} data + */ + log(kind, msg, data) { + this.logger && this.logger(kind, msg, data); + } + /** + * Returns true if a logger has been set on this socket. + */ + hasLogger() { + return this.logger !== null; + } + /** + * Registers callbacks for connection open events + * + * @example socket.onOpen(function(){ console.info("the socket was opened") }) + * + * @param {Function} callback + */ + onOpen(callback) { + let ref = this.makeRef(); + this.stateChangeCallbacks.open.push([ref, callback]); + return ref; + } + /** + * Registers callbacks for connection close events + * @param {Function} callback + */ + onClose(callback) { + let ref = this.makeRef(); + this.stateChangeCallbacks.close.push([ref, callback]); + return ref; + } + /** + * Registers callbacks for connection error events + * + * @example socket.onError(function(error){ alert("An error occurred") }) + * + * @param {Function} callback + */ + onError(callback) { + let ref = this.makeRef(); + this.stateChangeCallbacks.error.push([ref, callback]); + return ref; + } + /** + * Registers callbacks for connection message events + * @param {Function} callback + */ + onMessage(callback) { + let ref = this.makeRef(); + this.stateChangeCallbacks.message.push([ref, callback]); + return ref; + } + /** + * Pings the server and invokes the callback with the RTT in milliseconds + * @param {Function} callback + * + * Returns true if the ping was pushed or false if unable to be pushed. + */ + ping(callback) { + if (!this.isConnected()) { + return false; + } + let ref = this.makeRef(); + let startTime = Date.now(); + this.push({ topic: "phoenix", event: "heartbeat", payload: {}, ref }); + let onMsgRef = this.onMessage((msg) => { + if (msg.ref === ref) { + this.off([onMsgRef]); + callback(Date.now() - startTime); + } + }); + return true; + } + /** + * @private + * + * @param {Function} + */ + transportName(transport) { + switch (transport) { + case LongPoll: + return "LongPoll"; + default: + return transport.name; + } + } + /** + * @private + */ + transportConnect() { + this.connectClock++; + this.closeWasClean = false; + let protocols = void 0; + if (this.authToken) { + protocols = ["phoenix", `${AUTH_TOKEN_PREFIX}${btoa(this.authToken).replace(/=/g, "")}`]; + } + this.conn = new this.transport(this.endPointURL(), protocols); + this.conn.binaryType = this.binaryType; + this.conn.timeout = this.longpollerTimeout; + this.conn.onopen = () => this.onConnOpen(); + this.conn.onerror = (error) => this.onConnError(error); + this.conn.onmessage = (event) => this.onConnMessage(event); + this.conn.onclose = (event) => this.onConnClose(event); + } + getSession(key) { + return this.sessionStore && this.sessionStore.getItem(key); + } + storeSession(key, val) { + this.sessionStore && this.sessionStore.setItem(key, val); + } + connectWithFallback(fallbackTransport, fallbackThreshold = 2500) { + clearTimeout(this.fallbackTimer); + let established = false; + let primaryTransport = true; + let openRef, errorRef; + let fallbackTransportName = this.transportName(fallbackTransport); + let fallback = (reason) => { + this.log("transport", `falling back to ${fallbackTransportName}...`, reason); + this.off([openRef, errorRef]); + primaryTransport = false; + this.replaceTransport(fallbackTransport); + this.transportConnect(); + }; + if (this.getSession(`phx:fallback:${fallbackTransportName}`)) { + return fallback("memorized"); + } + this.fallbackTimer = setTimeout(fallback, fallbackThreshold); + errorRef = this.onError((reason) => { + this.log("transport", "error", reason); + if (primaryTransport && !established) { + clearTimeout(this.fallbackTimer); + fallback(reason); + } + }); + if (this.fallbackRef) { + this.off([this.fallbackRef]); + } + this.fallbackRef = this.onOpen(() => { + established = true; + if (!primaryTransport) { + let fallbackTransportName2 = this.transportName(fallbackTransport); + if (!this.primaryPassedHealthCheck) { + this.storeSession(`phx:fallback:${fallbackTransportName2}`, "true"); + } + return this.log("transport", `established ${fallbackTransportName2} fallback`); + } + clearTimeout(this.fallbackTimer); + this.fallbackTimer = setTimeout(fallback, fallbackThreshold); + this.ping((rtt) => { + this.log("transport", "connected to primary after", rtt); + this.primaryPassedHealthCheck = true; + clearTimeout(this.fallbackTimer); + }); + }); + this.transportConnect(); + } + clearHeartbeats() { + clearTimeout(this.heartbeatTimer); + clearTimeout(this.heartbeatTimeoutTimer); + } + onConnOpen() { + if (this.hasLogger()) this.log("transport", `${this.transportName(this.transport)} connected to ${this.endPointURL()}`); + this.closeWasClean = false; + this.disconnecting = false; + this.establishedConnections++; + this.flushSendBuffer(); + this.reconnectTimer.reset(); + this.resetHeartbeat(); + this.stateChangeCallbacks.open.forEach(([, callback]) => callback()); + } + /** + * @private + */ + heartbeatTimeout() { + if (this.pendingHeartbeatRef) { + this.pendingHeartbeatRef = null; + if (this.hasLogger()) { + this.log("transport", "heartbeat timeout. Attempting to re-establish connection"); + } + this.triggerChanError(); + this.closeWasClean = false; + this.teardown(() => this.reconnectTimer.scheduleTimeout(), WS_CLOSE_NORMAL, "heartbeat timeout"); + } + } + resetHeartbeat() { + if (this.conn && this.conn.skipHeartbeat) { + return; + } + this.pendingHeartbeatRef = null; + this.clearHeartbeats(); + this.heartbeatTimer = setTimeout(() => this.sendHeartbeat(), this.heartbeatIntervalMs); + } + teardown(callback, code, reason) { + if (!this.conn) { + return callback && callback(); + } + const connToClose = this.conn; + this.waitForBufferDone(connToClose, () => { + if (code) { + connToClose.close(code, reason || ""); + } else { + connToClose.close(); + } + this.waitForSocketClosed(connToClose, () => { + if (this.conn === connToClose) { + this.conn.onopen = function() { + }; + this.conn.onerror = function() { + }; + this.conn.onmessage = function() { + }; + this.conn.onclose = function() { + }; + this.conn = null; + } + callback && callback(); + }); + }); + } + waitForBufferDone(conn, callback, tries = 1) { + if (tries === 5 || !conn.bufferedAmount) { + callback(); + return; + } + setTimeout(() => { + this.waitForBufferDone(conn, callback, tries + 1); + }, 150 * tries); + } + waitForSocketClosed(conn, callback, tries = 1) { + if (tries === 5 || conn.readyState === SOCKET_STATES.closed) { + callback(); + return; + } + setTimeout(() => { + this.waitForSocketClosed(conn, callback, tries + 1); + }, 150 * tries); + } + onConnClose(event) { + if (this.conn) this.conn.onclose = () => { + }; + let closeCode = event && event.code; + if (this.hasLogger()) this.log("transport", "close", event); + this.triggerChanError(); + this.clearHeartbeats(); + if (!this.closeWasClean && closeCode !== 1e3) { + this.reconnectTimer.scheduleTimeout(); + } + this.stateChangeCallbacks.close.forEach(([, callback]) => callback(event)); + } + /** + * @private + */ + onConnError(error) { + if (this.hasLogger()) this.log("transport", error); + let transportBefore = this.transport; + let establishedBefore = this.establishedConnections; + this.stateChangeCallbacks.error.forEach(([, callback]) => { + callback(error, transportBefore, establishedBefore); + }); + if (transportBefore === this.transport || establishedBefore > 0) { + this.triggerChanError(); + } + } + /** + * @private + */ + triggerChanError() { + this.channels.forEach((channel) => { + if (!(channel.isErrored() || channel.isLeaving() || channel.isClosed())) { + channel.trigger(CHANNEL_EVENTS.error); + } + }); + } + /** + * @returns {string} + */ + connectionState() { + switch (this.conn && this.conn.readyState) { + case SOCKET_STATES.connecting: + return "connecting"; + case SOCKET_STATES.open: + return "open"; + case SOCKET_STATES.closing: + return "closing"; + default: + return "closed"; + } + } + /** + * @returns {boolean} + */ + isConnected() { + return this.connectionState() === "open"; + } + /** + * @private + * + * @param {Channel} + */ + remove(channel) { + this.off(channel.stateChangeRefs); + this.channels = this.channels.filter((c) => c !== channel); + } + /** + * Removes `onOpen`, `onClose`, `onError,` and `onMessage` registrations. + * + * @param {refs} - list of refs returned by calls to + * `onOpen`, `onClose`, `onError,` and `onMessage` + */ + off(refs) { + for (let key in this.stateChangeCallbacks) { + this.stateChangeCallbacks[key] = this.stateChangeCallbacks[key].filter(([ref]) => { + return refs.indexOf(ref) === -1; + }); + } + } + /** + * Initiates a new channel for the given topic + * + * @param {string} topic + * @param {Object} chanParams - Parameters for the channel + * @returns {Channel} + */ + channel(topic, chanParams = {}) { + let chan = new Channel(topic, chanParams, this); + this.channels.push(chan); + return chan; + } + /** + * @param {Object} data + */ + push(data) { + if (this.hasLogger()) { + let { topic, event, payload, ref, join_ref } = data; + this.log("push", `${topic} ${event} (${join_ref}, ${ref})`, payload); + } + if (this.isConnected()) { + this.encode(data, (result) => this.conn.send(result)); + } else { + this.sendBuffer.push(() => this.encode(data, (result) => this.conn.send(result))); + } + } + /** + * Return the next message ref, accounting for overflows + * @returns {string} + */ + makeRef() { + let newRef = this.ref + 1; + if (newRef === this.ref) { + this.ref = 0; + } else { + this.ref = newRef; + } + return this.ref.toString(); + } + sendHeartbeat() { + if (this.pendingHeartbeatRef && !this.isConnected()) { + return; + } + this.pendingHeartbeatRef = this.makeRef(); + this.push({ topic: "phoenix", event: "heartbeat", payload: {}, ref: this.pendingHeartbeatRef }); + this.heartbeatTimeoutTimer = setTimeout(() => this.heartbeatTimeout(), this.heartbeatIntervalMs); + } + flushSendBuffer() { + if (this.isConnected() && this.sendBuffer.length > 0) { + this.sendBuffer.forEach((callback) => callback()); + this.sendBuffer = []; + } + } + onConnMessage(rawMessage) { + this.decode(rawMessage.data, (msg) => { + let { topic, event, payload, ref, join_ref } = msg; + if (ref && ref === this.pendingHeartbeatRef) { + this.clearHeartbeats(); + this.pendingHeartbeatRef = null; + this.heartbeatTimer = setTimeout(() => this.sendHeartbeat(), this.heartbeatIntervalMs); + } + if (this.hasLogger()) this.log("receive", `${payload.status || ""} ${topic} ${event} ${ref && "(" + ref + ")" || ""}`, payload); + for (let i = 0; i < this.channels.length; i++) { + const channel = this.channels[i]; + if (!channel.isMember(topic, event, payload, join_ref)) { + continue; + } + channel.trigger(event, payload, ref, join_ref); + } + for (let i = 0; i < this.stateChangeCallbacks.message.length; i++) { + let [, callback] = this.stateChangeCallbacks.message[i]; + callback(msg); + } + }); + } + leaveOpenTopic(topic) { + let dupChannel = this.channels.find((c) => c.topic === topic && (c.isJoined() || c.isJoining())); + if (dupChannel) { + if (this.hasLogger()) this.log("transport", `leaving duplicate topic "${topic}"`); + dupChannel.leave(); + } + } + }; + + // ../deps/phoenix_live_view/priv/static/phoenix_live_view.esm.js + var CONSECUTIVE_RELOADS = "consecutive-reloads"; + var MAX_RELOADS = 10; + var RELOAD_JITTER_MIN = 5e3; + var RELOAD_JITTER_MAX = 1e4; + var FAILSAFE_JITTER = 3e4; + var PHX_EVENT_CLASSES = [ + "phx-click-loading", + "phx-change-loading", + "phx-submit-loading", + "phx-keydown-loading", + "phx-keyup-loading", + "phx-blur-loading", + "phx-focus-loading", + "phx-hook-loading" + ]; + var PHX_DROP_TARGET_ACTIVE_CLASS = "phx-drop-target-active"; + var PHX_COMPONENT = "data-phx-component"; + var PHX_VIEW_REF = "data-phx-view"; + var PHX_LIVE_LINK = "data-phx-link"; + var PHX_TRACK_STATIC = "track-static"; + var PHX_LINK_STATE = "data-phx-link-state"; + var PHX_REF_LOADING = "data-phx-ref-loading"; + var PHX_REF_SRC = "data-phx-ref-src"; + var PHX_REF_LOCK = "data-phx-ref-lock"; + var PHX_PENDING_REFS = "phx-pending-refs"; + var PHX_TRACK_UPLOADS = "track-uploads"; + var PHX_UPLOAD_REF = "data-phx-upload-ref"; + var PHX_PREFLIGHTED_REFS = "data-phx-preflighted-refs"; + var PHX_DONE_REFS = "data-phx-done-refs"; + var PHX_DROP_TARGET = "drop-target"; + var PHX_ACTIVE_ENTRY_REFS = "data-phx-active-refs"; + var PHX_LIVE_FILE_UPDATED = "phx:live-file:updated"; + var PHX_SKIP = "data-phx-skip"; + var PHX_MAGIC_ID = "data-phx-id"; + var PHX_PRUNE = "data-phx-prune"; + var PHX_CONNECTED_CLASS = "phx-connected"; + var PHX_LOADING_CLASS = "phx-loading"; + var PHX_ERROR_CLASS = "phx-error"; + var PHX_CLIENT_ERROR_CLASS = "phx-client-error"; + var PHX_SERVER_ERROR_CLASS = "phx-server-error"; + var PHX_PARENT_ID = "data-phx-parent-id"; + var PHX_MAIN = "data-phx-main"; + var PHX_ROOT_ID = "data-phx-root-id"; + var PHX_VIEWPORT_TOP = "viewport-top"; + var PHX_VIEWPORT_BOTTOM = "viewport-bottom"; + var PHX_VIEWPORT_OVERRUN_TARGET = "viewport-overrun-target"; + var PHX_TRIGGER_ACTION = "trigger-action"; + var PHX_HAS_FOCUSED = "phx-has-focused"; + var FOCUSABLE_INPUTS = [ + "text", + "textarea", + "number", + "email", + "password", + "search", + "tel", + "url", + "date", + "time", + "datetime-local", + "color", + "range" + ]; + var CHECKABLE_INPUTS = ["checkbox", "radio"]; + var PHX_HAS_SUBMITTED = "phx-has-submitted"; + var PHX_SESSION = "data-phx-session"; + var PHX_VIEW_SELECTOR = `[${PHX_SESSION}]`; + var PHX_STICKY = "data-phx-sticky"; + var PHX_STATIC = "data-phx-static"; + var PHX_READONLY = "data-phx-readonly"; + var PHX_DISABLED = "data-phx-disabled"; + var PHX_DISABLE_WITH = "disable-with"; + var PHX_DISABLE_WITH_RESTORE = "data-phx-disable-with-restore"; + var PHX_HOOK = "hook"; + var PHX_DEBOUNCE = "debounce"; + var PHX_THROTTLE = "throttle"; + var PHX_UPDATE = "update"; + var PHX_STREAM = "stream"; + var PHX_STREAM_REF = "data-phx-stream"; + var PHX_PORTAL = "data-phx-portal"; + var PHX_TELEPORTED_REF = "data-phx-teleported"; + var PHX_TELEPORTED_SRC = "data-phx-teleported-src"; + var PHX_RUNTIME_HOOK = "data-phx-runtime-hook"; + var PHX_LV_PID = "data-phx-pid"; + var PHX_KEY = "key"; + var PHX_PRIVATE = "phxPrivate"; + var PHX_AUTO_RECOVER = "auto-recover"; + var PHX_LV_DEBUG = "phx:live-socket:debug"; + var PHX_LV_PROFILE = "phx:live-socket:profiling"; + var PHX_LV_LATENCY_SIM = "phx:live-socket:latency-sim"; + var PHX_LV_HISTORY_POSITION = "phx:nav-history-position"; + var PHX_PROGRESS = "progress"; + var PHX_MOUNTED = "mounted"; + var PHX_RELOAD_STATUS = "__phoenix_reload_status__"; + var LOADER_TIMEOUT = 1; + var MAX_CHILD_JOIN_ATTEMPTS = 3; + var BEFORE_UNLOAD_LOADER_TIMEOUT = 200; + var DISCONNECTED_TIMEOUT = 500; + var BINDING_PREFIX = "phx-"; + var PUSH_TIMEOUT = 3e4; + var DEBOUNCE_TRIGGER = "debounce-trigger"; + var THROTTLED = "throttled"; + var DEBOUNCE_PREV_KEY = "debounce-prev-key"; + var DEFAULTS = { + debounce: 300, + throttle: 300 + }; + var PHX_PENDING_ATTRS = [PHX_REF_LOADING, PHX_REF_SRC, PHX_REF_LOCK]; + var STATIC = "s"; + var ROOT = "r"; + var COMPONENTS = "c"; + var KEYED = "k"; + var KEYED_COUNT = "kc"; + var EVENTS = "e"; + var REPLY = "r"; + var TITLE = "t"; + var TEMPLATES = "p"; + var STREAM = "stream"; + var EntryUploader = class { + constructor(entry, config, liveSocket) { + const { chunk_size, chunk_timeout } = config; + this.liveSocket = liveSocket; + this.entry = entry; + this.offset = 0; + this.chunkSize = chunk_size; + this.chunkTimeout = chunk_timeout; + this.chunkTimer = null; + this.errored = false; + this.uploadChannel = liveSocket.channel(`lvu:${entry.ref}`, { + token: entry.metadata() + }); + } + error(reason) { + if (this.errored) { + return; + } + this.uploadChannel.leave(); + this.errored = true; + clearTimeout(this.chunkTimer); + this.entry.error(reason); + } + upload() { + this.uploadChannel.onError((reason) => this.error(reason)); + this.uploadChannel.join().receive("ok", (_data) => this.readNextChunk()).receive("error", (reason) => this.error(reason)); + } + isDone() { + return this.offset >= this.entry.file.size; + } + readNextChunk() { + const reader = new window.FileReader(); + const blob = this.entry.file.slice( + this.offset, + this.chunkSize + this.offset + ); + reader.onload = (e) => { + if (e.target.error === null) { + this.offset += /** @type {ArrayBuffer} */ + e.target.result.byteLength; + this.pushChunk( + /** @type {ArrayBuffer} */ + e.target.result + ); + } else { + return logError("Read error: " + e.target.error); + } + }; + reader.readAsArrayBuffer(blob); + } + pushChunk(chunk) { + if (!this.uploadChannel.isJoined()) { + return; + } + this.uploadChannel.push("chunk", chunk, this.chunkTimeout).receive("ok", () => { + this.entry.progress(this.offset / this.entry.file.size * 100); + if (!this.isDone()) { + this.chunkTimer = setTimeout( + () => this.readNextChunk(), + this.liveSocket.getLatencySim() || 0 + ); + } + }).receive("error", ({ reason }) => this.error(reason)); + } + }; + var logError = (msg, obj) => console.error && console.error(msg, obj); + var isCid = (cid) => { + const type = typeof cid; + return type === "number" || type === "string" && /^(0|[1-9]\d*)$/.test(cid); + }; + function detectDuplicateIds() { + const ids = /* @__PURE__ */ new Set(); + const elems = document.querySelectorAll("*[id]"); + for (let i = 0, len = elems.length; i < len; i++) { + if (ids.has(elems[i].id)) { + console.error( + `Multiple IDs detected: ${elems[i].id}. Ensure unique element ids.` + ); + } else { + ids.add(elems[i].id); + } + } + } + function detectInvalidStreamInserts(inserts) { + const errors = /* @__PURE__ */ new Set(); + Object.keys(inserts).forEach((id) => { + const streamEl = document.getElementById(id); + if (streamEl && streamEl.parentElement && streamEl.parentElement.getAttribute("phx-update") !== "stream") { + errors.add( + `The stream container with id "${streamEl.parentElement.id}" is missing the phx-update="stream" attribute. Ensure it is set for streams to work properly.` + ); + } + }); + errors.forEach((error) => console.error(error)); + } + var debug = (view, kind, msg, obj) => { + if (view.liveSocket.isDebugEnabled()) { + console.log(`${view.id} ${kind}: ${msg} - `, obj); + } + }; + var closure2 = (val) => typeof val === "function" ? val : function() { + return val; + }; + var clone = (obj) => { + return JSON.parse(JSON.stringify(obj)); + }; + var closestPhxBinding = (el, binding, borderEl) => { + do { + if (el.matches(`[${binding}]`) && !el.disabled) { + return el; + } + el = el.parentElement || el.parentNode; + } while (el !== null && el.nodeType === 1 && !(borderEl && borderEl.isSameNode(el) || el.matches(PHX_VIEW_SELECTOR))); + return null; + }; + var isObject = (obj) => { + return obj !== null && typeof obj === "object" && !(obj instanceof Array); + }; + var isEqualObj = (obj1, obj2) => JSON.stringify(obj1) === JSON.stringify(obj2); + var isEmpty = (obj) => { + for (const x in obj) { + return false; + } + return true; + }; + var maybe = (el, callback) => el && callback(el); + var channelUploader = function(entries, onError, resp, liveSocket) { + entries.forEach((entry) => { + const entryUploader = new EntryUploader(entry, resp.config, liveSocket); + entryUploader.upload(); + }); + }; + var eventContainsFiles = (e) => { + if (e.dataTransfer.types) { + for (let i = 0; i < e.dataTransfer.types.length; i++) { + if (e.dataTransfer.types[i] === "Files") { + return true; + } + } + } + return false; + }; + var Browser = { + canPushState() { + return typeof history.pushState !== "undefined"; + }, + dropLocal(localStorage, namespace, subkey) { + return localStorage.removeItem(this.localKey(namespace, subkey)); + }, + updateLocal(localStorage, namespace, subkey, initial, func) { + const current = this.getLocal(localStorage, namespace, subkey); + const key = this.localKey(namespace, subkey); + const newVal = current === null ? initial : func(current); + localStorage.setItem(key, JSON.stringify(newVal)); + return newVal; + }, + getLocal(localStorage, namespace, subkey) { + return JSON.parse(localStorage.getItem(this.localKey(namespace, subkey))); + }, + updateCurrentState(callback) { + if (!this.canPushState()) { + return; + } + history.replaceState( + callback(history.state || {}), + "", + window.location.href + ); + }, + pushState(kind, meta, to) { + if (this.canPushState()) { + if (to !== window.location.href) { + if (meta.type == "redirect" && meta.scroll) { + const currentState = history.state || {}; + currentState.scroll = meta.scroll; + history.replaceState(currentState, "", window.location.href); + } + delete meta.scroll; + history[kind + "State"](meta, "", to || null); + window.requestAnimationFrame(() => { + const hashEl = this.getHashTargetEl(window.location.hash); + if (hashEl) { + hashEl.scrollIntoView(); + } else if (meta.type === "redirect") { + window.scroll(0, 0); + } + }); + } + } else { + this.redirect(to); + } + }, + setCookie(name, value, maxAgeSeconds) { + const expires = typeof maxAgeSeconds === "number" ? ` max-age=${maxAgeSeconds};` : ""; + document.cookie = `${name}=${value};${expires} path=/`; + }, + getCookie(name) { + return document.cookie.replace( + new RegExp(`(?:(?:^|.*;s*)${name}s*=s*([^;]*).*$)|^.*$`), + "$1" + ); + }, + deleteCookie(name) { + document.cookie = `${name}=; max-age=-1; path=/`; + }, + redirect(toURL, flash, navigate = (url) => { + window.location.href = url; + }) { + if (flash) { + this.setCookie("__phoenix_flash__", flash, 60); + } + navigate(toURL); + }, + localKey(namespace, subkey) { + return `${namespace}-${subkey}`; + }, + getHashTargetEl(maybeHash) { + const hash = maybeHash.toString().substring(1); + if (hash === "") { + return; + } + return document.getElementById(hash) || document.querySelector(`a[name="${hash}"]`); + } + }; + var browser_default = Browser; + var DOM = { + byId(id) { + return document.getElementById(id) || logError(`no id found for ${id}`); + }, + removeClass(el, className) { + el.classList.remove(className); + if (el.classList.length === 0) { + el.removeAttribute("class"); + } + }, + all(node, query, callback) { + if (!node) { + return []; + } + const array = Array.from(node.querySelectorAll(query)); + if (callback) { + array.forEach(callback); + } + return array; + }, + childNodeLength(html) { + const template = document.createElement("template"); + template.innerHTML = html; + return template.content.childElementCount; + }, + isUploadInput(el) { + return el.type === "file" && el.getAttribute(PHX_UPLOAD_REF) !== null; + }, + isAutoUpload(inputEl) { + return inputEl.hasAttribute("data-phx-auto-upload"); + }, + findUploadInputs(node) { + const formId = node.id; + const inputsOutsideForm = this.all( + document, + `input[type="file"][${PHX_UPLOAD_REF}][form="${formId}"]` + ); + return this.all(node, `input[type="file"][${PHX_UPLOAD_REF}]`).concat( + inputsOutsideForm + ); + }, + findComponentNodeList(viewId, cid, doc2 = document) { + return this.all( + doc2, + `[${PHX_VIEW_REF}="${viewId}"][${PHX_COMPONENT}="${cid}"]` + ); + }, + isPhxDestroyed(node) { + return node.id && DOM.private(node, "destroyed") ? true : false; + }, + wantsNewTab(e) { + const wantsNewTab = e.ctrlKey || e.shiftKey || e.metaKey || e.button && e.button === 1; + const isDownload = e.target instanceof HTMLAnchorElement && e.target.hasAttribute("download"); + const isTargetBlank = e.target.hasAttribute("target") && e.target.getAttribute("target").toLowerCase() === "_blank"; + const isTargetNamedTab = e.target.hasAttribute("target") && !e.target.getAttribute("target").startsWith("_"); + return wantsNewTab || isTargetBlank || isDownload || isTargetNamedTab; + }, + isUnloadableFormSubmit(e) { + const isDialogSubmit = e.target && e.target.getAttribute("method") === "dialog" || e.submitter && e.submitter.getAttribute("formmethod") === "dialog"; + if (isDialogSubmit) { + return false; + } else { + return !e.defaultPrevented && !this.wantsNewTab(e); + } + }, + isNewPageClick(e, currentLocation) { + const href = e.target instanceof HTMLAnchorElement ? e.target.getAttribute("href") : null; + let url; + if (e.defaultPrevented || href === null || this.wantsNewTab(e)) { + return false; + } + if (href.startsWith("mailto:") || href.startsWith("tel:")) { + return false; + } + if (e.target.isContentEditable) { + return false; + } + try { + url = new URL(href); + } catch { + try { + url = new URL(href, currentLocation); + } catch { + return true; + } + } + if (url.host === currentLocation.host && url.protocol === currentLocation.protocol) { + if (url.pathname === currentLocation.pathname && url.search === currentLocation.search) { + return url.hash === "" && !url.href.endsWith("#"); + } + } + return url.protocol.startsWith("http"); + }, + markPhxChildDestroyed(el) { + if (this.isPhxChild(el)) { + el.setAttribute(PHX_SESSION, ""); + } + this.putPrivate(el, "destroyed", true); + }, + findPhxChildrenInFragment(html, parentId) { + const template = document.createElement("template"); + template.innerHTML = html; + return this.findPhxChildren(template.content, parentId); + }, + isIgnored(el, phxUpdate) { + return (el.getAttribute(phxUpdate) || el.getAttribute("data-phx-update")) === "ignore"; + }, + isPhxUpdate(el, phxUpdate, updateTypes) { + return el.getAttribute && updateTypes.indexOf(el.getAttribute(phxUpdate)) >= 0; + }, + findPhxSticky(el) { + return this.all(el, `[${PHX_STICKY}]`); + }, + findPhxChildren(el, parentId) { + return this.all(el, `${PHX_VIEW_SELECTOR}[${PHX_PARENT_ID}="${parentId}"]`); + }, + findExistingParentCIDs(viewId, cids) { + const parentCids = /* @__PURE__ */ new Set(); + const childrenCids = /* @__PURE__ */ new Set(); + cids.forEach((cid) => { + this.all( + document, + `[${PHX_VIEW_REF}="${viewId}"][${PHX_COMPONENT}="${cid}"]` + ).forEach((parent) => { + parentCids.add(cid); + this.all(parent, `[${PHX_VIEW_REF}="${viewId}"][${PHX_COMPONENT}]`).map((el) => parseInt(el.getAttribute(PHX_COMPONENT))).forEach((childCID) => childrenCids.add(childCID)); + }); + }); + childrenCids.forEach((childCid) => parentCids.delete(childCid)); + return parentCids; + }, + private(el, key) { + return el[PHX_PRIVATE] && el[PHX_PRIVATE][key]; + }, + deletePrivate(el, key) { + el[PHX_PRIVATE] && delete el[PHX_PRIVATE][key]; + }, + putPrivate(el, key, value) { + if (!el[PHX_PRIVATE]) { + el[PHX_PRIVATE] = {}; + } + el[PHX_PRIVATE][key] = value; + }, + updatePrivate(el, key, defaultVal, updateFunc) { + const existing = this.private(el, key); + if (existing === void 0) { + this.putPrivate(el, key, updateFunc(defaultVal)); + } else { + this.putPrivate(el, key, updateFunc(existing)); + } + }, + syncPendingAttrs(fromEl, toEl) { + if (!fromEl.hasAttribute(PHX_REF_SRC)) { + return; + } + PHX_EVENT_CLASSES.forEach((className) => { + fromEl.classList.contains(className) && toEl.classList.add(className); + }); + PHX_PENDING_ATTRS.filter((attr) => fromEl.hasAttribute(attr)).forEach( + (attr) => { + toEl.setAttribute(attr, fromEl.getAttribute(attr)); + } + ); + }, + copyPrivates(target, source) { + if (source[PHX_PRIVATE]) { + target[PHX_PRIVATE] = source[PHX_PRIVATE]; + } + }, + putTitle(str) { + const titleEl = document.querySelector("title"); + if (titleEl) { + const { prefix, suffix, default: defaultTitle } = titleEl.dataset; + const isEmpty2 = typeof str !== "string" || str.trim() === ""; + if (isEmpty2 && typeof defaultTitle !== "string") { + return; + } + const inner = isEmpty2 ? defaultTitle : str; + document.title = `${prefix || ""}${inner || ""}${suffix || ""}`; + } else { + document.title = str; + } + }, + debounce(el, event, phxDebounce, defaultDebounce, phxThrottle, defaultThrottle, asyncFilter, callback) { + let debounce = el.getAttribute(phxDebounce); + let throttle = el.getAttribute(phxThrottle); + if (debounce === "") { + debounce = defaultDebounce; + } + if (throttle === "") { + throttle = defaultThrottle; + } + const value = debounce || throttle; + switch (value) { + case null: + return callback(); + case "blur": + this.incCycle(el, "debounce-blur-cycle", () => { + if (asyncFilter()) { + callback(); + } + }); + if (this.once(el, "debounce-blur")) { + el.addEventListener( + "blur", + () => this.triggerCycle(el, "debounce-blur-cycle") + ); + } + return; + default: + const timeout = parseInt(value); + const trigger = () => throttle ? this.deletePrivate(el, THROTTLED) : callback(); + const currentCycle = this.incCycle(el, DEBOUNCE_TRIGGER, trigger); + if (isNaN(timeout)) { + return logError(`invalid throttle/debounce value: ${value}`); + } + if (throttle) { + let newKeyDown = false; + if (event.type === "keydown") { + const prevKey = this.private(el, DEBOUNCE_PREV_KEY); + this.putPrivate(el, DEBOUNCE_PREV_KEY, event.key); + newKeyDown = prevKey !== event.key; + } + if (!newKeyDown && this.private(el, THROTTLED)) { + return false; + } else { + callback(); + const t = setTimeout(() => { + if (asyncFilter()) { + this.triggerCycle(el, DEBOUNCE_TRIGGER); + } + }, timeout); + this.putPrivate(el, THROTTLED, t); + } + } else { + setTimeout(() => { + if (asyncFilter()) { + this.triggerCycle(el, DEBOUNCE_TRIGGER, currentCycle); + } + }, timeout); + } + const form = el.form; + if (form && this.once(form, "bind-debounce")) { + form.addEventListener("submit", () => { + Array.from(new FormData(form).entries(), ([name]) => { + const namedItem = form.elements.namedItem(name); + const input = namedItem instanceof RadioNodeList ? namedItem[0] : namedItem; + if (input) { + this.incCycle(input, DEBOUNCE_TRIGGER); + this.deletePrivate(input, THROTTLED); + } + }); + }); + } + if (this.once(el, "bind-debounce")) { + el.addEventListener("blur", () => { + clearTimeout(this.private(el, THROTTLED)); + this.triggerCycle(el, DEBOUNCE_TRIGGER); + }); + } + } + }, + triggerCycle(el, key, currentCycle) { + const [cycle, trigger] = this.private(el, key); + if (!currentCycle) { + currentCycle = cycle; + } + if (currentCycle === cycle) { + this.incCycle(el, key); + trigger(); + } + }, + once(el, key) { + if (this.private(el, key) === true) { + return false; + } + this.putPrivate(el, key, true); + return true; + }, + incCycle(el, key, trigger = function() { + }) { + let [currentCycle] = this.private(el, key) || [0, trigger]; + currentCycle++; + this.putPrivate(el, key, [currentCycle, trigger]); + return currentCycle; + }, + // maintains or adds privately used hook information + // fromEl and toEl can be the same element in the case of a newly added node + // fromEl and toEl can be any HTML node type, so we need to check if it's an element node + maintainPrivateHooks(fromEl, toEl, phxViewportTop, phxViewportBottom) { + if (fromEl.hasAttribute && fromEl.hasAttribute("data-phx-hook") && !toEl.hasAttribute("data-phx-hook")) { + toEl.setAttribute("data-phx-hook", fromEl.getAttribute("data-phx-hook")); + } + if (toEl.hasAttribute && (toEl.hasAttribute(phxViewportTop) || toEl.hasAttribute(phxViewportBottom))) { + toEl.setAttribute("data-phx-hook", "Phoenix.InfiniteScroll"); + } + }, + putCustomElHook(el, hook) { + if (el.isConnected) { + el.setAttribute("data-phx-hook", ""); + } else { + console.error(` hook attached to non-connected DOM element - ensure you are calling createHook within your connectedCallback. ${e.outerHTML} - `),this.putPrivate(e,"custom-el-hook",t)},getCustomElHook(e){return this.private(e,"custom-el-hook")},isUsedInput(e){return e.nodeType===Node.ELEMENT_NODE&&(this.private(e,ct)||this.private(e,We))},resetForm(e){Array.from(e.elements).forEach(t=>{this.deletePrivate(t,ct),this.deletePrivate(t,We)})},isPhxChild(e){return e.getAttribute&&e.getAttribute(ye)},isPhxSticky(e){return e.getAttribute&&e.getAttribute(Ot)!==null},isChildOfAny(e,t){return!!t.find(i=>i.contains(e))},firstPhxChild(e){return this.isPhxChild(e)?e:this.all(e,`[${ye}]`)[0]},isPortalTemplate(e){return e.tagName==="TEMPLATE"&&e.hasAttribute(Bt)},closestViewEl(e){let t=e.closest(`[${Ee}],${qe}`);return t?t.hasAttribute(Ee)?this.byId(t.getAttribute(Ee)):t.hasAttribute(Q)?t:null:null},dispatchEvent(e,t,i={}){let s=!0;e.nodeName==="INPUT"&&e.type==="file"&&t==="click"&&(s=!1);let o={bubbles:i.bubbles===void 0?s:!!i.bubbles,cancelable:!0,detail:i.detail||{}},a=t==="click"?new MouseEvent("click",o):new CustomEvent(t,o);e.dispatchEvent(a)},cloneNode(e,t){if(typeof t>"u")return e.cloneNode(!0);{let i=e.cloneNode(!1);return i.innerHTML=t,i}},mergeAttrs(e,t,i={}){let s=new Set(i.exclude||[]),n=i.isIgnored,r=t.attributes;for(let a=r.length-1;a>=0;a--){let h=r[a].name;if(s.has(h)){if(h==="value"){let l=t.value??t.getAttribute(h);e.value===l&&e.setAttribute("value",t.getAttribute(h))}}else{let l=t.getAttribute(h);e.getAttribute(h)!==l&&(!n||n&&h.startsWith("data-"))&&e.setAttribute(h,l)}}let o=e.attributes;for(let a=o.length-1;a>=0;a--){let h=o[a].name;n?h.startsWith("data-")&&!t.hasAttribute(h)&&!ui.includes(h)&&e.removeAttribute(h):t.hasAttribute(h)||e.removeAttribute(h)}},mergeFocusedInput(e,t){e instanceof HTMLSelectElement||ve.mergeAttrs(e,t,{exclude:["value"]}),t.readOnly?e.setAttribute("readonly",!0):e.removeAttribute("readonly")},hasSelectionRange(e){return e.setSelectionRange&&(e.type==="text"||e.type==="textarea")},restoreFocus(e,t,i){if(e instanceof HTMLSelectElement&&e.focus(),!ve.isTextualInput(e))return;e.matches(":focus")||e.focus(),this.hasSelectionRange(e)&&e.setSelectionRange(t,i)},isFormInput(e){return e.localName&&customElements.get(e.localName)?customElements.get(e.localName).formAssociated:/^(?:input|select|textarea)$/i.test(e.tagName)&&e.type!=="button"},syncAttrsToProps(e){e instanceof HTMLInputElement&&Oi.indexOf(e.type.toLocaleLowerCase())>=0&&(e.checked=e.getAttribute("checked")!==null)},isTextualInput(e){return Rs.indexOf(e.type)>=0},isNowTriggerFormExternal(e,t){return e.getAttribute&&e.getAttribute(t)!==null&&document.body.contains(e)},cleanChildNodes(e,t){if(ve.isPhxUpdate(e,t,["append","prepend",at])){let i=[];e.childNodes.forEach(s=>{s.id||(!(s.nodeType===Node.TEXT_NODE&&s.nodeValue.trim()==="")&&s.nodeType!==Node.COMMENT_NODE&&P(`only HTML element tags with an id are allowed inside containers with phx-update. + ensure you are calling createHook within your connectedCallback. ${el.outerHTML} + `); + } + this.putPrivate(el, "custom-el-hook", hook); + }, + getCustomElHook(el) { + return this.private(el, "custom-el-hook"); + }, + isUsedInput(el) { + return el.nodeType === Node.ELEMENT_NODE && (this.private(el, PHX_HAS_FOCUSED) || this.private(el, PHX_HAS_SUBMITTED)); + }, + resetForm(form) { + Array.from(form.elements).forEach((input) => { + this.deletePrivate(input, PHX_HAS_FOCUSED); + this.deletePrivate(input, PHX_HAS_SUBMITTED); + }); + }, + isPhxChild(node) { + return node.getAttribute && node.getAttribute(PHX_PARENT_ID); + }, + isPhxSticky(node) { + return node.getAttribute && node.getAttribute(PHX_STICKY) !== null; + }, + isChildOfAny(el, parents) { + return !!parents.find((parent) => parent.contains(el)); + }, + firstPhxChild(el) { + return this.isPhxChild(el) ? el : this.all(el, `[${PHX_PARENT_ID}]`)[0]; + }, + isPortalTemplate(el) { + return el.tagName === "TEMPLATE" && el.hasAttribute(PHX_PORTAL); + }, + closestViewEl(el) { + const portalOrViewEl = el.closest( + `[${PHX_TELEPORTED_REF}],${PHX_VIEW_SELECTOR}` + ); + if (!portalOrViewEl) { + return null; + } + if (portalOrViewEl.hasAttribute(PHX_TELEPORTED_REF)) { + return this.byId(portalOrViewEl.getAttribute(PHX_TELEPORTED_REF)); + } else if (portalOrViewEl.hasAttribute(PHX_SESSION)) { + return portalOrViewEl; + } + return null; + }, + dispatchEvent(target, name, opts = {}) { + let defaultBubble = true; + const isUploadTarget = target.nodeName === "INPUT" && target.type === "file"; + if (isUploadTarget && name === "click") { + defaultBubble = false; + } + const bubbles = opts.bubbles === void 0 ? defaultBubble : !!opts.bubbles; + const eventOpts = { + bubbles, + cancelable: true, + detail: opts.detail || {} + }; + const event = name === "click" ? new MouseEvent("click", eventOpts) : new CustomEvent(name, eventOpts); + target.dispatchEvent(event); + }, + cloneNode(node, html) { + if (typeof html === "undefined") { + return node.cloneNode(true); + } else { + const cloned = node.cloneNode(false); + cloned.innerHTML = html; + return cloned; + } + }, + // merge attributes from source to target + // if an element is ignored, we only merge data attributes + // including removing data attributes that are no longer in the source + mergeAttrs(target, source, opts = {}) { + const exclude = new Set(opts.exclude || []); + const isIgnored = opts.isIgnored; + const sourceAttrs = source.attributes; + for (let i = sourceAttrs.length - 1; i >= 0; i--) { + const name = sourceAttrs[i].name; + if (!exclude.has(name)) { + const sourceValue = source.getAttribute(name); + if (target.getAttribute(name) !== sourceValue && (!isIgnored || isIgnored && name.startsWith("data-"))) { + target.setAttribute(name, sourceValue); + } + } else { + if (name === "value") { + const sourceValue = source.value ?? source.getAttribute(name); + if (target.value === sourceValue) { + target.setAttribute("value", source.getAttribute(name)); + } + } + } + } + const targetAttrs = target.attributes; + for (let i = targetAttrs.length - 1; i >= 0; i--) { + const name = targetAttrs[i].name; + if (isIgnored) { + if (name.startsWith("data-") && !source.hasAttribute(name) && !PHX_PENDING_ATTRS.includes(name)) { + target.removeAttribute(name); + } + } else { + if (!source.hasAttribute(name)) { + target.removeAttribute(name); + } + } + } + }, + mergeFocusedInput(target, source) { + if (!(target instanceof HTMLSelectElement)) { + DOM.mergeAttrs(target, source, { exclude: ["value"] }); + } + if (source.readOnly) { + target.setAttribute("readonly", true); + } else { + target.removeAttribute("readonly"); + } + }, + hasSelectionRange(el) { + return el.setSelectionRange && (el.type === "text" || el.type === "textarea"); + }, + restoreFocus(focused, selectionStart, selectionEnd) { + if (focused instanceof HTMLSelectElement) { + focused.focus(); + } + if (!DOM.isTextualInput(focused)) { + return; + } + const wasFocused = focused.matches(":focus"); + if (!wasFocused) { + focused.focus(); + } + if (this.hasSelectionRange(focused)) { + focused.setSelectionRange(selectionStart, selectionEnd); + } + }, + isFormInput(el) { + if (el.localName && customElements.get(el.localName)) { + return customElements.get(el.localName)[`formAssociated`]; + } + return /^(?:input|select|textarea)$/i.test(el.tagName) && el.type !== "button"; + }, + syncAttrsToProps(el) { + if (el instanceof HTMLInputElement && CHECKABLE_INPUTS.indexOf(el.type.toLocaleLowerCase()) >= 0) { + el.checked = el.getAttribute("checked") !== null; + } + }, + isTextualInput(el) { + return FOCUSABLE_INPUTS.indexOf(el.type) >= 0; + }, + isNowTriggerFormExternal(el, phxTriggerExternal) { + return el.getAttribute && el.getAttribute(phxTriggerExternal) !== null && document.body.contains(el); + }, + cleanChildNodes(container, phxUpdate) { + if (DOM.isPhxUpdate(container, phxUpdate, ["append", "prepend", PHX_STREAM])) { + const toRemove = []; + container.childNodes.forEach((childNode) => { + if (!childNode.id) { + const isEmptyTextNode = childNode.nodeType === Node.TEXT_NODE && childNode.nodeValue.trim() === ""; + if (!isEmptyTextNode && childNode.nodeType !== Node.COMMENT_NODE) { + logError( + `only HTML element tags with an id are allowed inside containers with phx-update. -removing illegal node: "${(s.outerHTML||s.nodeValue).trim()}" +removing illegal node: "${(childNode.outerHTML || childNode.nodeValue).trim()}" -`),i.push(s))}),i.forEach(s=>s.remove())}},replaceRootContainer(e,t,i){let s=new Set(["id",Q,we,Ut,re]);if(e.tagName.toLowerCase()===t.toLowerCase())return Array.from(e.attributes).filter(n=>!s.has(n.name.toLowerCase())).forEach(n=>e.removeAttribute(n.name)),Object.keys(i).filter(n=>!s.has(n.toLowerCase())).forEach(n=>e.setAttribute(n,i[n])),e;{let n=document.createElement(t);return Object.keys(i).forEach(r=>n.setAttribute(r,i[r])),s.forEach(r=>n.setAttribute(r,e.getAttribute(r))),n.innerHTML=e.innerHTML,e.replaceWith(n),n}},getSticky(e,t,i){let s=(ve.private(e,"sticky")||[]).find(([n])=>t===n);if(s){let[n,r,o]=s;return o}else return typeof i=="function"?i():i},deleteSticky(e,t){this.updatePrivate(e,"sticky",[],i=>i.filter(([s,n])=>s!==t))},putSticky(e,t,i){let s=i(e);this.updatePrivate(e,"sticky",[],n=>{let r=n.findIndex(([o])=>t===o);return r>=0?n[r]=[t,i,s]:n.push([t,i,s]),n})},applyStickyOperations(e){let t=ve.private(e,"sticky");t&&t.forEach(([i,s,n])=>this.putSticky(e,i,s))},isLocked(e){return e.hasAttribute&&e.hasAttribute(D)},attributeIgnored(e,t){return t.some(i=>e.name==i||i==="*"||i.includes("*")&&e.name.match(i)!=null)}},c=ve,je=class{static isActive(e,t){let i=t._phxRef===void 0,n=e.getAttribute(It).split(",").indexOf(M.genFileRef(t))>=0;return t.size>0&&(i||n)}static isPreflighted(e,t){return e.getAttribute(Ft).split(",").indexOf(M.genFileRef(t))>=0&&this.isActive(e,t)}static isPreflightInProgress(e){return e._preflightInProgress===!0}static markPreflightInProgress(e){e._preflightInProgress=!0}constructor(e,t,i,s){this.ref=M.genFileRef(t),this.fileEl=e,this.file=t,this.view=i,this.meta=null,this._isCancelled=!1,this._isDone=!1,this._progress=0,this._lastProgressSent=-1,this._onDone=function(){},this._onElUpdated=this.onElUpdated.bind(this),this.fileEl.addEventListener(ot,this._onElUpdated),this.autoUpload=s}metadata(){return this.meta}progress(e){this._progress=Math.floor(e),this._progress>this._lastProgressSent&&(this._progress>=100?(this._progress=100,this._lastProgressSent=100,this._isDone=!0,this.view.pushFileProgress(this.fileEl,this.ref,100,()=>{M.untrackFile(this.fileEl,this.file),this._onDone()})):(this._lastProgressSent=this._progress,this.view.pushFileProgress(this.fileEl,this.ref,this._progress)))}isCancelled(){return this._isCancelled}cancel(){this.file._preflightInProgress=!1,this._isCancelled=!0,this._isDone=!0,this._onDone()}isDone(){return this._isDone}error(e="failed"){this.fileEl.removeEventListener(ot,this._onElUpdated),this.view.pushFileProgress(this.fileEl,this.ref,{error:e}),this.isAutoUpload()||M.clearFiles(this.fileEl)}isAutoUpload(){return this.autoUpload}onDone(e){this._onDone=()=>{this.fileEl.removeEventListener(ot,this._onElUpdated),e()}}onElUpdated(){this.fileEl.getAttribute(It).split(",").indexOf(this.ref)===-1&&(M.untrackFile(this.fileEl,this.file),this.cancel())}toPreflightPayload(){return{last_modified:this.file.lastModified,name:this.file.name,relative_path:this.file.webkitRelativePath,size:this.file.size,type:this.file.type,ref:this.ref,meta:typeof this.file.meta=="function"?this.file.meta():void 0}}uploader(e){if(this.meta.uploader){let t=e[this.meta.uploader]||P(`no uploader configured for ${this.meta.uploader}`);return{name:this.meta.uploader,callback:t}}else return{name:"channel",callback:Xs}}zipPostFlight(e){this.meta=e.entries[this.ref],this.meta||P(`no preflight upload response returned with ref ${this.ref}`,{input:this.fileEl,response:e})}},Gs=0,M=class Ht{static genFileRef(t){let i=t._phxRef;return i!==void 0?i:(t._phxRef=(Gs++).toString(),t._phxRef)}static getEntryDataURL(t,i,s){let n=this.activeFiles(t).find(r=>this.genFileRef(r)===i);s(URL.createObjectURL(n))}static hasUploadsInProgress(t){let i=0;return c.findUploadInputs(t).forEach(s=>{s.getAttribute(Ft)!==s.getAttribute(_s)&&i++}),i>0}static serializeUploads(t){let i=this.activeFiles(t),s={};return i.forEach(n=>{let r={path:t.name},o=t.getAttribute(oe);s[o]=s[o]||[],r.ref=this.genFileRef(n),r.last_modified=n.lastModified,r.name=n.name||r.ref,r.relative_path=n.webkitRelativePath,r.type=n.type,r.size=n.size,typeof n.meta=="function"&&(r.meta=n.meta()),s[o].push(r)}),s}static clearFiles(t){t.value=null,t.removeAttribute(oe),c.putPrivate(t,"files",[])}static untrackFile(t,i){c.putPrivate(t,"files",c.private(t,"files").filter(s=>!Object.is(s,i)))}static trackFiles(t,i,s){if(t.getAttribute("multiple")!==null){let n=i.filter(r=>!this.activeFiles(t).find(o=>Object.is(o,r)));c.updatePrivate(t,"files",[],r=>r.concat(n)),t.value=null}else s&&s.files.length>0&&(t.files=s.files),c.putPrivate(t,"files",i)}static activeFileInputs(t){let i=c.findUploadInputs(t);return Array.from(i).filter(s=>s.files&&this.activeFiles(s).length>0)}static activeFiles(t){return(c.private(t,"files")||[]).filter(i=>je.isActive(t,i))}static inputsAwaitingPreflight(t){let i=c.findUploadInputs(t);return Array.from(i).filter(s=>this.filesAwaitingPreflight(s).length>0)}static filesAwaitingPreflight(t){return this.activeFiles(t).filter(i=>!je.isPreflighted(t,i)&&!je.isPreflightInProgress(i))}static markPreflightInProgress(t){t.forEach(i=>je.markPreflightInProgress(i.file))}constructor(t,i,s){this.autoUpload=c.isAutoUpload(t),this.view=i,this.onComplete=s,this._entries=Array.from(Ht.filesAwaitingPreflight(t)||[]).map(n=>new je(t,n,i,this.autoUpload)),Ht.markPreflightInProgress(this._entries),this.numEntriesInProgress=this._entries.length}isAutoUpload(){return this.autoUpload}entries(){return this._entries}initAdapterUpload(t,i,s){this._entries=this._entries.map(r=>(r.isCancelled()?(this.numEntriesInProgress--,this.numEntriesInProgress===0&&this.onComplete()):(r.zipPostFlight(t),r.onDone(()=>{this.numEntriesInProgress--,this.numEntriesInProgress===0&&this.onComplete()})),r));let n=this._entries.reduce((r,o)=>{if(!o.meta)return r;let{name:a,callback:h}=o.uploader(s.uploaders);return r[a]=r[a]||{callback:h,entries:[]},r[a].entries.push(o),r},{});for(let r in n){let{callback:o,entries:a}=n[r];o(a,i,t,s)}}},Ys={anyOf(e,t){return t.find(i=>e instanceof i)},isFocusable(e,t){return e instanceof HTMLAnchorElement&&e.rel!=="ignore"||e instanceof HTMLAreaElement&&e.href!==void 0||!e.disabled&&this.anyOf(e,[HTMLInputElement,HTMLSelectElement,HTMLTextAreaElement,HTMLButtonElement])||e instanceof HTMLIFrameElement||e.tabIndex>=0&&e.getAttribute("aria-hidden")!=="true"||!t&&e.getAttribute("tabindex")!==null&&e.getAttribute("aria-hidden")!=="true"},attemptFocus(e,t){if(this.isFocusable(e,t))try{e.focus()}catch{}return!!document.activeElement&&document.activeElement.isSameNode(e)},focusFirstInteractive(e){let t=e.firstElementChild;for(;t;){if(this.attemptFocus(t,!0)||this.focusFirstInteractive(t))return!0;t=t.nextElementSibling}},focusFirst(e){let t=e.firstElementChild;for(;t;){if(this.attemptFocus(t)||this.focusFirst(t))return!0;t=t.nextElementSibling}},focusLast(e){let t=e.lastElementChild;for(;t;){if(this.attemptFocus(t)||this.focusLast(t))return!0;t=t.previousElementSibling}}},j=Ys,Mi={LiveFileUpload:{activeRefs(){return this.el.getAttribute(It)},preflightedRefs(){return this.el.getAttribute(Ft)},mounted(){this.js().ignoreAttributes(this.el,["value"]),this.preflightedWas=this.preflightedRefs()},updated(){let e=this.preflightedRefs();this.preflightedWas!==e&&(this.preflightedWas=e,e===""&&this.__view().cancelSubmit(this.el.form)),this.activeRefs()===""&&(this.el.value=null),this.el.dispatchEvent(new CustomEvent(ot))}},LiveImgPreview:{mounted(){this.ref=this.el.getAttribute("data-phx-entry-ref"),this.inputEl=document.getElementById(this.el.getAttribute(oe)),M.getEntryDataURL(this.inputEl,this.ref,e=>{this.url=e,this.el.src=e})},destroyed(){URL.revokeObjectURL(this.url)}},FocusWrap:{mounted(){this.focusStart=this.el.firstElementChild,this.focusEnd=this.el.lastElementChild,this.focusStart.addEventListener("focus",e=>{if(!e.relatedTarget||!this.el.contains(e.relatedTarget)){let t=e.target.nextElementSibling;j.attemptFocus(t)||j.focusFirst(t)}else j.focusLast(this.el)}),this.focusEnd.addEventListener("focus",e=>{if(!e.relatedTarget||!this.el.contains(e.relatedTarget)){let t=e.target.previousElementSibling;j.attemptFocus(t)||j.focusLast(t)}else j.focusFirst(this.el)}),this.el.contains(document.activeElement)||(this.el.addEventListener("phx:show-end",()=>this.el.focus()),window.getComputedStyle(this.el).display!=="none"&&j.focusFirst(this.el))}}},Hi=e=>["HTML","BODY"].indexOf(e.nodeName.toUpperCase())>=0?null:["scroll","auto"].indexOf(getComputedStyle(e).overflowY)>=0?e:Hi(e.parentElement),vi=e=>e?e.scrollTop:document.documentElement.scrollTop||document.body.scrollTop,jt=e=>e?e.getBoundingClientRect().bottom:window.innerHeight||document.documentElement.clientHeight,Vt=e=>e?e.getBoundingClientRect().top:0,Zs=(e,t)=>{let i=e.getBoundingClientRect();return Math.ceil(i.top)>=Vt(t)&&Math.ceil(i.left)>=0&&Math.floor(i.top)<=jt(t)},Qs=(e,t)=>{let i=e.getBoundingClientRect();return Math.ceil(i.bottom)>=Vt(t)&&Math.ceil(i.left)>=0&&Math.floor(i.bottom)<=jt(t)},bi=(e,t)=>{let i=e.getBoundingClientRect();return Math.ceil(i.top)>=Vt(t)&&Math.ceil(i.left)>=0&&Math.floor(i.top)<=jt(t)};Mi.InfiniteScroll={mounted(){this.scrollContainer=Hi(this.el);let e=vi(this.scrollContainer),t=!1,i=500,s=null,n=this.throttle(i,(a,h)=>{s=()=>!0,this.liveSocket.js().push(this.el,a,{value:{id:h.id,_overran:!0},callback:()=>{s=null}})}),r=this.throttle(i,(a,h)=>{s=()=>h.scrollIntoView({block:"start"}),this.liveSocket.js().push(this.el,a,{value:{id:h.id},callback:()=>{s=null,window.requestAnimationFrame(()=>{bi(h,this.scrollContainer)||h.scrollIntoView({block:"start"})})}})}),o=this.throttle(i,(a,h)=>{s=()=>h.scrollIntoView({block:"end"}),this.liveSocket.js().push(this.el,a,{value:{id:h.id},callback:()=>{s=null,window.requestAnimationFrame(()=>{bi(h,this.scrollContainer)||h.scrollIntoView({block:"end"})})}})});this.onScroll=a=>{let h=vi(this.scrollContainer);if(s)return e=h,s();let l=this.findOverrunTarget(),d=this.el.getAttribute(this.liveSocket.binding("viewport-top")),p=this.el.getAttribute(this.liveSocket.binding("viewport-bottom")),m=this.el.lastElementChild,g=this.el.firstElementChild,u=he;u&&d&&!t&&l.top>=0?(t=!0,n(d,g)):v&&t&&l.top<=0&&(t=!1),d&&u&&Zs(g,this.scrollContainer)?r(d,g):p&&v&&Qs(m,this.scrollContainer)&&o(p,m),e=h},this.scrollContainer?this.scrollContainer.addEventListener("scroll",this.onScroll):window.addEventListener("scroll",this.onScroll)},destroyed(){this.scrollContainer?this.scrollContainer.removeEventListener("scroll",this.onScroll):window.removeEventListener("scroll",this.onScroll)},throttle(e,t){let i=0,s;return(...n)=>{let r=Date.now(),o=e-(r-i);o<=0||o>e?(s&&(clearTimeout(s),s=null),i=r,t(...n)):s||(s=setTimeout(()=>{i=Date.now(),s=null,t(...n)},o))}},findOverrunTarget(){let e,t=this.el.getAttribute(this.liveSocket.binding(Ps));if(t){let i=document.getElementById(t);if(i)e=i.getBoundingClientRect();else throw new Error("did not find element with id "+t)}else e=this.el.getBoundingClientRect();return e}};var en=Mi,Nt=class{static onUnlock(e,t){if(!c.isLocked(e)&&!e.closest(`[${D}]`))return t();let i=e.closest(`[${D}]`),s=i.closest(`[${D}]`).getAttribute(D);i.addEventListener(`phx:undo-lock:${s}`,()=>{t()},{once:!0})}constructor(e){this.el=e,this.loadingRef=e.hasAttribute(De)?parseInt(e.getAttribute(De),10):null,this.lockRef=e.hasAttribute(D)?parseInt(e.getAttribute(D),10):null}maybeUndo(e,t,i){if(!this.isWithin(e)){c.updatePrivate(this.el,ii,[],s=>(s.push(e),s));return}this.undoLocks(e,t,i),this.undoLoading(e,t),c.updatePrivate(this.el,ii,[],s=>s.filter(n=>{let r={detail:{ref:n,event:t},bubbles:!0,cancelable:!1};return this.loadingRef&&this.loadingRef>n&&this.el.dispatchEvent(new CustomEvent(`phx:undo-loading:${n}`,r)),this.lockRef&&this.lockRef>n&&this.el.dispatchEvent(new CustomEvent(`phx:undo-lock:${n}`,r)),n>e})),this.isFullyResolvedBy(e)&&this.el.removeAttribute(W)}isWithin(e){return!(this.loadingRef!==null&&this.loadingRef>e&&this.lockRef!==null&&this.lockRef>e)}undoLocks(e,t,i){if(!this.isLockUndoneBy(e))return;let s=c.private(this.el,D);s&&(i(s),c.deletePrivate(this.el,D)),this.el.removeAttribute(D);let n={detail:{ref:e,event:t},bubbles:!0,cancelable:!1};this.el.dispatchEvent(new CustomEvent(`phx:undo-lock:${this.lockRef}`,n))}undoLoading(e,t){if(!this.isLoadingUndoneBy(e)){this.canUndoLoading(e)&&this.el.classList.contains("phx-submit-loading")&&this.el.classList.remove("phx-change-loading");return}if(this.canUndoLoading(e)){this.el.removeAttribute(De);let i=this.el.getAttribute(Re),s=this.el.getAttribute(Mt);s!==null&&(this.el.readOnly=s==="true",this.el.removeAttribute(Mt)),i!==null&&(this.el.disabled=i==="true",this.el.removeAttribute(Re));let n=this.el.getAttribute(dt);n!==null&&(this.el.textContent=n,this.el.removeAttribute(dt));let r={detail:{ref:e,event:t},bubbles:!0,cancelable:!1};this.el.dispatchEvent(new CustomEvent(`phx:undo-loading:${this.loadingRef}`,r))}Ri.forEach(i=>{(i!=="phx-submit-loading"||this.canUndoLoading(e))&&c.removeClass(this.el,i)})}isLoadingUndoneBy(e){return this.loadingRef===null?!1:this.loadingRef<=e}isLockUndoneBy(e){return this.lockRef===null?!1:this.lockRef<=e}isFullyResolvedBy(e){return(this.loadingRef===null||this.loadingRef<=e)&&(this.lockRef===null||this.lockRef<=e)}canUndoLoading(e){return this.lockRef===null||this.lockRef<=e}},tn=class{constructor(e,t,i){let s=new Set,n=new Set([...t.children].map(o=>o.id)),r=[];Array.from(e.children).forEach(o=>{if(o.id&&(s.add(o.id),n.has(o.id))){let a=o.previousElementSibling&&o.previousElementSibling.id;r.push({elementId:o.id,previousElementId:a})}}),this.containerId=t.id,this.updateType=i,this.elementsToModify=r,this.elementIdsToAdd=[...n].filter(o=>!s.has(o))}perform(){let e=c.byId(this.containerId);e&&(this.elementsToModify.forEach(t=>{t.previousElementId?Ie(document.getElementById(t.previousElementId),i=>{Ie(document.getElementById(t.elementId),s=>{s.previousElementSibling&&s.previousElementSibling.id==i.id||i.insertAdjacentElement("afterend",s)})}):Ie(document.getElementById(t.elementId),i=>{i.previousElementSibling==null||e.insertAdjacentElement("afterbegin",i)})}),this.updateType=="prepend"&&this.elementIdsToAdd.reverse().forEach(t=>{Ie(document.getElementById(t),i=>e.insertAdjacentElement("afterbegin",i))}))}},wi=11;function sn(e,t){var i=t.attributes,s,n,r,o,a;if(!(t.nodeType===wi||e.nodeType===wi)){for(var h=i.length-1;h>=0;h--)s=i[h],n=s.name,r=s.namespaceURI,o=s.value,r?(n=s.localName||n,a=e.getAttributeNS(r,n),a!==o&&(s.prefix==="xmlns"&&(n=s.name),e.setAttributeNS(r,n,o))):(a=e.getAttribute(n),a!==o&&e.setAttribute(n,o));for(var l=e.attributes,d=l.length-1;d>=0;d--)s=l[d],n=s.name,r=s.namespaceURI,r?(n=s.localName||n,t.hasAttributeNS(r,n)||e.removeAttributeNS(r,n)):t.hasAttribute(n)||e.removeAttribute(n)}}var it,nn="http://www.w3.org/1999/xhtml",F=typeof document>"u"?void 0:document,rn=!!F&&"content"in F.createElement("template"),on=!!F&&F.createRange&&"createContextualFragment"in F.createRange();function an(e){var t=F.createElement("template");return t.innerHTML=e,t.content.childNodes[0]}function hn(e){it||(it=F.createRange(),it.selectNode(F.body));var t=it.createContextualFragment(e);return t.childNodes[0]}function ln(e){var t=F.createElement("body");return t.innerHTML=e,t.childNodes[0]}function cn(e){return e=e.trim(),rn?an(e):on?hn(e):ln(e)}function st(e,t){var i=e.nodeName,s=t.nodeName,n,r;return i===s?!0:(n=i.charCodeAt(0),r=s.charCodeAt(0),n<=90&&r>=97?i===s.toUpperCase():r<=90&&n>=97?s===i.toUpperCase():!1)}function dn(e,t){return!t||t===nn?F.createElement(e):F.createElementNS(t,e)}function un(e,t){for(var i=e.firstChild;i;){var s=i.nextSibling;t.appendChild(i),i=s}return t}function xt(e,t,i){e[i]!==t[i]&&(e[i]=t[i],e[i]?e.setAttribute(i,""):e.removeAttribute(i))}var yi={OPTION:function(e,t){var i=e.parentNode;if(i){var s=i.nodeName.toUpperCase();s==="OPTGROUP"&&(i=i.parentNode,s=i&&i.nodeName.toUpperCase()),s==="SELECT"&&!i.hasAttribute("multiple")&&(e.hasAttribute("selected")&&!t.selected&&(e.setAttribute("selected","selected"),e.removeAttribute("selected")),i.selectedIndex=-1)}xt(e,t,"selected")},INPUT:function(e,t){xt(e,t,"checked"),xt(e,t,"disabled"),e.value!==t.value&&(e.value=t.value),t.hasAttribute("value")||e.removeAttribute("value")},TEXTAREA:function(e,t){var i=t.value;e.value!==i&&(e.value=i);var s=e.firstChild;if(s){var n=s.nodeValue;if(n==i||!i&&n==e.placeholder)return;s.nodeValue=i}},SELECT:function(e,t){if(!t.hasAttribute("multiple")){for(var i=-1,s=0,n=e.firstChild,r,o;n;)if(o=n.nodeName&&n.nodeName.toUpperCase(),o==="OPTGROUP")r=n,n=r.firstChild,n||(n=r.nextSibling,r=null);else{if(o==="OPTION"){if(n.hasAttribute("selected")){i=s;break}s++}n=n.nextSibling,!n&&r&&(n=r.nextSibling,r=null)}e.selectedIndex=i}}},Ve=1,Ei=11,Si=3,ki=8;function ue(){}function fn(e){if(e)return e.getAttribute&&e.getAttribute("id")||e.id}function pn(e){return function(i,s,n){if(n||(n={}),typeof s=="string")if(i.nodeName==="#document"||i.nodeName==="HTML"){var r=s;s=F.createElement("html"),s.innerHTML=r}else if(i.nodeName==="BODY"){var o=s;s=F.createElement("html"),s.innerHTML=o;var a=s.querySelector("body");a&&(s=a)}else s=cn(s);else s.nodeType===Ei&&(s=s.firstElementChild);var h=n.getNodeKey||fn,l=n.onBeforeNodeAdded||ue,d=n.onNodeAdded||ue,p=n.onBeforeElUpdated||ue,m=n.onElUpdated||ue,g=n.onBeforeNodeDiscarded||ue,u=n.onNodeDiscarded||ue,v=n.onBeforeElChildrenUpdated||ue,w=n.skipFromChildren||ue,O=n.addChild||function(y,E){return y.appendChild(E)},q=n.childrenOnly===!0,S=Object.create(null),C=[];function x(y){C.push(y)}function H(y,E){if(y.nodeType===Ve)for(var L=y.firstChild;L;){var k=void 0;E&&(k=h(L))?x(k):(u(L),L.firstChild&&H(L,E)),L=L.nextSibling}}function f(y,E,L){g(y)!==!1&&(E&&E.removeChild(y),u(y),H(y,L))}function b(y){if(y.nodeType===Ve||y.nodeType===Ei)for(var E=y.firstChild;E;){var L=h(E);L&&(S[L]=E),b(E),E=E.nextSibling}}b(i);function N(y){d(y);for(var E=y.firstChild;E;){var L=E.nextSibling,k=h(E);if(k){var T=S[k];T&&st(E,T)?(E.parentNode.replaceChild(T,E),R(T,E)):N(E)}else N(E);E=L}}function J(y,E,L){for(;E;){var k=E.nextSibling;(L=h(E))?x(L):f(E,y,!0),E=k}}function R(y,E,L){var k=h(E);if(k&&delete S[k],!L){var T=p(y,E);if(T===!1||(T instanceof HTMLElement&&(y=T,b(y)),e(y,E),m(y),v(y,E)===!1))return}y.nodeName!=="TEXTAREA"?Se(y,E):yi.TEXTAREA(y,E)}function Se(y,E){var L=w(y,E),k=E.firstChild,T=y.firstChild,ke,ie,Ae,Ke,le;e:for(;k;){for(Ke=k.nextSibling,ke=h(k);!L&&T;){if(Ae=T.nextSibling,k.isSameNode&&k.isSameNode(T)){k=Ke,T=Ae;continue e}ie=h(T);var ze=T.nodeType,ce=void 0;if(ze===k.nodeType&&(ze===Ve?(ke?ke!==ie&&((le=S[ke])?Ae===le?ce=!1:(y.insertBefore(le,T),ie?x(ie):f(T,y,!0),T=le,ie=h(T)):ce=!1):ie&&(ce=!1),ce=ce!==!1&&st(T,k),ce&&R(T,k)):(ze===Si||ze==ki)&&(ce=!0,T.nodeValue!==k.nodeValue&&(T.nodeValue=k.nodeValue))),ce){k=Ke,T=Ae;continue e}ie?x(ie):f(T,y,!0),T=Ae}if(ke&&(le=S[ke])&&st(le,k))L||O(y,le),R(le,k);else{var Et=l(k);Et!==!1&&(Et&&(k=Et),k.actualize&&(k=k.actualize(y.ownerDocument||F)),O(y,k),N(k))}k=Ke,T=Ae}J(y,T,ie);var Qt=yi[y.nodeName];Qt&&Qt(y,E)}var _=i,Xe=_.nodeType,Zt=s.nodeType;if(!q){if(Xe===Ve)Zt===Ve?st(i,s)||(u(i),_=un(i,dn(s.nodeName,s.namespaceURI))):_=s;else if(Xe===Si||Xe===ki){if(Zt===Xe)return _.nodeValue!==s.nodeValue&&(_.nodeValue=s.nodeValue),_;_=s}}if(_===s)u(i);else{if(s.isSameNode&&s.isSameNode(_))return;if(R(_,s,q),C)for(var wt=0,fs=C.length;wti(...t))}trackAfter(e,...t){this.callbacks[`after${e}`].forEach(i=>i(...t))}markPrunableContentForRemoval(){let e=this.liveSocket.binding(ut);c.all(this.container,`[${e}=append] > *, [${e}=prepend] > *`,t=>{t.setAttribute(si,"")})}perform(e){let{view:t,liveSocket:i,html:s,container:n}=this,r=this.targetContainer;if(this.isCIDPatch()&&!this.targetContainer)return;if(this.isCIDPatch()){let S=r.closest(`[${D}]`);if(S&&!S.isSameNode(r)){let C=c.private(S,D);C&&(r=C.querySelector(`[data-phx-component="${this.targetCID}"]`))}}let o=i.getActiveElement(),{selectionStart:a,selectionEnd:h}=o&&c.hasSelectionRange(o)?o:{},l=i.binding(ut),d=i.binding(Lt),p=i.binding(Dt),m=i.binding(xs),g=[],u=[],v=[],w=[],O=null,q=(S,C,x=this.withChildren)=>{let H={childrenOnly:S.getAttribute(Z)===null&&!x,getNodeKey:f=>c.isPhxDestroyed(f)?null:e?f.id:f.id||f.getAttribute&&f.getAttribute(Di),skipFromChildren:f=>f.getAttribute(l)===at,addChild:(f,b)=>{let{ref:N,streamAt:J}=this.getStreamInsert(b);if(N===void 0)return f.appendChild(b);if(this.setStreamRef(b,N),J===0)f.insertAdjacentElement("afterbegin",b);else if(J===-1){let R=f.lastElementChild;if(R&&!R.hasAttribute($e)){let Se=Array.from(f.children).find(_=>!_.hasAttribute($e));f.insertBefore(b,Se)}else f.appendChild(b)}else if(J>0){let R=Array.from(f.children)[J];f.insertBefore(b,R)}},onBeforeNodeAdded:f=>{if(this.getStreamInsert(f)?.updateOnly&&!this.streamComponentRestore[f.id])return!1;c.maintainPrivateHooks(f,f,d,p),this.trackBefore("added",f);let b=f;return this.streamComponentRestore[f.id]&&(b=this.streamComponentRestore[f.id],delete this.streamComponentRestore[f.id],q(b,f,!0)),b},onNodeAdded:f=>{f.getAttribute&&this.maybeReOrderStream(f,!0),c.isPortalTemplate(f)&&w.push(()=>this.teleport(f,q)),f instanceof HTMLImageElement&&f.srcset?f.srcset=f.srcset:f instanceof HTMLVideoElement&&f.autoplay&&f.play(),c.isNowTriggerFormExternal(f,m)&&(O=f),(c.isPhxChild(f)&&t.ownsElement(f)||c.isPhxSticky(f)&&t.ownsElement(f.parentNode))&&this.trackAfter("phxChildAdded",f),f.nodeName==="SCRIPT"&&f.hasAttribute(ht)&&this.handleRuntimeHook(f,C),g.push(f)},onNodeDiscarded:f=>this.onNodeDiscarded(f),onBeforeNodeDiscarded:f=>{if(f.getAttribute&&f.getAttribute(si)!==null)return!0;if(f.parentElement!==null&&f.id&&c.isPhxUpdate(f.parentElement,l,[at,"append","prepend"])||f.getAttribute&&f.getAttribute(Ee)||this.maybePendingRemove(f)||this.skipCIDSibling(f))return!1;if(c.isPortalTemplate(f)){let b=document.getElementById(f.content.firstElementChild.id);b&&(b.remove(),H.onNodeDiscarded(b),this.view.dropPortalElementId(b.id))}return!0},onElUpdated:f=>{c.isNowTriggerFormExternal(f,m)&&(O=f),u.push(f),this.maybeReOrderStream(f,!1)},onBeforeElUpdated:(f,b)=>{if(f.id&&f.isSameNode(S)&&f.id!==b.id)return H.onNodeDiscarded(f),f.replaceWith(b),H.onNodeAdded(b);if(c.syncPendingAttrs(f,b),c.maintainPrivateHooks(f,b,d,p),c.cleanChildNodes(b,l),this.skipCIDSibling(b))return this.maybeReOrderStream(f),!1;if(c.isPhxSticky(f))return[Q,we,re].map(R=>[R,f.getAttribute(R),b.getAttribute(R)]).forEach(([R,Se,_])=>{_&&Se!==_&&f.setAttribute(R,_)}),!1;if(c.isIgnored(f,l)||f.form&&f.form.isSameNode(O))return this.trackBefore("updated",f,b),c.mergeAttrs(f,b,{isIgnored:c.isIgnored(f,l)}),u.push(f),c.applyStickyOperations(f),!1;if(f.type==="number"&&f.validity&&f.validity.badInput)return!1;let N=o&&f.isSameNode(o)&&c.isFormInput(f),J=N&&this.isChangedSelect(f,b);if(f.hasAttribute(W)){let R=new Nt(f);if(R.lockRef&&(!this.undoRef||!R.isLockUndoneBy(this.undoRef))){c.applyStickyOperations(f);let _=f.hasAttribute(D)?c.private(f,D)||f.cloneNode(!0):null;_&&(c.putPrivate(f,D,_),N||(f=_))}}if(c.isPhxChild(b)){let R=f.getAttribute(Q);return c.mergeAttrs(f,b,{exclude:[we]}),R!==""&&f.setAttribute(Q,R),f.setAttribute(re,this.rootID),c.applyStickyOperations(f),!1}return this.undoRef&&c.private(b,D)&&c.putPrivate(f,D,c.private(b,D)),c.copyPrivates(b,f),c.isPortalTemplate(b)?(w.push(()=>this.teleport(b,q)),f.content.replaceChildren(b.content.cloneNode(!0)),!1):N&&f.type!=="hidden"&&!J?(this.trackBefore("updated",f,b),c.mergeFocusedInput(f,b),c.syncAttrsToProps(f),u.push(f),c.applyStickyOperations(f),!1):(J&&f.blur(),c.isPhxUpdate(b,l,["append","prepend"])&&v.push(new tn(f,b,b.getAttribute(l))),c.syncAttrsToProps(b),c.applyStickyOperations(b),this.trackBefore("updated",f,b),f)}};$t(S,C,H)};if(this.trackBefore("added",n),this.trackBefore("updated",n,n),i.time("morphdom",()=>{this.streams.forEach(([C,x,H,f])=>{x.forEach(([b,N,J,R])=>{this.streamInserts[b]={ref:C,streamAt:N,limit:J,reset:f,updateOnly:R}}),f!==void 0&&c.all(document,`[${$e}="${C}"]`,b=>{this.removeStreamChildElement(b)}),H.forEach(b=>{let N=document.getElementById(b);N&&this.removeStreamChildElement(N)})}),e&&c.all(this.container,`[${l}=${at}]`).filter(C=>this.view.ownsElement(C)).forEach(C=>{Array.from(C.children).forEach(x=>{this.removeStreamChildElement(x,!0)})}),q(r,s);let S=0;for(;w.length>0&&S<5;){let C=w.slice();w=[],C.forEach(x=>x()),S++}this.view.portalElementIds.forEach(C=>{let x=document.getElementById(C);x&&(document.getElementById(x.getAttribute(fe))||(x.remove(),this.onNodeDiscarded(x),this.view.dropPortalElementId(C)))})}),i.isDebugEnabled()&&(Vs(),Ws(this.streamInserts),Array.from(document.querySelectorAll("input[name=id]")).forEach(S=>{S instanceof HTMLInputElement&&S.form&&console.error(`Detected an input with name="id" inside a form! This will cause problems when patching the DOM. -`,S)})),v.length>0&&i.time("post-morph append/prepend restoration",()=>{v.forEach(S=>S.perform())}),i.silenceEvents(()=>c.restoreFocus(o,a,h)),c.dispatchEvent(document,"phx:update"),g.forEach(S=>this.trackAfter("added",S)),u.forEach(S=>this.trackAfter("updated",S)),this.transitionPendingRemoves(),O){i.unload();let S=c.private(O,"submitter");if(S&&S.name&&r.contains(S)){let C=document.createElement("input");C.type="hidden";let x=S.getAttribute("form");x&&C.setAttribute("form",x),C.name=S.name,C.value=S.value,S.parentElement.insertBefore(C,S)}Object.getPrototypeOf(O).submit.call(O)}return!0}onNodeDiscarded(e){(c.isPhxChild(e)||c.isPhxSticky(e))&&this.liveSocket.destroyViewByEl(e),this.trackAfter("discarded",e)}maybePendingRemove(e){return e.getAttribute&&e.getAttribute(this.phxRemove)!==null?(this.pendingRemoves.push(e),!0):!1}removeStreamChildElement(e,t=!1){!t&&!this.view.ownsElement(e)||(this.streamInserts[e.id]?(this.streamComponentRestore[e.id]=e,e.remove()):this.maybePendingRemove(e)||(e.remove(),this.onNodeDiscarded(e)))}getStreamInsert(e){return(e.id?this.streamInserts[e.id]:{})||{}}setStreamRef(e,t){c.putSticky(e,$e,i=>i.setAttribute($e,t))}maybeReOrderStream(e,t){let{ref:i,streamAt:s,reset:n}=this.getStreamInsert(e);if(s!==void 0&&(this.setStreamRef(e,i),!(!n&&!t)&&e.parentElement)){if(s===0)e.parentElement.insertBefore(e,e.parentElement.firstElementChild);else if(s>0){let r=Array.from(e.parentElement.children),o=r.indexOf(e);if(s>=r.length-1)e.parentElement.appendChild(e);else{let a=r[s];o>s?e.parentElement.insertBefore(e,a):e.parentElement.insertBefore(e,a.nextElementSibling)}}this.maybeLimitStream(e)}}maybeLimitStream(e){let{limit:t}=this.getStreamInsert(e),i=t!==null&&Array.from(e.parentElement.children);t&&t<0&&i.length>t*-1?i.slice(0,i.length+t).forEach(s=>this.removeStreamChildElement(s)):t&&t>=0&&i.length>t&&i.slice(t).forEach(s=>this.removeStreamChildElement(s))}transitionPendingRemoves(){let{pendingRemoves:e,liveSocket:t}=this;e.length>0&&t.transitionRemoves(e,()=>{e.forEach(i=>{let s=c.firstPhxChild(i);s&&t.destroyViewByEl(s),i.remove()}),this.trackAfter("transitionsDiscarded",e)})}isChangedSelect(e,t){return!(e instanceof HTMLSelectElement)||e.multiple?!1:e.options.length!==t.options.length?!0:(t.value=e.value,!e.isEqualNode(t))}isCIDPatch(){return this.cidPatch}skipCIDSibling(e){return e.nodeType===Node.ELEMENT_NODE&&e.hasAttribute(Li)}targetCIDContainer(e){if(!this.isCIDPatch())return;let[t,...i]=c.findComponentNodeList(this.view.id,this.targetCID);return i.length===0&&c.childNodeLength(e)===1?t:t&&t.parentNode}indexOf(e,t){return Array.from(e.children).indexOf(t)}teleport(e,t){let i=e.getAttribute(Bt),s=document.querySelector(i);if(!s)throw new Error("portal target with selector "+i+" not found");let n=e.content.firstElementChild;if(this.skipCIDSibling(n))return;if(!n?.id)throw new Error("phx-portal template must have a single root element with ID!");let r=document.getElementById(n.id),o;r?(s.contains(r)||s.appendChild(r),o=r):(o=document.createElement(n.tagName),s.appendChild(o)),n.setAttribute(Ee,this.view.id),n.setAttribute(fe,e.id),t(o,n,!0),n.removeAttribute(Ee),n.removeAttribute(fe),this.view.pushPortalElementId(n.id)}handleRuntimeHook(e,t){let i=e.getAttribute(ht),s=e.hasAttribute("nonce")?e.getAttribute("nonce"):null;if(e.hasAttribute("nonce")){let r=document.createElement("template");r.innerHTML=t,s=r.content.querySelector(`script[${ht}="${CSS.escape(i)}"]`).getAttribute("nonce")}let n=document.createElement("script");n.textContent=e.textContent,c.mergeAttrs(n,e,{isIgnored:!1}),s&&(n.nonce=s),e.replaceWith(n),e=n}},gn=new Set(["area","base","br","col","command","embed","hr","img","input","keygen","link","meta","param","source","track","wbr"]),vn=new Set(["'",'"']),Ai=(e,t,i)=>{let s=0,n=!1,r,o,a,h,l,d,p=e.match(/^(\s*(?:\s*)*)<([^\s\/>]+)/);if(p===null)throw new Error(`malformed html ${e}`);for(s=p[0].length,r=p[1],a=p[2],h=s,s;s";s++)if(e.charAt(s)==="="){let u=e.slice(s-3,s)===" id";s++;let v=e.charAt(s);if(vn.has(v)){let w=s;for(s++,s;s=r.length+a.length;){let u=e.charAt(m);if(n)u==="-"&&e.slice(m-3,m)===""&&e.slice(m-2,m)==="--")n=!0,m-=3;else{if(u===">")break;m-=1}}o=e.slice(m+1,e.length);let g=Object.keys(t).map(u=>t[u]===!0?u:`${u}="${t[u]}"`).join(" ");if(i){let u=l?` id="${l}"`:"";gn.has(a)?d=`<${a}${u}${g===""?"":" "}${g}/>`:d=`<${a}${u}${g===""?"":" "}${g}>`}else{let u=e.slice(h,m+1);d=`<${a}${g===""?"":" "}${g}${u}`}return[d,r,o]},Ci=class{static extract(e){let{[pi]:t,[fi]:i,[mi]:s}=e;return delete e[pi],delete e[fi],delete e[mi],{diff:e,title:s,reply:t||null,events:i||[]}}constructor(e,t){this.viewId=e,this.rendered={},this.magicId=0,this.mergeDiff(t)}parentViewId(){return this.viewId}toString(e){let{buffer:t,streams:i}=this.recursiveToString(this.rendered,this.rendered[$],e,!0,{});return{buffer:t,streams:i}}recursiveToString(e,t=e[$],i,s,n){i=i?new Set(i):null;let r={buffer:"",components:t,onlyCids:i,streams:new Set};return this.toOutputBuffer(e,null,r,s,n),{buffer:r.buffer,streams:r.streams}}componentCIDs(e){return Object.keys(e[$]||{}).map(t=>parseInt(t))}isComponentOnlyDiff(e){return e[$]?Object.keys(e).length===1:!1}getComponent(e,t){return e[$][t]}resetRender(e){this.rendered[$][e]&&(this.rendered[$][e].reset=!0)}mergeDiff(e){let t=e[$],i={};if(delete e[$],this.rendered=this.mutableMerge(this.rendered,e),this.rendered[$]=this.rendered[$]||{},t){let s=this.rendered[$];for(let n in t)t[n]=this.cachedFindComponent(n,t[n],s,t,i);for(let n in t)s[n]=t[n];e[$]=t}}cachedFindComponent(e,t,i,s,n){if(n[e])return n[e];{let r,o,a=t[V];if(ne(a)){let h;a>0?h=this.cachedFindComponent(a,s[a],i,s,n):h=i[-a],o=h[V],r=this.cloneMerge(h,t,!0),r[V]=o}else r=t[V]!==void 0||i[e]===void 0?t:this.cloneMerge(i[e],t,!1);return n[e]=r,r}}mutableMerge(e,t){return t[V]!==void 0?t:(this.doMutableMerge(e,t),e)}doMutableMerge(e,t){if(t[I])this.mergeKeyed(e,t);else for(let i in t){let s=t[i],n=e[i];xe(s)&&s[V]===void 0&&xe(n)?this.doMutableMerge(n,s):e[i]=s}e[Pt]&&(e.newRender=!0)}clone(e){return"structuredClone"in window?structuredClone(e):JSON.parse(JSON.stringify(e))}mergeKeyed(e,t){let i=this.clone(e);if(Object.entries(t[I]).forEach(([s,n])=>{if(s!==Y)if(Array.isArray(n)){let[r,o]=n;e[I][s]=i[I][r],this.doMutableMerge(e[I][s],o)}else if(typeof n=="number"){let r=n;e[I][s]=i[I][r]}else typeof n=="object"&&(e[I][s]||(e[I][s]={}),this.doMutableMerge(e[I][s],n))}),t[I][Y]delete this.rendered[$][t])}get(){return this.rendered}isNewFingerprint(e={}){return!!e[V]}templateStatic(e,t){return typeof e=="number"?t[e]:e}nextMagicID(){return this.magicId++,`m${this.magicId}-${this.parentViewId()}`}toOutputBuffer(e,t,i,s,n={}){if(e[I])return this.comprehensionToBuffer(e,t,i,s);e[de]&&(t=e[de],delete e[de]);let{[V]:r}=e;r=this.templateStatic(r,t),e[V]=r;let o=e[Pt],a=i.buffer;o&&(i.buffer=""),s&&o&&!e.magicId&&(e.newRender=!0,e.magicId=this.nextMagicID()),i.buffer+=r[0];for(let h=1;h0||l.length>0||d)&&(delete e[Pe],e[I]={[Y]:0},i.streams.add(o))}}dynamicToBuffer(e,t,i,s){if(typeof e=="number"){let{buffer:n,streams:r}=this.recursiveCIDToString(i.components,e,i.onlyCids);i.buffer+=n,i.streams=new Set([...i.streams,...r])}else xe(e)?this.toOutputBuffer(e,t,i,s,{}):i.buffer+=e}recursiveCIDToString(e,t,i){let s=e[t]||P(`no component for CID ${t}`,e),n={[Z]:t,[Le]:this.viewId},r=i&&!i.has(t);s.newRender=!r,s.magicId=`c${t}-${this.parentViewId()}`;let o=!s.reset,{buffer:a,streams:h}=this.recursiveToString(s,e,i,o,n);return delete s.reset,{buffer:a,streams:h}}},Ti=[],_i=200,bn={exec(e,t,i,s,n,r){let[o,a]=r||[null,{callback:r&&r.callback}];(i.charAt(0)==="["?JSON.parse(i):[[o,a]]).forEach(([l,d])=>{l===o&&(d={...a,...d},d.callback=d.callback||a.callback),this.filterToEls(s.liveSocket,n,d).forEach(p=>{this[`exec_${l}`](e,t,i,s,n,p,d)})})},isVisible(e){return!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length>0)},isInViewport(e){let t=e.getBoundingClientRect(),i=window.innerHeight||document.documentElement.clientHeight,s=window.innerWidth||document.documentElement.clientWidth;return t.right>0&&t.bottom>0&&t.left{a.done=p});s.liveSocket.asyncTransition(d)}c.dispatchEvent(r,o,{detail:a,bubbles:h})},exec_push(e,t,i,s,n,r,o){let{event:a,data:h,target:l,page_loading:d,loading:p,value:m,dispatcher:g,callback:u}=o,v={loading:p,value:m,target:l,page_loading:!!d,originalEvent:e},w=t==="change"&&g?g:n,O=l||w.getAttribute(s.binding("target"))||w,q=(S,C)=>{if(S.isConnected())if(t==="change"){let{newCid:x,_target:H}=o;H=H||(c.isFormInput(n)?n.name:void 0),H&&(v._target=H),S.pushInput(n,C,x,a||i,v,u)}else if(t==="submit"){let{submitter:x}=o;S.submitForm(n,C,a||i,x,v,u)}else S.pushEvent(t,n,C,a||i,h,v,u)};o.targetView&&o.targetCtx?q(o.targetView,o.targetCtx):s.withinTargets(O,q)},exec_navigate(e,t,i,s,n,r,{href:o,replace:a}){s.liveSocket.historyRedirect(e,o,a?"replace":"push",null,n)},exec_patch(e,t,i,s,n,r,{href:o,replace:a}){s.liveSocket.pushHistoryPatch(e,o,a?"replace":"push",n)},exec_focus(e,t,i,s,n,r){j.attemptFocus(r),window.requestAnimationFrame(()=>{window.requestAnimationFrame(()=>j.attemptFocus(r))})},exec_focus_first(e,t,i,s,n,r){j.focusFirstInteractive(r)||j.focusFirst(r),window.requestAnimationFrame(()=>{window.requestAnimationFrame(()=>j.focusFirstInteractive(r)||j.focusFirst(r))})},exec_push_focus(e,t,i,s,n,r){Ti.push(r||n)},exec_pop_focus(e,t,i,s,n,r){let o=Ti.pop();o&&(o.focus(),window.requestAnimationFrame(()=>{window.requestAnimationFrame(()=>o.focus())}))},exec_add_class(e,t,i,s,n,r,{names:o,transition:a,time:h,blocking:l}){this.addOrRemoveClasses(r,o,[],a,h,s,l)},exec_remove_class(e,t,i,s,n,r,{names:o,transition:a,time:h,blocking:l}){this.addOrRemoveClasses(r,[],o,a,h,s,l)},exec_toggle_class(e,t,i,s,n,r,{names:o,transition:a,time:h,blocking:l}){this.toggleClasses(r,o,a,h,s,l)},exec_toggle_attr(e,t,i,s,n,r,{attr:[o,a,h]}){this.toggleAttr(r,o,a,h)},exec_ignore_attrs(e,t,i,s,n,r,{attrs:o}){this.ignoreAttrs(r,o)},exec_transition(e,t,i,s,n,r,{time:o,transition:a,blocking:h}){this.addOrRemoveClasses(r,[],[],a,o,s,h)},exec_toggle(e,t,i,s,n,r,{display:o,ins:a,outs:h,time:l,blocking:d}){this.toggle(t,s,r,o,a,h,l,d)},exec_show(e,t,i,s,n,r,{display:o,transition:a,time:h,blocking:l}){this.show(t,s,r,o,a,h,l)},exec_hide(e,t,i,s,n,r,{display:o,transition:a,time:h,blocking:l}){this.hide(t,s,r,o,a,h,l)},exec_set_attr(e,t,i,s,n,r,{attr:[o,a]}){this.setOrRemoveAttrs(r,[[o,a]],[])},exec_remove_attr(e,t,i,s,n,r,{attr:o}){this.setOrRemoveAttrs(r,[],[o])},ignoreAttrs(e,t){c.putPrivate(e,"JS:ignore_attrs",{apply:(i,s)=>{let n=Array.from(i.attributes),r=n.map(o=>o.name);Array.from(s.attributes).filter(o=>!r.includes(o.name)).forEach(o=>{c.attributeIgnored(o,t)&&s.removeAttribute(o.name)}),n.forEach(o=>{c.attributeIgnored(o,t)&&s.setAttribute(o.name,o.value)})}})},onBeforeElUpdated(e,t){let i=c.private(e,"JS:ignore_attrs");i&&i.apply(e,t)},show(e,t,i,s,n,r,o){this.isVisible(i)||this.toggle(e,t,i,s,n,null,r,o)},hide(e,t,i,s,n,r,o){this.isVisible(i)&&this.toggle(e,t,i,s,null,n,r,o)},toggle(e,t,i,s,n,r,o,a){o=o||_i;let[h,l,d]=n||[[],[],[]],[p,m,g]=r||[[],[],[]];if(h.length>0||p.length>0)if(this.isVisible(i)){let u=()=>{this.addOrRemoveClasses(i,m,h.concat(l).concat(d)),window.requestAnimationFrame(()=>{this.addOrRemoveClasses(i,p,[]),window.requestAnimationFrame(()=>this.addOrRemoveClasses(i,g,m))})},v=()=>{this.addOrRemoveClasses(i,[],p.concat(g)),c.putSticky(i,"toggle",w=>w.style.display="none"),i.dispatchEvent(new Event("phx:hide-end"))};i.dispatchEvent(new Event("phx:hide-start")),a===!1?(u(),setTimeout(v,o)):t.transition(o,u,v)}else{if(e==="remove")return;let u=()=>{this.addOrRemoveClasses(i,l,p.concat(m).concat(g));let w=s||this.defaultDisplay(i);window.requestAnimationFrame(()=>{this.addOrRemoveClasses(i,h,[]),window.requestAnimationFrame(()=>{c.putSticky(i,"toggle",O=>O.style.display=w),this.addOrRemoveClasses(i,d,l)})})},v=()=>{this.addOrRemoveClasses(i,[],h.concat(d)),i.dispatchEvent(new Event("phx:show-end"))};i.dispatchEvent(new Event("phx:show-start")),a===!1?(u(),setTimeout(v,o)):t.transition(o,u,v)}else this.isVisible(i)?window.requestAnimationFrame(()=>{i.dispatchEvent(new Event("phx:hide-start")),c.putSticky(i,"toggle",u=>u.style.display="none"),i.dispatchEvent(new Event("phx:hide-end"))}):window.requestAnimationFrame(()=>{i.dispatchEvent(new Event("phx:show-start"));let u=s||this.defaultDisplay(i);c.putSticky(i,"toggle",v=>v.style.display=u),i.dispatchEvent(new Event("phx:show-end"))})},toggleClasses(e,t,i,s,n,r){window.requestAnimationFrame(()=>{let[o,a]=c.getSticky(e,"classes",[[],[]]),h=t.filter(d=>o.indexOf(d)<0&&!e.classList.contains(d)),l=t.filter(d=>a.indexOf(d)<0&&e.classList.contains(d));this.addOrRemoveClasses(e,h,l,i,s,n,r)})},toggleAttr(e,t,i,s){e.hasAttribute(t)?s!==void 0?e.getAttribute(t)===i?this.setOrRemoveAttrs(e,[[t,s]],[]):this.setOrRemoveAttrs(e,[[t,i]],[]):this.setOrRemoveAttrs(e,[],[t]):this.setOrRemoveAttrs(e,[[t,i]],[])},addOrRemoveClasses(e,t,i,s,n,r,o){n=n||_i;let[a,h,l]=s||[[],[],[]];if(a.length>0){let d=()=>{this.addOrRemoveClasses(e,h,[].concat(a).concat(l)),window.requestAnimationFrame(()=>{this.addOrRemoveClasses(e,a,[]),window.requestAnimationFrame(()=>this.addOrRemoveClasses(e,l,h))})},p=()=>this.addOrRemoveClasses(e,t.concat(l),i.concat(a).concat(h));o===!1?(d(),setTimeout(p,n)):r.transition(n,d,p);return}window.requestAnimationFrame(()=>{let[d,p]=c.getSticky(e,"classes",[[],[]]),m=t.filter(w=>d.indexOf(w)<0&&!e.classList.contains(w)),g=i.filter(w=>p.indexOf(w)<0&&e.classList.contains(w)),u=d.filter(w=>i.indexOf(w)<0).concat(m),v=p.filter(w=>t.indexOf(w)<0).concat(g);c.putSticky(e,"classes",w=>(w.classList.remove(...v),w.classList.add(...u),[u,v]))})},setOrRemoveAttrs(e,t,i){let[s,n]=c.getSticky(e,"attrs",[[],[]]),r=t.map(([h,l])=>h).concat(i),o=s.filter(([h,l])=>!r.includes(h)).concat(t),a=n.filter(h=>!r.includes(h)).concat(i);c.putSticky(e,"attrs",h=>(a.forEach(l=>h.removeAttribute(l)),o.forEach(([l,d])=>h.setAttribute(l,d)),[o,a]))},hasAllClasses(e,t){return t.every(i=>e.classList.contains(i))},isToggledOut(e,t){return!this.isVisible(e)||this.hasAllClasses(e,t)},filterToEls(e,t,{to:i}){let s=()=>{if(typeof i=="string")return document.querySelectorAll(i);if(i.closest){let n=t.closest(i.closest);return n?[n]:[]}else if(i.inner)return t.querySelectorAll(i.inner)};return i?e.jsQuerySelectorAll(t,i,s):[t]},defaultDisplay(e){return{tr:"table-row",td:"table-cell"}[e.tagName.toLowerCase()]||"block"},transitionClasses(e){if(!e)return null;let[t,i,s]=Array.isArray(e)?e:[e.split(" "),[],[]];return t=Array.isArray(t)?t:t.split(" "),i=Array.isArray(i)?i:i.split(" "),s=Array.isArray(s)?s:s.split(" "),[t,i,s]}},A=bn,Ni=(e,t)=>({exec(i,s){e.execJS(i,s,t)},show(i,s={}){let n=e.owner(i);A.show(t,n,i,s.display,A.transitionClasses(s.transition),s.time,s.blocking)},hide(i,s={}){let n=e.owner(i);A.hide(t,n,i,null,A.transitionClasses(s.transition),s.time,s.blocking)},toggle(i,s={}){let n=e.owner(i),r=A.transitionClasses(s.in),o=A.transitionClasses(s.out);A.toggle(t,n,i,s.display,r,o,s.time,s.blocking)},addClass(i,s,n={}){let r=Array.isArray(s)?s:s.split(" "),o=e.owner(i);A.addOrRemoveClasses(i,r,[],A.transitionClasses(n.transition),n.time,o,n.blocking)},removeClass(i,s,n={}){let r=Array.isArray(s)?s:s.split(" "),o=e.owner(i);A.addOrRemoveClasses(i,[],r,A.transitionClasses(n.transition),n.time,o,n.blocking)},toggleClass(i,s,n={}){let r=Array.isArray(s)?s:s.split(" "),o=e.owner(i);A.toggleClasses(i,r,A.transitionClasses(n.transition),n.time,o,n.blocking)},transition(i,s,n={}){let r=e.owner(i);A.addOrRemoveClasses(i,[],[],A.transitionClasses(s),n.time,r,n.blocking)},setAttribute(i,s,n){A.setOrRemoveAttrs(i,[[s,n]],[])},removeAttribute(i,s){A.setOrRemoveAttrs(i,[],[s])},toggleAttribute(i,s,n,r){A.toggleAttr(i,s,n,r)},push(i,s,n={}){e.withinOwners(i,r=>{let o=n.value||{};delete n.value;let a=new CustomEvent("phx:exec",{detail:{sourceElement:i}});A.exec(a,t,s,r,i,["push",{data:o,...n}])})},navigate(i,s={}){let n=new CustomEvent("phx:exec");e.historyRedirect(n,i,s.replace?"replace":"push",null,null)},patch(i,s={}){let n=new CustomEvent("phx:exec");e.pushHistoryPatch(n,i,s.replace?"replace":"push",null)},ignoreAttributes(i,s){A.ignoreAttrs(i,Array.isArray(s)?s:[s])}}),Rt="hookId",Pi="deadHook",wn=1,ge=class $i{get liveSocket(){return this.__liveSocket()}static makeID(){return wn++}static elementID(t){return c.private(t,Rt)}static deadHook(t){return c.private(t,Pi)===!0}constructor(t,i,s){if(this.el=i,this.__attachView(t),this.__listeners=new Set,this.__isDisconnected=!1,c.putPrivate(this.el,Rt,$i.makeID()),t&&t.isDead&&c.putPrivate(this.el,Pi,!0),s){let n=new Set(["el","liveSocket","__view","__listeners","__isDisconnected","constructor","js","pushEvent","pushEventTo","handleEvent","removeHandleEvent","upload","uploadTo","__mounted","__updated","__beforeUpdate","__destroyed","__reconnected","__disconnected","__cleanup__"]);for(let o in s)Object.prototype.hasOwnProperty.call(s,o)&&(this[o]=s[o],n.has(o)&&console.warn(`Hook object for element #${i.id} overwrites core property '${o}'!`));["mounted","beforeUpdate","updated","destroyed","disconnected","reconnected"].forEach(o=>{s[o]&&typeof s[o]=="function"&&(this[o]=s[o])})}}__attachView(t){t?(this.__view=()=>t,this.__liveSocket=()=>t.liveSocket):(this.__view=()=>{throw new Error(`hook not yet attached to a live view: ${this.el.outerHTML}`)},this.__liveSocket=()=>{throw new Error(`hook not yet attached to a live view: ${this.el.outerHTML}`)})}mounted(){}beforeUpdate(){}updated(){}destroyed(){}disconnected(){}reconnected(){}__mounted(){this.mounted()}__updated(){this.updated()}__beforeUpdate(){this.beforeUpdate()}__destroyed(){this.destroyed(),c.deletePrivate(this.el,Rt)}__reconnected(){this.__isDisconnected&&(this.__isDisconnected=!1,this.reconnected())}__disconnected(){this.__isDisconnected=!0,this.disconnected()}js(){return{...Ni(this.__view().liveSocket,"hook"),exec:t=>{this.__view().liveSocket.execJS(this.el,t,"hook")}}}pushEvent(t,i,s){let n=this.__view().pushHookEvent(this.el,null,t,i||{});if(s===void 0)return n.then(({reply:r})=>r);n.then(({reply:r,ref:o})=>s(r,o)).catch(()=>{})}pushEventTo(t,i,s,n){if(n===void 0){let r=[];this.__view().withinTargets(t,(a,h)=>{r.push({view:a,targetCtx:h})});let o=r.map(({view:a,targetCtx:h})=>a.pushHookEvent(this.el,h,i,s||{}));return Promise.allSettled(o)}this.__view().withinTargets(t,(r,o)=>{r.pushHookEvent(this.el,o,i,s||{}).then(({reply:a,ref:h})=>n(a,h)).catch(()=>{})})}handleEvent(t,i){let s={event:t,callback:n=>i(n.detail)};return window.addEventListener(`phx:${t}`,s.callback),this.__listeners.add(s),s}removeHandleEvent(t){window.removeEventListener(`phx:${t.event}`,t.callback),this.__listeners.delete(t)}upload(t,i){return this.__view().dispatchUploads(null,t,i)}uploadTo(t,i,s){return this.__view().withinTargets(t,(n,r)=>{n.dispatchUploads(r,i,s)})}__cleanup__(){this.__listeners.forEach(t=>this.removeHandleEvent(t))}},yn=(e,t)=>{let i=e.endsWith("[]"),s=i?e.slice(0,-2):e;return s=s.replace(/([^\[\]]+)(\]?$)/,`${t}$1$2`),i&&(s+="[]"),s},rt=(e,t,i=[])=>{let{submitter:s}=t,n;if(s&&s.name){let d=document.createElement("input");d.type="hidden";let p=s.getAttribute("form");p&&d.setAttribute("form",p),d.name=s.name,d.value=s.value,s.parentElement.insertBefore(d,s),n=d}let r=new FormData(e),o=[];r.forEach((d,p,m)=>{d instanceof File&&o.push(p)}),o.forEach(d=>r.delete(d));let a=new URLSearchParams,{inputsUnused:h,onlyHiddenInputs:l}=Array.from(e.elements).reduce((d,p)=>{let{inputsUnused:m,onlyHiddenInputs:g}=d,u=p.name;if(!u)return d;m[u]===void 0&&(m[u]=!0),g[u]===void 0&&(g[u]=!0);let v=c.private(p,ct)||c.private(p,We),w=p.type==="hidden";return m[u]=m[u]&&!v,g[u]=g[u]&&w,d},{inputsUnused:{},onlyHiddenInputs:{}});for(let[d,p]of r.entries())if(i.length===0||i.indexOf(d)>=0){let m=h[d],g=l[d];m&&!(s&&s.name==d)&&!g&&a.append(yn(d,"_unused_"),""),typeof p=="string"&&a.append(d,p)}return s&&n&&s.parentElement.removeChild(n),a.toString()},En=class Fi{static closestView(t){let i=t.closest(qe);return i?c.private(i,"view"):null}constructor(t,i,s,n,r){this.isDead=!1,this.liveSocket=i,this.flash=n,this.parent=s,this.root=s?s.root:this,this.el=t;let o=c.private(this.el,"view");if(o!==void 0&&o.isDead!==!0)throw P(`The DOM element for this view has already been bound to a view. +` + ); + } + toRemove.push(childNode); + } + }); + toRemove.forEach((childNode) => childNode.remove()); + } + }, + replaceRootContainer(container, tagName, attrs) { + const retainedAttrs = /* @__PURE__ */ new Set([ + "id", + PHX_SESSION, + PHX_STATIC, + PHX_MAIN, + PHX_ROOT_ID + ]); + if (container.tagName.toLowerCase() === tagName.toLowerCase()) { + Array.from(container.attributes).filter((attr) => !retainedAttrs.has(attr.name.toLowerCase())).forEach((attr) => container.removeAttribute(attr.name)); + Object.keys(attrs).filter((name) => !retainedAttrs.has(name.toLowerCase())).forEach((attr) => container.setAttribute(attr, attrs[attr])); + return container; + } else { + const newContainer = document.createElement(tagName); + Object.keys(attrs).forEach( + (attr) => newContainer.setAttribute(attr, attrs[attr]) + ); + retainedAttrs.forEach( + (attr) => newContainer.setAttribute(attr, container.getAttribute(attr)) + ); + newContainer.innerHTML = container.innerHTML; + container.replaceWith(newContainer); + return newContainer; + } + }, + getSticky(el, name, defaultVal) { + const op = (DOM.private(el, "sticky") || []).find( + ([existingName]) => name === existingName + ); + if (op) { + const [_name, _op, stashedResult] = op; + return stashedResult; + } else { + return typeof defaultVal === "function" ? defaultVal() : defaultVal; + } + }, + deleteSticky(el, name) { + this.updatePrivate(el, "sticky", [], (ops) => { + return ops.filter(([existingName, _]) => existingName !== name); + }); + }, + putSticky(el, name, op) { + const stashedResult = op(el); + this.updatePrivate(el, "sticky", [], (ops) => { + const existingIndex = ops.findIndex( + ([existingName]) => name === existingName + ); + if (existingIndex >= 0) { + ops[existingIndex] = [name, op, stashedResult]; + } else { + ops.push([name, op, stashedResult]); + } + return ops; + }); + }, + applyStickyOperations(el) { + const ops = DOM.private(el, "sticky"); + if (!ops) { + return; + } + ops.forEach(([name, op, _stashed]) => this.putSticky(el, name, op)); + }, + isLocked(el) { + return el.hasAttribute && el.hasAttribute(PHX_REF_LOCK); + }, + attributeIgnored(attribute, ignoredAttributes) { + return ignoredAttributes.some( + (toIgnore) => attribute.name == toIgnore || toIgnore === "*" || toIgnore.includes("*") && attribute.name.match(toIgnore) != null + ); + } + }; + var dom_default = DOM; + var UploadEntry = class { + static isActive(fileEl, file) { + const isNew = file._phxRef === void 0; + const activeRefs = fileEl.getAttribute(PHX_ACTIVE_ENTRY_REFS).split(","); + const isActive = activeRefs.indexOf(LiveUploader.genFileRef(file)) >= 0; + return file.size > 0 && (isNew || isActive); + } + static isPreflighted(fileEl, file) { + const preflightedRefs = fileEl.getAttribute(PHX_PREFLIGHTED_REFS).split(","); + const isPreflighted = preflightedRefs.indexOf(LiveUploader.genFileRef(file)) >= 0; + return isPreflighted && this.isActive(fileEl, file); + } + static isPreflightInProgress(file) { + return file._preflightInProgress === true; + } + static markPreflightInProgress(file) { + file._preflightInProgress = true; + } + constructor(fileEl, file, view, autoUpload) { + this.ref = LiveUploader.genFileRef(file); + this.fileEl = fileEl; + this.file = file; + this.view = view; + this.meta = null; + this._isCancelled = false; + this._isDone = false; + this._progress = 0; + this._lastProgressSent = -1; + this._onDone = function() { + }; + this._onElUpdated = this.onElUpdated.bind(this); + this.fileEl.addEventListener(PHX_LIVE_FILE_UPDATED, this._onElUpdated); + this.autoUpload = autoUpload; + } + metadata() { + return this.meta; + } + progress(progress) { + this._progress = Math.floor(progress); + if (this._progress > this._lastProgressSent) { + if (this._progress >= 100) { + this._progress = 100; + this._lastProgressSent = 100; + this._isDone = true; + this.view.pushFileProgress(this.fileEl, this.ref, 100, () => { + LiveUploader.untrackFile(this.fileEl, this.file); + this._onDone(); + }); + } else { + this._lastProgressSent = this._progress; + this.view.pushFileProgress(this.fileEl, this.ref, this._progress); + } + } + } + isCancelled() { + return this._isCancelled; + } + cancel() { + this.file._preflightInProgress = false; + this._isCancelled = true; + this._isDone = true; + this._onDone(); + } + isDone() { + return this._isDone; + } + error(reason = "failed") { + this.fileEl.removeEventListener(PHX_LIVE_FILE_UPDATED, this._onElUpdated); + this.view.pushFileProgress(this.fileEl, this.ref, { error: reason }); + if (!this.isAutoUpload()) { + LiveUploader.clearFiles(this.fileEl); + } + } + isAutoUpload() { + return this.autoUpload; + } + //private + onDone(callback) { + this._onDone = () => { + this.fileEl.removeEventListener(PHX_LIVE_FILE_UPDATED, this._onElUpdated); + callback(); + }; + } + onElUpdated() { + const activeRefs = this.fileEl.getAttribute(PHX_ACTIVE_ENTRY_REFS).split(","); + if (activeRefs.indexOf(this.ref) === -1) { + LiveUploader.untrackFile(this.fileEl, this.file); + this.cancel(); + } + } + toPreflightPayload() { + return { + last_modified: this.file.lastModified, + name: this.file.name, + relative_path: this.file.webkitRelativePath, + size: this.file.size, + type: this.file.type, + ref: this.ref, + meta: typeof this.file.meta === "function" ? this.file.meta() : void 0 + }; + } + uploader(uploaders) { + if (this.meta.uploader) { + const callback = uploaders[this.meta.uploader] || logError(`no uploader configured for ${this.meta.uploader}`); + return { name: this.meta.uploader, callback }; + } else { + return { name: "channel", callback: channelUploader }; + } + } + zipPostFlight(resp) { + this.meta = resp.entries[this.ref]; + if (!this.meta) { + logError(`no preflight upload response returned with ref ${this.ref}`, { + input: this.fileEl, + response: resp + }); + } + } + }; + var liveUploaderFileRef = 0; + var LiveUploader = class _LiveUploader { + static genFileRef(file) { + const ref = file._phxRef; + if (ref !== void 0) { + return ref; + } else { + file._phxRef = (liveUploaderFileRef++).toString(); + return file._phxRef; + } + } + static getEntryDataURL(inputEl, ref, callback) { + const file = this.activeFiles(inputEl).find( + (file2) => this.genFileRef(file2) === ref + ); + callback(URL.createObjectURL(file)); + } + static hasUploadsInProgress(formEl) { + let active = 0; + dom_default.findUploadInputs(formEl).forEach((input) => { + if (input.getAttribute(PHX_PREFLIGHTED_REFS) !== input.getAttribute(PHX_DONE_REFS)) { + active++; + } + }); + return active > 0; + } + static serializeUploads(inputEl) { + const files = this.activeFiles(inputEl); + const fileData = {}; + files.forEach((file) => { + const entry = { path: inputEl.name }; + const uploadRef = inputEl.getAttribute(PHX_UPLOAD_REF); + fileData[uploadRef] = fileData[uploadRef] || []; + entry.ref = this.genFileRef(file); + entry.last_modified = file.lastModified; + entry.name = file.name || entry.ref; + entry.relative_path = file.webkitRelativePath; + entry.type = file.type; + entry.size = file.size; + if (typeof file.meta === "function") { + entry.meta = file.meta(); + } + fileData[uploadRef].push(entry); + }); + return fileData; + } + static clearFiles(inputEl) { + inputEl.value = null; + inputEl.removeAttribute(PHX_UPLOAD_REF); + dom_default.putPrivate(inputEl, "files", []); + } + static untrackFile(inputEl, file) { + dom_default.putPrivate( + inputEl, + "files", + dom_default.private(inputEl, "files").filter((f) => !Object.is(f, file)) + ); + } + /** + * @param {HTMLInputElement} inputEl + * @param {Array} files + * @param {DataTransfer} [dataTransfer] + */ + static trackFiles(inputEl, files, dataTransfer) { + if (inputEl.getAttribute("multiple") !== null) { + const newFiles = files.filter( + (file) => !this.activeFiles(inputEl).find((f) => Object.is(f, file)) + ); + dom_default.updatePrivate( + inputEl, + "files", + [], + (existing) => existing.concat(newFiles) + ); + inputEl.value = null; + } else { + if (dataTransfer && dataTransfer.files.length > 0) { + inputEl.files = dataTransfer.files; + } + dom_default.putPrivate(inputEl, "files", files); + } + } + static activeFileInputs(formEl) { + const fileInputs = dom_default.findUploadInputs(formEl); + return Array.from(fileInputs).filter( + (el) => el.files && this.activeFiles(el).length > 0 + ); + } + static activeFiles(input) { + return (dom_default.private(input, "files") || []).filter( + (f) => UploadEntry.isActive(input, f) + ); + } + static inputsAwaitingPreflight(formEl) { + const fileInputs = dom_default.findUploadInputs(formEl); + return Array.from(fileInputs).filter( + (input) => this.filesAwaitingPreflight(input).length > 0 + ); + } + static filesAwaitingPreflight(input) { + return this.activeFiles(input).filter( + (f) => !UploadEntry.isPreflighted(input, f) && !UploadEntry.isPreflightInProgress(f) + ); + } + static markPreflightInProgress(entries) { + entries.forEach((entry) => UploadEntry.markPreflightInProgress(entry.file)); + } + constructor(inputEl, view, onComplete) { + this.autoUpload = dom_default.isAutoUpload(inputEl); + this.view = view; + this.onComplete = onComplete; + this._entries = Array.from( + _LiveUploader.filesAwaitingPreflight(inputEl) || [] + ).map((file) => new UploadEntry(inputEl, file, view, this.autoUpload)); + _LiveUploader.markPreflightInProgress(this._entries); + this.numEntriesInProgress = this._entries.length; + } + isAutoUpload() { + return this.autoUpload; + } + entries() { + return this._entries; + } + initAdapterUpload(resp, onError, liveSocket) { + this._entries = this._entries.map((entry) => { + if (entry.isCancelled()) { + this.numEntriesInProgress--; + if (this.numEntriesInProgress === 0) { + this.onComplete(); + } + } else { + entry.zipPostFlight(resp); + entry.onDone(() => { + this.numEntriesInProgress--; + if (this.numEntriesInProgress === 0) { + this.onComplete(); + } + }); + } + return entry; + }); + const groupedEntries = this._entries.reduce((acc, entry) => { + if (!entry.meta) { + return acc; + } + const { name, callback } = entry.uploader(liveSocket.uploaders); + acc[name] = acc[name] || { callback, entries: [] }; + acc[name].entries.push(entry); + return acc; + }, {}); + for (const name in groupedEntries) { + const { callback, entries } = groupedEntries[name]; + callback(entries, onError, resp, liveSocket); + } + } + }; + var ARIA = { + anyOf(instance, classes) { + return classes.find((name) => instance instanceof name); + }, + isFocusable(el, interactiveOnly) { + return el instanceof HTMLAnchorElement && el.rel !== "ignore" || el instanceof HTMLAreaElement && el.href !== void 0 || !el.disabled && this.anyOf(el, [ + HTMLInputElement, + HTMLSelectElement, + HTMLTextAreaElement, + HTMLButtonElement + ]) || el instanceof HTMLIFrameElement || el.tabIndex >= 0 && el.getAttribute("aria-hidden") !== "true" || !interactiveOnly && el.getAttribute("tabindex") !== null && el.getAttribute("aria-hidden") !== "true"; + }, + attemptFocus(el, interactiveOnly) { + if (this.isFocusable(el, interactiveOnly)) { + try { + el.focus(); + } catch { + } + } + return !!document.activeElement && document.activeElement.isSameNode(el); + }, + focusFirstInteractive(el) { + let child = el.firstElementChild; + while (child) { + if (this.attemptFocus(child, true) || this.focusFirstInteractive(child)) { + return true; + } + child = child.nextElementSibling; + } + }, + focusFirst(el) { + let child = el.firstElementChild; + while (child) { + if (this.attemptFocus(child) || this.focusFirst(child)) { + return true; + } + child = child.nextElementSibling; + } + }, + focusLast(el) { + let child = el.lastElementChild; + while (child) { + if (this.attemptFocus(child) || this.focusLast(child)) { + return true; + } + child = child.previousElementSibling; + } + } + }; + var aria_default = ARIA; + var Hooks = { + LiveFileUpload: { + activeRefs() { + return this.el.getAttribute(PHX_ACTIVE_ENTRY_REFS); + }, + preflightedRefs() { + return this.el.getAttribute(PHX_PREFLIGHTED_REFS); + }, + mounted() { + this.js().ignoreAttributes(this.el, ["value"]); + this.preflightedWas = this.preflightedRefs(); + }, + updated() { + const newPreflights = this.preflightedRefs(); + if (this.preflightedWas !== newPreflights) { + this.preflightedWas = newPreflights; + if (newPreflights === "") { + this.__view().cancelSubmit(this.el.form); + } + } + if (this.activeRefs() === "") { + this.el.value = null; + } + this.el.dispatchEvent(new CustomEvent(PHX_LIVE_FILE_UPDATED)); + } + }, + LiveImgPreview: { + mounted() { + this.ref = this.el.getAttribute("data-phx-entry-ref"); + this.inputEl = document.getElementById( + this.el.getAttribute(PHX_UPLOAD_REF) + ); + LiveUploader.getEntryDataURL(this.inputEl, this.ref, (url) => { + this.url = url; + this.el.src = url; + }); + }, + destroyed() { + URL.revokeObjectURL(this.url); + } + }, + FocusWrap: { + mounted() { + this.focusStart = this.el.firstElementChild; + this.focusEnd = this.el.lastElementChild; + this.focusStart.addEventListener("focus", (e) => { + if (!e.relatedTarget || !this.el.contains(e.relatedTarget)) { + const nextFocus = e.target.nextElementSibling; + aria_default.attemptFocus(nextFocus) || aria_default.focusFirst(nextFocus); + } else { + aria_default.focusLast(this.el); + } + }); + this.focusEnd.addEventListener("focus", (e) => { + if (!e.relatedTarget || !this.el.contains(e.relatedTarget)) { + const nextFocus = e.target.previousElementSibling; + aria_default.attemptFocus(nextFocus) || aria_default.focusLast(nextFocus); + } else { + aria_default.focusFirst(this.el); + } + }); + if (!this.el.contains(document.activeElement)) { + this.el.addEventListener("phx:show-end", () => this.el.focus()); + if (window.getComputedStyle(this.el).display !== "none") { + aria_default.focusFirst(this.el); + } + } + } + } + }; + var findScrollContainer = (el) => { + if (["HTML", "BODY"].indexOf(el.nodeName.toUpperCase()) >= 0) + return null; + if (["scroll", "auto"].indexOf(getComputedStyle(el).overflowY) >= 0) + return el; + return findScrollContainer(el.parentElement); + }; + var scrollTop = (scrollContainer) => { + if (scrollContainer) { + return scrollContainer.scrollTop; + } else { + return document.documentElement.scrollTop || document.body.scrollTop; + } + }; + var bottom = (scrollContainer) => { + if (scrollContainer) { + return scrollContainer.getBoundingClientRect().bottom; + } else { + return window.innerHeight || document.documentElement.clientHeight; + } + }; + var top = (scrollContainer) => { + if (scrollContainer) { + return scrollContainer.getBoundingClientRect().top; + } else { + return 0; + } + }; + var isAtViewportTop = (el, scrollContainer) => { + const rect = el.getBoundingClientRect(); + return Math.ceil(rect.top) >= top(scrollContainer) && Math.ceil(rect.left) >= 0 && Math.floor(rect.top) <= bottom(scrollContainer); + }; + var isAtViewportBottom = (el, scrollContainer) => { + const rect = el.getBoundingClientRect(); + return Math.ceil(rect.bottom) >= top(scrollContainer) && Math.ceil(rect.left) >= 0 && Math.floor(rect.bottom) <= bottom(scrollContainer); + }; + var isWithinViewport = (el, scrollContainer) => { + const rect = el.getBoundingClientRect(); + return Math.ceil(rect.top) >= top(scrollContainer) && Math.ceil(rect.left) >= 0 && Math.floor(rect.top) <= bottom(scrollContainer); + }; + Hooks.InfiniteScroll = { + mounted() { + this.scrollContainer = findScrollContainer(this.el); + let scrollBefore = scrollTop(this.scrollContainer); + let topOverran = false; + const throttleInterval = 500; + let pendingOp = null; + const onTopOverrun = this.throttle( + throttleInterval, + (topEvent, firstChild) => { + pendingOp = () => true; + this.liveSocket.js().push(this.el, topEvent, { + value: { id: firstChild.id, _overran: true }, + callback: () => { + pendingOp = null; + } + }); + } + ); + const onFirstChildAtTop = this.throttle( + throttleInterval, + (topEvent, firstChild) => { + pendingOp = () => firstChild.scrollIntoView({ block: "start" }); + this.liveSocket.js().push(this.el, topEvent, { + value: { id: firstChild.id }, + callback: () => { + pendingOp = null; + window.requestAnimationFrame(() => { + if (!isWithinViewport(firstChild, this.scrollContainer)) { + firstChild.scrollIntoView({ block: "start" }); + } + }); + } + }); + } + ); + const onLastChildAtBottom = this.throttle( + throttleInterval, + (bottomEvent, lastChild) => { + pendingOp = () => lastChild.scrollIntoView({ block: "end" }); + this.liveSocket.js().push(this.el, bottomEvent, { + value: { id: lastChild.id }, + callback: () => { + pendingOp = null; + window.requestAnimationFrame(() => { + if (!isWithinViewport(lastChild, this.scrollContainer)) { + lastChild.scrollIntoView({ block: "end" }); + } + }); + } + }); + } + ); + this.onScroll = (_e) => { + const scrollNow = scrollTop(this.scrollContainer); + if (pendingOp) { + scrollBefore = scrollNow; + return pendingOp(); + } + const rect = this.findOverrunTarget(); + const topEvent = this.el.getAttribute( + this.liveSocket.binding("viewport-top") + ); + const bottomEvent = this.el.getAttribute( + this.liveSocket.binding("viewport-bottom") + ); + const lastChild = this.el.lastElementChild; + const firstChild = this.el.firstElementChild; + const isScrollingUp = scrollNow < scrollBefore; + const isScrollingDown = scrollNow > scrollBefore; + if (isScrollingUp && topEvent && !topOverran && rect.top >= 0) { + topOverran = true; + onTopOverrun(topEvent, firstChild); + } else if (isScrollingDown && topOverran && rect.top <= 0) { + topOverran = false; + } + if (topEvent && isScrollingUp && isAtViewportTop(firstChild, this.scrollContainer)) { + onFirstChildAtTop(topEvent, firstChild); + } else if (bottomEvent && isScrollingDown && isAtViewportBottom(lastChild, this.scrollContainer)) { + onLastChildAtBottom(bottomEvent, lastChild); + } + scrollBefore = scrollNow; + }; + if (this.scrollContainer) { + this.scrollContainer.addEventListener("scroll", this.onScroll); + } else { + window.addEventListener("scroll", this.onScroll); + } + }, + destroyed() { + if (this.scrollContainer) { + this.scrollContainer.removeEventListener("scroll", this.onScroll); + } else { + window.removeEventListener("scroll", this.onScroll); + } + }, + throttle(interval, callback) { + let lastCallAt = 0; + let timer; + return (...args) => { + const now = Date.now(); + const remainingTime = interval - (now - lastCallAt); + if (remainingTime <= 0 || remainingTime > interval) { + if (timer) { + clearTimeout(timer); + timer = null; + } + lastCallAt = now; + callback(...args); + } else if (!timer) { + timer = setTimeout(() => { + lastCallAt = Date.now(); + timer = null; + callback(...args); + }, remainingTime); + } + }; + }, + findOverrunTarget() { + let rect; + const overrunTarget = this.el.getAttribute( + this.liveSocket.binding(PHX_VIEWPORT_OVERRUN_TARGET) + ); + if (overrunTarget) { + const overrunEl = document.getElementById(overrunTarget); + if (overrunEl) { + rect = overrunEl.getBoundingClientRect(); + } else { + throw new Error("did not find element with id " + overrunTarget); + } + } else { + rect = this.el.getBoundingClientRect(); + } + return rect; + } + }; + var hooks_default = Hooks; + var ElementRef = class { + static onUnlock(el, callback) { + if (!dom_default.isLocked(el) && !el.closest(`[${PHX_REF_LOCK}]`)) { + return callback(); + } + const closestLock = el.closest(`[${PHX_REF_LOCK}]`); + const ref = closestLock.closest(`[${PHX_REF_LOCK}]`).getAttribute(PHX_REF_LOCK); + closestLock.addEventListener( + `phx:undo-lock:${ref}`, + () => { + callback(); + }, + { once: true } + ); + } + constructor(el) { + this.el = el; + this.loadingRef = el.hasAttribute(PHX_REF_LOADING) ? parseInt(el.getAttribute(PHX_REF_LOADING), 10) : null; + this.lockRef = el.hasAttribute(PHX_REF_LOCK) ? parseInt(el.getAttribute(PHX_REF_LOCK), 10) : null; + } + // public + maybeUndo(ref, phxEvent, eachCloneCallback) { + if (!this.isWithin(ref)) { + dom_default.updatePrivate(this.el, PHX_PENDING_REFS, [], (pendingRefs) => { + pendingRefs.push(ref); + return pendingRefs; + }); + return; + } + this.undoLocks(ref, phxEvent, eachCloneCallback); + this.undoLoading(ref, phxEvent); + dom_default.updatePrivate(this.el, PHX_PENDING_REFS, [], (pendingRefs) => { + return pendingRefs.filter((pendingRef) => { + let opts = { + detail: { ref: pendingRef, event: phxEvent }, + bubbles: true, + cancelable: false + }; + if (this.loadingRef && this.loadingRef > pendingRef) { + this.el.dispatchEvent( + new CustomEvent(`phx:undo-loading:${pendingRef}`, opts) + ); + } + if (this.lockRef && this.lockRef > pendingRef) { + this.el.dispatchEvent( + new CustomEvent(`phx:undo-lock:${pendingRef}`, opts) + ); + } + return pendingRef > ref; + }); + }); + if (this.isFullyResolvedBy(ref)) { + this.el.removeAttribute(PHX_REF_SRC); + } + } + // private + isWithin(ref) { + return !(this.loadingRef !== null && this.loadingRef > ref && this.lockRef !== null && this.lockRef > ref); + } + // Check for cloned PHX_REF_LOCK element that has been morphed behind + // the scenes while this element was locked in the DOM. + // When we apply the cloned tree to the active DOM element, we must + // + // 1. execute pending mounted hooks for nodes now in the DOM + // 2. undo any ref inside the cloned tree that has since been ack'd + undoLocks(ref, phxEvent, eachCloneCallback) { + if (!this.isLockUndoneBy(ref)) { + return; + } + const clonedTree = dom_default.private(this.el, PHX_REF_LOCK); + if (clonedTree) { + eachCloneCallback(clonedTree); + dom_default.deletePrivate(this.el, PHX_REF_LOCK); + } + this.el.removeAttribute(PHX_REF_LOCK); + const opts = { + detail: { ref, event: phxEvent }, + bubbles: true, + cancelable: false + }; + this.el.dispatchEvent( + new CustomEvent(`phx:undo-lock:${this.lockRef}`, opts) + ); + } + undoLoading(ref, phxEvent) { + if (!this.isLoadingUndoneBy(ref)) { + if (this.canUndoLoading(ref) && this.el.classList.contains("phx-submit-loading")) { + this.el.classList.remove("phx-change-loading"); + } + return; + } + if (this.canUndoLoading(ref)) { + this.el.removeAttribute(PHX_REF_LOADING); + const disabledVal = this.el.getAttribute(PHX_DISABLED); + const readOnlyVal = this.el.getAttribute(PHX_READONLY); + if (readOnlyVal !== null) { + this.el.readOnly = readOnlyVal === "true" ? true : false; + this.el.removeAttribute(PHX_READONLY); + } + if (disabledVal !== null) { + this.el.disabled = disabledVal === "true" ? true : false; + this.el.removeAttribute(PHX_DISABLED); + } + const disableRestore = this.el.getAttribute(PHX_DISABLE_WITH_RESTORE); + if (disableRestore !== null) { + this.el.textContent = disableRestore; + this.el.removeAttribute(PHX_DISABLE_WITH_RESTORE); + } + const opts = { + detail: { ref, event: phxEvent }, + bubbles: true, + cancelable: false + }; + this.el.dispatchEvent( + new CustomEvent(`phx:undo-loading:${this.loadingRef}`, opts) + ); + } + PHX_EVENT_CLASSES.forEach((name) => { + if (name !== "phx-submit-loading" || this.canUndoLoading(ref)) { + dom_default.removeClass(this.el, name); + } + }); + } + isLoadingUndoneBy(ref) { + return this.loadingRef === null ? false : this.loadingRef <= ref; + } + isLockUndoneBy(ref) { + return this.lockRef === null ? false : this.lockRef <= ref; + } + isFullyResolvedBy(ref) { + return (this.loadingRef === null || this.loadingRef <= ref) && (this.lockRef === null || this.lockRef <= ref); + } + // only remove the phx-submit-loading class if we are not locked + canUndoLoading(ref) { + return this.lockRef === null || this.lockRef <= ref; + } + }; + var DOMPostMorphRestorer = class { + constructor(containerBefore, containerAfter, updateType) { + const idsBefore = /* @__PURE__ */ new Set(); + const idsAfter = new Set( + [...containerAfter.children].map((child) => child.id) + ); + const elementsToModify = []; + Array.from(containerBefore.children).forEach((child) => { + if (child.id) { + idsBefore.add(child.id); + if (idsAfter.has(child.id)) { + const previousElementId = child.previousElementSibling && child.previousElementSibling.id; + elementsToModify.push({ + elementId: child.id, + previousElementId + }); + } + } + }); + this.containerId = containerAfter.id; + this.updateType = updateType; + this.elementsToModify = elementsToModify; + this.elementIdsToAdd = [...idsAfter].filter((id) => !idsBefore.has(id)); + } + // We do the following to optimize append/prepend operations: + // 1) Track ids of modified elements & of new elements + // 2) All the modified elements are put back in the correct position in the DOM tree + // by storing the id of their previous sibling + // 3) New elements are going to be put in the right place by morphdom during append. + // For prepend, we move them to the first position in the container + perform() { + const container = dom_default.byId(this.containerId); + if (!container) { + return; + } + this.elementsToModify.forEach((elementToModify) => { + if (elementToModify.previousElementId) { + maybe( + document.getElementById(elementToModify.previousElementId), + (previousElem) => { + maybe( + document.getElementById(elementToModify.elementId), + (elem) => { + const isInRightPlace = elem.previousElementSibling && elem.previousElementSibling.id == previousElem.id; + if (!isInRightPlace) { + previousElem.insertAdjacentElement("afterend", elem); + } + } + ); + } + ); + } else { + maybe(document.getElementById(elementToModify.elementId), (elem) => { + const isInRightPlace = elem.previousElementSibling == null; + if (!isInRightPlace) { + container.insertAdjacentElement("afterbegin", elem); + } + }); + } + }); + if (this.updateType == "prepend") { + this.elementIdsToAdd.reverse().forEach((elemId) => { + maybe( + document.getElementById(elemId), + (elem) => container.insertAdjacentElement("afterbegin", elem) + ); + }); + } + } + }; + var DOCUMENT_FRAGMENT_NODE = 11; + function morphAttrs(fromNode, toNode) { + var toNodeAttrs = toNode.attributes; + var attr; + var attrName; + var attrNamespaceURI; + var attrValue; + var fromValue; + if (toNode.nodeType === DOCUMENT_FRAGMENT_NODE || fromNode.nodeType === DOCUMENT_FRAGMENT_NODE) { + return; + } + for (var i = toNodeAttrs.length - 1; i >= 0; i--) { + attr = toNodeAttrs[i]; + attrName = attr.name; + attrNamespaceURI = attr.namespaceURI; + attrValue = attr.value; + if (attrNamespaceURI) { + attrName = attr.localName || attrName; + fromValue = fromNode.getAttributeNS(attrNamespaceURI, attrName); + if (fromValue !== attrValue) { + if (attr.prefix === "xmlns") { + attrName = attr.name; + } + fromNode.setAttributeNS(attrNamespaceURI, attrName, attrValue); + } + } else { + fromValue = fromNode.getAttribute(attrName); + if (fromValue !== attrValue) { + fromNode.setAttribute(attrName, attrValue); + } + } + } + var fromNodeAttrs = fromNode.attributes; + for (var d = fromNodeAttrs.length - 1; d >= 0; d--) { + attr = fromNodeAttrs[d]; + attrName = attr.name; + attrNamespaceURI = attr.namespaceURI; + if (attrNamespaceURI) { + attrName = attr.localName || attrName; + if (!toNode.hasAttributeNS(attrNamespaceURI, attrName)) { + fromNode.removeAttributeNS(attrNamespaceURI, attrName); + } + } else { + if (!toNode.hasAttribute(attrName)) { + fromNode.removeAttribute(attrName); + } + } + } + } + var range; + var NS_XHTML = "http://www.w3.org/1999/xhtml"; + var doc = typeof document === "undefined" ? void 0 : document; + var HAS_TEMPLATE_SUPPORT = !!doc && "content" in doc.createElement("template"); + var HAS_RANGE_SUPPORT = !!doc && doc.createRange && "createContextualFragment" in doc.createRange(); + function createFragmentFromTemplate(str) { + var template = doc.createElement("template"); + template.innerHTML = str; + return template.content.childNodes[0]; + } + function createFragmentFromRange(str) { + if (!range) { + range = doc.createRange(); + range.selectNode(doc.body); + } + var fragment = range.createContextualFragment(str); + return fragment.childNodes[0]; + } + function createFragmentFromWrap(str) { + var fragment = doc.createElement("body"); + fragment.innerHTML = str; + return fragment.childNodes[0]; + } + function toElement(str) { + str = str.trim(); + if (HAS_TEMPLATE_SUPPORT) { + return createFragmentFromTemplate(str); + } else if (HAS_RANGE_SUPPORT) { + return createFragmentFromRange(str); + } + return createFragmentFromWrap(str); + } + function compareNodeNames(fromEl, toEl) { + var fromNodeName = fromEl.nodeName; + var toNodeName = toEl.nodeName; + var fromCodeStart, toCodeStart; + if (fromNodeName === toNodeName) { + return true; + } + fromCodeStart = fromNodeName.charCodeAt(0); + toCodeStart = toNodeName.charCodeAt(0); + if (fromCodeStart <= 90 && toCodeStart >= 97) { + return fromNodeName === toNodeName.toUpperCase(); + } else if (toCodeStart <= 90 && fromCodeStart >= 97) { + return toNodeName === fromNodeName.toUpperCase(); + } else { + return false; + } + } + function createElementNS(name, namespaceURI) { + return !namespaceURI || namespaceURI === NS_XHTML ? doc.createElement(name) : doc.createElementNS(namespaceURI, name); + } + function moveChildren(fromEl, toEl) { + var curChild = fromEl.firstChild; + while (curChild) { + var nextChild = curChild.nextSibling; + toEl.appendChild(curChild); + curChild = nextChild; + } + return toEl; + } + function syncBooleanAttrProp(fromEl, toEl, name) { + if (fromEl[name] !== toEl[name]) { + fromEl[name] = toEl[name]; + if (fromEl[name]) { + fromEl.setAttribute(name, ""); + } else { + fromEl.removeAttribute(name); + } + } + } + var specialElHandlers = { + OPTION: function(fromEl, toEl) { + var parentNode = fromEl.parentNode; + if (parentNode) { + var parentName = parentNode.nodeName.toUpperCase(); + if (parentName === "OPTGROUP") { + parentNode = parentNode.parentNode; + parentName = parentNode && parentNode.nodeName.toUpperCase(); + } + if (parentName === "SELECT" && !parentNode.hasAttribute("multiple")) { + if (fromEl.hasAttribute("selected") && !toEl.selected) { + fromEl.setAttribute("selected", "selected"); + fromEl.removeAttribute("selected"); + } + parentNode.selectedIndex = -1; + } + } + syncBooleanAttrProp(fromEl, toEl, "selected"); + }, + /** + * The "value" attribute is special for the element since it sets + * the initial value. Changing the "value" attribute without changing the + * "value" property will have no effect since it is only used to the set the + * initial value. Similar for the "checked" attribute, and "disabled". + */ + INPUT: function(fromEl, toEl) { + syncBooleanAttrProp(fromEl, toEl, "checked"); + syncBooleanAttrProp(fromEl, toEl, "disabled"); + if (fromEl.value !== toEl.value) { + fromEl.value = toEl.value; + } + if (!toEl.hasAttribute("value")) { + fromEl.removeAttribute("value"); + } + }, + TEXTAREA: function(fromEl, toEl) { + var newValue = toEl.value; + if (fromEl.value !== newValue) { + fromEl.value = newValue; + } + var firstChild = fromEl.firstChild; + if (firstChild) { + var oldValue = firstChild.nodeValue; + if (oldValue == newValue || !newValue && oldValue == fromEl.placeholder) { + return; + } + firstChild.nodeValue = newValue; + } + }, + SELECT: function(fromEl, toEl) { + if (!toEl.hasAttribute("multiple")) { + var selectedIndex = -1; + var i = 0; + var curChild = fromEl.firstChild; + var optgroup; + var nodeName; + while (curChild) { + nodeName = curChild.nodeName && curChild.nodeName.toUpperCase(); + if (nodeName === "OPTGROUP") { + optgroup = curChild; + curChild = optgroup.firstChild; + if (!curChild) { + curChild = optgroup.nextSibling; + optgroup = null; + } + } else { + if (nodeName === "OPTION") { + if (curChild.hasAttribute("selected")) { + selectedIndex = i; + break; + } + i++; + } + curChild = curChild.nextSibling; + if (!curChild && optgroup) { + curChild = optgroup.nextSibling; + optgroup = null; + } + } + } + fromEl.selectedIndex = selectedIndex; + } + } + }; + var ELEMENT_NODE = 1; + var DOCUMENT_FRAGMENT_NODE$1 = 11; + var TEXT_NODE = 3; + var COMMENT_NODE = 8; + function noop() { + } + function defaultGetNodeKey(node) { + if (node) { + return node.getAttribute && node.getAttribute("id") || node.id; + } + } + function morphdomFactory(morphAttrs2) { + return function morphdom2(fromNode, toNode, options) { + if (!options) { + options = {}; + } + if (typeof toNode === "string") { + if (fromNode.nodeName === "#document" || fromNode.nodeName === "HTML") { + var toNodeHtml = toNode; + toNode = doc.createElement("html"); + toNode.innerHTML = toNodeHtml; + } else if (fromNode.nodeName === "BODY") { + var toNodeBody = toNode; + toNode = doc.createElement("html"); + toNode.innerHTML = toNodeBody; + var bodyElement = toNode.querySelector("body"); + if (bodyElement) { + toNode = bodyElement; + } + } else { + toNode = toElement(toNode); + } + } else if (toNode.nodeType === DOCUMENT_FRAGMENT_NODE$1) { + toNode = toNode.firstElementChild; + } + var getNodeKey = options.getNodeKey || defaultGetNodeKey; + var onBeforeNodeAdded = options.onBeforeNodeAdded || noop; + var onNodeAdded = options.onNodeAdded || noop; + var onBeforeElUpdated = options.onBeforeElUpdated || noop; + var onElUpdated = options.onElUpdated || noop; + var onBeforeNodeDiscarded = options.onBeforeNodeDiscarded || noop; + var onNodeDiscarded = options.onNodeDiscarded || noop; + var onBeforeElChildrenUpdated = options.onBeforeElChildrenUpdated || noop; + var skipFromChildren = options.skipFromChildren || noop; + var addChild = options.addChild || function(parent, child) { + return parent.appendChild(child); + }; + var childrenOnly = options.childrenOnly === true; + var fromNodesLookup = /* @__PURE__ */ Object.create(null); + var keyedRemovalList = []; + function addKeyedRemoval(key) { + keyedRemovalList.push(key); + } + function walkDiscardedChildNodes(node, skipKeyedNodes) { + if (node.nodeType === ELEMENT_NODE) { + var curChild = node.firstChild; + while (curChild) { + var key = void 0; + if (skipKeyedNodes && (key = getNodeKey(curChild))) { + addKeyedRemoval(key); + } else { + onNodeDiscarded(curChild); + if (curChild.firstChild) { + walkDiscardedChildNodes(curChild, skipKeyedNodes); + } + } + curChild = curChild.nextSibling; + } + } + } + function removeNode(node, parentNode, skipKeyedNodes) { + if (onBeforeNodeDiscarded(node) === false) { + return; + } + if (parentNode) { + parentNode.removeChild(node); + } + onNodeDiscarded(node); + walkDiscardedChildNodes(node, skipKeyedNodes); + } + function indexTree(node) { + if (node.nodeType === ELEMENT_NODE || node.nodeType === DOCUMENT_FRAGMENT_NODE$1) { + var curChild = node.firstChild; + while (curChild) { + var key = getNodeKey(curChild); + if (key) { + fromNodesLookup[key] = curChild; + } + indexTree(curChild); + curChild = curChild.nextSibling; + } + } + } + indexTree(fromNode); + function handleNodeAdded(el) { + onNodeAdded(el); + var curChild = el.firstChild; + while (curChild) { + var nextSibling = curChild.nextSibling; + var key = getNodeKey(curChild); + if (key) { + var unmatchedFromEl = fromNodesLookup[key]; + if (unmatchedFromEl && compareNodeNames(curChild, unmatchedFromEl)) { + curChild.parentNode.replaceChild(unmatchedFromEl, curChild); + morphEl(unmatchedFromEl, curChild); + } else { + handleNodeAdded(curChild); + } + } else { + handleNodeAdded(curChild); + } + curChild = nextSibling; + } + } + function cleanupFromEl(fromEl, curFromNodeChild, curFromNodeKey) { + while (curFromNodeChild) { + var fromNextSibling = curFromNodeChild.nextSibling; + if (curFromNodeKey = getNodeKey(curFromNodeChild)) { + addKeyedRemoval(curFromNodeKey); + } else { + removeNode( + curFromNodeChild, + fromEl, + true + /* skip keyed nodes */ + ); + } + curFromNodeChild = fromNextSibling; + } + } + function morphEl(fromEl, toEl, childrenOnly2) { + var toElKey = getNodeKey(toEl); + if (toElKey) { + delete fromNodesLookup[toElKey]; + } + if (!childrenOnly2) { + var beforeUpdateResult = onBeforeElUpdated(fromEl, toEl); + if (beforeUpdateResult === false) { + return; + } else if (beforeUpdateResult instanceof HTMLElement) { + fromEl = beforeUpdateResult; + indexTree(fromEl); + } + morphAttrs2(fromEl, toEl); + onElUpdated(fromEl); + if (onBeforeElChildrenUpdated(fromEl, toEl) === false) { + return; + } + } + if (fromEl.nodeName !== "TEXTAREA") { + morphChildren(fromEl, toEl); + } else { + specialElHandlers.TEXTAREA(fromEl, toEl); + } + } + function morphChildren(fromEl, toEl) { + var skipFrom = skipFromChildren(fromEl, toEl); + var curToNodeChild = toEl.firstChild; + var curFromNodeChild = fromEl.firstChild; + var curToNodeKey; + var curFromNodeKey; + var fromNextSibling; + var toNextSibling; + var matchingFromEl; + outer: + while (curToNodeChild) { + toNextSibling = curToNodeChild.nextSibling; + curToNodeKey = getNodeKey(curToNodeChild); + while (!skipFrom && curFromNodeChild) { + fromNextSibling = curFromNodeChild.nextSibling; + if (curToNodeChild.isSameNode && curToNodeChild.isSameNode(curFromNodeChild)) { + curToNodeChild = toNextSibling; + curFromNodeChild = fromNextSibling; + continue outer; + } + curFromNodeKey = getNodeKey(curFromNodeChild); + var curFromNodeType = curFromNodeChild.nodeType; + var isCompatible = void 0; + if (curFromNodeType === curToNodeChild.nodeType) { + if (curFromNodeType === ELEMENT_NODE) { + if (curToNodeKey) { + if (curToNodeKey !== curFromNodeKey) { + if (matchingFromEl = fromNodesLookup[curToNodeKey]) { + if (fromNextSibling === matchingFromEl) { + isCompatible = false; + } else { + fromEl.insertBefore(matchingFromEl, curFromNodeChild); + if (curFromNodeKey) { + addKeyedRemoval(curFromNodeKey); + } else { + removeNode( + curFromNodeChild, + fromEl, + true + /* skip keyed nodes */ + ); + } + curFromNodeChild = matchingFromEl; + curFromNodeKey = getNodeKey(curFromNodeChild); + } + } else { + isCompatible = false; + } + } + } else if (curFromNodeKey) { + isCompatible = false; + } + isCompatible = isCompatible !== false && compareNodeNames(curFromNodeChild, curToNodeChild); + if (isCompatible) { + morphEl(curFromNodeChild, curToNodeChild); + } + } else if (curFromNodeType === TEXT_NODE || curFromNodeType == COMMENT_NODE) { + isCompatible = true; + if (curFromNodeChild.nodeValue !== curToNodeChild.nodeValue) { + curFromNodeChild.nodeValue = curToNodeChild.nodeValue; + } + } + } + if (isCompatible) { + curToNodeChild = toNextSibling; + curFromNodeChild = fromNextSibling; + continue outer; + } + if (curFromNodeKey) { + addKeyedRemoval(curFromNodeKey); + } else { + removeNode( + curFromNodeChild, + fromEl, + true + /* skip keyed nodes */ + ); + } + curFromNodeChild = fromNextSibling; + } + if (curToNodeKey && (matchingFromEl = fromNodesLookup[curToNodeKey]) && compareNodeNames(matchingFromEl, curToNodeChild)) { + if (!skipFrom) { + addChild(fromEl, matchingFromEl); + } + morphEl(matchingFromEl, curToNodeChild); + } else { + var onBeforeNodeAddedResult = onBeforeNodeAdded(curToNodeChild); + if (onBeforeNodeAddedResult !== false) { + if (onBeforeNodeAddedResult) { + curToNodeChild = onBeforeNodeAddedResult; + } + if (curToNodeChild.actualize) { + curToNodeChild = curToNodeChild.actualize(fromEl.ownerDocument || doc); + } + addChild(fromEl, curToNodeChild); + handleNodeAdded(curToNodeChild); + } + } + curToNodeChild = toNextSibling; + curFromNodeChild = fromNextSibling; + } + cleanupFromEl(fromEl, curFromNodeChild, curFromNodeKey); + var specialElHandler = specialElHandlers[fromEl.nodeName]; + if (specialElHandler) { + specialElHandler(fromEl, toEl); + } + } + var morphedNode = fromNode; + var morphedNodeType = morphedNode.nodeType; + var toNodeType = toNode.nodeType; + if (!childrenOnly) { + if (morphedNodeType === ELEMENT_NODE) { + if (toNodeType === ELEMENT_NODE) { + if (!compareNodeNames(fromNode, toNode)) { + onNodeDiscarded(fromNode); + morphedNode = moveChildren(fromNode, createElementNS(toNode.nodeName, toNode.namespaceURI)); + } + } else { + morphedNode = toNode; + } + } else if (morphedNodeType === TEXT_NODE || morphedNodeType === COMMENT_NODE) { + if (toNodeType === morphedNodeType) { + if (morphedNode.nodeValue !== toNode.nodeValue) { + morphedNode.nodeValue = toNode.nodeValue; + } + return morphedNode; + } else { + morphedNode = toNode; + } + } + } + if (morphedNode === toNode) { + onNodeDiscarded(fromNode); + } else { + if (toNode.isSameNode && toNode.isSameNode(morphedNode)) { + return; + } + morphEl(morphedNode, toNode, childrenOnly); + if (keyedRemovalList) { + for (var i = 0, len = keyedRemovalList.length; i < len; i++) { + var elToRemove = fromNodesLookup[keyedRemovalList[i]]; + if (elToRemove) { + removeNode(elToRemove, elToRemove.parentNode, false); + } + } + } + } + if (!childrenOnly && morphedNode !== fromNode && fromNode.parentNode) { + if (morphedNode.actualize) { + morphedNode = morphedNode.actualize(fromNode.ownerDocument || doc); + } + fromNode.parentNode.replaceChild(morphedNode, fromNode); + } + return morphedNode; + }; + } + var morphdom = morphdomFactory(morphAttrs); + var morphdom_esm_default = morphdom; + var DOMPatch = class { + constructor(view, container, id, html, streams, targetCID, opts = {}) { + this.view = view; + this.liveSocket = view.liveSocket; + this.container = container; + this.id = id; + this.rootID = view.root.id; + this.html = html; + this.streams = streams; + this.streamInserts = {}; + this.streamComponentRestore = {}; + this.targetCID = targetCID; + this.cidPatch = isCid(this.targetCID); + this.pendingRemoves = []; + this.phxRemove = this.liveSocket.binding("remove"); + this.targetContainer = this.isCIDPatch() ? this.targetCIDContainer(html) : container; + this.callbacks = { + beforeadded: [], + beforeupdated: [], + beforephxChildAdded: [], + afteradded: [], + afterupdated: [], + afterdiscarded: [], + afterphxChildAdded: [], + aftertransitionsDiscarded: [] + }; + this.withChildren = opts.withChildren || opts.undoRef || false; + this.undoRef = opts.undoRef; + } + before(kind, callback) { + this.callbacks[`before${kind}`].push(callback); + } + after(kind, callback) { + this.callbacks[`after${kind}`].push(callback); + } + trackBefore(kind, ...args) { + this.callbacks[`before${kind}`].forEach((callback) => callback(...args)); + } + trackAfter(kind, ...args) { + this.callbacks[`after${kind}`].forEach((callback) => callback(...args)); + } + markPrunableContentForRemoval() { + const phxUpdate = this.liveSocket.binding(PHX_UPDATE); + dom_default.all( + this.container, + `[${phxUpdate}=append] > *, [${phxUpdate}=prepend] > *`, + (el) => { + el.setAttribute(PHX_PRUNE, ""); + } + ); + } + perform(isJoinPatch) { + const { view, liveSocket, html, container } = this; + let targetContainer = this.targetContainer; + if (this.isCIDPatch() && !this.targetContainer) { + return; + } + if (this.isCIDPatch()) { + const closestLock = targetContainer.closest(`[${PHX_REF_LOCK}]`); + if (closestLock && !closestLock.isSameNode(targetContainer)) { + const clonedTree = dom_default.private(closestLock, PHX_REF_LOCK); + if (clonedTree) { + targetContainer = clonedTree.querySelector( + `[data-phx-component="${this.targetCID}"]` + ); + } + } + } + const focused = liveSocket.getActiveElement(); + const { selectionStart, selectionEnd } = focused && dom_default.hasSelectionRange(focused) ? focused : {}; + const phxUpdate = liveSocket.binding(PHX_UPDATE); + const phxViewportTop = liveSocket.binding(PHX_VIEWPORT_TOP); + const phxViewportBottom = liveSocket.binding(PHX_VIEWPORT_BOTTOM); + const phxTriggerExternal = liveSocket.binding(PHX_TRIGGER_ACTION); + const added = []; + const updates = []; + const appendPrependUpdates = []; + let portalCallbacks = []; + let externalFormTriggered = null; + const morph = (targetContainer2, source, withChildren = this.withChildren) => { + const morphCallbacks = { + // normally, we are running with childrenOnly, as the patch HTML for a LV + // does not include the LV attrs (data-phx-session, etc.) + // when we are patching a live component, we do want to patch the root element as well; + // another case is the recursive patch of a stream item that was kept on reset (-> onBeforeNodeAdded) + childrenOnly: targetContainer2.getAttribute(PHX_COMPONENT) === null && !withChildren, + getNodeKey: (node) => { + if (dom_default.isPhxDestroyed(node)) { + return null; + } + if (isJoinPatch) { + return node.id; + } + return node.id || node.getAttribute && node.getAttribute(PHX_MAGIC_ID); + }, + // skip indexing from children when container is stream + skipFromChildren: (from) => { + return from.getAttribute(phxUpdate) === PHX_STREAM; + }, + // tell morphdom how to add a child + addChild: (parent, child) => { + const { ref, streamAt } = this.getStreamInsert(child); + if (ref === void 0) { + return parent.appendChild(child); + } + this.setStreamRef(child, ref); + if (streamAt === 0) { + parent.insertAdjacentElement("afterbegin", child); + } else if (streamAt === -1) { + const lastChild = parent.lastElementChild; + if (lastChild && !lastChild.hasAttribute(PHX_STREAM_REF)) { + const nonStreamChild = Array.from(parent.children).find( + (c) => !c.hasAttribute(PHX_STREAM_REF) + ); + parent.insertBefore(child, nonStreamChild); + } else { + parent.appendChild(child); + } + } else if (streamAt > 0) { + const sibling = Array.from(parent.children)[streamAt]; + parent.insertBefore(child, sibling); + } + }, + onBeforeNodeAdded: (el) => { + if (this.getStreamInsert(el)?.updateOnly && !this.streamComponentRestore[el.id]) { + return false; + } + dom_default.maintainPrivateHooks(el, el, phxViewportTop, phxViewportBottom); + this.trackBefore("added", el); + let morphedEl = el; + if (this.streamComponentRestore[el.id]) { + morphedEl = this.streamComponentRestore[el.id]; + delete this.streamComponentRestore[el.id]; + morph(morphedEl, el, true); + } + return morphedEl; + }, + onNodeAdded: (el) => { + if (el.getAttribute) { + this.maybeReOrderStream(el, true); + } + if (dom_default.isPortalTemplate(el)) { + portalCallbacks.push(() => this.teleport(el, morph)); + } + if (el instanceof HTMLImageElement && el.srcset) { + el.srcset = el.srcset; + } else if (el instanceof HTMLVideoElement && el.autoplay) { + el.play(); + } + if (dom_default.isNowTriggerFormExternal(el, phxTriggerExternal)) { + externalFormTriggered = el; + } + if (dom_default.isPhxChild(el) && view.ownsElement(el) || dom_default.isPhxSticky(el) && view.ownsElement(el.parentNode)) { + this.trackAfter("phxChildAdded", el); + } + if (el.nodeName === "SCRIPT" && el.hasAttribute(PHX_RUNTIME_HOOK)) { + this.handleRuntimeHook(el, source); + } + added.push(el); + }, + onNodeDiscarded: (el) => this.onNodeDiscarded(el), + onBeforeNodeDiscarded: (el) => { + if (el.getAttribute && el.getAttribute(PHX_PRUNE) !== null) { + return true; + } + if (el.parentElement !== null && el.id && dom_default.isPhxUpdate(el.parentElement, phxUpdate, [ + PHX_STREAM, + "append", + "prepend" + ])) { + return false; + } + if (el.getAttribute && el.getAttribute(PHX_TELEPORTED_REF)) { + return false; + } + if (this.maybePendingRemove(el)) { + return false; + } + if (this.skipCIDSibling(el)) { + return false; + } + if (dom_default.isPortalTemplate(el)) { + const teleportedEl = document.getElementById( + el.content.firstElementChild.id + ); + if (teleportedEl) { + teleportedEl.remove(); + morphCallbacks.onNodeDiscarded(teleportedEl); + this.view.dropPortalElementId(teleportedEl.id); + } + } + return true; + }, + onElUpdated: (el) => { + if (dom_default.isNowTriggerFormExternal(el, phxTriggerExternal)) { + externalFormTriggered = el; + } + updates.push(el); + this.maybeReOrderStream(el, false); + }, + onBeforeElUpdated: (fromEl, toEl) => { + if (fromEl.id && fromEl.isSameNode(targetContainer2) && fromEl.id !== toEl.id) { + morphCallbacks.onNodeDiscarded(fromEl); + fromEl.replaceWith(toEl); + return morphCallbacks.onNodeAdded(toEl); + } + dom_default.syncPendingAttrs(fromEl, toEl); + dom_default.maintainPrivateHooks( + fromEl, + toEl, + phxViewportTop, + phxViewportBottom + ); + dom_default.cleanChildNodes(toEl, phxUpdate); + if (this.skipCIDSibling(toEl)) { + this.maybeReOrderStream(fromEl); + return false; + } + if (dom_default.isPhxSticky(fromEl)) { + [PHX_SESSION, PHX_STATIC, PHX_ROOT_ID].map((attr) => [ + attr, + fromEl.getAttribute(attr), + toEl.getAttribute(attr) + ]).forEach(([attr, fromVal, toVal]) => { + if (toVal && fromVal !== toVal) { + fromEl.setAttribute(attr, toVal); + } + }); + return false; + } + if (dom_default.isIgnored(fromEl, phxUpdate) || fromEl.form && fromEl.form.isSameNode(externalFormTriggered)) { + this.trackBefore("updated", fromEl, toEl); + dom_default.mergeAttrs(fromEl, toEl, { + isIgnored: dom_default.isIgnored(fromEl, phxUpdate) + }); + updates.push(fromEl); + dom_default.applyStickyOperations(fromEl); + return false; + } + if (fromEl.type === "number" && fromEl.validity && fromEl.validity.badInput) { + return false; + } + const isFocusedFormEl = focused && fromEl.isSameNode(focused) && dom_default.isFormInput(fromEl); + const focusedSelectChanged = isFocusedFormEl && this.isChangedSelect(fromEl, toEl); + if (fromEl.hasAttribute(PHX_REF_SRC)) { + const ref = new ElementRef(fromEl); + if (ref.lockRef && (!this.undoRef || !ref.isLockUndoneBy(this.undoRef))) { + dom_default.applyStickyOperations(fromEl); + const isLocked = fromEl.hasAttribute(PHX_REF_LOCK); + const clone2 = isLocked ? dom_default.private(fromEl, PHX_REF_LOCK) || fromEl.cloneNode(true) : null; + if (clone2) { + dom_default.putPrivate(fromEl, PHX_REF_LOCK, clone2); + if (!isFocusedFormEl) { + fromEl = clone2; + } + } + } + } + if (dom_default.isPhxChild(toEl)) { + const prevSession = fromEl.getAttribute(PHX_SESSION); + dom_default.mergeAttrs(fromEl, toEl, { exclude: [PHX_STATIC] }); + if (prevSession !== "") { + fromEl.setAttribute(PHX_SESSION, prevSession); + } + fromEl.setAttribute(PHX_ROOT_ID, this.rootID); + dom_default.applyStickyOperations(fromEl); + return false; + } + if (this.undoRef && dom_default.private(toEl, PHX_REF_LOCK)) { + dom_default.putPrivate( + fromEl, + PHX_REF_LOCK, + dom_default.private(toEl, PHX_REF_LOCK) + ); + } + dom_default.copyPrivates(toEl, fromEl); + if (dom_default.isPortalTemplate(toEl)) { + portalCallbacks.push(() => this.teleport(toEl, morph)); + fromEl.content.replaceChildren(toEl.content.cloneNode(true)); + return false; + } + if (isFocusedFormEl && fromEl.type !== "hidden" && !focusedSelectChanged) { + this.trackBefore("updated", fromEl, toEl); + dom_default.mergeFocusedInput(fromEl, toEl); + dom_default.syncAttrsToProps(fromEl); + updates.push(fromEl); + dom_default.applyStickyOperations(fromEl); + return false; + } else { + if (focusedSelectChanged) { + fromEl.blur(); + } + if (dom_default.isPhxUpdate(toEl, phxUpdate, ["append", "prepend"])) { + appendPrependUpdates.push( + new DOMPostMorphRestorer( + fromEl, + toEl, + toEl.getAttribute(phxUpdate) + ) + ); + } + dom_default.syncAttrsToProps(toEl); + dom_default.applyStickyOperations(toEl); + this.trackBefore("updated", fromEl, toEl); + return fromEl; + } + } + }; + morphdom_esm_default(targetContainer2, source, morphCallbacks); + }; + this.trackBefore("added", container); + this.trackBefore("updated", container, container); + liveSocket.time("morphdom", () => { + this.streams.forEach(([ref, inserts, deleteIds, reset]) => { + inserts.forEach(([key, streamAt, limit, updateOnly]) => { + this.streamInserts[key] = { ref, streamAt, limit, reset, updateOnly }; + }); + if (reset !== void 0) { + dom_default.all(document, `[${PHX_STREAM_REF}="${ref}"]`, (child) => { + this.removeStreamChildElement(child); + }); + } + deleteIds.forEach((id) => { + const child = document.getElementById(id); + if (child) { + this.removeStreamChildElement(child); + } + }); + }); + if (isJoinPatch) { + dom_default.all(this.container, `[${phxUpdate}=${PHX_STREAM}]`).filter((el) => this.view.ownsElement(el)).forEach((el) => { + Array.from(el.children).forEach((child) => { + this.removeStreamChildElement(child, true); + }); + }); + } + morph(targetContainer, html); + let teleportCount = 0; + while (portalCallbacks.length > 0 && teleportCount < 5) { + const copy = portalCallbacks.slice(); + portalCallbacks = []; + copy.forEach((callback) => callback()); + teleportCount++; + } + this.view.portalElementIds.forEach((id) => { + const el = document.getElementById(id); + if (el) { + const source = document.getElementById( + el.getAttribute(PHX_TELEPORTED_SRC) + ); + if (!source) { + el.remove(); + this.onNodeDiscarded(el); + this.view.dropPortalElementId(id); + } + } + }); + }); + if (liveSocket.isDebugEnabled()) { + detectDuplicateIds(); + detectInvalidStreamInserts(this.streamInserts); + Array.from(document.querySelectorAll("input[name=id]")).forEach( + (node) => { + if (node instanceof HTMLInputElement && node.form) { + console.error( + 'Detected an input with name="id" inside a form! This will cause problems when patching the DOM.\n', + node + ); + } + } + ); + } + if (appendPrependUpdates.length > 0) { + liveSocket.time("post-morph append/prepend restoration", () => { + appendPrependUpdates.forEach((update) => update.perform()); + }); + } + liveSocket.silenceEvents( + () => dom_default.restoreFocus(focused, selectionStart, selectionEnd) + ); + dom_default.dispatchEvent(document, "phx:update"); + added.forEach((el) => this.trackAfter("added", el)); + updates.forEach((el) => this.trackAfter("updated", el)); + this.transitionPendingRemoves(); + if (externalFormTriggered) { + liveSocket.unload(); + const submitter = dom_default.private(externalFormTriggered, "submitter"); + if (submitter && submitter.name && targetContainer.contains(submitter)) { + const input = document.createElement("input"); + input.type = "hidden"; + const formId = submitter.getAttribute("form"); + if (formId) { + input.setAttribute("form", formId); + } + input.name = submitter.name; + input.value = submitter.value; + submitter.parentElement.insertBefore(input, submitter); + } + Object.getPrototypeOf(externalFormTriggered).submit.call( + externalFormTriggered + ); + } + return true; + } + onNodeDiscarded(el) { + if (dom_default.isPhxChild(el) || dom_default.isPhxSticky(el)) { + this.liveSocket.destroyViewByEl(el); + } + this.trackAfter("discarded", el); + } + maybePendingRemove(node) { + if (node.getAttribute && node.getAttribute(this.phxRemove) !== null) { + this.pendingRemoves.push(node); + return true; + } else { + return false; + } + } + removeStreamChildElement(child, force = false) { + if (!force && !this.view.ownsElement(child)) { + return; + } + if (this.streamInserts[child.id]) { + this.streamComponentRestore[child.id] = child; + child.remove(); + } else { + if (!this.maybePendingRemove(child)) { + child.remove(); + this.onNodeDiscarded(child); + } + } + } + getStreamInsert(el) { + const insert = el.id ? this.streamInserts[el.id] : {}; + return insert || {}; + } + setStreamRef(el, ref) { + dom_default.putSticky( + el, + PHX_STREAM_REF, + (el2) => el2.setAttribute(PHX_STREAM_REF, ref) + ); + } + maybeReOrderStream(el, isNew) { + const { ref, streamAt, reset } = this.getStreamInsert(el); + if (streamAt === void 0) { + return; + } + this.setStreamRef(el, ref); + if (!reset && !isNew) { + return; + } + if (!el.parentElement) { + return; + } + if (streamAt === 0) { + el.parentElement.insertBefore(el, el.parentElement.firstElementChild); + } else if (streamAt > 0) { + const children = Array.from(el.parentElement.children); + const oldIndex = children.indexOf(el); + if (streamAt >= children.length - 1) { + el.parentElement.appendChild(el); + } else { + const sibling = children[streamAt]; + if (oldIndex > streamAt) { + el.parentElement.insertBefore(el, sibling); + } else { + el.parentElement.insertBefore(el, sibling.nextElementSibling); + } + } + } + this.maybeLimitStream(el); + } + maybeLimitStream(el) { + const { limit } = this.getStreamInsert(el); + const children = limit !== null && Array.from(el.parentElement.children); + if (limit && limit < 0 && children.length > limit * -1) { + children.slice(0, children.length + limit).forEach((child) => this.removeStreamChildElement(child)); + } else if (limit && limit >= 0 && children.length > limit) { + children.slice(limit).forEach((child) => this.removeStreamChildElement(child)); + } + } + transitionPendingRemoves() { + const { pendingRemoves, liveSocket } = this; + if (pendingRemoves.length > 0) { + liveSocket.transitionRemoves(pendingRemoves, () => { + pendingRemoves.forEach((el) => { + const child = dom_default.firstPhxChild(el); + if (child) { + liveSocket.destroyViewByEl(child); + } + el.remove(); + }); + this.trackAfter("transitionsDiscarded", pendingRemoves); + }); + } + } + isChangedSelect(fromEl, toEl) { + if (!(fromEl instanceof HTMLSelectElement) || fromEl.multiple) { + return false; + } + if (fromEl.options.length !== toEl.options.length) { + return true; + } + toEl.value = fromEl.value; + return !fromEl.isEqualNode(toEl); + } + isCIDPatch() { + return this.cidPatch; + } + skipCIDSibling(el) { + return el.nodeType === Node.ELEMENT_NODE && el.hasAttribute(PHX_SKIP); + } + targetCIDContainer(html) { + if (!this.isCIDPatch()) { + return; + } + const [first, ...rest] = dom_default.findComponentNodeList( + this.view.id, + this.targetCID + ); + if (rest.length === 0 && dom_default.childNodeLength(html) === 1) { + return first; + } else { + return first && first.parentNode; + } + } + indexOf(parent, child) { + return Array.from(parent.children).indexOf(child); + } + teleport(el, morph) { + const targetSelector = el.getAttribute(PHX_PORTAL); + const portalContainer = document.querySelector(targetSelector); + if (!portalContainer) { + throw new Error( + "portal target with selector " + targetSelector + " not found" + ); + } + const toTeleport = el.content.firstElementChild; + if (this.skipCIDSibling(toTeleport)) { + return; + } + if (!toTeleport?.id) { + throw new Error( + "phx-portal template must have a single root element with ID!" + ); + } + const existing = document.getElementById(toTeleport.id); + let portalTarget; + if (existing) { + if (!portalContainer.contains(existing)) { + portalContainer.appendChild(existing); + } + portalTarget = existing; + } else { + portalTarget = document.createElement(toTeleport.tagName); + portalContainer.appendChild(portalTarget); + } + toTeleport.setAttribute(PHX_TELEPORTED_REF, this.view.id); + toTeleport.setAttribute(PHX_TELEPORTED_SRC, el.id); + morph(portalTarget, toTeleport, true); + toTeleport.removeAttribute(PHX_TELEPORTED_REF); + toTeleport.removeAttribute(PHX_TELEPORTED_SRC); + this.view.pushPortalElementId(toTeleport.id); + } + handleRuntimeHook(el, source) { + const name = el.getAttribute(PHX_RUNTIME_HOOK); + let nonce = el.hasAttribute("nonce") ? el.getAttribute("nonce") : null; + if (el.hasAttribute("nonce")) { + const template = document.createElement("template"); + template.innerHTML = source; + nonce = template.content.querySelector(`script[${PHX_RUNTIME_HOOK}="${CSS.escape(name)}"]`).getAttribute("nonce"); + } + const script = document.createElement("script"); + script.textContent = el.textContent; + dom_default.mergeAttrs(script, el, { isIgnored: false }); + if (nonce) { + script.nonce = nonce; + } + el.replaceWith(script); + el = script; + } + }; + var VOID_TAGS = /* @__PURE__ */ new Set([ + "area", + "base", + "br", + "col", + "command", + "embed", + "hr", + "img", + "input", + "keygen", + "link", + "meta", + "param", + "source", + "track", + "wbr" + ]); + var quoteChars = /* @__PURE__ */ new Set(["'", '"']); + var modifyRoot = (html, attrs, clearInnerHTML) => { + let i = 0; + let insideComment = false; + let beforeTag, afterTag, tag, tagNameEndsAt, id, newHTML; + const lookahead = html.match(/^(\s*(?:\s*)*)<([^\s\/>]+)/); + if (lookahead === null) { + throw new Error(`malformed html ${html}`); + } + i = lookahead[0].length; + beforeTag = lookahead[1]; + tag = lookahead[2]; + tagNameEndsAt = i; + for (i; i < html.length; i++) { + if (html.charAt(i) === ">") { + break; + } + if (html.charAt(i) === "=") { + const isId = html.slice(i - 3, i) === " id"; + i++; + const char = html.charAt(i); + if (quoteChars.has(char)) { + const attrStartsAt = i; + i++; + for (i; i < html.length; i++) { + if (html.charAt(i) === char) { + break; + } + } + if (isId) { + id = html.slice(attrStartsAt + 1, i); + break; + } + } + } + } + let closeAt = html.length - 1; + insideComment = false; + while (closeAt >= beforeTag.length + tag.length) { + const char = html.charAt(closeAt); + if (insideComment) { + if (char === "-" && html.slice(closeAt - 3, closeAt) === "" && html.slice(closeAt - 2, closeAt) === "--") { + insideComment = true; + closeAt -= 3; + } else if (char === ">") { + break; + } else { + closeAt -= 1; + } + } + afterTag = html.slice(closeAt + 1, html.length); + const attrsStr = Object.keys(attrs).map((attr) => attrs[attr] === true ? attr : `${attr}="${attrs[attr]}"`).join(" "); + if (clearInnerHTML) { + const idAttrStr = id ? ` id="${id}"` : ""; + if (VOID_TAGS.has(tag)) { + newHTML = `<${tag}${idAttrStr}${attrsStr === "" ? "" : " "}${attrsStr}/>`; + } else { + newHTML = `<${tag}${idAttrStr}${attrsStr === "" ? "" : " "}${attrsStr}>`; + } + } else { + const rest = html.slice(tagNameEndsAt, closeAt + 1); + newHTML = `<${tag}${attrsStr === "" ? "" : " "}${attrsStr}${rest}`; + } + return [newHTML, beforeTag, afterTag]; + }; + var Rendered = class { + static extract(diff) { + const { [REPLY]: reply, [EVENTS]: events, [TITLE]: title } = diff; + delete diff[REPLY]; + delete diff[EVENTS]; + delete diff[TITLE]; + return { diff, title, reply: reply || null, events: events || [] }; + } + constructor(viewId, rendered) { + this.viewId = viewId; + this.rendered = {}; + this.magicId = 0; + this.mergeDiff(rendered); + } + parentViewId() { + return this.viewId; + } + toString(onlyCids) { + const { buffer: str, streams } = this.recursiveToString( + this.rendered, + this.rendered[COMPONENTS], + onlyCids, + true, + {} + ); + return { buffer: str, streams }; + } + recursiveToString(rendered, components = rendered[COMPONENTS], onlyCids, changeTracking, rootAttrs) { + onlyCids = onlyCids ? new Set(onlyCids) : null; + const output = { + buffer: "", + components, + onlyCids, + streams: /* @__PURE__ */ new Set() + }; + this.toOutputBuffer(rendered, null, output, changeTracking, rootAttrs); + return { buffer: output.buffer, streams: output.streams }; + } + componentCIDs(diff) { + return Object.keys(diff[COMPONENTS] || {}).map((i) => parseInt(i)); + } + isComponentOnlyDiff(diff) { + if (!diff[COMPONENTS]) { + return false; + } + return Object.keys(diff).length === 1; + } + getComponent(diff, cid) { + return diff[COMPONENTS][cid]; + } + resetRender(cid) { + if (this.rendered[COMPONENTS][cid]) { + this.rendered[COMPONENTS][cid].reset = true; + } + } + mergeDiff(diff) { + const newc = diff[COMPONENTS]; + const cache = {}; + delete diff[COMPONENTS]; + this.rendered = this.mutableMerge(this.rendered, diff); + this.rendered[COMPONENTS] = this.rendered[COMPONENTS] || {}; + if (newc) { + const oldc = this.rendered[COMPONENTS]; + for (const cid in newc) { + newc[cid] = this.cachedFindComponent(cid, newc[cid], oldc, newc, cache); + } + for (const cid in newc) { + oldc[cid] = newc[cid]; + } + diff[COMPONENTS] = newc; + } + } + cachedFindComponent(cid, cdiff, oldc, newc, cache) { + if (cache[cid]) { + return cache[cid]; + } else { + let ndiff, stat, scid = cdiff[STATIC]; + if (isCid(scid)) { + let tdiff; + if (scid > 0) { + tdiff = this.cachedFindComponent(scid, newc[scid], oldc, newc, cache); + } else { + tdiff = oldc[-scid]; + } + stat = tdiff[STATIC]; + ndiff = this.cloneMerge(tdiff, cdiff, true); + ndiff[STATIC] = stat; + } else { + ndiff = cdiff[STATIC] !== void 0 || oldc[cid] === void 0 ? cdiff : this.cloneMerge(oldc[cid], cdiff, false); + } + cache[cid] = ndiff; + return ndiff; + } + } + mutableMerge(target, source) { + if (source[STATIC] !== void 0) { + return source; + } else { + this.doMutableMerge(target, source); + return target; + } + } + doMutableMerge(target, source) { + if (source[KEYED]) { + this.mergeKeyed(target, source); + } else { + for (const key in source) { + const val = source[key]; + const targetVal = target[key]; + const isObjVal = isObject(val); + if (isObjVal && val[STATIC] === void 0 && isObject(targetVal)) { + this.doMutableMerge(targetVal, val); + } else { + target[key] = val; + } + } + } + if (target[ROOT]) { + target.newRender = true; + } + } + clone(diff) { + if ("structuredClone" in window) { + return structuredClone(diff); + } else { + return JSON.parse(JSON.stringify(diff)); + } + } + // keyed comprehensions + mergeKeyed(target, source) { + const clonedTarget = this.clone(target); + Object.entries(source[KEYED]).forEach(([i, entry]) => { + if (i === KEYED_COUNT) { + return; + } + if (Array.isArray(entry)) { + const [old_idx, diff] = entry; + target[KEYED][i] = clonedTarget[KEYED][old_idx]; + this.doMutableMerge(target[KEYED][i], diff); + } else if (typeof entry === "number") { + const old_idx = entry; + target[KEYED][i] = clonedTarget[KEYED][old_idx]; + } else if (typeof entry === "object") { + if (!target[KEYED][i]) { + target[KEYED][i] = {}; + } + this.doMutableMerge(target[KEYED][i], entry); + } + }); + if (source[KEYED][KEYED_COUNT] < target[KEYED][KEYED_COUNT]) { + for (let i = source[KEYED][KEYED_COUNT]; i < target[KEYED][KEYED_COUNT]; i++) { + delete target[KEYED][i]; + } + } + target[KEYED][KEYED_COUNT] = source[KEYED][KEYED_COUNT]; + if (source[STREAM]) { + target[STREAM] = source[STREAM]; + } + if (source[TEMPLATES]) { + target[TEMPLATES] = source[TEMPLATES]; + } + } + // Merges cid trees together, copying statics from source tree. + // + // The `pruneMagicId` is passed to control pruning the magicId of the + // target. We must always prune the magicId when we are sharing statics + // from another component. If not pruning, we replicate the logic from + // mutableMerge, where we set newRender to true if there is a root + // (effectively forcing the new version to be rendered instead of skipped) + // + cloneMerge(target, source, pruneMagicId) { + let merged; + if (source[KEYED]) { + merged = this.clone(target); + this.mergeKeyed(merged, source); + } else { + merged = { ...target, ...source }; + for (const key in merged) { + const val = source[key]; + const targetVal = target[key]; + if (isObject(val) && val[STATIC] === void 0 && isObject(targetVal)) { + merged[key] = this.cloneMerge(targetVal, val, pruneMagicId); + } else if (val === void 0 && isObject(targetVal)) { + merged[key] = this.cloneMerge(targetVal, {}, pruneMagicId); + } + } + } + if (pruneMagicId) { + delete merged.magicId; + delete merged.newRender; + } else if (target[ROOT]) { + merged.newRender = true; + } + return merged; + } + componentToString(cid) { + const { buffer: str, streams } = this.recursiveCIDToString( + this.rendered[COMPONENTS], + cid, + null + ); + const [strippedHTML, _before, _after] = modifyRoot(str, {}); + return { buffer: strippedHTML, streams }; + } + pruneCIDs(cids) { + cids.forEach((cid) => delete this.rendered[COMPONENTS][cid]); + } + // private + get() { + return this.rendered; + } + isNewFingerprint(diff = {}) { + return !!diff[STATIC]; + } + templateStatic(part, templates) { + if (typeof part === "number") { + return templates[part]; + } else { + return part; + } + } + nextMagicID() { + this.magicId++; + return `m${this.magicId}-${this.parentViewId()}`; + } + // Converts rendered tree to output buffer. + // + // changeTracking controls if we can apply the PHX_SKIP optimization. + toOutputBuffer(rendered, templates, output, changeTracking, rootAttrs = {}) { + if (rendered[KEYED]) { + return this.comprehensionToBuffer( + rendered, + templates, + output, + changeTracking + ); + } + if (rendered[TEMPLATES]) { + templates = rendered[TEMPLATES]; + delete rendered[TEMPLATES]; + } + let { [STATIC]: statics } = rendered; + statics = this.templateStatic(statics, templates); + rendered[STATIC] = statics; + const isRoot = rendered[ROOT]; + const prevBuffer = output.buffer; + if (isRoot) { + output.buffer = ""; + } + if (changeTracking && isRoot && !rendered.magicId) { + rendered.newRender = true; + rendered.magicId = this.nextMagicID(); + } + output.buffer += statics[0]; + for (let i = 1; i < statics.length; i++) { + this.dynamicToBuffer(rendered[i - 1], templates, output, changeTracking); + output.buffer += statics[i]; + } + if (isRoot) { + let skip = false; + let attrs; + if (changeTracking || rendered.magicId) { + skip = changeTracking && !rendered.newRender; + attrs = { [PHX_MAGIC_ID]: rendered.magicId, ...rootAttrs }; + } else { + attrs = rootAttrs; + } + if (skip) { + attrs[PHX_SKIP] = true; + } + const [newRoot, commentBefore, commentAfter] = modifyRoot( + output.buffer, + attrs, + skip + ); + rendered.newRender = false; + output.buffer = prevBuffer + commentBefore + newRoot + commentAfter; + } + } + comprehensionToBuffer(rendered, templates, output, changeTracking) { + const keyedTemplates = templates || rendered[TEMPLATES]; + const statics = this.templateStatic(rendered[STATIC], templates); + rendered[STATIC] = statics; + delete rendered[TEMPLATES]; + for (let i = 0; i < rendered[KEYED][KEYED_COUNT]; i++) { + output.buffer += statics[0]; + for (let j = 1; j < statics.length; j++) { + this.dynamicToBuffer( + rendered[KEYED][i][j - 1], + keyedTemplates, + output, + changeTracking + ); + output.buffer += statics[j]; + } + } + if (rendered[STREAM]) { + const stream = rendered[STREAM]; + const [_ref, _inserts, deleteIds, reset] = stream || [null, {}, [], null]; + if (stream !== void 0 && (rendered[KEYED][KEYED_COUNT] > 0 || deleteIds.length > 0 || reset)) { + delete rendered[STREAM]; + rendered[KEYED] = { + [KEYED_COUNT]: 0 + }; + output.streams.add(stream); + } + } + } + dynamicToBuffer(rendered, templates, output, changeTracking) { + if (typeof rendered === "number") { + const { buffer: str, streams } = this.recursiveCIDToString( + output.components, + rendered, + output.onlyCids + ); + output.buffer += str; + output.streams = /* @__PURE__ */ new Set([...output.streams, ...streams]); + } else if (isObject(rendered)) { + this.toOutputBuffer(rendered, templates, output, changeTracking, {}); + } else { + output.buffer += rendered; + } + } + recursiveCIDToString(components, cid, onlyCids) { + const component = components[cid] || logError(`no component for CID ${cid}`, components); + const attrs = { [PHX_COMPONENT]: cid, [PHX_VIEW_REF]: this.viewId }; + const skip = onlyCids && !onlyCids.has(cid); + component.newRender = !skip; + component.magicId = `c${cid}-${this.parentViewId()}`; + const changeTracking = !component.reset; + const { buffer: html, streams } = this.recursiveToString( + component, + components, + onlyCids, + changeTracking, + attrs + ); + delete component.reset; + return { buffer: html, streams }; + } + }; + var focusStack = []; + var default_transition_time = 200; + var JS = { + // private + exec(e, eventType, phxEvent, view, sourceEl, defaults) { + const [defaultKind, defaultArgs] = defaults || [ + null, + { callback: defaults && defaults.callback } + ]; + const commands = phxEvent.charAt(0) === "[" ? JSON.parse(phxEvent) : [[defaultKind, defaultArgs]]; + commands.forEach(([kind, args]) => { + if (kind === defaultKind) { + args = { ...defaultArgs, ...args }; + args.callback = args.callback || defaultArgs.callback; + } + this.filterToEls(view.liveSocket, sourceEl, args).forEach((el) => { + this[`exec_${kind}`](e, eventType, phxEvent, view, sourceEl, el, args); + }); + }); + }, + isVisible(el) { + return !!(el.offsetWidth || el.offsetHeight || el.getClientRects().length > 0); + }, + // returns true if any part of the element is inside the viewport + isInViewport(el) { + const rect = el.getBoundingClientRect(); + const windowHeight = window.innerHeight || document.documentElement.clientHeight; + const windowWidth = window.innerWidth || document.documentElement.clientWidth; + return rect.right > 0 && rect.bottom > 0 && rect.left < windowWidth && rect.top < windowHeight; + }, + // private + // commands + exec_exec(e, eventType, phxEvent, view, sourceEl, el, { attr, to }) { + const encodedJS = el.getAttribute(attr); + if (!encodedJS) { + throw new Error(`expected ${attr} to contain JS command on "${to}"`); + } + view.liveSocket.execJS(el, encodedJS, eventType); + }, + exec_dispatch(e, eventType, phxEvent, view, sourceEl, el, { event, detail, bubbles, blocking }) { + detail = detail || {}; + detail.dispatcher = sourceEl; + if (blocking) { + const promise = new Promise((resolve, _reject) => { + detail.done = resolve; + }); + view.liveSocket.asyncTransition(promise); + } + dom_default.dispatchEvent(el, event, { detail, bubbles }); + }, + exec_push(e, eventType, phxEvent, view, sourceEl, el, args) { + const { + event, + data, + target, + page_loading, + loading, + value, + dispatcher, + callback + } = args; + const pushOpts = { + loading, + value, + target, + page_loading: !!page_loading, + originalEvent: e + }; + const targetSrc = eventType === "change" && dispatcher ? dispatcher : sourceEl; + const phxTarget = target || targetSrc.getAttribute(view.binding("target")) || targetSrc; + const handler = (targetView, targetCtx) => { + if (!targetView.isConnected()) { + return; + } + if (eventType === "change") { + let { newCid, _target } = args; + _target = _target || (dom_default.isFormInput(sourceEl) ? sourceEl.name : void 0); + if (_target) { + pushOpts._target = _target; + } + targetView.pushInput( + sourceEl, + targetCtx, + newCid, + event || phxEvent, + pushOpts, + callback + ); + } else if (eventType === "submit") { + const { submitter } = args; + targetView.submitForm( + sourceEl, + targetCtx, + event || phxEvent, + submitter, + pushOpts, + callback + ); + } else { + targetView.pushEvent( + eventType, + sourceEl, + targetCtx, + event || phxEvent, + data, + pushOpts, + callback + ); + } + }; + if (args.targetView && args.targetCtx) { + handler(args.targetView, args.targetCtx); + } else { + view.withinTargets(phxTarget, handler); + } + }, + exec_navigate(e, eventType, phxEvent, view, sourceEl, el, { href, replace }) { + view.liveSocket.historyRedirect( + e, + href, + replace ? "replace" : "push", + null, + sourceEl + ); + }, + exec_patch(e, eventType, phxEvent, view, sourceEl, el, { href, replace }) { + view.liveSocket.pushHistoryPatch( + e, + href, + replace ? "replace" : "push", + sourceEl + ); + }, + exec_focus(e, eventType, phxEvent, view, sourceEl, el) { + aria_default.attemptFocus(el); + window.requestAnimationFrame(() => { + window.requestAnimationFrame(() => aria_default.attemptFocus(el)); + }); + }, + exec_focus_first(e, eventType, phxEvent, view, sourceEl, el) { + aria_default.focusFirstInteractive(el) || aria_default.focusFirst(el); + window.requestAnimationFrame(() => { + window.requestAnimationFrame( + () => aria_default.focusFirstInteractive(el) || aria_default.focusFirst(el) + ); + }); + }, + exec_push_focus(e, eventType, phxEvent, view, sourceEl, el) { + focusStack.push(el || sourceEl); + }, + exec_pop_focus(_e, _eventType, _phxEvent, _view, _sourceEl, _el) { + const el = focusStack.pop(); + if (el) { + el.focus(); + window.requestAnimationFrame(() => { + window.requestAnimationFrame(() => el.focus()); + }); + } + }, + exec_add_class(e, eventType, phxEvent, view, sourceEl, el, { names, transition, time, blocking }) { + this.addOrRemoveClasses(el, names, [], transition, time, view, blocking); + }, + exec_remove_class(e, eventType, phxEvent, view, sourceEl, el, { names, transition, time, blocking }) { + this.addOrRemoveClasses(el, [], names, transition, time, view, blocking); + }, + exec_toggle_class(e, eventType, phxEvent, view, sourceEl, el, { names, transition, time, blocking }) { + this.toggleClasses(el, names, transition, time, view, blocking); + }, + exec_toggle_attr(e, eventType, phxEvent, view, sourceEl, el, { attr: [attr, val1, val2] }) { + this.toggleAttr(el, attr, val1, val2); + }, + exec_ignore_attrs(e, eventType, phxEvent, view, sourceEl, el, { attrs }) { + this.ignoreAttrs(el, attrs); + }, + exec_transition(e, eventType, phxEvent, view, sourceEl, el, { time, transition, blocking }) { + this.addOrRemoveClasses(el, [], [], transition, time, view, blocking); + }, + exec_toggle(e, eventType, phxEvent, view, sourceEl, el, { display, ins, outs, time, blocking }) { + this.toggle(eventType, view, el, display, ins, outs, time, blocking); + }, + exec_show(e, eventType, phxEvent, view, sourceEl, el, { display, transition, time, blocking }) { + this.show(eventType, view, el, display, transition, time, blocking); + }, + exec_hide(e, eventType, phxEvent, view, sourceEl, el, { display, transition, time, blocking }) { + this.hide(eventType, view, el, display, transition, time, blocking); + }, + exec_set_attr(e, eventType, phxEvent, view, sourceEl, el, { attr: [attr, val] }) { + this.setOrRemoveAttrs(el, [[attr, val]], []); + }, + exec_remove_attr(e, eventType, phxEvent, view, sourceEl, el, { attr }) { + this.setOrRemoveAttrs(el, [], [attr]); + }, + ignoreAttrs(el, attrs) { + dom_default.putPrivate(el, "JS:ignore_attrs", { + apply: (fromEl, toEl) => { + let fromAttributes = Array.from(fromEl.attributes); + let fromAttributeNames = fromAttributes.map((attr) => attr.name); + Array.from(toEl.attributes).filter((attr) => { + return !fromAttributeNames.includes(attr.name); + }).forEach((attr) => { + if (dom_default.attributeIgnored(attr, attrs)) { + toEl.removeAttribute(attr.name); + } + }); + fromAttributes.forEach((attr) => { + if (dom_default.attributeIgnored(attr, attrs)) { + toEl.setAttribute(attr.name, attr.value); + } + }); + } + }); + }, + onBeforeElUpdated(fromEl, toEl) { + const ignoreAttrs = dom_default.private(fromEl, "JS:ignore_attrs"); + if (ignoreAttrs) { + ignoreAttrs.apply(fromEl, toEl); + } + }, + // utils for commands + show(eventType, view, el, display, transition, time, blocking) { + if (!this.isVisible(el)) { + this.toggle( + eventType, + view, + el, + display, + transition, + null, + time, + blocking + ); + } + }, + hide(eventType, view, el, display, transition, time, blocking) { + if (this.isVisible(el)) { + this.toggle( + eventType, + view, + el, + display, + null, + transition, + time, + blocking + ); + } + }, + toggle(eventType, view, el, display, ins, outs, time, blocking) { + time = time || default_transition_time; + const [inClasses, inStartClasses, inEndClasses] = ins || [[], [], []]; + const [outClasses, outStartClasses, outEndClasses] = outs || [[], [], []]; + if (inClasses.length > 0 || outClasses.length > 0) { + if (this.isVisible(el)) { + const onStart = () => { + this.addOrRemoveClasses( + el, + outStartClasses, + inClasses.concat(inStartClasses).concat(inEndClasses) + ); + window.requestAnimationFrame(() => { + this.addOrRemoveClasses(el, outClasses, []); + window.requestAnimationFrame( + () => this.addOrRemoveClasses(el, outEndClasses, outStartClasses) + ); + }); + }; + const onEnd = () => { + this.addOrRemoveClasses(el, [], outClasses.concat(outEndClasses)); + dom_default.putSticky( + el, + "toggle", + (currentEl) => currentEl.style.display = "none" + ); + el.dispatchEvent(new Event("phx:hide-end")); + }; + el.dispatchEvent(new Event("phx:hide-start")); + if (blocking === false) { + onStart(); + setTimeout(onEnd, time); + } else { + view.transition(time, onStart, onEnd); + } + } else { + if (eventType === "remove") { + return; + } + const onStart = () => { + this.addOrRemoveClasses( + el, + inStartClasses, + outClasses.concat(outStartClasses).concat(outEndClasses) + ); + const stickyDisplay = display || this.defaultDisplay(el); + window.requestAnimationFrame(() => { + this.addOrRemoveClasses(el, inClasses, []); + window.requestAnimationFrame(() => { + dom_default.putSticky( + el, + "toggle", + (currentEl) => currentEl.style.display = stickyDisplay + ); + this.addOrRemoveClasses(el, inEndClasses, inStartClasses); + }); + }); + }; + const onEnd = () => { + this.addOrRemoveClasses(el, [], inClasses.concat(inEndClasses)); + el.dispatchEvent(new Event("phx:show-end")); + }; + el.dispatchEvent(new Event("phx:show-start")); + if (blocking === false) { + onStart(); + setTimeout(onEnd, time); + } else { + view.transition(time, onStart, onEnd); + } + } + } else { + if (this.isVisible(el)) { + window.requestAnimationFrame(() => { + el.dispatchEvent(new Event("phx:hide-start")); + dom_default.putSticky( + el, + "toggle", + (currentEl) => currentEl.style.display = "none" + ); + el.dispatchEvent(new Event("phx:hide-end")); + }); + } else { + window.requestAnimationFrame(() => { + el.dispatchEvent(new Event("phx:show-start")); + const stickyDisplay = display || this.defaultDisplay(el); + dom_default.putSticky( + el, + "toggle", + (currentEl) => currentEl.style.display = stickyDisplay + ); + el.dispatchEvent(new Event("phx:show-end")); + }); + } + } + }, + toggleClasses(el, classes, transition, time, view, blocking) { + window.requestAnimationFrame(() => { + const [prevAdds, prevRemoves] = dom_default.getSticky(el, "classes", [[], []]); + const newAdds = classes.filter( + (name) => prevAdds.indexOf(name) < 0 && !el.classList.contains(name) + ); + const newRemoves = classes.filter( + (name) => prevRemoves.indexOf(name) < 0 && el.classList.contains(name) + ); + this.addOrRemoveClasses( + el, + newAdds, + newRemoves, + transition, + time, + view, + blocking + ); + }); + }, + toggleAttr(el, attr, val1, val2) { + if (el.hasAttribute(attr)) { + if (val2 !== void 0) { + if (el.getAttribute(attr) === val1) { + this.setOrRemoveAttrs(el, [[attr, val2]], []); + } else { + this.setOrRemoveAttrs(el, [[attr, val1]], []); + } + } else { + this.setOrRemoveAttrs(el, [], [attr]); + } + } else { + this.setOrRemoveAttrs(el, [[attr, val1]], []); + } + }, + addOrRemoveClasses(el, adds, removes, transition, time, view, blocking) { + time = time || default_transition_time; + const [transitionRun, transitionStart, transitionEnd] = transition || [ + [], + [], + [] + ]; + if (transitionRun.length > 0) { + const onStart = () => { + this.addOrRemoveClasses( + el, + transitionStart, + [].concat(transitionRun).concat(transitionEnd) + ); + window.requestAnimationFrame(() => { + this.addOrRemoveClasses(el, transitionRun, []); + window.requestAnimationFrame( + () => this.addOrRemoveClasses(el, transitionEnd, transitionStart) + ); + }); + }; + const onDone = () => this.addOrRemoveClasses( + el, + adds.concat(transitionEnd), + removes.concat(transitionRun).concat(transitionStart) + ); + if (blocking === false) { + onStart(); + setTimeout(onDone, time); + } else { + view.transition(time, onStart, onDone); + } + return; + } + window.requestAnimationFrame(() => { + const [prevAdds, prevRemoves] = dom_default.getSticky(el, "classes", [[], []]); + const keepAdds = adds.filter( + (name) => prevAdds.indexOf(name) < 0 && !el.classList.contains(name) + ); + const keepRemoves = removes.filter( + (name) => prevRemoves.indexOf(name) < 0 && el.classList.contains(name) + ); + const newAdds = prevAdds.filter((name) => removes.indexOf(name) < 0).concat(keepAdds); + const newRemoves = prevRemoves.filter((name) => adds.indexOf(name) < 0).concat(keepRemoves); + dom_default.putSticky(el, "classes", (currentEl) => { + currentEl.classList.remove(...newRemoves); + currentEl.classList.add(...newAdds); + return [newAdds, newRemoves]; + }); + }); + }, + setOrRemoveAttrs(el, sets, removes) { + const [prevSets, prevRemoves] = dom_default.getSticky(el, "attrs", [[], []]); + const alteredAttrs = sets.map(([attr, _val]) => attr).concat(removes); + const newSets = prevSets.filter(([attr, _val]) => !alteredAttrs.includes(attr)).concat(sets); + const newRemoves = prevRemoves.filter((attr) => !alteredAttrs.includes(attr)).concat(removes); + dom_default.putSticky(el, "attrs", (currentEl) => { + newRemoves.forEach((attr) => currentEl.removeAttribute(attr)); + newSets.forEach(([attr, val]) => currentEl.setAttribute(attr, val)); + return [newSets, newRemoves]; + }); + }, + hasAllClasses(el, classes) { + return classes.every((name) => el.classList.contains(name)); + }, + isToggledOut(el, outClasses) { + return !this.isVisible(el) || this.hasAllClasses(el, outClasses); + }, + filterToEls(liveSocket, sourceEl, { to }) { + const defaultQuery = () => { + if (typeof to === "string") { + return document.querySelectorAll(to); + } else if (to.closest) { + const toEl = sourceEl.closest(to.closest); + return toEl ? [toEl] : []; + } else if (to.inner) { + return sourceEl.querySelectorAll(to.inner); + } + }; + return to ? liveSocket.jsQuerySelectorAll(sourceEl, to, defaultQuery) : [sourceEl]; + }, + defaultDisplay(el) { + return { tr: "table-row", td: "table-cell" }[el.tagName.toLowerCase()] || "block"; + }, + transitionClasses(val) { + if (!val) { + return null; + } + let [trans, tStart, tEnd] = Array.isArray(val) ? val : [val.split(" "), [], []]; + trans = Array.isArray(trans) ? trans : trans.split(" "); + tStart = Array.isArray(tStart) ? tStart : tStart.split(" "); + tEnd = Array.isArray(tEnd) ? tEnd : tEnd.split(" "); + return [trans, tStart, tEnd]; + } + }; + var js_default = JS; + var js_commands_default = (liveSocket, eventType) => { + return { + exec(el, encodedJS) { + liveSocket.execJS(el, encodedJS, eventType); + }, + show(el, opts = {}) { + const owner = liveSocket.owner(el); + js_default.show( + eventType, + owner, + el, + opts.display, + js_default.transitionClasses(opts.transition), + opts.time, + opts.blocking + ); + }, + hide(el, opts = {}) { + const owner = liveSocket.owner(el); + js_default.hide( + eventType, + owner, + el, + null, + js_default.transitionClasses(opts.transition), + opts.time, + opts.blocking + ); + }, + toggle(el, opts = {}) { + const owner = liveSocket.owner(el); + const inTransition = js_default.transitionClasses(opts.in); + const outTransition = js_default.transitionClasses(opts.out); + js_default.toggle( + eventType, + owner, + el, + opts.display, + inTransition, + outTransition, + opts.time, + opts.blocking + ); + }, + addClass(el, names, opts = {}) { + const classNames = Array.isArray(names) ? names : names.split(" "); + const owner = liveSocket.owner(el); + js_default.addOrRemoveClasses( + el, + classNames, + [], + js_default.transitionClasses(opts.transition), + opts.time, + owner, + opts.blocking + ); + }, + removeClass(el, names, opts = {}) { + const classNames = Array.isArray(names) ? names : names.split(" "); + const owner = liveSocket.owner(el); + js_default.addOrRemoveClasses( + el, + [], + classNames, + js_default.transitionClasses(opts.transition), + opts.time, + owner, + opts.blocking + ); + }, + toggleClass(el, names, opts = {}) { + const classNames = Array.isArray(names) ? names : names.split(" "); + const owner = liveSocket.owner(el); + js_default.toggleClasses( + el, + classNames, + js_default.transitionClasses(opts.transition), + opts.time, + owner, + opts.blocking + ); + }, + transition(el, transition, opts = {}) { + const owner = liveSocket.owner(el); + js_default.addOrRemoveClasses( + el, + [], + [], + js_default.transitionClasses(transition), + opts.time, + owner, + opts.blocking + ); + }, + setAttribute(el, attr, val) { + js_default.setOrRemoveAttrs(el, [[attr, val]], []); + }, + removeAttribute(el, attr) { + js_default.setOrRemoveAttrs(el, [], [attr]); + }, + toggleAttribute(el, attr, val1, val2) { + js_default.toggleAttr(el, attr, val1, val2); + }, + push(el, type, opts = {}) { + liveSocket.withinOwners(el, (view) => { + const data = opts.value || {}; + delete opts.value; + let e = new CustomEvent("phx:exec", { detail: { sourceElement: el } }); + js_default.exec(e, eventType, type, view, el, ["push", { data, ...opts }]); + }); + }, + navigate(href, opts = {}) { + const customEvent = new CustomEvent("phx:exec"); + liveSocket.historyRedirect( + customEvent, + href, + opts.replace ? "replace" : "push", + null, + null + ); + }, + patch(href, opts = {}) { + const customEvent = new CustomEvent("phx:exec"); + liveSocket.pushHistoryPatch( + customEvent, + href, + opts.replace ? "replace" : "push", + null + ); + }, + ignoreAttributes(el, attrs) { + js_default.ignoreAttrs(el, Array.isArray(attrs) ? attrs : [attrs]); + } + }; + }; + var HOOK_ID = "hookId"; + var DEAD_HOOK = "deadHook"; + var viewHookID = 1; + var ViewHook = class _ViewHook { + get liveSocket() { + return this.__liveSocket(); + } + static makeID() { + return viewHookID++; + } + static elementID(el) { + return dom_default.private(el, HOOK_ID); + } + static deadHook(el) { + return dom_default.private(el, DEAD_HOOK) === true; + } + constructor(view, el, callbacks) { + this.el = el; + this.__attachView(view); + this.__listeners = /* @__PURE__ */ new Set(); + this.__isDisconnected = false; + dom_default.putPrivate(this.el, HOOK_ID, _ViewHook.makeID()); + if (view && view.isDead) { + dom_default.putPrivate(this.el, DEAD_HOOK, true); + } + if (callbacks) { + const protectedProps = /* @__PURE__ */ new Set([ + "el", + "liveSocket", + "__view", + "__listeners", + "__isDisconnected", + "constructor", + // Standard object properties + // Core ViewHook API methods + "js", + "pushEvent", + "pushEventTo", + "handleEvent", + "removeHandleEvent", + "upload", + "uploadTo", + // Internal lifecycle callers + "__mounted", + "__updated", + "__beforeUpdate", + "__destroyed", + "__reconnected", + "__disconnected", + "__cleanup__" + ]); + for (const key in callbacks) { + if (Object.prototype.hasOwnProperty.call(callbacks, key)) { + this[key] = callbacks[key]; + if (protectedProps.has(key)) { + console.warn( + `Hook object for element #${el.id} overwrites core property '${key}'!` + ); + } + } + } + const lifecycleMethods = [ + "mounted", + "beforeUpdate", + "updated", + "destroyed", + "disconnected", + "reconnected" + ]; + lifecycleMethods.forEach((methodName) => { + if (callbacks[methodName] && typeof callbacks[methodName] === "function") { + this[methodName] = callbacks[methodName]; + } + }); + } + } + /** @internal */ + __attachView(view) { + if (view) { + this.__view = () => view; + this.__liveSocket = () => view.liveSocket; + } else { + this.__view = () => { + throw new Error( + `hook not yet attached to a live view: ${this.el.outerHTML}` + ); + }; + this.__liveSocket = () => { + throw new Error( + `hook not yet attached to a live view: ${this.el.outerHTML}` + ); + }; + } + } + // Default lifecycle methods + mounted() { + } + beforeUpdate() { + } + updated() { + } + destroyed() { + } + disconnected() { + } + reconnected() { + } + // Internal lifecycle callers - called by the View + /** @internal */ + __mounted() { + this.mounted(); + } + /** @internal */ + __updated() { + this.updated(); + } + /** @internal */ + __beforeUpdate() { + this.beforeUpdate(); + } + /** @internal */ + __destroyed() { + this.destroyed(); + dom_default.deletePrivate(this.el, HOOK_ID); + } + /** @internal */ + __reconnected() { + if (this.__isDisconnected) { + this.__isDisconnected = false; + this.reconnected(); + } + } + /** @internal */ + __disconnected() { + this.__isDisconnected = true; + this.disconnected(); + } + js() { + return { + ...js_commands_default(this.__view().liveSocket, "hook"), + exec: (encodedJS) => { + this.__view().liveSocket.execJS(this.el, encodedJS, "hook"); + } + }; + } + pushEvent(event, payload, onReply) { + const promise = this.__view().pushHookEvent( + this.el, + null, + event, + payload || {} + ); + if (onReply === void 0) { + return promise.then(({ reply }) => reply); + } + promise.then( + ({ reply, ref }) => onReply(reply, ref) + ).catch(() => { + }); + } + pushEventTo(selectorOrTarget, event, payload, onReply) { + if (onReply === void 0) { + const targetPair = []; + this.__view().withinTargets( + selectorOrTarget, + (view, targetCtx) => { + targetPair.push({ view, targetCtx }); + } + ); + const promises = targetPair.map(({ view, targetCtx }) => { + return view.pushHookEvent(this.el, targetCtx, event, payload || {}); + }); + return Promise.allSettled(promises); + } + this.__view().withinTargets( + selectorOrTarget, + (view, targetCtx) => { + view.pushHookEvent(this.el, targetCtx, event, payload || {}).then( + ({ reply, ref }) => onReply(reply, ref) + ).catch(() => { + }); + } + ); + } + handleEvent(event, callback) { + const callbackRef = { + event, + callback: (customEvent) => callback(customEvent.detail) + }; + window.addEventListener( + `phx:${event}`, + callbackRef.callback + ); + this.__listeners.add(callbackRef); + return callbackRef; + } + removeHandleEvent(ref) { + window.removeEventListener( + `phx:${ref.event}`, + ref.callback + ); + this.__listeners.delete(ref); + } + upload(name, files) { + return this.__view().dispatchUploads(null, name, files); + } + uploadTo(selectorOrTarget, name, files) { + return this.__view().withinTargets( + selectorOrTarget, + (view, targetCtx) => { + view.dispatchUploads(targetCtx, name, files); + } + ); + } + /** @internal */ + __cleanup__() { + this.__listeners.forEach( + (callbackRef) => this.removeHandleEvent(callbackRef) + ); + } + }; + var prependFormDataKey = (key, prefix) => { + const isArray = key.endsWith("[]"); + let baseKey = isArray ? key.slice(0, -2) : key; + baseKey = baseKey.replace(/([^\[\]]+)(\]?$)/, `${prefix}$1$2`); + if (isArray) { + baseKey += "[]"; + } + return baseKey; + }; + var serializeForm = (form, opts, onlyNames = []) => { + const { submitter } = opts; + let injectedElement; + if (submitter && submitter.name) { + const input = document.createElement("input"); + input.type = "hidden"; + const formId = submitter.getAttribute("form"); + if (formId) { + input.setAttribute("form", formId); + } + input.name = submitter.name; + input.value = submitter.value; + submitter.parentElement.insertBefore(input, submitter); + injectedElement = input; + } + const formData = new FormData(form); + const toRemove = []; + formData.forEach((val, key, _index) => { + if (val instanceof File) { + toRemove.push(key); + } + }); + toRemove.forEach((key) => formData.delete(key)); + const params = new URLSearchParams(); + const { inputsUnused, onlyHiddenInputs } = Array.from(form.elements).reduce( + (acc, input) => { + const { inputsUnused: inputsUnused2, onlyHiddenInputs: onlyHiddenInputs2 } = acc; + const key = input.name; + if (!key) { + return acc; + } + if (inputsUnused2[key] === void 0) { + inputsUnused2[key] = true; + } + if (onlyHiddenInputs2[key] === void 0) { + onlyHiddenInputs2[key] = true; + } + const isUsed = dom_default.private(input, PHX_HAS_FOCUSED) || dom_default.private(input, PHX_HAS_SUBMITTED); + const isHidden = input.type === "hidden"; + inputsUnused2[key] = inputsUnused2[key] && !isUsed; + onlyHiddenInputs2[key] = onlyHiddenInputs2[key] && isHidden; + return acc; + }, + { inputsUnused: {}, onlyHiddenInputs: {} } + ); + for (const [key, val] of formData.entries()) { + if (onlyNames.length === 0 || onlyNames.indexOf(key) >= 0) { + const isUnused = inputsUnused[key]; + const hidden = onlyHiddenInputs[key]; + if (isUnused && !(submitter && submitter.name == key) && !hidden) { + params.append(prependFormDataKey(key, "_unused_"), ""); + } + if (typeof val === "string") { + params.append(key, val); + } + } + } + if (submitter && injectedElement) { + submitter.parentElement.removeChild(injectedElement); + } + return params.toString(); + }; + var View = class _View { + static closestView(el) { + const liveViewEl = el.closest(PHX_VIEW_SELECTOR); + return liveViewEl ? dom_default.private(liveViewEl, "view") : null; + } + constructor(el, liveSocket, parentView, flash, liveReferer) { + this.isDead = false; + this.liveSocket = liveSocket; + this.flash = flash; + this.parent = parentView; + this.root = parentView ? parentView.root : this; + this.el = el; + const boundView = dom_default.private(this.el, "view"); + if (boundView !== void 0 && boundView.isDead !== true) { + logError( + `The DOM element for this view has already been bound to a view. An element can only ever be associated with a single view! Please ensure that you are not trying to initialize multiple LiveSockets on the same page. This could happen if you're accidentally trying to render your root layout more than once. Ensure that the template set on the LiveView is different than the root layout. - `,{view:o}),new Error("Cannot bind multiple views to the same DOM element.");c.putPrivate(this.el,"view",this),this.id=this.el.id,this.el.setAttribute(re,this.root.id),this.ref=0,this.lastAckRef=null,this.childJoins=0,this.loaderTimer=null,this.disconnectedTimer=null,this.pendingDiffs=[],this.pendingForms=new Set,this.redirect=!1,this.href=null,this.joinCount=this.parent?this.parent.joinCount-1:0,this.joinAttempts=0,this.joinPending=!0,this.destroyed=!1,this.joinCallback=function(a){a&&a()},this.stopCallback=function(){},this.pendingJoinOps=[],this.viewHooks={},this.formSubmits=[],this.children=this.parent?null:{},this.root.children[this.id]={},this.formsForRecovery={},this.channel=this.liveSocket.channel(`lv:${this.id}`,()=>{let a=this.href&&this.expandURL(this.href);return{redirect:this.redirect?a:void 0,url:this.redirect?void 0:a||void 0,params:this.connectParams(r),session:this.getSession(),static:this.getStatic(),flash:this.flash,sticky:this.el.hasAttribute(Ot)}}),this.portalElementIds=new Set}setHref(t){this.href=t}setRedirect(t){this.redirect=!0,this.href=t}isMain(){return this.el.hasAttribute(Ut)}connectParams(t){let i=this.liveSocket.params(this.el),s=c.all(document,`[${this.binding(Cs)}]`).map(n=>n.src||n.href).filter(n=>typeof n=="string");return s.length>0&&(i._track_static=s),i._mounts=this.joinCount,i._mount_attempts=this.joinAttempts,i._live_referer=t,this.joinAttempts++,i}isConnected(){return this.channel.canPush()}getSession(){return this.el.getAttribute(Q)}getStatic(){let t=this.el.getAttribute(we);return t===""?null:t}destroy(t=function(){}){this.destroyAllChildren(),this.destroyPortalElements(),this.destroyed=!0,c.deletePrivate(this.el,"view"),delete this.root.children[this.id],this.parent&&delete this.root.children[this.parent.id][this.id],clearTimeout(this.loaderTimer);let i=()=>{t();for(let s in this.viewHooks)this.destroyHook(this.viewHooks[s])};c.markPhxChildDestroyed(this.el),this.log("destroyed",()=>["the child has been removed from the parent"]),this.channel.leave().receive("ok",i).receive("error",i).receive("timeout",i)}setContainerClasses(...t){this.el.classList.remove(ni,me,_e,ri,He),this.el.classList.add(...t)}showLoader(t){if(clearTimeout(this.loaderTimer),t)this.loaderTimer=setTimeout(()=>this.showLoader(),t);else{for(let i in this.viewHooks)this.viewHooks[i].__disconnected();this.setContainerClasses(me)}}execAll(t){c.all(this.el,`[${t}]`,i=>this.liveSocket.execJS(i,i.getAttribute(t)))}hideLoader(){clearTimeout(this.loaderTimer),clearTimeout(this.disconnectedTimer),this.setContainerClasses(ni),this.execAll(this.binding("connected"))}triggerReconnected(){for(let t in this.viewHooks)this.viewHooks[t].__reconnected()}log(t,i){this.liveSocket.log(this,t,i)}transition(t,i,s=function(){}){this.liveSocket.transition(t,i,s)}withinTargets(t,i,s=document){if(t instanceof HTMLElement||t instanceof SVGElement)return this.liveSocket.owner(t,n=>i(n,t));if(ne(t))c.findComponentNodeList(this.id,t,s).length===0?P(`no component found matching phx-target of ${t}`):i(this,parseInt(t));else{let n=Array.from(s.querySelectorAll(t));n.length===0&&P(`nothing found matching the phx-target selector "${t}"`),n.forEach(r=>this.liveSocket.owner(r,o=>i(o,r)))}}applyDiff(t,i,s){this.log(t,()=>["",lt(i)]);let{diff:n,reply:r,events:o,title:a}=Ci.extract(i),h=o.reduce((d,p)=>(p.length===3&&p[2]==!0?d.pre.push(p.slice(0,-1)):d.post.push(p),d),{pre:[],post:[]});this.liveSocket.dispatchEvents(h.pre);let l=()=>{s({diff:n,reply:r,events:h.post}),(typeof a=="string"||t=="mount"&&this.isMain())&&window.requestAnimationFrame(()=>c.putTitle(a))};"onDocumentPatch"in this.liveSocket.domCallbacks?this.liveSocket.triggerDOM("onDocumentPatch",[l]):l()}onJoin(t){let{rendered:i,container:s,liveview_version:n,pid:r}=t;if(s){let[o,a]=s;this.el=c.replaceRootContainer(this.el,o,a)}this.childJoins=0,this.joinPending=!0,this.flash=null,this.root===this&&(this.formsForRecovery=this.getFormsForRecovery()),this.isMain()&&window.history.state===null&&U.pushState("replace",{type:"patch",id:this.id,position:this.liveSocket.currentHistoryPosition}),n!==this.liveSocket.version()&&console.warn(`LiveView asset version mismatch. JavaScript version ${this.liveSocket.version()} vs. server ${n}. To avoid issues, please ensure that your assets use the same version as the server.`),r&&this.el.setAttribute(Ds,r),U.dropLocal(this.liveSocket.localStorage,window.location.pathname,xi),this.applyDiff("mount",i,({diff:o,events:a})=>{this.rendered=new Ci(this.id,o);let[h,l]=this.renderContainer(null,"join");this.dropPendingRefs(),this.joinCount++,this.joinAttempts=0,this.maybeRecoverForms(h,()=>{this.onJoinComplete(t,h,l,a)})})}dropPendingRefs(){c.all(document,`[${W}="${this.refSrc()}"]`,t=>{t.removeAttribute(De),t.removeAttribute(W),t.removeAttribute(D)})}onJoinComplete({live_patch:t},i,s,n){if(this.joinCount>1||this.parent&&!this.parent.isJoinPending())return this.applyJoinPatch(t,i,s,n);c.findPhxChildrenInFragment(i,this.id).filter(o=>{let a=o.id&&this.el.querySelector(`[id="${o.id}"]`),h=a&&a.getAttribute(we);return h&&o.setAttribute(we,h),a&&a.setAttribute(re,this.root.id),this.joinChild(o)}).length===0?this.parent?(this.root.pendingJoinOps.push([this,()=>this.applyJoinPatch(t,i,s,n)]),this.parent.ackJoin(this)):(this.onAllChildJoinsComplete(),this.applyJoinPatch(t,i,s,n)):this.root.pendingJoinOps.push([this,()=>this.applyJoinPatch(t,i,s,n)])}attachTrueDocEl(){this.el=c.byId(this.id),this.el.setAttribute(re,this.root.id)}execNewMounted(t=document){let i=this.binding(Lt),s=this.binding(Dt);this.all(t,`[${i}], [${s}]`,n=>{c.maintainPrivateHooks(n,n,i,s),this.maybeAddNewHook(n)}),this.all(t,`[${this.binding(Ne)}], [data-phx-${Ne}]`,n=>{this.maybeAddNewHook(n)}),this.all(t,`[${this.binding(hi)}]`,n=>{this.maybeMounted(n)})}all(t,i,s){c.all(t,i,n=>{this.ownsElement(n)&&s(n)})}applyJoinPatch(t,i,s,n){this.joinCount>1&&this.pendingJoinOps.length&&(this.pendingJoinOps.forEach(o=>typeof o=="function"&&o()),this.pendingJoinOps=[]),this.attachTrueDocEl();let r=new nt(this,this.el,this.id,i,s,null);if(r.markPrunableContentForRemoval(),this.performPatch(r,!1,!0),this.joinNewChildren(),this.execNewMounted(),this.joinPending=!1,this.liveSocket.dispatchEvents(n),this.applyPendingUpdates(),t){let{kind:o,to:a}=t;this.liveSocket.historyPatch(a,o)}this.hideLoader(),this.joinCount>1&&this.triggerReconnected(),this.stopCallback()}triggerBeforeUpdateHook(t,i){this.liveSocket.triggerDOM("onBeforeElUpdated",[t,i]);let s=this.getHook(t),n=s&&c.isIgnored(t,this.binding(ut));if(s&&!t.isEqualNode(i)&&!(n&&Js(t.dataset,i.dataset)))return s.__beforeUpdate(),s}maybeMounted(t){let i=t.getAttribute(this.binding(hi)),s=i&&c.private(t,"mounted");i&&!s&&(this.liveSocket.execJS(t,i),c.putPrivate(t,"mounted",!0))}maybeAddNewHook(t){let i=this.addHook(t);i&&i.__mounted()}performPatch(t,i,s=!1){let n=[],r=!1,o=new Set;return this.liveSocket.triggerDOM("onPatchStart",[t.targetContainer]),t.after("added",a=>{this.liveSocket.triggerDOM("onNodeAdded",[a]);let h=this.binding(Lt),l=this.binding(Dt);c.maintainPrivateHooks(a,a,h,l),this.maybeAddNewHook(a),a.getAttribute&&this.maybeMounted(a)}),t.after("phxChildAdded",a=>{c.isPhxSticky(a)?this.liveSocket.joinRootViews():r=!0}),t.before("updated",(a,h)=>{this.triggerBeforeUpdateHook(a,h)&&o.add(a.id),A.onBeforeElUpdated(a,h)}),t.after("updated",a=>{o.has(a.id)&&this.getHook(a).__updated()}),t.after("discarded",a=>{a.nodeType===Node.ELEMENT_NODE&&n.push(a)}),t.after("transitionsDiscarded",a=>this.afterElementsRemoved(a,i)),t.perform(s),this.afterElementsRemoved(n,i),this.liveSocket.triggerDOM("onPatchEnd",[t.targetContainer]),r}afterElementsRemoved(t,i){let s=[];t.forEach(n=>{let r=c.all(n,`[${Le}="${this.id}"][${Z}]`),o=c.all(n,`[${this.binding(Ne)}], [data-phx-hook]`);r.concat(n).forEach(a=>{let h=this.componentID(a);ne(h)&&s.indexOf(h)===-1&&a.getAttribute(Le)===this.id&&s.push(h)}),o.concat(n).forEach(a=>{let h=this.getHook(a);h&&this.destroyHook(h)})}),i&&this.maybePushComponentsDestroyed(s)}joinNewChildren(){c.findPhxChildren(document,this.id).forEach(t=>this.joinChild(t))}maybeRecoverForms(t,i){let s=this.binding("change"),n=this.root.formsForRecovery,r=document.createElement("template");r.innerHTML=t,c.all(r.content,`[${Bt}]`).forEach(h=>{r.content.firstElementChild.appendChild(h.content.firstElementChild)});let o=r.content.firstElementChild;o.id=this.id,o.setAttribute(re,this.root.id),o.setAttribute(Q,this.getSession()),o.setAttribute(we,this.getStatic()),o.setAttribute(ye,this.parent?this.parent.id:null);let a=c.all(r.content,"form").filter(h=>h.id&&n[h.id]).filter(h=>!this.pendingForms.has(h.id)).filter(h=>n[h.id].getAttribute(s)===h.getAttribute(s)).map(h=>[n[h.id],h]);if(a.length===0)return i();a.forEach(([h,l],d)=>{this.pendingForms.add(l.id),this.pushFormRecovery(h,l,r.content.firstElementChild,()=>{this.pendingForms.delete(l.id),d===a.length-1&&i()})})}getChildById(t){return this.root.children[this.id][t]}getDescendentByEl(t){return t.id===this.id?this:this.children[t.getAttribute(ye)]?.[t.id]}destroyDescendent(t){for(let i in this.root.children)for(let s in this.root.children[i])if(s===t)return this.root.children[i][s].destroy()}joinChild(t){if(!this.getChildById(t.id)){let s=new Fi(t,this.liveSocket,this);return this.root.children[this.id][s.id]=s,s.join(),this.childJoins++,!0}}isJoinPending(){return this.joinPending}ackJoin(t){this.childJoins--,this.childJoins===0&&(this.parent?this.parent.ackJoin(this):this.onAllChildJoinsComplete())}onAllChildJoinsComplete(){this.pendingForms.clear(),this.formsForRecovery={},this.joinCallback(()=>{this.pendingJoinOps.forEach(([t,i])=>{t.isDestroyed()||i()}),this.pendingJoinOps=[]})}update(t,i,s=!1){if(this.isJoinPending()||this.liveSocket.hasPendingLink()&&this.root.isMain())return s||this.pendingDiffs.push({diff:t,events:i}),!1;this.rendered.mergeDiff(t);let n=!1;return this.rendered.isComponentOnlyDiff(t)?this.liveSocket.time("component patch complete",()=>{c.findExistingParentCIDs(this.id,this.rendered.componentCIDs(t)).forEach(o=>{this.componentPatch(this.rendered.getComponent(t,o),o)&&(n=!0)})}):gi(t)||this.liveSocket.time("full patch complete",()=>{let[r,o]=this.renderContainer(t,"update"),a=new nt(this,this.el,this.id,r,o,null);n=this.performPatch(a,!0)}),this.liveSocket.dispatchEvents(i),n&&this.joinNewChildren(),!0}renderContainer(t,i){return this.liveSocket.time(`toString diff (${i})`,()=>{let s=this.el.tagName,n=t?this.rendered.componentCIDs(t):null,{buffer:r,streams:o}=this.rendered.toString(n);return[`<${s}>${r}`,o]})}componentPatch(t,i){if(gi(t))return!1;let{buffer:s,streams:n}=this.rendered.componentToString(i),r=new nt(this,this.el,this.id,s,n,i);return this.performPatch(r,!0)}getHook(t){return this.viewHooks[ge.elementID(t)]}addHook(t){let i=ge.elementID(t);if(!(t.getAttribute&&!this.ownsElement(t)))if(i&&!this.viewHooks[i]){if(ge.deadHook(t))return;let s=c.getCustomElHook(t)||P(`no hook found for custom element: ${t.id}`);return this.viewHooks[i]=s,s.__attachView(this),s}else{if(i||!t.getAttribute)return;{let s=t.getAttribute(`data-phx-${Ne}`)||t.getAttribute(this.binding(Ne));if(!s)return;let n=this.liveSocket.getHookDefinition(s);if(n){if(!t.id){P(`no DOM ID for hook "${s}". Hooks require a unique ID on each element.`,t);return}let r;try{if(typeof n=="function"&&n.prototype instanceof ge)r=new n(this,t);else if(typeof n=="object"&&n!==null)r=new ge(this,t,n);else{P(`Invalid hook definition for "${s}". Expected a class extending ViewHook or an object definition.`,t);return}}catch(o){let a=o instanceof Error?o.message:String(o);P(`Failed to create hook "${s}": ${a}`,t);return}return this.viewHooks[ge.elementID(r.el)]=r,r}else s!==null&&P(`unknown hook found for "${s}"`,t)}}}destroyHook(t){let i=ge.elementID(t.el);t.__destroyed(),t.__cleanup__(),delete this.viewHooks[i]}applyPendingUpdates(){this.pendingDiffs=this.pendingDiffs.filter(({diff:t,events:i})=>!this.update(t,i,!0)),this.eachChild(t=>t.applyPendingUpdates())}eachChild(t){let i=this.root.children[this.id]||{};for(let s in i)t(this.getChildById(s))}onChannel(t,i){this.liveSocket.onChannel(this.channel,t,s=>{this.isJoinPending()?this.joinCount>1?this.pendingJoinOps.push(()=>i(s)):this.root.pendingJoinOps.push([this,()=>i(s)]):this.liveSocket.requestDOMUpdate(()=>i(s))})}bindChannel(){this.liveSocket.onChannel(this.channel,"diff",t=>{this.liveSocket.requestDOMUpdate(()=>{this.applyDiff("update",t,({diff:i,events:s})=>this.update(i,s))})}),this.onChannel("redirect",({to:t,flash:i})=>this.onRedirect({to:t,flash:i})),this.onChannel("live_patch",t=>this.onLivePatch(t)),this.onChannel("live_redirect",t=>this.onLiveRedirect(t)),this.channel.onError(t=>this.onError(t)),this.channel.onClose(t=>this.onClose(t))}destroyAllChildren(){this.eachChild(t=>t.destroy())}onLiveRedirect(t){let{to:i,kind:s,flash:n}=t,r=this.expandURL(i),o=new CustomEvent("phx:server-navigate",{detail:{to:i,kind:s,flash:n}});this.liveSocket.historyRedirect(o,r,s,n)}onLivePatch(t){let{to:i,kind:s}=t;this.href=this.expandURL(i),this.liveSocket.historyPatch(i,s)}expandURL(t){return t.startsWith("/")?`${window.location.protocol}//${window.location.host}${t}`:t}onRedirect({to:t,flash:i,reloadToken:s}){this.liveSocket.redirect(t,i,s)}isDestroyed(){return this.destroyed}joinDead(){this.isDead=!0}joinPush(){return this.joinPush=this.joinPush||this.channel.join(),this.joinPush}join(t){this.showLoader(this.liveSocket.loaderTimeout),this.bindChannel(),this.isMain()&&(this.stopCallback=this.liveSocket.withPageLoading({to:this.href,kind:"initial"})),this.joinCallback=i=>{i=i||function(){},t?t(this.joinCount,i):i()},this.wrapPush(()=>this.channel.join(),{ok:i=>this.liveSocket.requestDOMUpdate(()=>this.onJoin(i)),error:i=>this.onJoinError(i),timeout:()=>this.onJoinError({reason:"timeout"})})}onJoinError(t){if(t.reason==="reload"){this.log("error",()=>[`failed mount with ${t.status}. Falling back to page reload`,t]),this.onRedirect({to:this.liveSocket.main.href,reloadToken:t.token});return}else if(t.reason==="unauthorized"||t.reason==="stale"){this.log("error",()=>["unauthorized live_redirect. Falling back to page request",t]),this.onRedirect({to:this.liveSocket.main.href,flash:this.flash});return}if((t.redirect||t.live_redirect)&&(this.joinPending=!1,this.channel.leave()),t.redirect)return this.onRedirect(t.redirect);if(t.live_redirect)return this.onLiveRedirect(t.live_redirect);if(this.log("error",()=>["unable to join",t]),this.isMain())this.displayError([me,_e,He],{unstructuredError:t,errorKind:"server"}),this.liveSocket.isConnected()&&this.liveSocket.reloadWithJitter(this);else{this.joinAttempts>=ci&&(this.root.displayError([me,_e,He],{unstructuredError:t,errorKind:"server"}),this.log("error",()=>[`giving up trying to mount after ${ci} tries`,t]),this.destroy());let i=c.byId(this.el.id);i?(c.mergeAttrs(i,this.el),this.displayError([me,_e,He],{unstructuredError:t,errorKind:"server"}),this.el=i):this.destroy()}}onClose(t){if(!this.isDestroyed()){if(this.isMain()&&this.liveSocket.hasPendingLink()&&t!=="leave")return this.liveSocket.reloadWithJitter(this);this.destroyAllChildren(),this.liveSocket.dropActiveElement(this),this.liveSocket.isUnloaded()&&this.showLoader(Ns)}}onError(t){this.onClose(t),this.liveSocket.isConnected()&&this.log("error",()=>["view crashed",t]),this.liveSocket.isUnloaded()||(this.liveSocket.isConnected()?this.displayError([me,_e,He],{unstructuredError:t,errorKind:"server"}):this.displayError([me,_e,ri],{unstructuredError:t,errorKind:"client"}))}displayError(t,i={}){this.isMain()&&c.dispatchEvent(window,"phx:page-loading-start",{detail:{to:this.href,kind:"error",...i}}),this.showLoader(),this.setContainerClasses(...t),this.delayedDisconnected()}delayedDisconnected(){this.disconnectedTimer=setTimeout(()=>{this.execAll(this.binding("disconnected"))},this.liveSocket.disconnectedTimeout)}wrapPush(t,i){let s=this.liveSocket.getLatencySim(),n=s?r=>setTimeout(()=>!this.isDestroyed()&&r(),s):r=>!this.isDestroyed()&&r();n(()=>{t().receive("ok",r=>n(()=>i.ok&&i.ok(r))).receive("error",r=>n(()=>i.error&&i.error(r))).receive("timeout",()=>n(()=>i.timeout&&i.timeout()))})}pushWithReply(t,i,s){if(!this.isConnected())return Promise.reject(new Error("no connection"));let[n,[r],o]=t?t({payload:s}):[null,[],{}],a=this.joinCount,h=function(){};return o.page_loading&&(h=this.liveSocket.withPageLoading({kind:"element",target:r})),typeof s.cid!="number"&&delete s.cid,new Promise((l,d)=>{this.wrapPush(()=>this.channel.push(i,s,Us),{ok:p=>{n!==null&&(this.lastAckRef=n);let m=g=>{p.redirect&&this.onRedirect(p.redirect),p.live_patch&&this.onLivePatch(p.live_patch),p.live_redirect&&this.onLiveRedirect(p.live_redirect),h(),l({resp:p,reply:g,ref:n})};p.diff?this.liveSocket.requestDOMUpdate(()=>{this.applyDiff("update",p.diff,({diff:g,reply:u,events:v})=>{n!==null&&this.undoRefs(n,s.event),this.update(g,v),m(u)})}):(n!==null&&this.undoRefs(n,s.event),m(null))},error:p=>d(new Error(`failed with reason: ${JSON.stringify(p)}`)),timeout:()=>{d(new Error("timeout")),this.joinCount===a&&this.liveSocket.reloadWithJitter(this,()=>{this.log("timeout",()=>["received timeout while communicating with server. Falling back to hard refresh for recovery"])})}})})}undoRefs(t,i,s){if(!this.isConnected())return;let n=`[${W}="${this.refSrc()}"]`;s?(s=new Set(s),c.all(document,n,r=>{s&&!s.has(r)||(c.all(r,n,o=>this.undoElRef(o,t,i)),this.undoElRef(r,t,i))})):c.all(document,n,r=>this.undoElRef(r,t,i))}undoElRef(t,i,s){new Nt(t).maybeUndo(i,s,r=>{let o=new nt(this,t,this.id,r,[],null,{undoRef:i}),a=this.performPatch(o,!0);c.all(t,`[${W}="${this.refSrc()}"]`,h=>this.undoElRef(h,i,s)),a&&this.joinNewChildren()})}refSrc(){return this.el.id}putRef(t,i,s,n={}){let r=this.ref++,o=this.binding(oi);if(n.loading){let a=c.all(document,n.loading).map(h=>({el:h,lock:!0,loading:!0}));t=t.concat(a)}for(let{el:a,lock:h,loading:l}of t){if(!h&&!l)throw new Error("putRef requires lock or loading");if(a.setAttribute(W,this.refSrc()),l&&a.setAttribute(De,r),h&&a.setAttribute(D,r),!l||n.submitter&&!(a===n.submitter||a===n.form))continue;let d=new Promise(u=>{a.addEventListener(`phx:undo-lock:${r}`,()=>u(g),{once:!0})}),p=new Promise(u=>{a.addEventListener(`phx:undo-loading:${r}`,()=>u(g),{once:!0})});a.classList.add(`phx-${s}-loading`);let m=a.getAttribute(o);m!==null&&(a.getAttribute(dt)||a.setAttribute(dt,a.textContent),m!==""&&(a.textContent=m),a.setAttribute(Re,a.getAttribute(Re)||a.disabled),a.setAttribute("disabled",""));let g={event:i,eventType:s,ref:r,isLoading:l,isLocked:h,lockElements:t.filter(({lock:u})=>u).map(({el:u})=>u),loadingElements:t.filter(({loading:u})=>u).map(({el:u})=>u),unlock:u=>{u=Array.isArray(u)?u:[u],this.undoRefs(r,i,u)},lockComplete:d,loadingComplete:p,lock:u=>new Promise(v=>{if(this.isAcked(r))return v(g);u.setAttribute(D,r),u.setAttribute(W,this.refSrc()),u.addEventListener(`phx:lock-stop:${r}`,()=>v(g),{once:!0})})};n.payload&&(g.payload=n.payload),n.target&&(g.target=n.target),n.originalEvent&&(g.originalEvent=n.originalEvent),a.dispatchEvent(new CustomEvent("phx:push",{detail:g,bubbles:!0,cancelable:!1})),i&&a.dispatchEvent(new CustomEvent(`phx:push:${i}`,{detail:g,bubbles:!0,cancelable:!1}))}return[r,t.map(({el:a})=>a),n]}isAcked(t){return this.lastAckRef!==null&&this.lastAckRef>=t}componentID(t){let i=t.getAttribute&&t.getAttribute(Z);return i?parseInt(i):null}targetComponentID(t,i,s={}){if(ne(i))return i;let n=s.target||t.getAttribute(this.binding("target"));return ne(n)?parseInt(n):i&&(n!==null||s.target)?this.closestComponentID(i):null}closestComponentID(t){return ne(t)?t:t?Ie(t.closest(`[${Z}],[${fe}]`),i=>{if(i.hasAttribute(Z))return this.ownsElement(i)&&this.componentID(i);if(i.hasAttribute(fe)){let s=c.byId(i.getAttribute(fe));return this.closestComponentID(s)}}):null}pushHookEvent(t,i,s,n){if(!this.isConnected())return this.log("hook",()=>["unable to push hook event. LiveView not connected",s,n]),Promise.reject(new Error("unable to push hook event. LiveView not connected"));let r=()=>this.putRef([{el:t,loading:!0,lock:!0}],s,"hook",{payload:n,target:i});return this.pushWithReply(r,"event",{type:"hook",event:s,value:n,cid:this.closestComponentID(i)}).then(({resp:o,reply:a,ref:h})=>({reply:a,ref:h}))}extractMeta(t,i,s){let n=this.binding("value-");for(let r=0;r=0&&!t.checked&&delete i.value),s){i||(i={});for(let r in s)i[r]=s[r]}return i}pushEvent(t,i,s,n,r,o={},a){this.pushWithReply(h=>this.putRef([{el:i,loading:!0,lock:!0}],n,t,{...o,payload:h?.payload}),"event",{type:t,event:n,value:this.extractMeta(i,r,o.value),cid:this.targetComponentID(i,s,o)}).then(({reply:h})=>a&&a(h)).catch(h=>P("Failed to push event",h))}pushFileProgress(t,i,s,n=function(){}){this.liveSocket.withinOwners(t.form,(r,o)=>{r.pushWithReply(null,"progress",{event:t.getAttribute(r.binding(Ms)),ref:t.getAttribute(oe),entry_ref:i,progress:s,cid:r.targetComponentID(t.form,o)}).then(()=>n()).catch(a=>P("Failed to push file progress",a))})}pushInput(t,i,s,n,r,o){if(!t.form)throw new Error("form events require the input to be inside a form");let a,h=ne(s)?s:this.targetComponentID(t.form,i,r),l=u=>this.putRef([{el:t,loading:!0,lock:!0},{el:t.form,loading:!0,lock:!0}],n,"change",{...r,payload:u?.payload}),d,p=this.extractMeta(t.form,{},r.value),m={};t instanceof HTMLButtonElement&&(m.submitter=t),t.getAttribute(this.binding("change"))?d=rt(t.form,m,[t.name]):d=rt(t.form,m),c.isUploadInput(t)&&t.files&&t.files.length>0&&M.trackFiles(t,Array.from(t.files)),a=M.serializeUploads(t);let g={type:"form",event:n,value:d,meta:{_target:r._target||"undefined",...p},uploads:a,cid:h};this.pushWithReply(l,"event",g).then(({resp:u})=>{c.isUploadInput(t)&&c.isAutoUpload(t)?Nt.onUnlock(t,()=>{if(M.filesAwaitingPreflight(t).length>0){let[v,w]=l();this.undoRefs(v,n,[t.form]),this.uploadFiles(t.form,n,i,v,h,O=>{o&&o(u),this.triggerAwaitingSubmit(t.form,n),this.undoRefs(v,n)})}}):o&&o(u)}).catch(u=>P("Failed to push input event",u))}triggerAwaitingSubmit(t,i){let s=this.getScheduledSubmit(t);if(s){let[n,r,o,a]=s;this.cancelSubmit(t,i),a()}}getScheduledSubmit(t){return this.formSubmits.find(([i,s,n,r])=>i.isSameNode(t))}scheduleSubmit(t,i,s,n){if(this.getScheduledSubmit(t))return!0;this.formSubmits.push([t,i,s,n])}cancelSubmit(t,i){this.formSubmits=this.formSubmits.filter(([s,n,r,o])=>s.isSameNode(t)?(this.undoRefs(n,i),!1):!0)}disableForm(t,i,s={}){let n=u=>!(be(u,`${this.binding(ut)}=ignore`,u.form)||be(u,"data-phx-update=ignore",u.form)),r=u=>u.hasAttribute(this.binding(oi)),o=u=>u.tagName=="BUTTON",a=u=>["INPUT","TEXTAREA","SELECT"].includes(u.tagName),h=Array.from(t.elements),l=h.filter(r),d=h.filter(o).filter(n),p=h.filter(a).filter(n);d.forEach(u=>{u.setAttribute(Re,u.disabled),u.disabled=!0}),p.forEach(u=>{u.setAttribute(Mt,u.readOnly),u.readOnly=!0,u.files&&(u.setAttribute(Re,u.disabled),u.disabled=!0)});let m=l.concat(d).concat(p).map(u=>({el:u,loading:!0,lock:!0})),g=[{el:t,loading:!0,lock:!1}].concat(m).reverse();return this.putRef(g,i,"submit",s)}pushFormSubmit(t,i,s,n,r,o){let a=l=>this.disableForm(t,s,{...r,form:t,payload:l?.payload,submitter:n});c.putPrivate(t,"submitter",n);let h=this.targetComponentID(t,i);if(M.hasUploadsInProgress(t)){let[l,d]=a(),p=()=>this.pushFormSubmit(t,i,s,n,r,o);return this.scheduleSubmit(t,l,r,p)}else if(M.inputsAwaitingPreflight(t).length>0){let[l,d]=a(),p=()=>[l,d,r];this.uploadFiles(t,s,i,l,h,m=>{if(M.inputsAwaitingPreflight(t).length>0)return this.undoRefs(l,s);let g=this.extractMeta(t,{},r.value),u=rt(t,{submitter:n});this.pushWithReply(p,"event",{type:"form",event:s,value:u,meta:g,cid:h}).then(({resp:v})=>o(v)).catch(v=>P("Failed to push form submit",v))})}else if(!(t.hasAttribute(W)&&t.classList.contains("phx-submit-loading"))){let l=this.extractMeta(t,{},r.value),d=rt(t,{submitter:n});this.pushWithReply(a,"event",{type:"form",event:s,value:d,meta:l,cid:h}).then(({resp:p})=>o(p)).catch(p=>P("Failed to push form submit",p))}}uploadFiles(t,i,s,n,r,o){let a=this.joinCount,h=M.activeFileInputs(t),l=h.length;h.forEach(d=>{let p=new M(d,this,()=>{l--,l===0&&o()}),m=p.entries().map(u=>u.toPreflightPayload());if(m.length===0){l--;return}let g={ref:d.getAttribute(oe),entries:m,cid:this.targetComponentID(d.form,s)};this.log("upload",()=>["sending preflight request",g]),this.pushWithReply(null,"allow_upload",g).then(({resp:u})=>{if(this.log("upload",()=>["got preflight response",u]),p.entries().forEach(v=>{u.entries&&!u.entries[v.ref]&&this.handleFailedEntryPreflight(v.ref,"failed preflight",p)}),u.error||Object.keys(u.entries).length===0)this.undoRefs(n,i),(u.error||[]).map(([w,O])=>{this.handleFailedEntryPreflight(w,O,p)});else{let v=w=>{this.channel.onError(()=>{this.joinCount===a&&w()})};p.initAdapterUpload(u,v,this.liveSocket)}}).catch(u=>P("Failed to push upload",u))})}handleFailedEntryPreflight(t,i,s){if(s.isAutoUpload()){let n=s.entries().find(r=>r.ref===t.toString());n&&n.cancel()}else s.entries().map(n=>n.cancel());this.log("upload",()=>[`error for entry ${t}`,i])}dispatchUploads(t,i,s){let n=this.targetCtxElement(t)||this.el,r=c.findUploadInputs(n).filter(o=>o.name===i);r.length===0?P(`no live file inputs found matching the name "${i}"`):r.length>1?P(`duplicate live file inputs found matching the name "${i}"`):c.dispatchEvent(r[0],Ii,{detail:{files:s}})}targetCtxElement(t){if(ne(t)){let[i]=c.findComponentNodeList(this.id,t);return i}else return t||null}pushFormRecovery(t,i,s,n){let r=this.binding("change"),o=i.getAttribute(this.binding("target"))||i,a=i.getAttribute(this.binding(ai))||i.getAttribute(this.binding("change")),h=Array.from(t.elements).filter(p=>c.isFormInput(p)&&p.name&&!p.hasAttribute(r));if(h.length===0){n();return}h.forEach(p=>p.hasAttribute(oe)&&M.clearFiles(p));let l=h.find(p=>p.type!=="hidden")||h[0],d=0;this.withinTargets(o,(p,m)=>{let g=this.targetComponentID(i,m);d++;let u=new CustomEvent("phx:form-recovery",{detail:{sourceElement:t}});A.exec(u,"change",a,this,l,["push",{_target:l.name,targetView:p,targetCtx:m,newCid:g,callback:()=>{d--,d===0&&n()}}])},s)}pushLinkPatch(t,i,s,n){let r=this.liveSocket.setPendingLink(i),o=t.isTrusted&&t.type!=="popstate",a=s?()=>this.putRef([{el:s,loading:o,lock:!0}],null,"click"):null,h=()=>this.liveSocket.redirect(window.location.href),l=i.startsWith("/")?`${location.protocol}//${location.host}${i}`:i;this.pushWithReply(a,"live_patch",{url:l}).then(({resp:d})=>{this.liveSocket.requestDOMUpdate(()=>{if(d.link_redirect)this.liveSocket.replaceMain(i,null,n,r);else{if(d.redirect)return;this.liveSocket.commitPendingLink(r)&&(this.href=i),this.applyPendingUpdates(),n&&n(r)}})},({error:d,timeout:p})=>h())}getFormsForRecovery(){if(this.joinCount===0)return{};let t=this.binding("change");return c.all(document,`#${CSS.escape(this.id)} form[${t}], [${Ee}="${CSS.escape(this.id)}"] form[${t}]`).filter(i=>i.id).filter(i=>i.elements.length>0).filter(i=>i.getAttribute(this.binding(ai))!=="ignore").map(i=>{let s=i.cloneNode(!0);$t(s,i,{onBeforeElUpdated:(r,o)=>(c.copyPrivates(r,o),r.getAttribute("form")===i.id?(r.parentNode.removeChild(r),!1):!0)});let n=document.querySelectorAll(`[form="${CSS.escape(i.id)}"]`);return Array.from(n).forEach(r=>{let o=r.cloneNode(!0);$t(o,r),c.copyPrivates(o,r),o.removeAttribute("form"),s.appendChild(o)}),s}).reduce((i,s)=>(i[s.id]=s,i),{})}maybePushComponentsDestroyed(t){let i=t.filter(n=>c.findComponentNodeList(this.id,n).length===0),s=n=>{this.isDestroyed()||P("Failed to push components destroyed",n)};i.length>0&&(i.forEach(n=>this.rendered.resetRender(n)),this.pushWithReply(null,"cids_will_destroy",{cids:i}).then(()=>{this.liveSocket.requestDOMUpdate(()=>{let n=i.filter(r=>c.findComponentNodeList(this.id,r).length===0);n.length>0&&this.pushWithReply(null,"cids_destroyed",{cids:n}).then(({resp:r})=>{this.rendered.pruneCIDs(r.cids)}).catch(s)})}).catch(s))}ownsElement(t){let i=c.closestViewEl(t);return t.getAttribute(ye)===this.id||i&&i.id===this.id||!i&&this.isDead}submitForm(t,i,s,n,r={}){c.putPrivate(t,We,!0),Array.from(t.elements).forEach(a=>c.putPrivate(a,We,!0)),this.liveSocket.blurActiveElement(this),this.pushFormSubmit(t,i,s,n,r,()=>{this.liveSocket.restorePreviouslyActiveFocus()})}binding(t){return this.liveSocket.binding(t)}pushPortalElementId(t){this.portalElementIds.add(t)}dropPortalElementId(t){this.portalElementIds.delete(t)}destroyPortalElements(){this.liveSocket.unloaded||this.portalElementIds.forEach(t=>{let i=document.getElementById(t);i&&i.remove()})}};var Sn=class{constructor(e,t,i={}){if(this.unloaded=!1,!t||t.constructor.name==="Object")throw new Error(` + `, + { view: boundView } + ); + throw new Error("Cannot bind multiple views to the same DOM element."); + } + dom_default.putPrivate(this.el, "view", this); + this.id = this.el.id; + this.el.setAttribute(PHX_ROOT_ID, this.root.id); + this.ref = 0; + this.lastAckRef = null; + this.childJoins = 0; + this.loaderTimer = null; + this.disconnectedTimer = null; + this.pendingDiffs = []; + this.pendingForms = /* @__PURE__ */ new Set(); + this.redirect = false; + this.href = null; + this.joinCount = this.parent ? this.parent.joinCount - 1 : 0; + this.joinAttempts = 0; + this.joinPending = true; + this.destroyed = false; + this.joinCallback = function(onDone) { + onDone && onDone(); + }; + this.stopCallback = function() { + }; + this.pendingJoinOps = []; + this.viewHooks = {}; + this.formSubmits = []; + this.children = this.parent ? null : {}; + this.root.children[this.id] = {}; + this.formsForRecovery = {}; + this.channel = this.liveSocket.channel(`lv:${this.id}`, () => { + const url = this.href && this.expandURL(this.href); + return { + redirect: this.redirect ? url : void 0, + url: this.redirect ? void 0 : url || void 0, + params: this.connectParams(liveReferer), + session: this.getSession(), + static: this.getStatic(), + flash: this.flash, + sticky: this.el.hasAttribute(PHX_STICKY) + }; + }); + this.portalElementIds = /* @__PURE__ */ new Set(); + } + setHref(href) { + this.href = href; + } + setRedirect(href) { + this.redirect = true; + this.href = href; + } + isMain() { + return this.el.hasAttribute(PHX_MAIN); + } + connectParams(liveReferer) { + const params = this.liveSocket.params(this.el); + const manifest = dom_default.all(document, `[${this.binding(PHX_TRACK_STATIC)}]`).map((node) => node.src || node.href).filter((url) => typeof url === "string"); + if (manifest.length > 0) { + params["_track_static"] = manifest; + } + params["_mounts"] = this.joinCount; + params["_mount_attempts"] = this.joinAttempts; + params["_live_referer"] = liveReferer; + this.joinAttempts++; + return params; + } + isConnected() { + return this.channel.canPush(); + } + getSession() { + return this.el.getAttribute(PHX_SESSION); + } + getStatic() { + const val = this.el.getAttribute(PHX_STATIC); + return val === "" ? null : val; + } + destroy(callback = function() { + }) { + this.destroyAllChildren(); + this.destroyPortalElements(); + this.destroyed = true; + dom_default.deletePrivate(this.el, "view"); + delete this.root.children[this.id]; + if (this.parent) { + delete this.root.children[this.parent.id][this.id]; + } + clearTimeout(this.loaderTimer); + const onFinished = () => { + callback(); + for (const id in this.viewHooks) { + this.destroyHook(this.viewHooks[id]); + } + }; + dom_default.markPhxChildDestroyed(this.el); + this.log("destroyed", () => ["the child has been removed from the parent"]); + this.channel.leave().receive("ok", onFinished).receive("error", onFinished).receive("timeout", onFinished); + } + setContainerClasses(...classes) { + this.el.classList.remove( + PHX_CONNECTED_CLASS, + PHX_LOADING_CLASS, + PHX_ERROR_CLASS, + PHX_CLIENT_ERROR_CLASS, + PHX_SERVER_ERROR_CLASS + ); + this.el.classList.add(...classes); + } + showLoader(timeout) { + clearTimeout(this.loaderTimer); + if (timeout) { + this.loaderTimer = setTimeout(() => this.showLoader(), timeout); + } else { + for (const id in this.viewHooks) { + this.viewHooks[id].__disconnected(); + } + this.setContainerClasses(PHX_LOADING_CLASS); + } + } + execAll(binding) { + dom_default.all( + this.el, + `[${binding}]`, + (el) => this.liveSocket.execJS(el, el.getAttribute(binding)) + ); + } + hideLoader() { + clearTimeout(this.loaderTimer); + clearTimeout(this.disconnectedTimer); + this.setContainerClasses(PHX_CONNECTED_CLASS); + this.execAll(this.binding("connected")); + } + triggerReconnected() { + for (const id in this.viewHooks) { + this.viewHooks[id].__reconnected(); + } + } + log(kind, msgCallback) { + this.liveSocket.log(this, kind, msgCallback); + } + transition(time, onStart, onDone = function() { + }) { + this.liveSocket.transition(time, onStart, onDone); + } + // calls the callback with the view and target element for the given phxTarget + // targets can be: + // * an element itself, then it is simply passed to liveSocket.owner; + // * a CID (Component ID), then we first search the component's element in the DOM + // * a selector, then we search the selector in the DOM and call the callback + // for each element found with the corresponding owner view + withinTargets(phxTarget, callback, dom = document) { + if (phxTarget instanceof HTMLElement || phxTarget instanceof SVGElement) { + return this.liveSocket.owner( + phxTarget, + (view) => callback(view, phxTarget) + ); + } + if (isCid(phxTarget)) { + const targets = dom_default.findComponentNodeList(this.id, phxTarget, dom); + if (targets.length === 0) { + logError(`no component found matching phx-target of ${phxTarget}`); + } else { + callback(this, parseInt(phxTarget)); + } + } else { + const targets = Array.from(dom.querySelectorAll(phxTarget)); + if (targets.length === 0) { + logError( + `nothing found matching the phx-target selector "${phxTarget}"` + ); + } + targets.forEach( + (target) => this.liveSocket.owner(target, (view) => callback(view, target)) + ); + } + } + applyDiff(type, rawDiff, callback) { + this.log(type, () => ["", clone(rawDiff)]); + const { diff, reply, events, title } = Rendered.extract(rawDiff); + const ev = events.reduce( + (acc, args) => { + if (args.length === 3 && args[2] == true) { + acc.pre.push(args.slice(0, -1)); + } else { + acc.post.push(args); + } + return acc; + }, + { pre: [], post: [] } + ); + this.liveSocket.dispatchEvents(ev.pre); + const update = () => { + callback({ diff, reply, events: ev.post }); + if (typeof title === "string" || type == "mount" && this.isMain()) { + window.requestAnimationFrame(() => dom_default.putTitle(title)); + } + }; + if ("onDocumentPatch" in this.liveSocket.domCallbacks) { + this.liveSocket.triggerDOM("onDocumentPatch", [update]); + } else { + update(); + } + } + onJoin(resp) { + const { rendered, container, liveview_version, pid } = resp; + if (container) { + const [tag, attrs] = container; + this.el = dom_default.replaceRootContainer(this.el, tag, attrs); + } + this.childJoins = 0; + this.joinPending = true; + this.flash = null; + if (this.root === this) { + this.formsForRecovery = this.getFormsForRecovery(); + } + if (this.isMain() && window.history.state === null) { + browser_default.pushState("replace", { + type: "patch", + id: this.id, + position: this.liveSocket.currentHistoryPosition + }); + } + if (liveview_version !== this.liveSocket.version()) { + console.warn( + `LiveView asset version mismatch. JavaScript version ${this.liveSocket.version()} vs. server ${liveview_version}. To avoid issues, please ensure that your assets use the same version as the server.` + ); + } + if (pid) { + this.el.setAttribute(PHX_LV_PID, pid); + } + browser_default.dropLocal( + this.liveSocket.localStorage, + window.location.pathname, + CONSECUTIVE_RELOADS + ); + this.applyDiff("mount", rendered, ({ diff, events }) => { + this.rendered = new Rendered(this.id, diff); + const [html, streams] = this.renderContainer(null, "join"); + this.dropPendingRefs(); + this.joinCount++; + this.joinAttempts = 0; + this.maybeRecoverForms(html, () => { + this.onJoinComplete(resp, html, streams, events); + }); + }); + } + dropPendingRefs() { + dom_default.all(document, `[${PHX_REF_SRC}="${this.refSrc()}"]`, (el) => { + el.removeAttribute(PHX_REF_LOADING); + el.removeAttribute(PHX_REF_SRC); + el.removeAttribute(PHX_REF_LOCK); + }); + } + onJoinComplete({ live_patch }, html, streams, events) { + if (this.joinCount > 1 || this.parent && !this.parent.isJoinPending()) { + return this.applyJoinPatch(live_patch, html, streams, events); + } + const newChildren = dom_default.findPhxChildrenInFragment(html, this.id).filter( + (toEl) => { + const fromEl = toEl.id && this.el.querySelector(`[id="${toEl.id}"]`); + const phxStatic = fromEl && fromEl.getAttribute(PHX_STATIC); + if (phxStatic) { + toEl.setAttribute(PHX_STATIC, phxStatic); + } + if (fromEl) { + fromEl.setAttribute(PHX_ROOT_ID, this.root.id); + } + return this.joinChild(toEl); + } + ); + if (newChildren.length === 0) { + if (this.parent) { + this.root.pendingJoinOps.push([ + this, + () => this.applyJoinPatch(live_patch, html, streams, events) + ]); + this.parent.ackJoin(this); + } else { + this.onAllChildJoinsComplete(); + this.applyJoinPatch(live_patch, html, streams, events); + } + } else { + this.root.pendingJoinOps.push([ + this, + () => this.applyJoinPatch(live_patch, html, streams, events) + ]); + } + } + attachTrueDocEl() { + this.el = dom_default.byId(this.id); + this.el.setAttribute(PHX_ROOT_ID, this.root.id); + } + // this is invoked for dead and live views, so we must filter by + // by owner to ensure we aren't duplicating hooks across disconnect + // and connected states. This also handles cases where hooks exist + // in a root layout with a LV in the body + execNewMounted(parent = document) { + let phxViewportTop = this.binding(PHX_VIEWPORT_TOP); + let phxViewportBottom = this.binding(PHX_VIEWPORT_BOTTOM); + this.all( + parent, + `[${phxViewportTop}], [${phxViewportBottom}]`, + (hookEl) => { + dom_default.maintainPrivateHooks( + hookEl, + hookEl, + phxViewportTop, + phxViewportBottom + ); + this.maybeAddNewHook(hookEl); + } + ); + this.all( + parent, + `[${this.binding(PHX_HOOK)}], [data-phx-${PHX_HOOK}]`, + (hookEl) => { + this.maybeAddNewHook(hookEl); + } + ); + this.all(parent, `[${this.binding(PHX_MOUNTED)}]`, (el) => { + this.maybeMounted(el); + }); + } + all(parent, selector, callback) { + dom_default.all(parent, selector, (el) => { + if (this.ownsElement(el)) { + callback(el); + } + }); + } + applyJoinPatch(live_patch, html, streams, events) { + if (this.joinCount > 1) { + if (this.pendingJoinOps.length) { + this.pendingJoinOps.forEach((cb) => typeof cb === "function" && cb()); + this.pendingJoinOps = []; + } + } + this.attachTrueDocEl(); + const patch = new DOMPatch(this, this.el, this.id, html, streams, null); + patch.markPrunableContentForRemoval(); + this.performPatch(patch, false, true); + this.joinNewChildren(); + this.execNewMounted(); + this.joinPending = false; + this.liveSocket.dispatchEvents(events); + this.applyPendingUpdates(); + if (live_patch) { + const { kind, to } = live_patch; + this.liveSocket.historyPatch(to, kind); + } + this.hideLoader(); + if (this.joinCount > 1) { + this.triggerReconnected(); + } + this.stopCallback(); + } + triggerBeforeUpdateHook(fromEl, toEl) { + this.liveSocket.triggerDOM("onBeforeElUpdated", [fromEl, toEl]); + const hook = this.getHook(fromEl); + const isIgnored = hook && dom_default.isIgnored(fromEl, this.binding(PHX_UPDATE)); + if (hook && !fromEl.isEqualNode(toEl) && !(isIgnored && isEqualObj(fromEl.dataset, toEl.dataset))) { + hook.__beforeUpdate(); + return hook; + } + } + maybeMounted(el) { + const phxMounted = el.getAttribute(this.binding(PHX_MOUNTED)); + const hasBeenInvoked = phxMounted && dom_default.private(el, "mounted"); + if (phxMounted && !hasBeenInvoked) { + this.liveSocket.execJS(el, phxMounted); + dom_default.putPrivate(el, "mounted", true); + } + } + maybeAddNewHook(el) { + const newHook = this.addHook(el); + if (newHook) { + newHook.__mounted(); + } + } + performPatch(patch, pruneCids, isJoinPatch = false) { + const removedEls = []; + let phxChildrenAdded = false; + const updatedHookIds = /* @__PURE__ */ new Set(); + this.liveSocket.triggerDOM("onPatchStart", [patch.targetContainer]); + patch.after("added", (el) => { + this.liveSocket.triggerDOM("onNodeAdded", [el]); + const phxViewportTop = this.binding(PHX_VIEWPORT_TOP); + const phxViewportBottom = this.binding(PHX_VIEWPORT_BOTTOM); + dom_default.maintainPrivateHooks(el, el, phxViewportTop, phxViewportBottom); + this.maybeAddNewHook(el); + if (el.getAttribute) { + this.maybeMounted(el); + } + }); + patch.after("phxChildAdded", (el) => { + if (dom_default.isPhxSticky(el)) { + this.liveSocket.joinRootViews(); + } else { + phxChildrenAdded = true; + } + }); + patch.before("updated", (fromEl, toEl) => { + const hook = this.triggerBeforeUpdateHook(fromEl, toEl); + if (hook) { + updatedHookIds.add(fromEl.id); + } + js_default.onBeforeElUpdated(fromEl, toEl); + }); + patch.after("updated", (el) => { + if (updatedHookIds.has(el.id)) { + this.getHook(el).__updated(); + } + }); + patch.after("discarded", (el) => { + if (el.nodeType === Node.ELEMENT_NODE) { + removedEls.push(el); + } + }); + patch.after( + "transitionsDiscarded", + (els) => this.afterElementsRemoved(els, pruneCids) + ); + patch.perform(isJoinPatch); + this.afterElementsRemoved(removedEls, pruneCids); + this.liveSocket.triggerDOM("onPatchEnd", [patch.targetContainer]); + return phxChildrenAdded; + } + afterElementsRemoved(elements, pruneCids) { + const destroyedCIDs = []; + elements.forEach((parent) => { + const components = dom_default.all( + parent, + `[${PHX_VIEW_REF}="${this.id}"][${PHX_COMPONENT}]` + ); + const hooks = dom_default.all( + parent, + `[${this.binding(PHX_HOOK)}], [data-phx-hook]` + ); + components.concat(parent).forEach((el) => { + const cid = this.componentID(el); + if (isCid(cid) && destroyedCIDs.indexOf(cid) === -1 && el.getAttribute(PHX_VIEW_REF) === this.id) { + destroyedCIDs.push(cid); + } + }); + hooks.concat(parent).forEach((hookEl) => { + const hook = this.getHook(hookEl); + hook && this.destroyHook(hook); + }); + }); + if (pruneCids) { + this.maybePushComponentsDestroyed(destroyedCIDs); + } + } + joinNewChildren() { + dom_default.findPhxChildren(document, this.id).forEach((el) => this.joinChild(el)); + } + maybeRecoverForms(html, callback) { + const phxChange = this.binding("change"); + const oldForms = this.root.formsForRecovery; + const template = document.createElement("template"); + template.innerHTML = html; + dom_default.all(template.content, `[${PHX_PORTAL}]`).forEach((portalTemplate) => { + template.content.firstElementChild.appendChild( + portalTemplate.content.firstElementChild + ); + }); + const rootEl = template.content.firstElementChild; + rootEl.id = this.id; + rootEl.setAttribute(PHX_ROOT_ID, this.root.id); + rootEl.setAttribute(PHX_SESSION, this.getSession()); + rootEl.setAttribute(PHX_STATIC, this.getStatic()); + rootEl.setAttribute(PHX_PARENT_ID, this.parent ? this.parent.id : null); + const formsToRecover = ( + // we go over all forms in the new DOM; because this is only the HTML for the current + // view, we can be sure that all forms are owned by this view: + dom_default.all(template.content, "form").filter((newForm) => newForm.id && oldForms[newForm.id]).filter((newForm) => !this.pendingForms.has(newForm.id)).filter( + (newForm) => oldForms[newForm.id].getAttribute(phxChange) === newForm.getAttribute(phxChange) + ).map((newForm) => { + return [oldForms[newForm.id], newForm]; + }) + ); + if (formsToRecover.length === 0) { + return callback(); + } + formsToRecover.forEach(([oldForm, newForm], i) => { + this.pendingForms.add(newForm.id); + this.pushFormRecovery( + oldForm, + newForm, + template.content.firstElementChild, + () => { + this.pendingForms.delete(newForm.id); + if (i === formsToRecover.length - 1) { + callback(); + } + } + ); + }); + } + getChildById(id) { + return this.root.children[this.id][id]; + } + getDescendentByEl(el) { + if (el.id === this.id) { + return this; + } else { + return this.children[el.getAttribute(PHX_PARENT_ID)]?.[el.id]; + } + } + destroyDescendent(id) { + for (const parentId in this.root.children) { + for (const childId in this.root.children[parentId]) { + if (childId === id) { + return this.root.children[parentId][childId].destroy(); + } + } + } + } + joinChild(el) { + const child = this.getChildById(el.id); + if (!child) { + const view = new _View(el, this.liveSocket, this); + this.root.children[this.id][view.id] = view; + view.join(); + this.childJoins++; + return true; + } + } + isJoinPending() { + return this.joinPending; + } + ackJoin(_child) { + this.childJoins--; + if (this.childJoins === 0) { + if (this.parent) { + this.parent.ackJoin(this); + } else { + this.onAllChildJoinsComplete(); + } + } + } + onAllChildJoinsComplete() { + this.pendingForms.clear(); + this.formsForRecovery = {}; + this.joinCallback(() => { + this.pendingJoinOps.forEach(([view, op]) => { + if (!view.isDestroyed()) { + op(); + } + }); + this.pendingJoinOps = []; + }); + } + update(diff, events, isPending = false) { + if (this.isJoinPending() || this.liveSocket.hasPendingLink() && this.root.isMain()) { + if (!isPending) { + this.pendingDiffs.push({ diff, events }); + } + return false; + } + this.rendered.mergeDiff(diff); + let phxChildrenAdded = false; + if (this.rendered.isComponentOnlyDiff(diff)) { + this.liveSocket.time("component patch complete", () => { + const parentCids = dom_default.findExistingParentCIDs( + this.id, + this.rendered.componentCIDs(diff) + ); + parentCids.forEach((parentCID) => { + if (this.componentPatch( + this.rendered.getComponent(diff, parentCID), + parentCID + )) { + phxChildrenAdded = true; + } + }); + }); + } else if (!isEmpty(diff)) { + this.liveSocket.time("full patch complete", () => { + const [html, streams] = this.renderContainer(diff, "update"); + const patch = new DOMPatch(this, this.el, this.id, html, streams, null); + phxChildrenAdded = this.performPatch(patch, true); + }); + } + this.liveSocket.dispatchEvents(events); + if (phxChildrenAdded) { + this.joinNewChildren(); + } + return true; + } + renderContainer(diff, kind) { + return this.liveSocket.time(`toString diff (${kind})`, () => { + const tag = this.el.tagName; + const cids = diff ? this.rendered.componentCIDs(diff) : null; + const { buffer: html, streams } = this.rendered.toString(cids); + return [`<${tag}>${html}`, streams]; + }); + } + componentPatch(diff, cid) { + if (isEmpty(diff)) + return false; + const { buffer: html, streams } = this.rendered.componentToString(cid); + const patch = new DOMPatch(this, this.el, this.id, html, streams, cid); + const childrenAdded = this.performPatch(patch, true); + return childrenAdded; + } + getHook(el) { + return this.viewHooks[ViewHook.elementID(el)]; + } + addHook(el) { + const hookElId = ViewHook.elementID(el); + if (el.getAttribute && !this.ownsElement(el)) { + return; + } + if (hookElId && !this.viewHooks[hookElId]) { + if (ViewHook.deadHook(el)) { + return; + } + const hook = dom_default.getCustomElHook(el) || logError(`no hook found for custom element: ${el.id}`); + this.viewHooks[hookElId] = hook; + hook.__attachView(this); + return hook; + } else if (hookElId || !el.getAttribute) { + return; + } else { + const hookName = el.getAttribute(`data-phx-${PHX_HOOK}`) || el.getAttribute(this.binding(PHX_HOOK)); + if (!hookName) { + return; + } + const hookDefinition = this.liveSocket.getHookDefinition(hookName); + if (hookDefinition) { + if (!el.id) { + logError( + `no DOM ID for hook "${hookName}". Hooks require a unique ID on each element.`, + el + ); + return; + } + let hookInstance; + try { + if (typeof hookDefinition === "function" && hookDefinition.prototype instanceof ViewHook) { + hookInstance = new hookDefinition(this, el); + } else if (typeof hookDefinition === "object" && hookDefinition !== null) { + hookInstance = new ViewHook(this, el, hookDefinition); + } else { + logError( + `Invalid hook definition for "${hookName}". Expected a class extending ViewHook or an object definition.`, + el + ); + return; + } + } catch (e) { + const errorMessage = e instanceof Error ? e.message : String(e); + logError(`Failed to create hook "${hookName}": ${errorMessage}`, el); + return; + } + this.viewHooks[ViewHook.elementID(hookInstance.el)] = hookInstance; + return hookInstance; + } else if (hookName !== null) { + logError(`unknown hook found for "${hookName}"`, el); + } + } + } + destroyHook(hook) { + const hookId = ViewHook.elementID(hook.el); + hook.__destroyed(); + hook.__cleanup__(); + delete this.viewHooks[hookId]; + } + applyPendingUpdates() { + this.pendingDiffs = this.pendingDiffs.filter( + ({ diff, events }) => !this.update(diff, events, true) + ); + this.eachChild((child) => child.applyPendingUpdates()); + } + eachChild(callback) { + const children = this.root.children[this.id] || {}; + for (const id in children) { + callback(this.getChildById(id)); + } + } + onChannel(event, cb) { + this.liveSocket.onChannel(this.channel, event, (resp) => { + if (this.isJoinPending()) { + if (this.joinCount > 1) { + this.pendingJoinOps.push(() => cb(resp)); + } else { + this.root.pendingJoinOps.push([this, () => cb(resp)]); + } + } else { + this.liveSocket.requestDOMUpdate(() => cb(resp)); + } + }); + } + bindChannel() { + this.liveSocket.onChannel(this.channel, "diff", (rawDiff) => { + this.liveSocket.requestDOMUpdate(() => { + this.applyDiff( + "update", + rawDiff, + ({ diff, events }) => this.update(diff, events) + ); + }); + }); + this.onChannel( + "redirect", + ({ to, flash }) => this.onRedirect({ to, flash }) + ); + this.onChannel("live_patch", (redir) => this.onLivePatch(redir)); + this.onChannel("live_redirect", (redir) => this.onLiveRedirect(redir)); + this.channel.onError((reason) => this.onError(reason)); + this.channel.onClose((reason) => this.onClose(reason)); + } + destroyAllChildren() { + this.eachChild((child) => child.destroy()); + } + onLiveRedirect(redir) { + const { to, kind, flash } = redir; + const url = this.expandURL(to); + const e = new CustomEvent("phx:server-navigate", { + detail: { to, kind, flash } + }); + this.liveSocket.historyRedirect(e, url, kind, flash); + } + onLivePatch(redir) { + const { to, kind } = redir; + this.href = this.expandURL(to); + this.liveSocket.historyPatch(to, kind); + } + expandURL(to) { + return to.startsWith("/") ? `${window.location.protocol}//${window.location.host}${to}` : to; + } + /** + * @param {{to: string, flash?: string, reloadToken?: string}} redirect + */ + onRedirect({ to, flash, reloadToken }) { + this.liveSocket.redirect(to, flash, reloadToken); + } + isDestroyed() { + return this.destroyed; + } + joinDead() { + this.isDead = true; + } + joinPush() { + this.joinPush = this.joinPush || this.channel.join(); + return this.joinPush; + } + join(callback) { + this.showLoader(this.liveSocket.loaderTimeout); + this.bindChannel(); + if (this.isMain()) { + this.stopCallback = this.liveSocket.withPageLoading({ + to: this.href, + kind: "initial" + }); + } + this.joinCallback = (onDone) => { + onDone = onDone || function() { + }; + callback ? callback(this.joinCount, onDone) : onDone(); + }; + this.wrapPush(() => this.channel.join(), { + ok: (resp) => this.liveSocket.requestDOMUpdate(() => this.onJoin(resp)), + error: (error) => this.onJoinError(error), + timeout: () => this.onJoinError({ reason: "timeout" }) + }); + } + onJoinError(resp) { + if (resp.reason === "reload") { + this.log("error", () => [ + `failed mount with ${resp.status}. Falling back to page reload`, + resp + ]); + this.onRedirect({ + to: this.liveSocket.main.href, + reloadToken: resp.token + }); + return; + } else if (resp.reason === "unauthorized" || resp.reason === "stale") { + this.log("error", () => [ + "unauthorized live_redirect. Falling back to page request", + resp + ]); + this.onRedirect({ to: this.liveSocket.main.href, flash: this.flash }); + return; + } + if (resp.redirect || resp.live_redirect) { + this.joinPending = false; + this.channel.leave(); + } + if (resp.redirect) { + return this.onRedirect(resp.redirect); + } + if (resp.live_redirect) { + return this.onLiveRedirect(resp.live_redirect); + } + this.log("error", () => ["unable to join", resp]); + if (this.isMain()) { + this.displayError( + [PHX_LOADING_CLASS, PHX_ERROR_CLASS, PHX_SERVER_ERROR_CLASS], + { unstructuredError: resp, errorKind: "server" } + ); + if (this.liveSocket.isConnected()) { + this.liveSocket.reloadWithJitter(this); + } + } else { + if (this.joinAttempts >= MAX_CHILD_JOIN_ATTEMPTS) { + this.root.displayError( + [PHX_LOADING_CLASS, PHX_ERROR_CLASS, PHX_SERVER_ERROR_CLASS], + { unstructuredError: resp, errorKind: "server" } + ); + this.log("error", () => [ + `giving up trying to mount after ${MAX_CHILD_JOIN_ATTEMPTS} tries`, + resp + ]); + this.destroy(); + } + const trueChildEl = dom_default.byId(this.el.id); + if (trueChildEl) { + dom_default.mergeAttrs(trueChildEl, this.el); + this.displayError( + [PHX_LOADING_CLASS, PHX_ERROR_CLASS, PHX_SERVER_ERROR_CLASS], + { unstructuredError: resp, errorKind: "server" } + ); + this.el = trueChildEl; + } else { + this.destroy(); + } + } + } + onClose(reason) { + if (this.isDestroyed()) { + return; + } + if (this.isMain() && this.liveSocket.hasPendingLink() && reason !== "leave") { + return this.liveSocket.reloadWithJitter(this); + } + this.destroyAllChildren(); + this.liveSocket.dropActiveElement(this); + if (this.liveSocket.isUnloaded()) { + this.showLoader(BEFORE_UNLOAD_LOADER_TIMEOUT); + } + } + onError(reason) { + this.onClose(reason); + if (this.liveSocket.isConnected()) { + this.log("error", () => ["view crashed", reason]); + } + if (!this.liveSocket.isUnloaded()) { + if (this.liveSocket.isConnected()) { + this.displayError( + [PHX_LOADING_CLASS, PHX_ERROR_CLASS, PHX_SERVER_ERROR_CLASS], + { unstructuredError: reason, errorKind: "server" } + ); + } else { + this.displayError( + [PHX_LOADING_CLASS, PHX_ERROR_CLASS, PHX_CLIENT_ERROR_CLASS], + { unstructuredError: reason, errorKind: "client" } + ); + } + } + } + displayError(classes, details = {}) { + if (this.isMain()) { + dom_default.dispatchEvent(window, "phx:page-loading-start", { + detail: { to: this.href, kind: "error", ...details } + }); + } + this.showLoader(); + this.setContainerClasses(...classes); + this.delayedDisconnected(); + } + delayedDisconnected() { + this.disconnectedTimer = setTimeout(() => { + this.execAll(this.binding("disconnected")); + }, this.liveSocket.disconnectedTimeout); + } + wrapPush(callerPush, receives) { + const latency = this.liveSocket.getLatencySim(); + const withLatency = latency ? (cb) => setTimeout(() => !this.isDestroyed() && cb(), latency) : (cb) => !this.isDestroyed() && cb(); + withLatency(() => { + callerPush().receive( + "ok", + (resp) => withLatency(() => receives.ok && receives.ok(resp)) + ).receive( + "error", + (reason) => withLatency(() => receives.error && receives.error(reason)) + ).receive( + "timeout", + () => withLatency(() => receives.timeout && receives.timeout()) + ); + }); + } + pushWithReply(refGenerator, event, payload) { + if (!this.isConnected()) { + return Promise.reject(new Error("no connection")); + } + const [ref, [el], opts] = refGenerator ? refGenerator({ payload }) : [null, [], {}]; + const oldJoinCount = this.joinCount; + let onLoadingDone = function() { + }; + if (opts.page_loading) { + onLoadingDone = this.liveSocket.withPageLoading({ + kind: "element", + target: el + }); + } + if (typeof payload.cid !== "number") { + delete payload.cid; + } + return new Promise((resolve, reject) => { + this.wrapPush(() => this.channel.push(event, payload, PUSH_TIMEOUT), { + ok: (resp) => { + if (ref !== null) { + this.lastAckRef = ref; + } + const finish = (hookReply) => { + if (resp.redirect) { + this.onRedirect(resp.redirect); + } + if (resp.live_patch) { + this.onLivePatch(resp.live_patch); + } + if (resp.live_redirect) { + this.onLiveRedirect(resp.live_redirect); + } + onLoadingDone(); + resolve({ resp, reply: hookReply, ref }); + }; + if (resp.diff) { + this.liveSocket.requestDOMUpdate(() => { + this.applyDiff("update", resp.diff, ({ diff, reply, events }) => { + if (ref !== null) { + this.undoRefs(ref, payload.event); + } + this.update(diff, events); + finish(reply); + }); + }); + } else { + if (ref !== null) { + this.undoRefs(ref, payload.event); + } + finish(null); + } + }, + error: (reason) => reject(new Error(`failed with reason: ${JSON.stringify(reason)}`)), + timeout: () => { + reject(new Error("timeout")); + if (this.joinCount === oldJoinCount) { + this.liveSocket.reloadWithJitter(this, () => { + this.log("timeout", () => [ + "received timeout while communicating with server. Falling back to hard refresh for recovery" + ]); + }); + } + } + }); + }); + } + undoRefs(ref, phxEvent, onlyEls) { + if (!this.isConnected()) { + return; + } + const selector = `[${PHX_REF_SRC}="${this.refSrc()}"]`; + if (onlyEls) { + onlyEls = new Set(onlyEls); + dom_default.all(document, selector, (parent) => { + if (onlyEls && !onlyEls.has(parent)) { + return; + } + dom_default.all( + parent, + selector, + (child) => this.undoElRef(child, ref, phxEvent) + ); + this.undoElRef(parent, ref, phxEvent); + }); + } else { + dom_default.all(document, selector, (el) => this.undoElRef(el, ref, phxEvent)); + } + } + undoElRef(el, ref, phxEvent) { + const elRef = new ElementRef(el); + elRef.maybeUndo(ref, phxEvent, (clonedTree) => { + const patch = new DOMPatch(this, el, this.id, clonedTree, [], null, { + undoRef: ref + }); + const phxChildrenAdded = this.performPatch(patch, true); + dom_default.all( + el, + `[${PHX_REF_SRC}="${this.refSrc()}"]`, + (child) => this.undoElRef(child, ref, phxEvent) + ); + if (phxChildrenAdded) { + this.joinNewChildren(); + } + }); + } + refSrc() { + return this.el.id; + } + putRef(elements, phxEvent, eventType, opts = {}) { + const newRef = this.ref++; + const disableWith = this.binding(PHX_DISABLE_WITH); + if (opts.loading) { + const loadingEls = dom_default.all(document, opts.loading).map((el) => { + return { el, lock: true, loading: true }; + }); + elements = elements.concat(loadingEls); + } + for (const { el, lock, loading } of elements) { + if (!lock && !loading) { + throw new Error("putRef requires lock or loading"); + } + el.setAttribute(PHX_REF_SRC, this.refSrc()); + if (loading) { + el.setAttribute(PHX_REF_LOADING, newRef); + } + if (lock) { + el.setAttribute(PHX_REF_LOCK, newRef); + } + if (!loading || opts.submitter && !(el === opts.submitter || el === opts.form)) { + continue; + } + const lockCompletePromise = new Promise((resolve) => { + el.addEventListener(`phx:undo-lock:${newRef}`, () => resolve(detail), { + once: true + }); + }); + const loadingCompletePromise = new Promise((resolve) => { + el.addEventListener( + `phx:undo-loading:${newRef}`, + () => resolve(detail), + { once: true } + ); + }); + el.classList.add(`phx-${eventType}-loading`); + const disableText = el.getAttribute(disableWith); + if (disableText !== null) { + if (!el.getAttribute(PHX_DISABLE_WITH_RESTORE)) { + el.setAttribute(PHX_DISABLE_WITH_RESTORE, el.textContent); + } + if (disableText !== "") { + el.textContent = disableText; + } + el.setAttribute( + PHX_DISABLED, + el.getAttribute(PHX_DISABLED) || el.disabled + ); + el.setAttribute("disabled", ""); + } + const detail = { + event: phxEvent, + eventType, + ref: newRef, + isLoading: loading, + isLocked: lock, + lockElements: elements.filter(({ lock: lock2 }) => lock2).map(({ el: el2 }) => el2), + loadingElements: elements.filter(({ loading: loading2 }) => loading2).map(({ el: el2 }) => el2), + unlock: (els) => { + els = Array.isArray(els) ? els : [els]; + this.undoRefs(newRef, phxEvent, els); + }, + lockComplete: lockCompletePromise, + loadingComplete: loadingCompletePromise, + lock: (lockEl) => { + return new Promise((resolve) => { + if (this.isAcked(newRef)) { + return resolve(detail); + } + lockEl.setAttribute(PHX_REF_LOCK, newRef); + lockEl.setAttribute(PHX_REF_SRC, this.refSrc()); + lockEl.addEventListener( + `phx:lock-stop:${newRef}`, + () => resolve(detail), + { once: true } + ); + }); + } + }; + if (opts.payload) { + detail["payload"] = opts.payload; + } + if (opts.target) { + detail["target"] = opts.target; + } + if (opts.originalEvent) { + detail["originalEvent"] = opts.originalEvent; + } + el.dispatchEvent( + new CustomEvent("phx:push", { + detail, + bubbles: true, + cancelable: false + }) + ); + if (phxEvent) { + el.dispatchEvent( + new CustomEvent(`phx:push:${phxEvent}`, { + detail, + bubbles: true, + cancelable: false + }) + ); + } + } + return [newRef, elements.map(({ el }) => el), opts]; + } + isAcked(ref) { + return this.lastAckRef !== null && this.lastAckRef >= ref; + } + componentID(el) { + const cid = el.getAttribute && el.getAttribute(PHX_COMPONENT); + return cid ? parseInt(cid) : null; + } + targetComponentID(target, targetCtx, opts = {}) { + if (isCid(targetCtx)) { + return targetCtx; + } + const cidOrSelector = opts.target || target.getAttribute(this.binding("target")); + if (isCid(cidOrSelector)) { + return parseInt(cidOrSelector); + } else if (targetCtx && (cidOrSelector !== null || opts.target)) { + return this.closestComponentID(targetCtx); + } else { + return null; + } + } + closestComponentID(targetCtx) { + if (isCid(targetCtx)) { + return targetCtx; + } else if (targetCtx) { + return maybe( + // We either use the closest data-phx-component binding, or - + // in case of portals - continue with the portal source. + // This is necessary if teleporting an element outside of its LiveComponent. + targetCtx.closest(`[${PHX_COMPONENT}],[${PHX_TELEPORTED_SRC}]`), + (el) => { + if (el.hasAttribute(PHX_COMPONENT)) { + return this.ownsElement(el) && this.componentID(el); + } + if (el.hasAttribute(PHX_TELEPORTED_SRC)) { + const portalParent = dom_default.byId(el.getAttribute(PHX_TELEPORTED_SRC)); + return this.closestComponentID(portalParent); + } + } + ); + } else { + return null; + } + } + pushHookEvent(el, targetCtx, event, payload) { + if (!this.isConnected()) { + this.log("hook", () => [ + "unable to push hook event. LiveView not connected", + event, + payload + ]); + return Promise.reject( + new Error("unable to push hook event. LiveView not connected") + ); + } + const refGenerator = () => this.putRef([{ el, loading: true, lock: true }], event, "hook", { + payload, + target: targetCtx + }); + return this.pushWithReply(refGenerator, "event", { + type: "hook", + event, + value: payload, + cid: this.closestComponentID(targetCtx) + }).then(({ resp: _resp, reply, ref }) => ({ reply, ref })); + } + extractMeta(el, meta, value) { + const prefix = this.binding("value-"); + for (let i = 0; i < el.attributes.length; i++) { + if (!meta) { + meta = {}; + } + const name = el.attributes[i].name; + if (name.startsWith(prefix)) { + meta[name.replace(prefix, "")] = el.getAttribute(name); + } + } + if (el.value !== void 0 && !(el instanceof HTMLFormElement)) { + if (!meta) { + meta = {}; + } + meta.value = el.value; + if (el.tagName === "INPUT" && CHECKABLE_INPUTS.indexOf(el.type) >= 0 && !el.checked) { + delete meta.value; + } + } + if (value) { + if (!meta) { + meta = {}; + } + for (const key in value) { + meta[key] = value[key]; + } + } + return meta; + } + pushEvent(type, el, targetCtx, phxEvent, meta, opts = {}, onReply) { + this.pushWithReply( + (maybePayload) => this.putRef([{ el, loading: true, lock: true }], phxEvent, type, { + ...opts, + payload: maybePayload?.payload + }), + "event", + { + type, + event: phxEvent, + value: this.extractMeta(el, meta, opts.value), + cid: this.targetComponentID(el, targetCtx, opts) + } + ).then(({ reply }) => onReply && onReply(reply)).catch((error) => logError("Failed to push event", error)); + } + pushFileProgress(fileEl, entryRef, progress, onReply = function() { + }) { + this.liveSocket.withinOwners(fileEl.form, (view, targetCtx) => { + view.pushWithReply(null, "progress", { + event: fileEl.getAttribute(view.binding(PHX_PROGRESS)), + ref: fileEl.getAttribute(PHX_UPLOAD_REF), + entry_ref: entryRef, + progress, + cid: view.targetComponentID(fileEl.form, targetCtx) + }).then(() => onReply()).catch((error) => logError("Failed to push file progress", error)); + }); + } + pushInput(inputEl, targetCtx, forceCid, phxEvent, opts, callback) { + if (!inputEl.form) { + throw new Error("form events require the input to be inside a form"); + } + let uploads; + const cid = isCid(forceCid) ? forceCid : this.targetComponentID(inputEl.form, targetCtx, opts); + const refGenerator = (maybePayload) => { + return this.putRef( + [ + { el: inputEl, loading: true, lock: true }, + { el: inputEl.form, loading: true, lock: true } + ], + phxEvent, + "change", + { ...opts, payload: maybePayload?.payload } + ); + }; + let formData; + const meta = this.extractMeta(inputEl.form, {}, opts.value); + const serializeOpts = {}; + if (inputEl instanceof HTMLButtonElement) { + serializeOpts.submitter = inputEl; + } + if (inputEl.getAttribute(this.binding("change"))) { + formData = serializeForm(inputEl.form, serializeOpts, [inputEl.name]); + } else { + formData = serializeForm(inputEl.form, serializeOpts); + } + if (dom_default.isUploadInput(inputEl) && inputEl.files && inputEl.files.length > 0) { + LiveUploader.trackFiles(inputEl, Array.from(inputEl.files)); + } + uploads = LiveUploader.serializeUploads(inputEl); + const event = { + type: "form", + event: phxEvent, + value: formData, + meta: { + // no target was implicitly sent as "undefined" in LV <= 1.0.5, therefore + // we have to keep it. In 1.0.6 we switched from passing meta as URL encoded data + // to passing it directly in the event, but the JSON encode would drop keys with + // undefined values. + _target: opts._target || "undefined", + ...meta + }, + uploads, + cid + }; + this.pushWithReply(refGenerator, "event", event).then(({ resp }) => { + if (dom_default.isUploadInput(inputEl) && dom_default.isAutoUpload(inputEl)) { + ElementRef.onUnlock(inputEl, () => { + if (LiveUploader.filesAwaitingPreflight(inputEl).length > 0) { + const [ref, _els] = refGenerator(); + this.undoRefs(ref, phxEvent, [inputEl.form]); + this.uploadFiles( + inputEl.form, + phxEvent, + targetCtx, + ref, + cid, + (_uploads) => { + callback && callback(resp); + this.triggerAwaitingSubmit(inputEl.form, phxEvent); + this.undoRefs(ref, phxEvent); + } + ); + } + }); + } else { + callback && callback(resp); + } + }).catch((error) => logError("Failed to push input event", error)); + } + triggerAwaitingSubmit(formEl, phxEvent) { + const awaitingSubmit = this.getScheduledSubmit(formEl); + if (awaitingSubmit) { + const [_el, _ref, _opts, callback] = awaitingSubmit; + this.cancelSubmit(formEl, phxEvent); + callback(); + } + } + getScheduledSubmit(formEl) { + return this.formSubmits.find( + ([el, _ref, _opts, _callback]) => el.isSameNode(formEl) + ); + } + scheduleSubmit(formEl, ref, opts, callback) { + if (this.getScheduledSubmit(formEl)) { + return true; + } + this.formSubmits.push([formEl, ref, opts, callback]); + } + cancelSubmit(formEl, phxEvent) { + this.formSubmits = this.formSubmits.filter( + ([el, ref, _opts, _callback]) => { + if (el.isSameNode(formEl)) { + this.undoRefs(ref, phxEvent); + return false; + } else { + return true; + } + } + ); + } + disableForm(formEl, phxEvent, opts = {}) { + const filterIgnored = (el) => { + const userIgnored = closestPhxBinding( + el, + `${this.binding(PHX_UPDATE)}=ignore`, + el.form + ); + return !(userIgnored || closestPhxBinding(el, "data-phx-update=ignore", el.form)); + }; + const filterDisables = (el) => { + return el.hasAttribute(this.binding(PHX_DISABLE_WITH)); + }; + const filterButton = (el) => el.tagName == "BUTTON"; + const filterInput = (el) => ["INPUT", "TEXTAREA", "SELECT"].includes(el.tagName); + const formElements = Array.from(formEl.elements); + const disables = formElements.filter(filterDisables); + const buttons = formElements.filter(filterButton).filter(filterIgnored); + const inputs = formElements.filter(filterInput).filter(filterIgnored); + buttons.forEach((button) => { + button.setAttribute(PHX_DISABLED, button.disabled); + button.disabled = true; + }); + inputs.forEach((input) => { + input.setAttribute(PHX_READONLY, input.readOnly); + input.readOnly = true; + if (input.files) { + input.setAttribute(PHX_DISABLED, input.disabled); + input.disabled = true; + } + }); + const formEls = disables.concat(buttons).concat(inputs).map((el) => { + return { el, loading: true, lock: true }; + }); + const els = [{ el: formEl, loading: true, lock: false }].concat(formEls).reverse(); + return this.putRef(els, phxEvent, "submit", opts); + } + pushFormSubmit(formEl, targetCtx, phxEvent, submitter, opts, onReply) { + const refGenerator = (maybePayload) => this.disableForm(formEl, phxEvent, { + ...opts, + form: formEl, + payload: maybePayload?.payload, + submitter + }); + dom_default.putPrivate(formEl, "submitter", submitter); + const cid = this.targetComponentID(formEl, targetCtx); + if (LiveUploader.hasUploadsInProgress(formEl)) { + const [ref, _els] = refGenerator(); + const push = () => this.pushFormSubmit( + formEl, + targetCtx, + phxEvent, + submitter, + opts, + onReply + ); + return this.scheduleSubmit(formEl, ref, opts, push); + } else if (LiveUploader.inputsAwaitingPreflight(formEl).length > 0) { + const [ref, els] = refGenerator(); + const proxyRefGen = () => [ref, els, opts]; + this.uploadFiles(formEl, phxEvent, targetCtx, ref, cid, (_uploads) => { + if (LiveUploader.inputsAwaitingPreflight(formEl).length > 0) { + return this.undoRefs(ref, phxEvent); + } + const meta = this.extractMeta(formEl, {}, opts.value); + const formData = serializeForm(formEl, { submitter }); + this.pushWithReply(proxyRefGen, "event", { + type: "form", + event: phxEvent, + value: formData, + meta, + cid + }).then(({ resp }) => onReply(resp)).catch((error) => logError("Failed to push form submit", error)); + }); + } else if (!(formEl.hasAttribute(PHX_REF_SRC) && formEl.classList.contains("phx-submit-loading"))) { + const meta = this.extractMeta(formEl, {}, opts.value); + const formData = serializeForm(formEl, { submitter }); + this.pushWithReply(refGenerator, "event", { + type: "form", + event: phxEvent, + value: formData, + meta, + cid + }).then(({ resp }) => onReply(resp)).catch((error) => logError("Failed to push form submit", error)); + } + } + uploadFiles(formEl, phxEvent, targetCtx, ref, cid, onComplete) { + const joinCountAtUpload = this.joinCount; + const inputEls = LiveUploader.activeFileInputs(formEl); + let numFileInputsInProgress = inputEls.length; + inputEls.forEach((inputEl) => { + const uploader = new LiveUploader(inputEl, this, () => { + numFileInputsInProgress--; + if (numFileInputsInProgress === 0) { + onComplete(); + } + }); + const entries = uploader.entries().map((entry) => entry.toPreflightPayload()); + if (entries.length === 0) { + numFileInputsInProgress--; + return; + } + const payload = { + ref: inputEl.getAttribute(PHX_UPLOAD_REF), + entries, + cid: this.targetComponentID(inputEl.form, targetCtx) + }; + this.log("upload", () => ["sending preflight request", payload]); + this.pushWithReply(null, "allow_upload", payload).then(({ resp }) => { + this.log("upload", () => ["got preflight response", resp]); + uploader.entries().forEach((entry) => { + if (resp.entries && !resp.entries[entry.ref]) { + this.handleFailedEntryPreflight( + entry.ref, + "failed preflight", + uploader + ); + } + }); + if (resp.error || Object.keys(resp.entries).length === 0) { + this.undoRefs(ref, phxEvent); + const errors = resp.error || []; + errors.map(([entry_ref, reason]) => { + this.handleFailedEntryPreflight(entry_ref, reason, uploader); + }); + } else { + const onError = (callback) => { + this.channel.onError(() => { + if (this.joinCount === joinCountAtUpload) { + callback(); + } + }); + }; + uploader.initAdapterUpload(resp, onError, this.liveSocket); + } + }).catch((error) => logError("Failed to push upload", error)); + }); + } + handleFailedEntryPreflight(uploadRef, reason, uploader) { + if (uploader.isAutoUpload()) { + const entry = uploader.entries().find((entry2) => entry2.ref === uploadRef.toString()); + if (entry) { + entry.cancel(); + } + } else { + uploader.entries().map((entry) => entry.cancel()); + } + this.log("upload", () => [`error for entry ${uploadRef}`, reason]); + } + dispatchUploads(targetCtx, name, filesOrBlobs) { + const targetElement = this.targetCtxElement(targetCtx) || this.el; + const inputs = dom_default.findUploadInputs(targetElement).filter( + (el) => el.name === name + ); + if (inputs.length === 0) { + logError(`no live file inputs found matching the name "${name}"`); + } else if (inputs.length > 1) { + logError(`duplicate live file inputs found matching the name "${name}"`); + } else { + dom_default.dispatchEvent(inputs[0], PHX_TRACK_UPLOADS, { + detail: { files: filesOrBlobs } + }); + } + } + targetCtxElement(targetCtx) { + if (isCid(targetCtx)) { + const [target] = dom_default.findComponentNodeList(this.id, targetCtx); + return target; + } else if (targetCtx) { + return targetCtx; + } else { + return null; + } + } + pushFormRecovery(oldForm, newForm, templateDom, callback) { + const phxChange = this.binding("change"); + const phxTarget = newForm.getAttribute(this.binding("target")) || newForm; + const phxEvent = newForm.getAttribute(this.binding(PHX_AUTO_RECOVER)) || newForm.getAttribute(this.binding("change")); + const inputs = Array.from(oldForm.elements).filter( + (el) => dom_default.isFormInput(el) && el.name && !el.hasAttribute(phxChange) + ); + if (inputs.length === 0) { + callback(); + return; + } + inputs.forEach( + (input2) => input2.hasAttribute(PHX_UPLOAD_REF) && LiveUploader.clearFiles(input2) + ); + const input = inputs.find((el) => el.type !== "hidden") || inputs[0]; + let pending = 0; + this.withinTargets( + phxTarget, + (targetView, targetCtx) => { + const cid = this.targetComponentID(newForm, targetCtx); + pending++; + let e = new CustomEvent("phx:form-recovery", { + detail: { sourceElement: oldForm } + }); + js_default.exec(e, "change", phxEvent, this, input, [ + "push", + { + _target: input.name, + targetView, + targetCtx, + newCid: cid, + callback: () => { + pending--; + if (pending === 0) { + callback(); + } + } + } + ]); + }, + templateDom + ); + } + pushLinkPatch(e, href, targetEl, callback) { + const linkRef = this.liveSocket.setPendingLink(href); + const loading = e.isTrusted && e.type !== "popstate"; + const refGen = targetEl ? () => this.putRef( + [{ el: targetEl, loading, lock: true }], + null, + "click" + ) : null; + const fallback = () => this.liveSocket.redirect(window.location.href); + const url = href.startsWith("/") ? `${location.protocol}//${location.host}${href}` : href; + this.pushWithReply(refGen, "live_patch", { url }).then( + ({ resp }) => { + this.liveSocket.requestDOMUpdate(() => { + if (resp.link_redirect) { + this.liveSocket.replaceMain(href, null, callback, linkRef); + } else if (resp.redirect) { + return; + } else { + if (this.liveSocket.commitPendingLink(linkRef)) { + this.href = href; + } + this.applyPendingUpdates(); + callback && callback(linkRef); + } + }); + }, + ({ error: _error, timeout: _timeout }) => fallback() + ); + } + getFormsForRecovery() { + if (this.joinCount === 0) { + return {}; + } + const phxChange = this.binding("change"); + return dom_default.all( + document, + `#${CSS.escape(this.id)} form[${phxChange}], [${PHX_TELEPORTED_REF}="${CSS.escape(this.id)}"] form[${phxChange}]` + ).filter((form) => form.id).filter((form) => form.elements.length > 0).filter( + (form) => form.getAttribute(this.binding(PHX_AUTO_RECOVER)) !== "ignore" + ).map((form) => { + const clonedForm = form.cloneNode(true); + morphdom_esm_default(clonedForm, form, { + onBeforeElUpdated: (fromEl, toEl) => { + dom_default.copyPrivates(fromEl, toEl); + if (fromEl.getAttribute("form") === form.id) { + fromEl.parentNode.removeChild(fromEl); + return false; + } + return true; + } + }); + const externalElements = document.querySelectorAll( + `[form="${CSS.escape(form.id)}"]` + ); + Array.from(externalElements).forEach((el) => { + const clonedEl = ( + /** @type {HTMLElement} */ + el.cloneNode(true) + ); + morphdom_esm_default(clonedEl, el); + dom_default.copyPrivates(clonedEl, el); + clonedEl.removeAttribute("form"); + clonedForm.appendChild(clonedEl); + }); + return clonedForm; + }).reduce((acc, form) => { + acc[form.id] = form; + return acc; + }, {}); + } + maybePushComponentsDestroyed(destroyedCIDs) { + let willDestroyCIDs = destroyedCIDs.filter((cid) => { + return dom_default.findComponentNodeList(this.id, cid).length === 0; + }); + const onError = (error) => { + if (!this.isDestroyed()) { + logError("Failed to push components destroyed", error); + } + }; + if (willDestroyCIDs.length > 0) { + willDestroyCIDs.forEach((cid) => this.rendered.resetRender(cid)); + this.pushWithReply(null, "cids_will_destroy", { cids: willDestroyCIDs }).then(() => { + this.liveSocket.requestDOMUpdate(() => { + let completelyDestroyCIDs = willDestroyCIDs.filter((cid) => { + return dom_default.findComponentNodeList(this.id, cid).length === 0; + }); + if (completelyDestroyCIDs.length > 0) { + this.pushWithReply(null, "cids_destroyed", { + cids: completelyDestroyCIDs + }).then(({ resp }) => { + this.rendered.pruneCIDs(resp.cids); + }).catch(onError); + } + }); + }).catch(onError); + } + } + ownsElement(el) { + let parentViewEl = dom_default.closestViewEl(el); + return el.getAttribute(PHX_PARENT_ID) === this.id || parentViewEl && parentViewEl.id === this.id || !parentViewEl && this.isDead; + } + submitForm(form, targetCtx, phxEvent, submitter, opts = {}) { + dom_default.putPrivate(form, PHX_HAS_SUBMITTED, true); + const inputs = Array.from(form.elements); + inputs.forEach((input) => dom_default.putPrivate(input, PHX_HAS_SUBMITTED, true)); + this.liveSocket.blurActiveElement(this); + this.pushFormSubmit(form, targetCtx, phxEvent, submitter, opts, () => { + this.liveSocket.restorePreviouslyActiveFocus(); + }); + } + binding(kind) { + return this.liveSocket.binding(kind); + } + // phx-portal + pushPortalElementId(id) { + this.portalElementIds.add(id); + } + dropPortalElementId(id) { + this.portalElementIds.delete(id); + } + destroyPortalElements() { + if (!this.liveSocket.unloaded) { + this.portalElementIds.forEach((id) => { + const el = document.getElementById(id); + if (el) { + el.remove(); + } + }); + } + } + }; + var LiveSocket = class { + constructor(url, phxSocket, opts = {}) { + this.unloaded = false; + if (!phxSocket || phxSocket.constructor.name === "Object") { + throw new Error(` a phoenix Socket must be provided as the second argument to the LiveSocket constructor. For example: import {Socket} from "phoenix" import {LiveSocket} from "phoenix_live_view" let liveSocket = new LiveSocket("/live", Socket, {...}) - `);this.socket=new t(e,i),this.bindingPrefix=i.bindingPrefix||Fs,this.opts=i,this.params=Be(i.params||{}),this.viewLogger=i.viewLogger,this.metadataCallbacks=i.metadata||{},this.defaults=Object.assign(lt(Bs),i.defaults||{}),this.prevActive=null,this.silenced=!1,this.main=null,this.outgoingMainEl=null,this.clickStartedAtTarget=null,this.linkRef=1,this.roots={},this.href=window.location.href,this.pendingLink=null,this.currentLocation=lt(window.location),this.hooks=i.hooks||{},this.uploaders=i.uploaders||{},this.loaderTimeout=i.loaderTimeout||Hs,this.disconnectedTimeout=i.disconnectedTimeout||$s,this.reloadWithJitterTimer=null,this.maxReloads=i.maxReloads||Es,this.reloadJitterMin=i.reloadJitterMin||Ss,this.reloadJitterMax=i.reloadJitterMax||ks,this.failsafeJitter=i.failsafeJitter||As,this.localStorage=i.localStorage||window.localStorage,this.sessionStorage=i.sessionStorage||window.sessionStorage,this.boundTopLevelEvents=!1,this.boundEventNames=new Set,this.blockPhxChangeWhileComposing=i.blockPhxChangeWhileComposing||!1,this.serverCloseRef=null,this.domCallbacks=Object.assign({jsQuerySelectorAll:null,onPatchStart:Be(),onPatchEnd:Be(),onNodeAdded:Be(),onBeforeElUpdated:Be()},i.dom||{}),this.transitions=new kn,this.currentHistoryPosition=parseInt(this.sessionStorage.getItem(tt))||0,window.addEventListener("pagehide",s=>{this.unloaded=!0}),this.socket.onOpen(()=>{this.isUnloaded()&&window.location.reload()})}version(){return"1.1.28"}isProfileEnabled(){return this.sessionStorage.getItem(Tt)==="true"}isDebugEnabled(){return this.sessionStorage.getItem(et)==="true"}isDebugDisabled(){return this.sessionStorage.getItem(et)==="false"}enableDebug(){this.sessionStorage.setItem(et,"true")}enableProfiling(){this.sessionStorage.setItem(Tt,"true")}disableDebug(){this.sessionStorage.setItem(et,"false")}disableProfiling(){this.sessionStorage.removeItem(Tt)}enableLatencySim(e){this.enableDebug(),console.log("latency simulator enabled for the duration of this browser session. Call disableLatencySim() to disable"),this.sessionStorage.setItem(_t,e)}disableLatencySim(){this.sessionStorage.removeItem(_t)}getLatencySim(){let e=this.sessionStorage.getItem(_t);return e?parseInt(e):null}getSocket(){return this.socket}connect(){window.location.hostname==="localhost"&&!this.isDebugDisabled()&&this.enableDebug();let e=()=>{this.resetReloadStatus(),this.joinRootViews()?(this.bindTopLevelEvents(),this.socket.connect()):this.main?this.socket.connect():this.bindTopLevelEvents({dead:!0}),this.joinDeadView()};["complete","loaded","interactive"].indexOf(document.readyState)>=0?e():document.addEventListener("DOMContentLoaded",()=>e())}disconnect(e){clearTimeout(this.reloadWithJitterTimer),this.serverCloseRef&&(this.socket.off(this.serverCloseRef),this.serverCloseRef=null),this.socket.disconnect(e)}replaceTransport(e){clearTimeout(this.reloadWithJitterTimer),this.socket.replaceTransport(e),this.connect()}execJS(e,t,i=null){let s=new CustomEvent("phx:exec",{detail:{sourceElement:e}});this.owner(e,n=>A.exec(s,i,t,n,e))}js(){return Ni(this,"js")}unload(){this.unloaded||(this.main&&this.isConnected()&&this.log(this.main,"socket",()=>["disconnect for page nav"]),this.unloaded=!0,this.destroyAllViews(),this.disconnect())}triggerDOM(e,t){this.domCallbacks[e](...t)}time(e,t){if(!this.isProfileEnabled()||!console.time)return t();console.time(e);let i=t();return console.timeEnd(e),i}log(e,t,i){if(this.viewLogger){let[s,n]=i();this.viewLogger(e,t,s,n)}else if(this.isDebugEnabled()){let[s,n]=i();qs(e,t,s,n)}}requestDOMUpdate(e){this.transitions.after(e)}asyncTransition(e){this.transitions.addAsyncTransition(e)}transition(e,t,i=function(){}){this.transitions.addTransition(e,t,i)}onChannel(e,t,i){e.on(t,s=>{let n=this.getLatencySim();n?setTimeout(()=>i(s),n):i(s)})}reloadWithJitter(e,t){clearTimeout(this.reloadWithJitterTimer),this.disconnect();let i=this.reloadJitterMin,s=this.reloadJitterMax,n=Math.floor(Math.random()*(s-i+1))+i,r=U.updateLocal(this.localStorage,window.location.pathname,xi,0,o=>o+1);r>=this.maxReloads&&(n=this.failsafeJitter),this.reloadWithJitterTimer=setTimeout(()=>{e.isDestroyed()||e.isConnected()||(e.destroy(),t?t():this.log(e,"join",()=>[`encountered ${r} consecutive reloads`]),r>=this.maxReloads&&this.log(e,"join",()=>[`exceeded ${this.maxReloads} consecutive reloads. Entering failsafe mode`]),this.hasPendingLink()?window.location=this.pendingLink:window.location.reload())},n)}getHookDefinition(e){if(e)return this.maybeInternalHook(e)||this.hooks[e]||this.maybeRuntimeHook(e)}maybeInternalHook(e){return e&&e.startsWith("Phoenix.")&&en[e.split(".")[1]]}maybeRuntimeHook(e){let t=document.querySelector(`script[${ht}="${CSS.escape(e)}"]`);if(!t)return;let i=window[`phx_hook_${e}`];if(!i||typeof i!="function"){P("a runtime hook must be a function",t);return}let s=i();if(s&&(typeof s=="object"||typeof s=="function"))return s;P("runtime hook must return an object with hook callbacks or an instance of ViewHook",t)}isUnloaded(){return this.unloaded}isConnected(){return this.socket.isConnected()}getBindingPrefix(){return this.bindingPrefix}binding(e){return`${this.getBindingPrefix()}${e}`}channel(e,t){return this.socket.channel(e,t)}joinDeadView(){let e=document.body;if(e&&!this.isPhxView(e)&&!this.isPhxView(document.firstElementChild)){let t=this.newRootView(e);t.setHref(this.getHref()),t.joinDead(),this.main||(this.main=t),window.requestAnimationFrame(()=>{t.execNewMounted(),this.maybeScroll(history.state?.scroll)})}}joinRootViews(){let e=!1;return c.all(document,`${qe}:not([${ye}])`,t=>{if(!this.getRootById(t.id)){let i=this.newRootView(t);c.isPhxSticky(t)||i.setHref(this.getHref()),i.join(),t.hasAttribute(Ut)&&(this.main=i)}e=!0}),e}redirect(e,t,i){i&&U.setCookie(li,i,60),this.unload(),U.redirect(e,t)}replaceMain(e,t,i=null,s=this.setPendingLink(e)){let n=this.currentLocation.href;this.outgoingMainEl=this.outgoingMainEl||this.main.el;let r=c.findPhxSticky(document)||[],o=c.all(this.outgoingMainEl,`[${this.binding("remove")}]`).filter(h=>!c.isChildOfAny(h,r)),a=c.cloneNode(this.outgoingMainEl,"");this.main.showLoader(this.loaderTimeout),this.main.destroy(),this.main=this.newRootView(a,t,n),this.main.setRedirect(e),this.transitionRemoves(o),this.main.join((h,l)=>{h===1&&this.commitPendingLink(s)&&this.requestDOMUpdate(()=>{o.forEach(d=>d.remove()),r.forEach(d=>a.appendChild(d)),this.outgoingMainEl.replaceWith(a),this.outgoingMainEl=null,i&&i(s),l()})})}transitionRemoves(e,t){let i=this.binding("remove"),s=n=>{n.preventDefault(),n.stopImmediatePropagation()};e.forEach(n=>{for(let r of this.boundEventNames)n.addEventListener(r,s,!0);this.execJS(n,n.getAttribute(i),"remove")}),this.requestDOMUpdate(()=>{e.forEach(n=>{for(let r of this.boundEventNames)n.removeEventListener(r,s,!0)}),t&&t()})}isPhxView(e){return e.getAttribute&&e.getAttribute(Q)!==null}newRootView(e,t,i){let s=new En(e,this,null,t,i);return this.roots[s.id]=s,s}owner(e,t){let i,s=c.closestViewEl(e);if(s)i=this.getViewByEl(s);else{if(!e.isConnected)return null;i=this.main}return i&&t?t(i):i}withinOwners(e,t){this.owner(e,i=>t(i,e))}getViewByEl(e){let t=e.getAttribute(re);return Ie(this.getRootById(t),i=>i.getDescendentByEl(e))}getRootById(e){return this.roots[e]}destroyAllViews(){for(let e in this.roots)this.roots[e].destroy(),delete this.roots[e];this.main=null}destroyViewByEl(e){let t=this.getRootById(e.getAttribute(re));t&&t.id===e.id?(t.destroy(),delete this.roots[t.id]):t&&t.destroyDescendent(e.id)}getActiveElement(){return document.activeElement}dropActiveElement(e){this.prevActive&&e.ownsElement(this.prevActive)&&(this.prevActive=null)}restorePreviouslyActiveFocus(){this.prevActive&&this.prevActive!==document.body&&this.prevActive instanceof HTMLElement&&this.prevActive.focus()}blurActiveElement(){this.prevActive=this.getActiveElement(),this.prevActive!==document.body&&this.prevActive instanceof HTMLElement&&this.prevActive.blur()}bindTopLevelEvents({dead:e}={}){this.boundTopLevelEvents||(this.boundTopLevelEvents=!0,this.serverCloseRef=this.socket.onClose(t=>{if(t&&t.code===1e3&&this.main)return this.reloadWithJitter(this.main)}),document.body.addEventListener("click",function(){}),window.addEventListener("pageshow",t=>{t.persisted&&(this.getSocket().disconnect(),this.withPageLoading({to:window.location.href,kind:"redirect"}),window.location.reload())},!0),e||this.bindNav(),this.bindClicks(),e||this.bindForms(),this.bind({keyup:"keyup",keydown:"keydown"},(t,i,s,n,r,o)=>{let a=n.getAttribute(this.binding(Os)),h=t.key&&t.key.toLowerCase();if(a&&a.toLowerCase()!==h)return;let l={key:t.key,...this.eventMeta(i,t,n)};A.exec(t,i,r,s,n,["push",{data:l}])}),this.bind({blur:"focusout",focus:"focusin"},(t,i,s,n,r,o)=>{if(!o){let a={key:t.key,...this.eventMeta(i,t,n)};A.exec(t,i,r,s,n,["push",{data:a}])}}),this.bind({blur:"blur",focus:"focus"},(t,i,s,n,r,o)=>{if(o==="window"){let a=this.eventMeta(i,t,n);A.exec(t,i,r,s,n,["push",{data:a}])}}),this.on("dragover",t=>t.preventDefault()),this.on("dragenter",t=>{let i=be(t.target,this.binding(Qe));!i||!(i instanceof HTMLElement)||Ks(t)&&this.js().addClass(i,At)}),this.on("dragleave",t=>{let i=be(t.target,this.binding(Qe));if(!i||!(i instanceof HTMLElement))return;let s=i.getBoundingClientRect();(t.clientX<=s.left||t.clientX>=s.right||t.clientY<=s.top||t.clientY>=s.bottom)&&this.js().removeClass(i,At)}),this.on("drop",t=>{t.preventDefault();let i=be(t.target,this.binding(Qe));if(!i||!(i instanceof HTMLElement))return;this.js().removeClass(i,At);let s=i.getAttribute(this.binding(Qe)),n=s&&document.getElementById(s),r=Array.from(t.dataTransfer.files||[]);!n||!(n instanceof HTMLInputElement)||n.disabled||r.length===0||!(n.files instanceof FileList)||(M.trackFiles(n,r,t.dataTransfer),n.dispatchEvent(new Event("input",{bubbles:!0})))}),this.on(Ii,t=>{let i=t.target;if(!c.isUploadInput(i))return;let s=Array.from(t.detail.files||[]).filter(n=>n instanceof File||n instanceof Blob);M.trackFiles(i,s),i.dispatchEvent(new Event("input",{bubbles:!0}))}))}eventMeta(e,t,i){let s=this.metadataCallbacks[e];return s?s(t,i):{}}setPendingLink(e){return this.linkRef++,this.pendingLink=e,this.resetReloadStatus(),this.linkRef}resetReloadStatus(){U.deleteCookie(li)}commitPendingLink(e){return this.linkRef!==e?!1:(this.href=this.pendingLink,this.pendingLink=null,!0)}getHref(){return this.href}hasPendingLink(){return!!this.pendingLink}bind(e,t){for(let i in e){let s=e[i];this.on(s,n=>{let r=this.binding(i),o=this.binding(`window-${i}`),a=n.target.getAttribute&&n.target.getAttribute(r);a?this.debounce(n.target,n,s,()=>{this.withinOwners(n.target,h=>{t(n,i,h,n.target,a,null)})}):c.all(document,`[${o}]`,h=>{let l=h.getAttribute(o);this.debounce(h,n,s,()=>{this.withinOwners(h,d=>{t(n,i,d,h,l,"window")})})})})}}bindClicks(){this.on("mousedown",e=>this.clickStartedAtTarget=e.target),this.bindClick("click","click")}bindClick(e,t){let i=this.binding(t);window.addEventListener(e,s=>{let n=null;s.detail===0&&(this.clickStartedAtTarget=s.target);let r=this.clickStartedAtTarget||s.target;n=be(s.target,i),this.dispatchClickAway(s,r),this.clickStartedAtTarget=null;let o=n&&n.getAttribute(i);if(!o){c.isNewPageClick(s,window.location)&&this.unload();return}n.getAttribute("href")==="#"&&s.preventDefault(),!n.hasAttribute(W)&&this.debounce(n,s,"click",()=>{this.withinOwners(n,a=>{A.exec(s,"click",o,a,n,["push",{data:this.eventMeta("click",s,n)}])})})},!1)}dispatchClickAway(e,t){let i=this.binding("click-away"),s=t.closest(`[${fe}]`),n=s&&c.byId(s.getAttribute(fe));c.all(document,`[${i}]`,r=>{let o=t;s&&!s.contains(r)&&(o=n),r.isSameNode(o)||r.contains(o)||!A.isVisible(t)||this.withinOwners(r,a=>{let h=r.getAttribute(i);A.isVisible(r)&&A.isInViewport(r)&&A.exec(e,"click",h,a,r,["push",{data:this.eventMeta("click",e,e.target)}])})})}bindNav(){if(!U.canPushState())return;history.scrollRestoration&&(history.scrollRestoration="manual");let e=null;window.addEventListener("scroll",t=>{clearTimeout(e),e=setTimeout(()=>{U.updateCurrentState(i=>Object.assign(i,{scroll:window.scrollY}))},100)}),window.addEventListener("popstate",t=>{if(!this.registerNewLocation(window.location))return;let{type:i,backType:s,id:n,scroll:r,position:o}=t.state||{},a=window.location.href,h=o>this.currentHistoryPosition,l=h?i:s||i;this.currentHistoryPosition=o||0,this.sessionStorage.setItem(tt,this.currentHistoryPosition.toString()),c.dispatchEvent(window,"phx:navigate",{detail:{href:a,patch:l==="patch",pop:!0,direction:h?"forward":"backward"}}),this.requestDOMUpdate(()=>{let d=()=>{this.maybeScroll(r)};this.main.isConnected()&&l==="patch"&&n===this.main.id?this.main.pushLinkPatch(t,a,null,d):this.replaceMain(a,null,d)})},!1),window.addEventListener("click",t=>{let i=be(t.target,Ct),s=i&&i.getAttribute(Ct);if(!s||!this.isConnected()||!this.main||c.wantsNewTab(t))return;let n=i.href instanceof SVGAnimatedString?i.href.baseVal:i.href,r=i.getAttribute(Ts);t.preventDefault(),t.stopImmediatePropagation(),this.pendingLink!==n&&this.requestDOMUpdate(()=>{if(s==="patch")this.pushHistoryPatch(t,n,r,i);else if(s==="redirect")this.historyRedirect(t,n,r,null,i);else throw new Error(`expected ${Ct} to be "patch" or "redirect", got: ${s}`);let o=i.getAttribute(this.binding("click"));o&&this.requestDOMUpdate(()=>this.execJS(i,o,"click"))})},!1)}maybeScroll(e){typeof e=="number"&&requestAnimationFrame(()=>{window.scrollTo(0,e)})}dispatchEvent(e,t={}){c.dispatchEvent(window,`phx:${e}`,{detail:t})}dispatchEvents(e){e.forEach(([t,i])=>this.dispatchEvent(t,i))}withPageLoading(e,t){c.dispatchEvent(window,"phx:page-loading-start",{detail:e});let i=()=>c.dispatchEvent(window,"phx:page-loading-stop",{detail:e});return t?t(i):i}pushHistoryPatch(e,t,i,s){if(!this.isConnected()||!this.main.isMain())return U.redirect(t);this.withPageLoading({to:t,kind:"patch"},n=>{this.main.pushLinkPatch(e,t,s,r=>{this.historyPatch(t,i,r),n()})})}historyPatch(e,t,i=this.setPendingLink(e)){this.commitPendingLink(i)&&(this.currentHistoryPosition++,this.sessionStorage.setItem(tt,this.currentHistoryPosition.toString()),U.updateCurrentState(s=>({...s,backType:"patch"})),U.pushState(t,{type:"patch",id:this.main.id,position:this.currentHistoryPosition},e),c.dispatchEvent(window,"phx:navigate",{detail:{patch:!0,href:e,pop:!1,direction:"forward"}}),this.registerNewLocation(window.location))}historyRedirect(e,t,i,s,n){let r=n&&e.isTrusted&&e.type!=="popstate";if(r&&n.classList.add("phx-click-loading"),!this.isConnected()||!this.main.isMain())return U.redirect(t,s);if(/^\/$|^\/[^\/]+.*$/.test(t)){let{protocol:a,host:h}=window.location;t=`${a}//${h}${t}`}let o=window.scrollY;this.withPageLoading({to:t,kind:"redirect"},a=>{this.replaceMain(t,s,h=>{h===this.linkRef&&(this.currentHistoryPosition++,this.sessionStorage.setItem(tt,this.currentHistoryPosition.toString()),U.updateCurrentState(l=>({...l,backType:"redirect"})),U.pushState(i,{type:"redirect",id:this.main.id,scroll:o,position:this.currentHistoryPosition},t),c.dispatchEvent(window,"phx:navigate",{detail:{href:t,patch:!1,pop:!1,direction:"forward"}}),this.registerNewLocation(window.location)),r&&n.classList.remove("phx-click-loading"),a()})})}registerNewLocation(e){let{pathname:t,search:i}=this.currentLocation;return t+i===e.pathname+e.search?!1:(this.currentLocation=lt(e),!0)}bindForms(){let e=0,t=!1;this.on("submit",i=>{let s=i.target.getAttribute(this.binding("submit")),n=i.target.getAttribute(this.binding("change"));!t&&n&&!s&&(t=!0,i.preventDefault(),this.withinOwners(i.target,r=>{r.disableForm(i.target),window.requestAnimationFrame(()=>{c.isUnloadableFormSubmit(i)&&this.unload(),i.target.submit()})}))}),this.on("submit",i=>{let s=i.target.getAttribute(this.binding("submit"));if(!s){c.isUnloadableFormSubmit(i)&&this.unload();return}i.preventDefault(),i.target.disabled=!0,this.withinOwners(i.target,n=>{A.exec(i,"submit",s,n,i.target,["push",{submitter:i.submitter}])})});for(let i of["change","input"])this.on(i,s=>{if(s instanceof CustomEvent&&(s.target instanceof HTMLInputElement||s.target instanceof HTMLSelectElement||s.target instanceof HTMLTextAreaElement)&&s.target.form===void 0){if(s.detail&&s.detail.dispatcher)throw new Error(`dispatching a custom ${i} event is only supported on input elements inside a form`);return}let n=this.binding("change"),r=s.target;if(this.blockPhxChangeWhileComposing&&s.isComposing){let g=`composition-listener-${i}`;c.private(r,g)||(c.putPrivate(r,g,!0),r.addEventListener("compositionend",()=>{r.dispatchEvent(new Event(i,{bubbles:!0})),c.deletePrivate(r,g)},{once:!0}));return}let o=r.getAttribute(n),a=r.form&&r.form.getAttribute(n),h=o||a;if(!h||r.type==="number"&&r.validity&&r.validity.badInput)return;let l=o?r:r.form,d=e;e++;let{at:p,type:m}=c.private(r,"prev-iteration")||{};p===d-1&&i==="change"&&m==="input"||(c.putPrivate(r,"prev-iteration",{at:d,type:i}),this.debounce(r,s,i,()=>{this.withinOwners(l,g=>{c.putPrivate(r,ct,!0),A.exec(s,"change",h,g,r,["push",{_target:s.target.name,dispatcher:l}])})}))});this.on("reset",i=>{let s=i.target;c.resetForm(s);let n=Array.from(s.elements).find(r=>r.type==="reset");n&&window.requestAnimationFrame(()=>{n.dispatchEvent(new Event("input",{bubbles:!0,cancelable:!1}))})})}debounce(e,t,i,s){if(i==="blur"||i==="focusout")return s();let n=this.binding(Is),r=this.binding(Ls),o=this.defaults.debounce.toString(),a=this.defaults.throttle.toString();this.withinOwners(e,h=>{let l=()=>!h.isDestroyed()&&document.body.contains(e);c.debounce(e,t,n,o,r,a,l,()=>{s()})})}silenceEvents(e){this.silenced=!0,e(),this.silenced=!1}on(e,t){this.boundEventNames.add(e),window.addEventListener(e,i=>{this.silenced||t(i)})}jsQuerySelectorAll(e,t,i){let s=this.domCallbacks.jsQuerySelectorAll;return s?s(e,t,i):i()}},kn=class{constructor(){this.transitions=new Set,this.promises=new Set,this.pendingOps=[]}reset(){this.transitions.forEach(e=>{clearTimeout(e),this.transitions.delete(e)}),this.promises.clear(),this.flushPendingOps()}after(e){this.size()===0?e():this.pushPendingOp(e)}addTransition(e,t,i){t();let s=setTimeout(()=>{this.transitions.delete(s),i(),this.flushPendingOps()},e);this.transitions.add(s)}addAsyncTransition(e){this.promises.add(e),e.then(()=>{this.promises.delete(e),this.flushPendingOps()})}pushPendingOp(e){this.pendingOps.push(e)}size(){return this.transitions.size+this.promises.size}flushPendingOps(){if(this.size()>0)return;let e=this.pendingOps.shift();e&&(e(),this.flushPendingOps())}},Ui=Sn;(function(){var e=t();function t(){if(typeof window.CustomEvent=="function")return window.CustomEvent;function n(r,o){o=o||{bubbles:!1,cancelable:!1,detail:void 0};var a=document.createEvent("CustomEvent");return a.initCustomEvent(r,o.bubbles,o.cancelable,o.detail),a}return n.prototype=window.Event.prototype,n}function i(n,r){var o=document.createElement("input");return o.type="hidden",o.name=n,o.value=r,o}function s(n,r){var o=n.getAttribute("data-to"),a=i("_method",n.getAttribute("data-method")),h=i("_csrf_token",n.getAttribute("data-csrf")),l=document.createElement("form"),d=document.createElement("input"),p=n.getAttribute("target");l.method=n.getAttribute("data-method")==="get"?"get":"post",l.action=o,l.style.display="none",p?l.target=p:r&&(l.target="_blank"),l.appendChild(h),l.appendChild(a),document.body.appendChild(l),d.type="submit",l.appendChild(d),d.click()}window.addEventListener("click",function(n){var r=n.target;if(!n.defaultPrevented)for(;r&&r.getAttribute;){var o=new e("phoenix.link.click",{bubbles:!0,cancelable:!0});if(!r.dispatchEvent(o))return n.preventDefault(),n.stopImmediatePropagation(),!1;if(r.getAttribute("data-method")&&r.getAttribute("data-to"))return s(r,n.metaKey||n.shiftKey),n.preventDefault(),!1;r=r.parentNode}},!1),window.addEventListener("phoenix.link.click",function(n){var r=n.target.getAttribute("data-confirm");r&&!window.confirm(r)&&n.preventDefault()},!1)})();var ft="bds-panel-sidebar",pt="bds-panel-assistant-sidebar",Wt="bds-ui-language",Bi="bds-workbench-";var ae=(e,t,i)=>Math.max(t,Math.min(e,i)),ji=e=>{if(!e)return null;try{let t=JSON.parse(e);return t&&typeof t=="object"&&!Array.isArray(t)?t:null}catch{return null}},mt=(e,t)=>{let i=e?.closest(".media-thumbnail");i&&(t?i.classList.add("is-loaded"):i.classList.remove("is-loaded"))},qt=e=>{e.querySelectorAll(".media-thumbnail-image").forEach(t=>{mt(t,!!(t.complete&&t.naturalWidth>0))})};var gt=e=>{let t=document.querySelector(e);if(!t)return 0;let i=Number.parseInt(t.style.width||"0",10);return Number.isNaN(i)?Math.round(t.getBoundingClientRect().width):i},Vi=(e,t)=>{let i=document.querySelector(e);i&&(i.style.width=`${t}px`,i.classList.remove("is-hidden"))},Jt=(e,t)=>{let i=e==="assistant"?pt:ft;window.localStorage.setItem(i,String(t))},Xt=(e,t,i,s)=>{let n=window.localStorage.getItem(e);if(!n)return t;let r=Number.parseInt(n,10);return Number.isNaN(r)?t:ae(r,i,s)};var vt=e=>String(e||"").toLowerCase(),Wi=e=>{let t=e.target?.tagName||null;return e.target?.isContentEditable||["INPUT","TEXTAREA","SELECT"].includes(t)},qi=(e,t)=>{let i=t.metaKey||t.ctrlKey;return vt(t.key)===vt(e.key)&&i===!!e.primary&&t.shiftKey===!!e.shift&&t.altKey===!!e.alt},Ji=e=>{if(!e)return[];try{let t=JSON.parse(e);return Array.isArray(t)?t:[]}catch{return[]}};var Xi=()=>{let e=document.documentElement.style,t=(o,a)=>{e.setProperty("--bds-titlebar-overlay-left",`${o}px`),e.setProperty("--bds-titlebar-overlay-right",`${a}px`)},i=navigator.windowControlsOverlay;if(!i)return t(0,0),()=>{};let s=()=>{if(!i.visible){t(0,0);return}let o=i.getTitlebarAreaRect(),a=window.innerWidth||document.documentElement.clientWidth||o.right,h=Math.max(0,Math.round(o.left)),l=Math.max(0,Math.round(a-o.right));t(h,l)},n=()=>s(),r=()=>s();return s(),i.addEventListener("geometrychange",n),window.addEventListener("resize",r),()=>{i.removeEventListener("geometrychange",n),window.removeEventListener("resize",r)}};var Ki=e=>new Promise((t,i)=>{let s=document.querySelector(`script[src="${e}"]`);if(s){if(s.dataset.loaded==="true"){t();return}s.addEventListener("load",()=>t(),{once:!0}),s.addEventListener("error",()=>i(new Error(`Failed to load ${e}`)),{once:!0});return}let n=document.createElement("script");n.src=e,n.async=!0,n.addEventListener("load",()=>{n.dataset.loaded="true",t()},{once:!0}),n.addEventListener("error",()=>i(new Error(`Failed to load ${e}`)),{once:!0}),document.head.appendChild(n)});var X=(e,t)=>window.getComputedStyle(document.documentElement).getPropertyValue(e).trim()||t,An=e=>{if(!e)return null;let t=e.match(/^#([0-9a-f]{6})$/i);if(t)return{r:Number.parseInt(t[1].slice(0,2),16),g:Number.parseInt(t[1].slice(2,4),16),b:Number.parseInt(t[1].slice(4,6),16)};let i=e.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)/i);return i?{r:Number.parseInt(i[1],10),g:Number.parseInt(i[2],10),b:Number.parseInt(i[3],10)}:null},ee=(e,t)=>{let i=An(e);return i?`#${[i.r,i.g,i.b].map(s=>ae(s,0,255).toString(16).padStart(2,"0")).join("")}`:t};var zi=null,he=e=>{let t=ee(X("--vscode-editor-background",X("--vscode-input-background","#1e1e1e")),"#1e1e1e"),i=ee(X("--vscode-editor-foreground","#d4d4d4"),"#d4d4d4"),s=ee(X("--vscode-editorLineNumber-foreground","#858585"),"#858585"),n=ee(X("--vscode-editorLineNumber-activeForeground",i),i),r=ee(X("--vscode-editor-selectionBackground","#264f78"),"#264f78"),o=ee(X("--vscode-editor-inactiveSelectionBackground","#3a3d41"),"#3a3d41"),a=ee(X("--vscode-editorCursor-foreground",i),i),h=ee(X("--vscode-panel-border","#3c3c3c"),"#3c3c3c"),l=ee(X("--vscode-editor-lineHighlightBackground",t),t),d=[t,i,s,n,r,o,a,h].join("|");if(d===zi){e.editor.setTheme("bds-theme");return}e.editor.defineTheme("bds-theme",{base:"vs-dark",inherit:!0,rules:[{token:"keyword.macro",foreground:"C586C0",fontStyle:"bold"},{token:"attribute.name",foreground:"9CDCFE"},{token:"attribute.value",foreground:"CE9178"}],colors:{"editor.background":t,"editor.foreground":i,"editor.lineHighlightBackground":l,"editorCursor.foreground":a,"editor.selectionBackground":r,"editor.inactiveSelectionBackground":o,"editorLineNumber.foreground":s,"editorLineNumber.activeForeground":n,"editorIndentGuide.background1":h,"editorIndentGuide.activeBackground1":i,"editorWidget.border":h,"editorGutter.background":t,focusBorder:h,"input.border":h}}),zi=d,e.editor.setTheme("bds-theme")};var Gi=!1,Yi=!1,Kt=e=>{Gi||(e.languages.register({id:"liquid"}),e.languages.setLanguageConfiguration("liquid",{comments:{blockComment:["{% comment %}","{% endcomment %}"]},brackets:[["{","}"],["[","]"],["(",")"]],autoClosingPairs:[{open:"{",close:"}"},{open:"[",close:"]"},{open:"(",close:")"},{open:'"',close:'"'},{open:"'",close:"'"}],surroundingPairs:[{open:"{",close:"}"},{open:"[",close:"]"},{open:"(",close:")"},{open:'"',close:'"'},{open:"'",close:"'"}]}),e.languages.setMonarchTokensProvider("liquid",{defaultToken:"",tokenizer:{root:[[/\{\{-?/,{token:"delimiter.output",next:"@liquidOutput"}],[/\{%-?\s*comment\b[^%]*-?%\}/,{token:"comment.block",next:"@liquidComment"}],[/\{%-?/,{token:"delimiter.tag",next:"@liquidTag"}],[/<=!]=?|\.|:/,"operator"],[/[a-zA-Z_][\w.-]*/,"identifier"],[/[,:()[\]]/,"delimiter"]],liquidComment:[[/\{%-?\s*endcomment\s*-?%\}/,{token:"comment.block",next:"@pop"}],[/./,"comment.block"]],htmlComment:[[/-->/,{token:"comment",next:"@pop"}],[/./,"comment"]],htmlTag:[[/\/>/,{token:"delimiter.html",next:"@pop"}],[/>/,{token:"delimiter.html",next:"@pop"}],[/"(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*'/,"attribute.value"],[/[\w:-]+/,"attribute.name"],[/=/,"delimiter"]],scriptTag:[[/>/,{token:"delimiter.html",next:"@pop"}],[/"(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*'/,"attribute.value"],[/[\w:-]+/,"attribute.name"],[/=/,"delimiter"]],styleTag:[[/>/,{token:"delimiter.html",next:"@pop"}],[/"(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*'/,"attribute.value"],[/[\w:-]+/,"attribute.name"],[/=/,"delimiter"]]}}),Gi=!0)},zt=e=>{Yi||(e.languages.register({id:"markdown-with-macros"}),e.languages.setMonarchTokensProvider("markdown-with-macros",{defaultToken:"",tokenPostfix:".md",tokenizer:{root:[[/\[\[[a-zA-Z][\w-]*/,{token:"keyword.macro",next:"@macroParams"}],[/^#{1,6}\s.*$/,"keyword.header"],[/^\s*>+/,"string.quote"],[/^\s*[-+*]\s/,"keyword"],[/^\s*\d+\.\s/,"keyword"],[/^\s*```\w*/,{token:"string.code",next:"@codeblock"}],[/\*\*[^*]+\*\*/,"strong"],[/\*[^*]+\*/,"emphasis"],[/__[^_]+__/,"strong"],[/_[^_]+_/,"emphasis"],[/`[^`]+`/,"variable"],[/!?\[[^\]]*\]\([^)]*\)/,"string.link"],[/!?\[[^\]]*\]\[[^\]]*\]/,"string.link"]],macroParams:[[/\]\]/,{token:"keyword.macro",next:"@root"}],[/[a-zA-Z][\w-]*(?=\s*=)/,"attribute.name"],[/=/,"delimiter"],[/"[^"]*"/,"string"],[/\s+/,"white"],[/[^\]"=\s]+/,"attribute.value"]],codeblock:[[/^\s*```\s*$/,{token:"string.code",next:"@root"}],[/.*$/,"variable.source"]]}}),Yi=!0)};var Je,Gt=new Map,Oe=()=>window.monaco?.editor?(he(window.monaco),Kt(window.monaco),zt(window.monaco),Promise.resolve(window.monaco)):Je||(Je=Ki("/monaco/vs/loader.js").then(()=>new Promise((e,t)=>{window.require.config({paths:{vs:"/monaco/vs"}}),window.require(["vs/editor/editor.main"],()=>{he(window.monaco),Kt(window.monaco),zt(window.monaco),e(window.monaco)},t)})).catch(e=>{throw Je=null,e}),Je),Zi=(e,t)=>{e&&Gt.set(e,t)},Qi=e=>{e&&Gt.delete(e)},es=()=>{for(let e of Gt.values())if(typeof e?.hasTextFocus=="function"&&e.hasTextFocus())return e;return null},te=(e,t,i=t)=>{if(!e)return!1;let s=typeof e.getAction=="function"?e.getAction(t):null;return s&&typeof s.run=="function"?(s.run(),!0):typeof e.trigger=="function"?(e.trigger("bds-menu",i,null),!0):!1},Yt=(e,t)=>{let i=String(e||"working-tree").replace(/^\/+/,"");return`inmemory://model/git-diff/${t}/${i}`};var bt=e=>{let t=ae(Math.round(e*100)/100,.5,2);window.__bdsAppZoom=t,document.documentElement.style.zoom=String(t)},pe=e=>{if(typeof document.execCommand!="function")return!1;try{return document.execCommand(e)}catch{return!1}};var ts=e=>{let t=es();switch(e){case"undo":return t?te(t,"undo"):pe("undo");case"redo":return t?te(t,"redo"):pe("redo");case"cut":return t?te(t,"editor.action.clipboardCutAction"):pe("cut");case"copy":return t?te(t,"editor.action.clipboardCopyAction"):pe("copy");case"paste":return t?te(t,"editor.action.clipboardPasteAction"):pe("paste");case"delete":return t?te(t,"deleteLeft"):pe("delete");case"select_all":return t?te(t,"editor.action.selectAll"):pe("selectAll");case"find":return t?te(t,"actions.find"):!1;case"replace":return t?te(t,"editor.action.startFindReplaceAction"):!1;case"reload":case"force_reload":return window.location.reload(),!0;case"reset_zoom":return bt(1),!0;case"zoom_in":return bt((window.__bdsAppZoom||1)+.1),!0;case"zoom_out":return bt((window.__bdsAppZoom||1)-.1),!0;case"toggle_full_screen":return document.fullscreenElement?document.exitFullscreen?.():document.documentElement.requestFullscreen?.(),!0;default:return!1}};var is={mounted(){this.shortcuts=Ji(this.el.dataset.shortcuts),this.currentProjectId=this.el.dataset.projectId||"",this.syncStoredLayout(),this.syncStoredUiLanguage(),this.destroyOverlaySync=Xi(),this.workbenchStorageKey=e=>e?`${Bi}${e}`:null,this.restoreStoredWorkbenchSession=()=>{let e=this.el.dataset.projectId||"",t=this.workbenchStorageKey(e);if(!t)return!1;let i=ji(window.localStorage.getItem(t));return i?(this.pushEvent("restore_workbench_session",{session:i}),!0):!1},this.persistWorkbenchSession=()=>{let e=this.el.dataset.projectId||"",t=this.workbenchStorageKey(e),i=this.el.dataset.workbenchSession;!t||!i||window.localStorage.setItem(t,i)},this.handleMouseDown=e=>{let t=e.target.closest("[data-role='resize-handle']");if(!t||!this.el.contains(t))return;e.preventDefault();let i=t.dataset.resize,s=e.clientX,n=i==="assistant"?gt("[data-testid='assistant-shell']"):gt("[data-testid='sidebar-shell']"),r=i==="assistant"?280:200,o=i==="assistant"?640:500,a=i==="assistant",h=d=>{let p=a?s-d.clientX:d.clientX-s,m=ae(n+p,r,o);Vi(i==="assistant"?"[data-testid='assistant-shell']":"[data-testid='sidebar-shell']",m),Jt(i,m)},l=d=>{let p=a?s-d.clientX:d.clientX-s,m=ae(n+p,r,o);Jt(i,m),this.pushEvent("resize_panel",{target:i,width:m}),window.removeEventListener("mousemove",h),window.removeEventListener("mouseup",l)};window.addEventListener("mousemove",h),window.addEventListener("mouseup",l)},this.el.addEventListener("mousedown",this.handleMouseDown),this.handleNativeMenuAction=e=>{let t=e.detail?.action,i=e.detail?.ackId;t&&this.pushEvent("native_menu_action",{action:t},()=>{i&&window.dispatchEvent(new CustomEvent("bds:native-menu-action-ack",{detail:{ackId:i}}))})},this.handleChange=e=>{let t=e.target.closest(".status-bar-language-select");t&&this.el.contains(t)&&window.localStorage.setItem(Wt,t.value)},this.handleShortcutKeyDown=e=>{Wi(e)||!this.shortcuts.find(i=>qi(i,e))||(e.preventDefault(),e.stopPropagation(),this.pushEvent("shortcut",{key:vt(e.key),meta:e.metaKey,ctrl:e.ctrlKey,alt:e.altKey,shift:e.shiftKey,tag:e.target?.tagName||null,contentEditable:e.target?.isContentEditable||!1}))},this.handleThumbnailLoad=e=>{e.target instanceof HTMLImageElement&&e.target.classList.contains("media-thumbnail-image")&&mt(e.target,!0)},this.handleThumbnailError=e=>{e.target instanceof HTMLImageElement&&e.target.classList.contains("media-thumbnail-image")&&mt(e.target,!1)},this.handleEvent("menu-runtime-command",({action:e})=>{e&&ts(String(e))}),this.handleEvent("url-state",({path:e})=>{e&&window.location.pathname+window.location.search!==e&&window.history.replaceState({},"",e)}),window.addEventListener("bds:native-menu-action",this.handleNativeMenuAction),window.addEventListener("keydown",this.handleShortcutKeyDown,!0),this.el.addEventListener("load",this.handleThumbnailLoad,!0),this.el.addEventListener("error",this.handleThumbnailError,!0),this.el.addEventListener("change",this.handleChange),qt(this.el),this.restoreStoredWorkbenchSession()},updated(){let e=this.el.dataset.projectId||"";e!==this.currentProjectId&&(this.currentProjectId=e,this.restoreStoredWorkbenchSession())||(qt(this.el),this.persistWorkbenchSession())},destroyed(){this.el.removeEventListener("mousedown",this.handleMouseDown),this.el.removeEventListener("load",this.handleThumbnailLoad,!0),this.el.removeEventListener("error",this.handleThumbnailError,!0),this.el.removeEventListener("change",this.handleChange),window.removeEventListener("bds:native-menu-action",this.handleNativeMenuAction),window.removeEventListener("keydown",this.handleShortcutKeyDown,!0),this.destroyOverlaySync&&this.destroyOverlaySync()},syncStoredLayout(){this.pushEvent("sync_layout",{sidebar_width:Xt(ft,gt("[data-testid='sidebar-shell']"),200,500),assistant_sidebar_width:Xt(pt,360,280,640)})},syncStoredUiLanguage(){let e=window.localStorage.getItem(Wt);e&&this.pushEvent("sync_ui_language",{language:e})}};var ss={mounted(){this.handleDblClick=e=>{let t=e.target.closest("[data-testid='sidebar-open-item']");!t||!this.el.contains(t)||this.pushEvent("pin_sidebar_item",{route:t.dataset.route,id:t.dataset.itemId,title:t.dataset.openTitle||"",subtitle:t.dataset.openSubtitle||""})},this.el.addEventListener("dblclick",this.handleDblClick)},destroyed(){this.el.removeEventListener("dblclick",this.handleDblClick)}};var ns=e=>({mounted(){this.lastTargetId=null,this.scrollToSelectedSection()},updated(){this.scrollToSelectedSection()},scrollToSelectedSection(){let t=this.el.dataset[e];!t||t===this.lastTargetId||(this.lastTargetId=t,window.requestAnimationFrame(()=>{let i=document.getElementById(t);i&&this.el.contains(i)&&i.scrollIntoView({block:"start",behavior:"smooth"})}))}}),rs=ns("settingsScrollTarget"),os=ns("tagsScrollTarget");var as={mounted(){this.stickToBottom=!0,this.scrollContainer=null,this.autoResize=()=>{let e=this.el.querySelector(".chat-input");if(!e)return;let t=getComputedStyle(e),i=parseFloat(t.getPropertyValue("--chat-input-min-height"))||20,s=parseFloat(t.getPropertyValue("--chat-input-max-height"))||160;if(e.rows=1,e.style.minHeight=`${i}px`,e.value.trim()===""){e.style.height=`${i}px`,e.style.maxHeight=`${i}px`,e.style.overflowY="hidden";return}e.style.maxHeight=`${s}px`,e.style.height="0px";let n=Math.min(Math.max(e.scrollHeight,i),s);e.style.height=`${n}px`,e.style.overflowY=n>=s?"auto":"hidden"},this.syncScrollContainer=()=>{let e=this.el.querySelector(".chat-messages");e!==this.scrollContainer&&(this.scrollContainer&&this.scrollContainer.removeEventListener("scroll",this.handleScroll),this.scrollContainer=e,this.scrollContainer&&this.scrollContainer.addEventListener("scroll",this.handleScroll))},this.scrollToBottom=(e=!1)=>{this.scrollContainer&&(e||this.stickToBottom)&&(this.scrollContainer.scrollTop=this.scrollContainer.scrollHeight)},this.syncExpandedSurfaces=()=>{this.el.querySelectorAll(".chat-inline-surface[data-expanded='true']").forEach(e=>{e.open=!0})},this.surfaceObserver=new MutationObserver(()=>{this.syncExpandedSurfaces()}),this.handleScroll=()=>{if(!this.scrollContainer){this.stickToBottom=!0;return}let e=this.scrollContainer.scrollHeight-this.scrollContainer.scrollTop-this.scrollContainer.clientHeight;this.stickToBottom=e<48},this.handleInput=e=>{e.target.closest(".chat-input")&&(this.stickToBottom=!0,this.autoResize())},this.handleKeyDown=e=>{if(e.target.closest(".chat-input")&&e.key==="Enter"&&!e.shiftKey&&!e.isComposing){e.preventDefault();let t=this.el.querySelector("[data-testid='chat-send-button']");t&&!t.disabled&&t.click()}},this.el.addEventListener("input",this.handleInput),this.el.addEventListener("keydown",this.handleKeyDown),this.syncScrollContainer(),this.syncExpandedSurfaces(),this.surfaceObserver.observe(this.el,{childList:!0,subtree:!0}),this.autoResize(),window.requestAnimationFrame(()=>this.scrollToBottom(!0))},updated(){this.syncScrollContainer(),this.syncExpandedSurfaces(),this.autoResize(),window.requestAnimationFrame(()=>this.scrollToBottom())},destroyed(){this.surfaceObserver.disconnect(),this.el.removeEventListener("input",this.handleInput),this.el.removeEventListener("keydown",this.handleKeyDown),this.scrollContainer&&this.scrollContainer.removeEventListener("scroll",this.handleScroll)}};var hs={mounted(){this._onClickAway=e=>{this.el.contains(e.target)||this.el.querySelector(".colour-picker-popover")?.classList.add("hidden")},document.addEventListener("mousedown",this._onClickAway),this._setupCustomInput()},updated(){this._setupCustomInput()},destroyed(){document.removeEventListener("mousedown",this._onClickAway)},_setupCustomInput(){let e=this.el.querySelector(".colour-picker-custom input");if(!e||e._cpBound)return;e._cpBound=!0;let t=()=>{let i=e.value.trim();if(i&&!i.startsWith("#")&&(i="#"+i),/^#[0-9a-fA-F]{6}$/.test(i)){let s=this.el.dataset.pickEvent;this.pushEventTo(this.el.dataset.target,s,{color:i}),this.el.querySelector(".colour-picker-popover")?.classList.add("hidden")}};e.addEventListener("keydown",i=>{i.key==="Enter"&&(i.preventDefault(),t())}),e.addEventListener("blur",t)}};var ls={mounted(){this.dragItemId=null,this.dragSourceEl=null,this.dropTargetEl=null,this.dropPosition=null,this.clearDropTarget=()=>{this.dropTargetEl&&this.dropTargetEl.classList.remove("is-drop-before","is-drop-after","is-drop-inside"),this.dropTargetEl=null,this.dropPosition=null},this.setDropTarget=(e,t)=>{this.dropTargetEl===e&&this.dropPosition===t||(this.clearDropTarget(),this.dropTargetEl=e,this.dropPosition=t,e.classList.add(`is-drop-${t}`))},this.handleDragStart=e=>{let t=e.target.closest("[data-menu-drag-handle='true']"),i=e.target.closest("[data-menu-item-id]");!t||!i||!this.el.contains(i)||(this.dragItemId=i.dataset.menuItemId||null,this.dragSourceEl=i,i.classList.add("is-dragging"),e.dataTransfer&&(e.dataTransfer.effectAllowed="move",e.dataTransfer.setData("text/plain",this.dragItemId||"")))},this.handleDragOver=e=>{let t=e.target.closest("[data-menu-item-id]");if(!this.dragItemId||!t||!this.el.contains(t)){this.clearDropTarget();return}let i=t.dataset.menuItemId||"";if(!i||i===this.dragItemId){this.clearDropTarget();return}e.preventDefault();let s=t.getBoundingClientRect(),n=e.clientY-s.top,r=t.dataset.menuCanDropInside==="true",o=s.height*.3,a=s.height*.7,h=r&&n>=o&&n<=a?"inside":n{let t=e.target.closest("[data-menu-item-id]");if(!this.dragItemId||!t||!this.el.contains(t)||!this.dropPosition){this.clearDropTarget();return}e.preventDefault(),this.pushEvent("menu_editor_drop_item",{drag_item_id:this.dragItemId,target_item_id:t.dataset.menuItemId,position:this.dropPosition}),this.clearDropTarget()},this.handleDragLeave=e=>{let t=e.relatedTarget;this.dropTargetEl&&(!t||!this.dropTargetEl.contains(t))&&this.clearDropTarget()},this.handleDragEnd=()=>{this.dragSourceEl&&this.dragSourceEl.classList.remove("is-dragging"),this.dragItemId=null,this.dragSourceEl=null,this.clearDropTarget()},this.el.addEventListener("dragstart",this.handleDragStart),this.el.addEventListener("dragover",this.handleDragOver),this.el.addEventListener("drop",this.handleDrop),this.el.addEventListener("dragleave",this.handleDragLeave),this.el.addEventListener("dragend",this.handleDragEnd)},destroyed(){this.el.removeEventListener("dragstart",this.handleDragStart),this.el.removeEventListener("dragover",this.handleDragOver),this.el.removeEventListener("drop",this.handleDrop),this.el.removeEventListener("dragleave",this.handleDragLeave),this.el.removeEventListener("dragend",this.handleDragEnd)}};var cs={mounted(){this.textarea=document.getElementById(this.el.dataset.monacoInputId)||this.el.querySelector("textarea"),this.host=this.el.querySelector(".monaco-editor-instance"),this.language=this.el.dataset.monacoLanguage||"plaintext",this.wordWrap=this.el.dataset.monacoWordWrap||"off",this.editorId=this.el.dataset.monacoEditorId||"",this.insertEvent=this.el.dataset.monacoInsertEvent||"",this.syncTimer=null,this.isApplyingRemoteUpdate=!1,this.lastKnownValue=this.textarea?.value||"",this.syncEditorFromTextarea=()=>{if(this.textarea=document.getElementById(this.el.dataset.monacoInputId)||this.el.querySelector("textarea"),!this.textarea||!this.editor)return;let e=this.textarea.value||"";this.editor.getValue()!==e&&(this.isApplyingRemoteUpdate=!0,this.editor.setValue(e),this.isApplyingRemoteUpdate=!1),this.lastKnownValue=e},this.layoutEditorSoon=()=>{window.requestAnimationFrame(()=>{window.requestAnimationFrame(()=>{this.editor&&this.editor.layout()})})},this.waitForMonacoVisibleSize=()=>new Promise(e=>{let t=!1,i=0,s=()=>{let o=this.host?.getBoundingClientRect();return!!(o&&o.width>0&&o.height>0)},n=()=>{t||(t=!0,this.visibleSizeObserver?.disconnect(),this.visibleSizeObserver=null,e())},r=()=>{if(s()||i>=20){n();return}i+=1,window.requestAnimationFrame(r)};if(s()){n();return}window.ResizeObserver&&this.host&&(this.visibleSizeObserver=new ResizeObserver(()=>{s()&&n()}),this.visibleSizeObserver.observe(this.host)),window.requestAnimationFrame(r)}),this.queueSync=()=>{!this.textarea||!this.editor||(window.clearTimeout(this.syncTimer),this.syncTimer=window.setTimeout(()=>{if(!this.textarea||!this.editor)return;let e=this.editor.getValue();this.textarea.value!==e&&(this.lastKnownValue=e,this.textarea.value=e,this.textarea.dispatchEvent(new Event("input",{bubbles:!0})))},120))},this.dropEvent=this.el.dataset.monacoDropEvent||"",this.dropPostId=this.el.dataset.monacoDropPostId||"",this.handleDragOver=e=>{e.dataTransfer&&Array.from(e.dataTransfer.types||[]).includes("Files")&&(e.preventDefault(),e.dataTransfer.dropEffect="copy")},this.handleDrop=e=>{if(!this.dropEvent||!e.dataTransfer)return;let i=Array.from(e.dataTransfer.files||[]).filter(s=>(s.type||"").startsWith("image/")&&s.path);i.length!==0&&(e.preventDefault(),e.stopPropagation(),i.forEach(s=>{this.pushEvent(this.dropEvent,{"post-id":this.dropPostId,path:s.path})}))},this.handleInsert=({id:e,content:t})=>{if(!this.editor||!t||String(e)!==String(this.editorId))return;let i=this.editor.getModel(),s=this.editor.getSelection();if(!i||!s)return;let n=this.editor.getValue(),r=i.getOffsetAt(s.getStartPosition()),o=i.getOffsetAt(s.getEndPosition()),a=n.slice(0,r),h=n.slice(o),l=a!==""&&!a.endsWith(` -`)?` -`:"",d=h!==""&&!t.endsWith(` -`)?` -`:"",p=`${l}${t}${d}`;this.editor.executeEdits("bds-insert-content",[{range:s,text:p,forceMoveMarkers:!0}]),this.editor.focus()},Oe().then(async e=>{!this.host||!this.textarea||(await this.waitForMonacoVisibleSize(),he(e),this.editor=e.editor.create(this.host,{value:this.textarea.value||"",language:this.language,theme:"bds-theme",automaticLayout:!0,minimap:{enabled:!1},scrollBeyondLastLine:!1,wordWrap:this.wordWrap,lineNumbers:"on",lineNumbersMinChars:3,fontSize:14,fontFamily:"'Cascadia Code', 'Consolas', 'Courier New', monospace",padding:{top:12,bottom:12},roundedSelection:!1,renderLineHighlight:"line",formatOnPaste:!0,cursorStyle:"line",cursorBlinking:"smooth",quickSuggestions:this.language!=="markdown-with-macros",tabSize:2,insertSpaces:!0}),Zi(this.editorId||this.el.id,this.editor),e.editor.setTheme("bds-theme"),this.syncEditorFromTextarea(),this.layoutEditorSoon(),this.changeSubscription=this.editor.onDidChangeModelContent(()=>{this.isApplyingRemoteUpdate||this.queueSync()}),this.insertEvent&&this.handleEvent(this.insertEvent,this.handleInsert),this.dropEvent&&(this.el.addEventListener("dragover",this.handleDragOver),this.el.addEventListener("drop",this.handleDrop)))}).catch(e=>{console.error("Failed to load Monaco editor",e)})},updated(){this.textarea=document.getElementById(this.el.dataset.monacoInputId)||this.el.querySelector("textarea"),this.host=this.el.querySelector(".monaco-editor-instance"),this.language=this.el.dataset.monacoLanguage||this.language||"plaintext",this.wordWrap=this.el.dataset.monacoWordWrap||this.wordWrap||"off",!(!this.editor||!this.textarea)&&(Oe().then(e=>{he(e),e.editor.setTheme("bds-theme"),this.editor.getModel()?.getLanguageId()!==this.language&&e.editor.setModelLanguage(this.editor.getModel(),this.language),this.editor.updateOptions({wordWrap:this.wordWrap})}),this.syncEditorFromTextarea(),this.layoutEditorSoon())},destroyed(){window.clearTimeout(this.syncTimer),this.visibleSizeObserver?.disconnect(),this.changeSubscription?.dispose(),this.dropEvent&&(this.el.removeEventListener("dragover",this.handleDragOver),this.el.removeEventListener("drop",this.handleDrop)),Qi(this.editorId||this.el.id),this.editor?.dispose()}};var ds={mounted(){this.host=this.el.querySelector(".monaco-diff-editor-instance"),this.originalInput=this.el.querySelector(".monaco-diff-original"),this.modifiedInput=this.el.querySelector(".monaco-diff-modified"),this.filePath=this.el.dataset.monacoDiffFilePath||"working-tree",this.language=this.el.dataset.monacoDiffLanguage||"plaintext",this.viewStyle=this.el.dataset.monacoDiffViewStyle||"inline",this.wordWrap=this.el.dataset.monacoDiffWordWrap||"off",this.hideUnchanged=this.el.dataset.monacoDiffHideUnchanged==="true",this.readValues=()=>({original:this.originalInput?.value||"",modified:this.modifiedInput?.value||""}),this.applyDataset=()=>{this.filePath=this.el.dataset.monacoDiffFilePath||"working-tree",this.language=this.el.dataset.monacoDiffLanguage||"plaintext",this.viewStyle=this.el.dataset.monacoDiffViewStyle||"inline",this.wordWrap=this.el.dataset.monacoDiffWordWrap||"off",this.hideUnchanged=this.el.dataset.monacoDiffHideUnchanged==="true"},this.setModels=e=>{let t=this.readValues();this.originalModel?.dispose(),this.modifiedModel?.dispose(),this.originalModel=e.editor.createModel(t.original,this.language,e.Uri.parse(Yt(this.filePath,"original"))),this.modifiedModel=e.editor.createModel(t.modified,this.language,e.Uri.parse(Yt(this.filePath,"modified"))),this.editor.setModel({original:this.originalModel,modified:this.modifiedModel}),this.lastFilePath=this.filePath},Oe().then(e=>{this.host&&(he(e),this.editor=e.editor.createDiffEditor(this.host,{theme:"bds-theme",automaticLayout:!0,readOnly:!0,renderSideBySide:this.viewStyle==="side-by-side",minimap:{enabled:!1},scrollBeyondLastLine:!1,lineNumbers:"on",diffCodeLens:!1,originalEditable:!1,wordWrap:this.wordWrap,hideUnchangedRegions:{enabled:this.hideUnchanged},ignoreTrimWhitespace:!1}),this.setModels(e))}).catch(e=>{console.error("Failed to load Monaco diff editor",e)})},updated(){this.host=this.el.querySelector(".monaco-diff-editor-instance"),this.originalInput=this.el.querySelector(".monaco-diff-original"),this.modifiedInput=this.el.querySelector(".monaco-diff-modified"),this.applyDataset(),this.editor&&Oe().then(e=>{if(he(e),e.editor.setTheme("bds-theme"),this.editor.updateOptions({renderSideBySide:this.viewStyle==="side-by-side",wordWrap:this.wordWrap,hideUnchangedRegions:{enabled:this.hideUnchanged}}),this.lastFilePath!==this.filePath){this.setModels(e);return}let t=this.readValues();this.originalModel&&this.originalModel.getLanguageId()!==this.language&&e.editor.setModelLanguage(this.originalModel,this.language),this.modifiedModel&&this.modifiedModel.getLanguageId()!==this.language&&e.editor.setModelLanguage(this.modifiedModel,this.language),this.originalModel&&this.originalModel.getValue()!==t.original&&this.originalModel.setValue(t.original),this.modifiedModel&&this.modifiedModel.getValue()!==t.modified&&this.modifiedModel.setValue(t.modified)})},destroyed(){this.originalModel?.dispose(),this.modifiedModel?.dispose(),this.editor?.dispose()}};var us={AppShell:is,SidebarInteractions:ss,SettingsSectionScroll:rs,TagsSectionScroll:os,ChatSurface:as,ColourPicker:hs,MenuEditorTree:ls,MonacoEditor:cs,MonacoDiffEditor:ds};document.addEventListener("DOMContentLoaded",()=>{let e=document.querySelector("meta[name='csrf-token']").getAttribute("content"),t=new Ui("/live",ti,{params:{_csrf_token:e},hooks:us,metadata:{keydown:i=>({key:i.key,meta:i.metaKey,ctrl:i.ctrlKey,alt:i.altKey,shift:i.shiftKey,tag:i.target?.tagName||null,contentEditable:i.target?.isContentEditable||!1})}});t.connect(),window.liveSocket=t});})(); + `); + } + this.socket = new phxSocket(url, opts); + this.bindingPrefix = opts.bindingPrefix || BINDING_PREFIX; + this.opts = opts; + this.params = closure2(opts.params || {}); + this.viewLogger = opts.viewLogger; + this.metadataCallbacks = opts.metadata || {}; + this.defaults = Object.assign(clone(DEFAULTS), opts.defaults || {}); + this.prevActive = null; + this.silenced = false; + this.main = null; + this.outgoingMainEl = null; + this.clickStartedAtTarget = null; + this.linkRef = 1; + this.roots = {}; + this.href = window.location.href; + this.pendingLink = null; + this.currentLocation = clone(window.location); + this.hooks = opts.hooks || {}; + this.uploaders = opts.uploaders || {}; + this.loaderTimeout = opts.loaderTimeout || LOADER_TIMEOUT; + this.disconnectedTimeout = opts.disconnectedTimeout || DISCONNECTED_TIMEOUT; + this.reloadWithJitterTimer = null; + this.maxReloads = opts.maxReloads || MAX_RELOADS; + this.reloadJitterMin = opts.reloadJitterMin || RELOAD_JITTER_MIN; + this.reloadJitterMax = opts.reloadJitterMax || RELOAD_JITTER_MAX; + this.failsafeJitter = opts.failsafeJitter || FAILSAFE_JITTER; + this.localStorage = opts.localStorage || window.localStorage; + this.sessionStorage = opts.sessionStorage || window.sessionStorage; + this.boundTopLevelEvents = false; + this.boundEventNames = /* @__PURE__ */ new Set(); + this.blockPhxChangeWhileComposing = opts.blockPhxChangeWhileComposing || false; + this.serverCloseRef = null; + this.domCallbacks = Object.assign( + { + jsQuerySelectorAll: null, + onPatchStart: closure2(), + onPatchEnd: closure2(), + onNodeAdded: closure2(), + onBeforeElUpdated: closure2() + }, + opts.dom || {} + ); + this.transitions = new TransitionSet(); + this.currentHistoryPosition = parseInt(this.sessionStorage.getItem(PHX_LV_HISTORY_POSITION)) || 0; + window.addEventListener("pagehide", (_e) => { + this.unloaded = true; + }); + this.socket.onOpen(() => { + if (this.isUnloaded()) { + window.location.reload(); + } + }); + } + // public + version() { + return "1.1.28"; + } + isProfileEnabled() { + return this.sessionStorage.getItem(PHX_LV_PROFILE) === "true"; + } + isDebugEnabled() { + return this.sessionStorage.getItem(PHX_LV_DEBUG) === "true"; + } + isDebugDisabled() { + return this.sessionStorage.getItem(PHX_LV_DEBUG) === "false"; + } + enableDebug() { + this.sessionStorage.setItem(PHX_LV_DEBUG, "true"); + } + enableProfiling() { + this.sessionStorage.setItem(PHX_LV_PROFILE, "true"); + } + disableDebug() { + this.sessionStorage.setItem(PHX_LV_DEBUG, "false"); + } + disableProfiling() { + this.sessionStorage.removeItem(PHX_LV_PROFILE); + } + enableLatencySim(upperBoundMs) { + this.enableDebug(); + console.log( + "latency simulator enabled for the duration of this browser session. Call disableLatencySim() to disable" + ); + this.sessionStorage.setItem(PHX_LV_LATENCY_SIM, upperBoundMs); + } + disableLatencySim() { + this.sessionStorage.removeItem(PHX_LV_LATENCY_SIM); + } + getLatencySim() { + const str = this.sessionStorage.getItem(PHX_LV_LATENCY_SIM); + return str ? parseInt(str) : null; + } + getSocket() { + return this.socket; + } + connect() { + if (window.location.hostname === "localhost" && !this.isDebugDisabled()) { + this.enableDebug(); + } + const doConnect = () => { + this.resetReloadStatus(); + if (this.joinRootViews()) { + this.bindTopLevelEvents(); + this.socket.connect(); + } else if (this.main) { + this.socket.connect(); + } else { + this.bindTopLevelEvents({ dead: true }); + } + this.joinDeadView(); + }; + if (["complete", "loaded", "interactive"].indexOf(document.readyState) >= 0) { + doConnect(); + } else { + document.addEventListener("DOMContentLoaded", () => doConnect()); + } + } + disconnect(callback) { + clearTimeout(this.reloadWithJitterTimer); + if (this.serverCloseRef) { + this.socket.off(this.serverCloseRef); + this.serverCloseRef = null; + } + this.socket.disconnect(callback); + } + replaceTransport(transport) { + clearTimeout(this.reloadWithJitterTimer); + this.socket.replaceTransport(transport); + this.connect(); + } + /** + * @param {HTMLElement} el + * @param {string} encodedJS + * @param {string | null} [eventType] + */ + execJS(el, encodedJS, eventType = null) { + const e = new CustomEvent("phx:exec", { detail: { sourceElement: el } }); + this.owner(el, (view) => js_default.exec(e, eventType, encodedJS, view, el)); + } + /** + * Returns an object with methods to manipulate the DOM and execute JavaScript. + * The applied changes integrate with server DOM patching. + * + * @returns {import("./js_commands").LiveSocketJSCommands} + */ + js() { + return js_commands_default(this, "js"); + } + // private + unload() { + if (this.unloaded) { + return; + } + if (this.main && this.isConnected()) { + this.log(this.main, "socket", () => ["disconnect for page nav"]); + } + this.unloaded = true; + this.destroyAllViews(); + this.disconnect(); + } + triggerDOM(kind, args) { + this.domCallbacks[kind](...args); + } + time(name, func) { + if (!this.isProfileEnabled() || !console.time) { + return func(); + } + console.time(name); + const result = func(); + console.timeEnd(name); + return result; + } + log(view, kind, msgCallback) { + if (this.viewLogger) { + const [msg, obj] = msgCallback(); + this.viewLogger(view, kind, msg, obj); + } else if (this.isDebugEnabled()) { + const [msg, obj] = msgCallback(); + debug(view, kind, msg, obj); + } + } + requestDOMUpdate(callback) { + this.transitions.after(callback); + } + asyncTransition(promise) { + this.transitions.addAsyncTransition(promise); + } + transition(time, onStart, onDone = function() { + }) { + this.transitions.addTransition(time, onStart, onDone); + } + onChannel(channel, event, cb) { + channel.on(event, (data) => { + const latency = this.getLatencySim(); + if (!latency) { + cb(data); + } else { + setTimeout(() => cb(data), latency); + } + }); + } + reloadWithJitter(view, log) { + clearTimeout(this.reloadWithJitterTimer); + this.disconnect(); + const minMs = this.reloadJitterMin; + const maxMs = this.reloadJitterMax; + let afterMs = Math.floor(Math.random() * (maxMs - minMs + 1)) + minMs; + const tries = browser_default.updateLocal( + this.localStorage, + window.location.pathname, + CONSECUTIVE_RELOADS, + 0, + (count) => count + 1 + ); + if (tries >= this.maxReloads) { + afterMs = this.failsafeJitter; + } + this.reloadWithJitterTimer = setTimeout(() => { + if (view.isDestroyed() || view.isConnected()) { + return; + } + view.destroy(); + log ? log() : this.log(view, "join", () => [ + `encountered ${tries} consecutive reloads` + ]); + if (tries >= this.maxReloads) { + this.log(view, "join", () => [ + `exceeded ${this.maxReloads} consecutive reloads. Entering failsafe mode` + ]); + } + if (this.hasPendingLink()) { + window.location = this.pendingLink; + } else { + window.location.reload(); + } + }, afterMs); + } + getHookDefinition(name) { + if (!name) { + return; + } + return this.maybeInternalHook(name) || this.hooks[name] || this.maybeRuntimeHook(name); + } + maybeInternalHook(name) { + return name && name.startsWith("Phoenix.") && hooks_default[name.split(".")[1]]; + } + maybeRuntimeHook(name) { + const runtimeHook = document.querySelector( + `script[${PHX_RUNTIME_HOOK}="${CSS.escape(name)}"]` + ); + if (!runtimeHook) { + return; + } + let callbacks = window[`phx_hook_${name}`]; + if (!callbacks || typeof callbacks !== "function") { + logError("a runtime hook must be a function", runtimeHook); + return; + } + const hookDefiniton = callbacks(); + if (hookDefiniton && (typeof hookDefiniton === "object" || typeof hookDefiniton === "function")) { + return hookDefiniton; + } + logError( + "runtime hook must return an object with hook callbacks or an instance of ViewHook", + runtimeHook + ); + } + isUnloaded() { + return this.unloaded; + } + isConnected() { + return this.socket.isConnected(); + } + getBindingPrefix() { + return this.bindingPrefix; + } + binding(kind) { + return `${this.getBindingPrefix()}${kind}`; + } + channel(topic, params) { + return this.socket.channel(topic, params); + } + joinDeadView() { + const body = document.body; + if (body && !this.isPhxView(body) && !this.isPhxView(document.firstElementChild)) { + const view = this.newRootView(body); + view.setHref(this.getHref()); + view.joinDead(); + if (!this.main) { + this.main = view; + } + window.requestAnimationFrame(() => { + view.execNewMounted(); + this.maybeScroll(history.state?.scroll); + }); + } + } + joinRootViews() { + let rootsFound = false; + dom_default.all( + document, + `${PHX_VIEW_SELECTOR}:not([${PHX_PARENT_ID}])`, + (rootEl) => { + if (!this.getRootById(rootEl.id)) { + const view = this.newRootView(rootEl); + if (!dom_default.isPhxSticky(rootEl)) { + view.setHref(this.getHref()); + } + view.join(); + if (rootEl.hasAttribute(PHX_MAIN)) { + this.main = view; + } + } + rootsFound = true; + } + ); + return rootsFound; + } + redirect(to, flash, reloadToken) { + if (reloadToken) { + browser_default.setCookie(PHX_RELOAD_STATUS, reloadToken, 60); + } + this.unload(); + browser_default.redirect(to, flash); + } + replaceMain(href, flash, callback = null, linkRef = this.setPendingLink(href)) { + const liveReferer = this.currentLocation.href; + this.outgoingMainEl = this.outgoingMainEl || this.main.el; + const stickies = dom_default.findPhxSticky(document) || []; + const removeEls = dom_default.all( + this.outgoingMainEl, + `[${this.binding("remove")}]` + ).filter((el) => !dom_default.isChildOfAny(el, stickies)); + const newMainEl = dom_default.cloneNode(this.outgoingMainEl, ""); + this.main.showLoader(this.loaderTimeout); + this.main.destroy(); + this.main = this.newRootView(newMainEl, flash, liveReferer); + this.main.setRedirect(href); + this.transitionRemoves(removeEls); + this.main.join((joinCount, onDone) => { + if (joinCount === 1 && this.commitPendingLink(linkRef)) { + this.requestDOMUpdate(() => { + removeEls.forEach((el) => el.remove()); + stickies.forEach((el) => newMainEl.appendChild(el)); + this.outgoingMainEl.replaceWith(newMainEl); + this.outgoingMainEl = null; + callback && callback(linkRef); + onDone(); + }); + } + }); + } + transitionRemoves(elements, callback) { + const removeAttr = this.binding("remove"); + const silenceEvents = (e) => { + e.preventDefault(); + e.stopImmediatePropagation(); + }; + elements.forEach((el) => { + for (const event of this.boundEventNames) { + el.addEventListener(event, silenceEvents, true); + } + this.execJS(el, el.getAttribute(removeAttr), "remove"); + }); + this.requestDOMUpdate(() => { + elements.forEach((el) => { + for (const event of this.boundEventNames) { + el.removeEventListener(event, silenceEvents, true); + } + }); + callback && callback(); + }); + } + isPhxView(el) { + return el.getAttribute && el.getAttribute(PHX_SESSION) !== null; + } + newRootView(el, flash, liveReferer) { + const view = new View(el, this, null, flash, liveReferer); + this.roots[view.id] = view; + return view; + } + owner(childEl, callback) { + let view; + const viewEl = dom_default.closestViewEl(childEl); + if (viewEl) { + view = this.getViewByEl(viewEl); + } else { + if (!childEl.isConnected) { + return null; + } + view = this.main; + } + return view && callback ? callback(view) : view; + } + withinOwners(childEl, callback) { + this.owner(childEl, (view) => callback(view, childEl)); + } + getViewByEl(el) { + const rootId = el.getAttribute(PHX_ROOT_ID); + return maybe( + this.getRootById(rootId), + (root) => root.getDescendentByEl(el) + ); + } + getRootById(id) { + return this.roots[id]; + } + destroyAllViews() { + for (const id in this.roots) { + this.roots[id].destroy(); + delete this.roots[id]; + } + this.main = null; + } + destroyViewByEl(el) { + const root = this.getRootById(el.getAttribute(PHX_ROOT_ID)); + if (root && root.id === el.id) { + root.destroy(); + delete this.roots[root.id]; + } else if (root) { + root.destroyDescendent(el.id); + } + } + getActiveElement() { + return document.activeElement; + } + dropActiveElement(view) { + if (this.prevActive && view.ownsElement(this.prevActive)) { + this.prevActive = null; + } + } + restorePreviouslyActiveFocus() { + if (this.prevActive && this.prevActive !== document.body && this.prevActive instanceof HTMLElement) { + this.prevActive.focus(); + } + } + blurActiveElement() { + this.prevActive = this.getActiveElement(); + if (this.prevActive !== document.body && this.prevActive instanceof HTMLElement) { + this.prevActive.blur(); + } + } + /** + * @param {{dead?: boolean}} [options={}] + */ + bindTopLevelEvents({ dead } = {}) { + if (this.boundTopLevelEvents) { + return; + } + this.boundTopLevelEvents = true; + this.serverCloseRef = this.socket.onClose((event) => { + if (event && event.code === 1e3 && this.main) { + return this.reloadWithJitter(this.main); + } + }); + document.body.addEventListener("click", function() { + }); + window.addEventListener( + "pageshow", + (e) => { + if (e.persisted) { + this.getSocket().disconnect(); + this.withPageLoading({ to: window.location.href, kind: "redirect" }); + window.location.reload(); + } + }, + true + ); + if (!dead) { + this.bindNav(); + } + this.bindClicks(); + if (!dead) { + this.bindForms(); + } + this.bind( + { keyup: "keyup", keydown: "keydown" }, + (e, type, view, targetEl, phxEvent, _phxTarget) => { + const matchKey = targetEl.getAttribute(this.binding(PHX_KEY)); + const pressedKey = e.key && e.key.toLowerCase(); + if (matchKey && matchKey.toLowerCase() !== pressedKey) { + return; + } + const data = { key: e.key, ...this.eventMeta(type, e, targetEl) }; + js_default.exec(e, type, phxEvent, view, targetEl, ["push", { data }]); + } + ); + this.bind( + { blur: "focusout", focus: "focusin" }, + (e, type, view, targetEl, phxEvent, phxTarget) => { + if (!phxTarget) { + const data = { key: e.key, ...this.eventMeta(type, e, targetEl) }; + js_default.exec(e, type, phxEvent, view, targetEl, ["push", { data }]); + } + } + ); + this.bind( + { blur: "blur", focus: "focus" }, + (e, type, view, targetEl, phxEvent, phxTarget) => { + if (phxTarget === "window") { + const data = this.eventMeta(type, e, targetEl); + js_default.exec(e, type, phxEvent, view, targetEl, ["push", { data }]); + } + } + ); + this.on("dragover", (e) => e.preventDefault()); + this.on("dragenter", (e) => { + const dropzone = closestPhxBinding( + e.target, + this.binding(PHX_DROP_TARGET) + ); + if (!dropzone || !(dropzone instanceof HTMLElement)) { + return; + } + if (eventContainsFiles(e)) { + this.js().addClass(dropzone, PHX_DROP_TARGET_ACTIVE_CLASS); + } + }); + this.on("dragleave", (e) => { + const dropzone = closestPhxBinding( + e.target, + this.binding(PHX_DROP_TARGET) + ); + if (!dropzone || !(dropzone instanceof HTMLElement)) { + return; + } + const rect = dropzone.getBoundingClientRect(); + if (e.clientX <= rect.left || e.clientX >= rect.right || e.clientY <= rect.top || e.clientY >= rect.bottom) { + this.js().removeClass(dropzone, PHX_DROP_TARGET_ACTIVE_CLASS); + } + }); + this.on("drop", (e) => { + e.preventDefault(); + const dropzone = closestPhxBinding( + e.target, + this.binding(PHX_DROP_TARGET) + ); + if (!dropzone || !(dropzone instanceof HTMLElement)) { + return; + } + this.js().removeClass(dropzone, PHX_DROP_TARGET_ACTIVE_CLASS); + const dropTargetId = dropzone.getAttribute(this.binding(PHX_DROP_TARGET)); + const dropTarget = dropTargetId && document.getElementById(dropTargetId); + const files = Array.from(e.dataTransfer.files || []); + if (!dropTarget || !(dropTarget instanceof HTMLInputElement) || dropTarget.disabled || files.length === 0 || !(dropTarget.files instanceof FileList)) { + return; + } + LiveUploader.trackFiles(dropTarget, files, e.dataTransfer); + dropTarget.dispatchEvent(new Event("input", { bubbles: true })); + }); + this.on(PHX_TRACK_UPLOADS, (e) => { + const uploadTarget = e.target; + if (!dom_default.isUploadInput(uploadTarget)) { + return; + } + const files = Array.from(e.detail.files || []).filter( + (f) => f instanceof File || f instanceof Blob + ); + LiveUploader.trackFiles(uploadTarget, files); + uploadTarget.dispatchEvent(new Event("input", { bubbles: true })); + }); + } + eventMeta(eventName, e, targetEl) { + const callback = this.metadataCallbacks[eventName]; + return callback ? callback(e, targetEl) : {}; + } + setPendingLink(href) { + this.linkRef++; + this.pendingLink = href; + this.resetReloadStatus(); + return this.linkRef; + } + // anytime we are navigating or connecting, drop reload cookie in case + // we issue the cookie but the next request was interrupted and the server never dropped it + resetReloadStatus() { + browser_default.deleteCookie(PHX_RELOAD_STATUS); + } + commitPendingLink(linkRef) { + if (this.linkRef !== linkRef) { + return false; + } else { + this.href = this.pendingLink; + this.pendingLink = null; + return true; + } + } + getHref() { + return this.href; + } + hasPendingLink() { + return !!this.pendingLink; + } + bind(events, callback) { + for (const event in events) { + const browserEventName = events[event]; + this.on(browserEventName, (e) => { + const binding = this.binding(event); + const windowBinding = this.binding(`window-${event}`); + const targetPhxEvent = e.target.getAttribute && e.target.getAttribute(binding); + if (targetPhxEvent) { + this.debounce(e.target, e, browserEventName, () => { + this.withinOwners(e.target, (view) => { + callback(e, event, view, e.target, targetPhxEvent, null); + }); + }); + } else { + dom_default.all(document, `[${windowBinding}]`, (el) => { + const phxEvent = el.getAttribute(windowBinding); + this.debounce(el, e, browserEventName, () => { + this.withinOwners(el, (view) => { + callback(e, event, view, el, phxEvent, "window"); + }); + }); + }); + } + }); + } + } + bindClicks() { + this.on("mousedown", (e) => this.clickStartedAtTarget = e.target); + this.bindClick("click", "click"); + } + bindClick(eventName, bindingName) { + const click = this.binding(bindingName); + window.addEventListener( + eventName, + (e) => { + let target = null; + if (e.detail === 0) + this.clickStartedAtTarget = e.target; + const clickStartedAtTarget = this.clickStartedAtTarget || e.target; + target = closestPhxBinding(e.target, click); + this.dispatchClickAway(e, clickStartedAtTarget); + this.clickStartedAtTarget = null; + const phxEvent = target && target.getAttribute(click); + if (!phxEvent) { + if (dom_default.isNewPageClick(e, window.location)) { + this.unload(); + } + return; + } + if (target.getAttribute("href") === "#") { + e.preventDefault(); + } + if (target.hasAttribute(PHX_REF_SRC)) { + return; + } + this.debounce(target, e, "click", () => { + this.withinOwners(target, (view) => { + js_default.exec(e, "click", phxEvent, view, target, [ + "push", + { data: this.eventMeta("click", e, target) } + ]); + }); + }); + }, + false + ); + } + dispatchClickAway(e, clickStartedAt) { + const phxClickAway = this.binding("click-away"); + const portal = clickStartedAt.closest(`[${PHX_TELEPORTED_SRC}]`); + const portalStartedAt = portal && dom_default.byId(portal.getAttribute(PHX_TELEPORTED_SRC)); + dom_default.all(document, `[${phxClickAway}]`, (el) => { + let startedAt = clickStartedAt; + if (portal && !portal.contains(el)) { + startedAt = portalStartedAt; + } + if (!(el.isSameNode(startedAt) || el.contains(startedAt) || // When clicking a link with custom method, + // phoenix_html triggers a click on a submit button + // of a hidden form appended to the body. For such cases + // where the clicked target is hidden, we skip click-away. + // + // Also, when we have a portal, we don't want to check the visibility + // of the portal source, as it's a