npm - @konomi-app/ui - Versions diffs - 3.0.0 → 4.0.0 - Mend

@konomi-app/ui 3.0.0 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/dist/index.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/index.ts","../src/overlay/style.ts","../src/overlay/index.ts","../src/loading-overlay/style.ts","../src/loading-overlay/index.ts","../src/task-list-overlay.ts","../src/modal/style.ts","../src/modal/index.ts","../src/utilities.ts"],"sourcesContent":["export * from './loading-overlay';\r\nexport * from './task-list-overlay';\r\nexport * from './modal';\r\nexport * from './utilities';\r\n","import { css } from '@emotion/css';\r\nimport { ATTRIBUTE_KEY, ATTRIBUTE_SHOWN } from '.';\r\n\r\nexport const getBodyStyle = () => css`\r\n overflow: visible;\r\n &[${ATTRIBUTE_KEY}] {\r\n overflow: hidden;\r\n }\r\n`;\r\n\r\nexport const getRootStyle = () => css`\r\n font-family: 'Yu Gothic Medium', '游ゴシック', YuGothic, 'メイリオ', 'Hiragino Kaku Gothic ProN',\r\n Meiryo, sans-serif;\r\n color: #356;\r\n font-size: 14px;\r\n\r\n overflow: hidden;\r\n background-color: #fffb;\r\n backdrop-filter: blur(4px);\r\n box-sizing: content-box;\r\n\r\n position: fixed;\r\n inset: 0;\r\n width: 100vw;\r\n height: 100vh;\r\n\r\n display: grid;\r\n transition: all 250ms ease;\r\n z-index: 1000;\r\n opacity: 0;\r\n transition: all 250ms ease;\r\n\r\n place-items: end stretch;\r\n @media (min-width: 640px) {\r\n font-size: 16px;\r\n place-items: center;\r\n }\r\n\r\n opacity: 0;\r\n pointer-events: none;\r\n &[${ATTRIBUTE_SHOWN}] {\r\n opacity: 1;\r\n pointer-events: all;\r\n }\r\n`;\r\n","import { getBodyStyle, getRootStyle } from './style';\r\n\r\nexport const ATTRIBUTE_KEY = 'data-konomi-ui-overlay';\r\nexport const ATTRIBUTE_SHOWN = 'data-shown';\r\n\r\nexport class Overlay {\r\n /*\r\n オーバーレイをレンダリングするルート要素。\r\n /\r\n readonly #root: HTMLDivElement;\r\n /\r\n オーバーレイをレンダリングするルート要素の`dataset`。\r\n /\r\n protected readonly _rootDataset: DOMStringMap;\r\n /\r\n オーバーレイが表示されているかどうか。\r\n /\r\n protected _shown: boolean;\r\n /\r\n オーバーレイを表示中にページを離れようとした場合にアラートを表示するかどうかを設定します。\r\n /\r\n protected _disableBeforeUnload: boolean;\r\n\r\n public constructor() {\r\n this._shown = false;\r\n this._disableBeforeUnload = false;\r\n this._rootDataset = {};\r\n\r\n const root = document.createElement('div');\r\n this.#root = root;\r\n this.#root.classList.add(getRootStyle());\r\n document.body.classList.add(getBodyStyle());\r\n this.#root.setAttribute(ATTRIBUTE_KEY, '');\r\n document.body.append(root);\r\n }\r\n\r\n public show(): void {\r\n this._shown = true;\r\n this.#root.setAttribute(ATTRIBUTE_SHOWN, '');\r\n document.body.setAttribute(ATTRIBUTE_KEY, '');\r\n window.addEventListener('beforeunload', this.beforeunload);\r\n this.render();\r\n }\r\n\r\n public hide(): void {\r\n this._shown = false;\r\n this.#root.removeAttribute(ATTRIBUTE_SHOWN);\r\n document.body.removeAttribute(ATTRIBUTE_KEY);\r\n window.removeEventListener('beforeunload', this.beforeunload);\r\n this.render();\r\n }\r\n\r\n protected render(): void {}\r\n\r\n /* JavaScript中にページを離れようとした場合にアラートを表示します /\r\n private beforeunload(event: BeforeUnloadEvent): void {\r\n event.preventDefault();\r\n }\r\n\r\n protected get root(): HTMLDivElement {\r\n return this.#root;\r\n }\r\n\r\n /* @deprecated このメソッドは非推奨です。代わりに`show`メソッドを使用してください。 /\r\n public start(): void {\r\n this.show();\r\n }\r\n /* @deprecated このメソッドは非推奨です。代わりに`hide`メソッドを使用してください。 /\r\n public stop(): void {\r\n this.hide();\r\n }\r\n}\r\n","import { css } from '@emotion/css';\r\nimport { ATTRIBUTE_ANIMATION } from '.';\r\n\r\nexport const containerStyle = css`\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 32px;\r\n padding: 24px;\r\n background-color: #fff;\r\n border-radius: 0;\r\n box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\r\n border: 1px solid #f3f4f6;\r\n min-height: 200px;\r\n position: relative;\r\n overflow: hidden;\r\n transition: all 250ms ease;\r\n\r\n @media (min-width: 640px) {\r\n width: 400px;\r\n max-width: 90vw;\r\n border-radius: 4px;\r\n padding: 32px;\r\n }\r\n`;\r\n\r\nexport const getLoaderStyle = () => css`\r\n font-size: 60px;\r\n width: 1em;\r\n height: 1em;\r\n border-radius: 50%;\r\n box-shadow: inset 0 0 0 1px #3b82f633;\r\n position: relative;\r\n\r\n animation: none;\r\n &[${ATTRIBUTE_ANIMATION}] {\r\n animation: rotate 1.2s infinite linear;\r\n }\r\n\r\n > div {\r\n position: absolute;\r\n left: 50%;\r\n top: 50%;\r\n width: 0.5em;\r\n height: 1em;\r\n margin-left: -0.5em;\r\n margin-top: -0.5em;\r\n overflow: hidden;\r\n transform-origin: 0.5em 0.5em;\r\n mask-image: linear-gradient(top, #000f, #0000);\r\n -webkit-mask-image: -webkit-linear-gradient(top, #000f, #0000);\r\n\r\n > div {\r\n width: 1em;\r\n height: 1em;\r\n border-radius: 50%;\r\n box-shadow: inset 0 0 0 1px #3b82f6;\r\n }\r\n }\r\n @keyframes rotate {\r\n 0% {\r\n transform: rotate(0deg);\r\n }\r\n 100% {\r\n transform: rotate(360deg);\r\n }\r\n }\r\n`;\r\n\r\nexport const progressStyle = css`\r\n position: absolute;\r\n bottom: 0px;\r\n left: 0;\r\n width: 0%;\r\n height: 2px;\r\n background-color: #2563eb;\r\n transition: all 350ms ease;\r\n`;\r\n","import { Overlay } from '../overlay';\r\nimport { containerStyle, getLoaderStyle, progressStyle } from './style';\r\n\r\ntype Label = string \| string[];\r\ntype ConstructorProps = Readonly<Partial<{ label: Label; progress: number }>>;\r\n\r\nexport const ATTRIBUTE_ANIMATION = 'data-animation';\r\n\r\nexport class LoadingOverlay extends Overlay {\r\n #label: Label;\r\n #html: string;\r\n #progress: number \| null;\r\n\r\n protected readonly _loaderElement: HTMLDivElement;\r\n protected readonly _progressElement: HTMLDivElement;\r\n protected readonly _contentElement: HTMLDivElement;\r\n\r\n public constructor(props: ConstructorProps = {}) {\r\n super();\r\n\r\n this.#label = props.label ?? '';\r\n this.#html = '';\r\n this.#progress = props.progress ?? null;\r\n\r\n const container = document.createElement('div');\r\n container.classList.add(containerStyle);\r\n this.root.append(container);\r\n\r\n const loaderElement = document.createElement('div');\r\n loaderElement.innerHTML = '<div><div></div></div>';\r\n loaderElement.classList.add(getLoaderStyle());\r\n this._loaderElement = loaderElement;\r\n container.append(loaderElement);\r\n\r\n const progressElement = document.createElement('div');\r\n progressElement.classList.add(progressStyle);\r\n this._progressElement = progressElement;\r\n container.append(progressElement);\r\n\r\n const contentElement = document.createElement('div');\r\n this._contentElement = contentElement;\r\n container.append(contentElement);\r\n\r\n this.render();\r\n }\r\n\r\n override show(): void {\r\n super.show();\r\n this._loaderElement.setAttribute(ATTRIBUTE_ANIMATION, '');\r\n }\r\n\r\n override hide(): void {\r\n super.hide();\r\n this._loaderElement.removeAttribute(ATTRIBUTE_ANIMATION);\r\n this.#progress = 0;\r\n this.#html = '';\r\n this.#label = '';\r\n }\r\n\r\n public set label(label: Label) {\r\n this.#label = label;\r\n this.render();\r\n }\r\n\r\n public set html(html: string) {\r\n this.#html = html;\r\n this.render();\r\n }\r\n\r\n /\r\n 進捗状況を設定します。\r\n * @param percent 進捗のパーセンテージ(0-100)\r\n /\r\n public set progress(percent: number) {\r\n this.#progress = percent;\r\n this.render();\r\n }\r\n\r\n override render(): void {\r\n super.render();\r\n\r\n this._progressElement.style.width = `${this.#progress}%`;\r\n\r\n if (this.#html) {\r\n this._contentElement.innerHTML = this.#html;\r\n } else {\r\n if (this.#label instanceof Array) {\r\n this._contentElement.innerHTML = `<div>${this.#label.join('</div><div>')}</div>`;\r\n } else {\r\n this._contentElement.innerText = this.#label;\r\n }\r\n }\r\n }\r\n}\r\n","import { css } from '@emotion/css';\r\nimport { Overlay } from './overlay';\r\n\r\ntype Label = string \| string[];\r\ntype TaskStatus = 'new' \| 'in-progress' \| 'done' \| 'error';\r\ntype Task = {\r\n key: string;\r\n label: Label;\r\n status: TaskStatus;\r\n};\r\n\r\ntype ConstructorProps = Readonly<Partial<{ taskList: Task[] }>>;\r\n\r\nexport class TaskListOverlay extends Overlay {\r\n #taskList: Task[];\r\n\r\n protected readonly _contentElement: HTMLDivElement;\r\n\r\n public constructor(props: ConstructorProps = {}) {\r\n super();\r\n\r\n this.#taskList = props.taskList ?? [];\r\n\r\n const container = document.createElement('div');\r\n container.classList.add(this.containerStyle);\r\n this.root.append(container);\r\n\r\n const contentElement = document.createElement('div');\r\n this._contentElement = contentElement;\r\n contentElement.classList.add(this.contentStyle);\r\n container.append(contentElement);\r\n\r\n this.render();\r\n }\r\n\r\n override hide(): void {\r\n this.#taskList = [];\r\n super.hide();\r\n }\r\n\r\n public done(key: string): void {\r\n const task = this.#taskList.find((t) => t.key === key);\r\n if (task) {\r\n task.status = 'done';\r\n this.render();\r\n }\r\n }\r\n\r\n public error(key: string): void {\r\n const task = this.#taskList.find((t) => t.key === key);\r\n if (task) {\r\n task.status = 'error';\r\n this.render();\r\n }\r\n }\r\n\r\n public inProgress(key: string): void {\r\n const task = this.#taskList.find((t) => t.key === key);\r\n if (task) {\r\n task.status = 'in-progress';\r\n this.render();\r\n }\r\n }\r\n\r\n public addTask(...tasks: { key: string; label: Label }[]): void {\r\n this.#taskList.push(...tasks.map<Task>(({ key, label }) => ({ key, label, status: 'new' })));\r\n this.render();\r\n }\r\n\r\n override render(): void {\r\n super.render();\r\n\r\n this._contentElement.innerHTML = `\r\n <div class=\"${this.taskListContainerStyle}\">\r\n ${this.#taskList.map((task) => this.renderTask(task)).join('')}\r\n </div>\r\n `;\r\n }\r\n\r\n private renderTask(task: Task): string {\r\n const label = Array.isArray(task.label) ? task.label.join(' ') : task.label;\r\n const status = task.status;\r\n\r\n return `\r\n <div class=\"${this.taskContainerStyle}\">\r\n <div class=\"${this.taskStatusStyle} status-${status}\">${this.getTaskStatusElement(\r\n task.status\r\n )}</div>\r\n <div class=\"${this.taskLabelStyle}\">${label}</div>\r\n </div>\r\n `;\r\n }\r\n\r\n private getTaskStatusElement(status: TaskStatus): string {\r\n switch (status) {\r\n case 'new':\r\n return `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#ddd\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"feather feather-minus-circle\"><circle cx=\"12\" cy=\"12\" r=\"10\"></circle><line x1=\"8\" y1=\"12\" x2=\"16\" y2=\"12\"></line></svg>`;\r\n case 'in-progress':\r\n return `<div><div></div></div>`;\r\n case 'done':\r\n return `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#80beaf\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"feather feather-check-circle\"><path d=\"M22 11.08V12a10 10 0 1 1-5.93-9.14\"></path><polyline points=\"22 4 12 14.01 9 11.01\"></polyline></svg>`;\r\n default:\r\n return ``;\r\n }\r\n }\r\n\r\n private containerStyle = css`\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 32px;\r\n padding: 32px 64px;\r\n background-color: #fffc;\r\n border-radius: 8px;\r\n box-shadow: 0 5px 24px -6px #0002;\r\n width: 300px;\r\n max-width: 90vw;\r\n min-height: 200px;\r\n position: relative;\r\n overflow: hidden;\r\n transition: all 250ms ease;\r\n\r\n @keyframes spin {\r\n 0% {\r\n transform: rotate(0deg);\r\n border-radius: 1em;\r\n }\r\n 20% {\r\n transform: rotate(0deg);\r\n }\r\n 30%,\r\n 60% {\r\n border-radius: 0.25em;\r\n }\r\n 70% {\r\n transform: rotate(180deg);\r\n }\r\n 100% {\r\n transform: rotate(180deg);\r\n border-radius: 1em;\r\n }\r\n }\r\n `;\r\n\r\n private contentStyle = css`\r\n width: 100%;\r\n `;\r\n\r\n private taskListContainerStyle = css`\r\n display: flex;\r\n flex-direction: column;\r\n gap: 1em;\r\n width: 100%;\r\n `;\r\n\r\n private taskContainerStyle = css`\r\n display: flex;\r\n align-items: center;\r\n gap: 1em;\r\n `;\r\n\r\n private taskLabelStyle = css``;\r\n\r\n private taskStatusStyle = css`\r\n font-size: 32px;\r\n width: 1em;\r\n height: 1em;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n\r\n &.status-new {\r\n }\r\n\r\n &.status-in-progress {\r\n border-radius: 50%;\r\n box-shadow: inset 0 0 0 1px #3b82f633;\r\n position: relative;\r\n animation: rotate 1.2s infinite linear;\r\n > div {\r\n position: absolute;\r\n left: 50%;\r\n top: 50%;\r\n width: 0.5em;\r\n height: 1em;\r\n margin-left: -0.5em;\r\n margin-top: -0.5em;\r\n overflow: hidden;\r\n transform-origin: 0.5em 0.5em;\r\n mask-image: linear-gradient(top, #000f, #0000);\r\n -webkit-mask-image: -webkit-linear-gradient(top, #000f, #0000);\r\n\r\n > div {\r\n width: 1em;\r\n height: 1em;\r\n border-radius: 50%;\r\n box-shadow: inset 0 0 0 1px #3b82f6;\r\n }\r\n }\r\n @keyframes rotate {\r\n 0% {\r\n transform: rotate(0deg);\r\n }\r\n 100% {\r\n transform: rotate(360deg);\r\n }\r\n }\r\n }\r\n `;\r\n}\r\n","import { css } from '@emotion/css';\r\n\r\nexport const containerStyle = css`\r\n display: grid;\r\n gap: 2px;\r\n padding: 24px;\r\n background-color: #fff;\r\n border-radius: 0;\r\n box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\r\n border: 1px solid #f3f4f6;\r\n min-height: 200px;\r\n position: relative;\r\n overflow: hidden;\r\n transition: all 250ms ease;\r\n\r\n @media (min-width: 640px) {\r\n width: 400px;\r\n max-width: 90vw;\r\n border-radius: 4px;\r\n padding: 32px;\r\n }\r\n`;\r\n\r\nexport const iconStyle = css``;\r\n\r\nexport const titleStyle = css`\r\n font-size: 18px;\r\n font-weight: 600;\r\n color: #1f2937;\r\n text-align: center;\r\n @media (min-width: 640px) {\r\n text-align: left;\r\n }\r\n`;\r\n\r\nexport const loaderStyle = css`\r\n font-size: 60px;\r\n width: 1em;\r\n height: 1em;\r\n border-radius: 50%;\r\n box-shadow: inset 0 0 0 1px #3b82f633;\r\n position: relative;\r\n\r\n animation: none;\r\n &[data-state='loading'] {\r\n animation: rotate 1s linear infinite;\r\n }\r\n\r\n > div {\r\n position: absolute;\r\n left: 50%;\r\n top: 50%;\r\n width: 0.5em;\r\n height: 1em;\r\n margin-left: -0.5em;\r\n margin-top: -0.5em;\r\n overflow: hidden;\r\n transform-origin: 0.5em 0.5em;\r\n mask-image: linear-gradient(top, #000f, #0000);\r\n -webkit-mask-image: -webkit-linear-gradient(top, #000f, #0000);\r\n\r\n > div {\r\n width: 1em;\r\n height: 1em;\r\n border-radius: 50%;\r\n box-shadow: inset 0 0 0 1px #3b82f6;\r\n }\r\n }\r\n @keyframes rotate {\r\n 0% {\r\n transform: rotate(0deg);\r\n }\r\n 100% {\r\n transform: rotate(360deg);\r\n }\r\n }\r\n`;\r\n\r\nexport const progressStyle = css`\r\n position: absolute;\r\n bottom: 0px;\r\n left: 0;\r\n width: 0%;\r\n height: 2px;\r\n background-color: #2563eb;\r\n transition: all 350ms ease;\r\n`;\r\n\r\nexport const actionsStyle = css`\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: flex-end;\r\n align-items: flex-end;\r\n gap: 8px;\r\n\r\n @media (min-width: 640px) {\r\n flex-direction: row;\r\n }\r\n`;\r\n","import { Overlay } from '../overlay';\r\nimport {\r\n actionsStyle,\r\n containerStyle,\r\n iconStyle,\r\n loaderStyle,\r\n progressStyle,\r\n titleStyle,\r\n} from './style';\r\n\r\ntype Label = string \| string[];\r\ntype ConstructorProps = Readonly<Partial<{ label: Label; progress: number }>>;\r\n\r\nexport class Modal extends Overlay {\r\n #title: string;\r\n #html: string;\r\n #label: Label;\r\n #progress: number \| null;\r\n #state: 'loading' \| 'alert' \| 'hidden';\r\n\r\n protected readonly _containerElement: HTMLDivElement;\r\n protected readonly _iconElement: HTMLDivElement;\r\n protected readonly _titleElement: HTMLDivElement;\r\n protected readonly _loaderElement: HTMLDivElement;\r\n protected readonly _progressElement: HTMLDivElement;\r\n protected readonly _contentElement: HTMLDivElement;\r\n protected readonly _actionsElement: HTMLDivElement;\r\n protected readonly _okButtonElement: HTMLButtonElement;\r\n protected readonly _cancelButtonElement: HTMLButtonElement;\r\n\r\n public constructor(props: ConstructorProps = {}) {\r\n super();\r\n\r\n this.#title = '';\r\n this.#html = '';\r\n this.#label = props.label ?? '';\r\n this.#progress = props.progress ?? null;\r\n this.#state = 'hidden';\r\n\r\n const container = document.createElement('div');\r\n container.classList.add(containerStyle);\r\n this._containerElement = container;\r\n this.root.append(container);\r\n\r\n const iconElement = document.createElement('div');\r\n iconElement.classList.add(iconStyle);\r\n this._iconElement = iconElement;\r\n container.append(iconElement);\r\n\r\n const titleElement = document.createElement('div');\r\n titleElement.classList.add(titleStyle);\r\n this._titleElement = titleElement;\r\n container.append(titleElement);\r\n\r\n const loaderElement = document.createElement('div');\r\n loaderElement.innerHTML = '<div><div></div></div>';\r\n loaderElement.classList.add(loaderStyle);\r\n this._loaderElement = loaderElement;\r\n\r\n const progressElement = document.createElement('div');\r\n progressElement.classList.add(progressStyle);\r\n this._progressElement = progressElement;\r\n container.append(progressElement);\r\n\r\n const contentElement = document.createElement('div');\r\n this._contentElement = contentElement;\r\n container.append(contentElement);\r\n\r\n const actionsElement = document.createElement('div');\r\n actionsElement.classList.add(actionsStyle);\r\n this._actionsElement = actionsElement;\r\n container.append(actionsElement);\r\n\r\n const okButtonElement = document.createElement('button');\r\n okButtonElement.type = 'button';\r\n okButtonElement.textContent = 'OK';\r\n this._okButtonElement = okButtonElement;\r\n actionsElement.append(okButtonElement);\r\n\r\n const cancelButtonElement = document.createElement('button');\r\n cancelButtonElement.type = 'button';\r\n cancelButtonElement.textContent = 'キャンセル';\r\n this._cancelButtonElement = cancelButtonElement;\r\n actionsElement.append(cancelButtonElement);\r\n\r\n this.render();\r\n }\r\n\r\n public alert(params: {\r\n title?: string;\r\n text?: string;\r\n icon?: string;\r\n disableClose?: boolean;\r\n disableEscape?: boolean;\r\n }): Promise<any> {\r\n const {\r\n title = '',\r\n text = '',\r\n icon = '',\r\n disableClose = false,\r\n disableEscape = false,\r\n } = params;\r\n this.#title = title;\r\n this.#label = text;\r\n\r\n this.changeState('alert');\r\n this.show();\r\n\r\n return new Promise((resolve) => {\r\n this._okButtonElement.addEventListener('click', () => {\r\n if (!disableClose) {\r\n this.hide();\r\n }\r\n resolve({\r\n isConfirmed: true,\r\n });\r\n });\r\n\r\n this._cancelButtonElement.addEventListener('click', () => {\r\n if (!disableClose) {\r\n this.hide();\r\n }\r\n resolve({\r\n isConfirmed: false,\r\n });\r\n });\r\n\r\n this.root.addEventListener('click', (event) => {\r\n if (event.currentTarget === event.target) {\r\n if (!disableClose) {\r\n this.hide();\r\n }\r\n resolve({\r\n isConfirmed: false,\r\n });\r\n }\r\n });\r\n\r\n this.root.addEventListener('keydown', (event) => {\r\n if (event.key === 'Escape') {\r\n if (!disableEscape) {\r\n this.hide();\r\n }\r\n resolve({\r\n isConfirmed: false,\r\n });\r\n }\r\n });\r\n });\r\n }\r\n\r\n public loading(): void {\r\n this._iconElement.append(this._loaderElement);\r\n this.changeState('loading');\r\n this.show();\r\n }\r\n\r\n override hide(): void {\r\n this.#progress = 0;\r\n this.#html = '';\r\n this.#label = '';\r\n this.changeState('hidden');\r\n super.hide();\r\n }\r\n\r\n public set label(label: Label) {\r\n this.#label = label;\r\n this.render();\r\n }\r\n\r\n public set html(html: string) {\r\n this.#html = html;\r\n this.render();\r\n }\r\n\r\n public set progress(progress: number) {\r\n this.#progress = progress;\r\n this.render();\r\n }\r\n\r\n private changeState(state: 'loading' \| 'alert' \| 'hidden'): void {\r\n this.#state = state;\r\n const elements = [\r\n this.root,\r\n this._actionsElement,\r\n this._contentElement,\r\n this._iconElement,\r\n this._loaderElement,\r\n this._progressElement,\r\n this._titleElement,\r\n ];\r\n for (const element of elements) {\r\n element.dataset.state = state;\r\n }\r\n\r\n this.render();\r\n }\r\n\r\n override render(): void {\r\n super.render();\r\n\r\n this._progressElement.style.width = `${this.#progress}%`;\r\n\r\n switch (this.#state) {\r\n case 'loading':\r\n break;\r\n case 'alert':\r\n this._iconElement.innerHTML = '';\r\n break;\r\n case 'hidden':\r\n default:\r\n this._iconElement.innerHTML = '';\r\n break;\r\n }\r\n\r\n this._titleElement.textContent = this.#title;\r\n if (this.#html) {\r\n this._contentElement.innerHTML = this.#html;\r\n } else {\r\n if (this.#label instanceof Array) {\r\n this._contentElement.innerHTML = `<div>${this.#label.join('</div><div>')}</div>`;\r\n } else {\r\n this._contentElement.textContent = this.#label;\r\n }\r\n }\r\n }\r\n}\r\n","import { LoadingOverlay } from './loading-overlay';\n\n/\n 指定された関数をラップし、実行中にローディングオーバーレイを表示する高階関数。\n \n @template T - 任意の引数を取り、任意の値を返す関数の型。\n * @param {T} fn - 実行する関数。\n * @param {string} [label='Loading...'] - ローディングオーバーレイに表示するラベル。デフォルトは 'Loading...'。\n * @returns {(...args: Parameters<T>) => Promise<ReturnType<T>>} - ラップされた関数。実行中にローディングオーバーレイを表示し、完了後に非表示にする。\n */\nexport const withLoading = <T extends (...args: any[]) => any>(\n fn: T,\n label: string = 'Loading...'\n) => {\n return async (...args: Parameters<T>): Promise<ReturnType<T>> => {\n const overlay = new LoadingOverlay({ label });\n overlay.show();\n try {\n return await fn(...args);\n } finally {\n overlay.hide();\n }\n };\n};\n"],"mappings":"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","names":["import_css","import_css","import_css","containerStyle","progressStyle","containerStyle","progressStyle"]}
1	+ {"version":3,"sources":["../src/index.ts","../src/types.ts","../src/controller.ts","../src/overlay-dialog.ts","../src/styles.ts","../src/dialog.ts"],"sourcesContent":["export { dialog } from './dialog';\r\nexport { DialogController } from './controller';\r\nexport { OverlayDialog } from './overlay-dialog';\r\nexport type {\r\n AlertIcon,\r\n AlertOptions,\r\n ConfirmOptions,\r\n DialogResult,\r\n DialogState,\r\n DialogType,\r\n QueueItem,\r\n QueueItemStatus,\r\n ShowOptions,\r\n StepItem,\r\n StepItemStatus,\r\n} from './types';\r\n","// ─── Dialog Types ────────────────────────────────────────────\r\n\r\nexport type DialogType = 'loading' \| 'alert' \| 'confirm' \| 'queue' \| 'steps';\r\nexport type AlertIcon = 'success' \| 'error' \| 'warning' \| 'info';\r\nexport type QueueItemStatus = 'pending' \| 'active' \| 'done' \| 'skipped' \| 'error';\r\nexport type StepItemStatus = 'pending' \| 'active' \| 'done' \| 'skipped' \| 'error';\r\n\r\nexport interface QueueItem {\r\n label: string;\r\n status: QueueItemStatus;\r\n}\r\n\r\nexport interface StepItem {\r\n label: string;\r\n status: StepItemStatus;\r\n}\r\n\r\n// ─── Show Options ────────────────────────────────────────────\r\n\r\nexport interface ShowOptions {\r\n type: DialogType;\r\n label?: string;\r\n description?: string;\r\n icon?: AlertIcon;\r\n progress?: number;\r\n allowOutsideClick?: boolean;\r\n}\r\n\r\nexport interface AlertOptions {\r\n type?: AlertIcon;\r\n label?: string;\r\n description?: string;\r\n html?: string;\r\n showCancelButton?: boolean;\r\n confirmButtonText?: string;\r\n cancelButtonText?: string;\r\n allowOutsideClick?: boolean;\r\n allowEscapeKey?: boolean;\r\n timer?: number;\r\n}\r\n\r\nexport interface ConfirmOptions {\r\n label?: string;\r\n description?: string;\r\n type?: AlertIcon;\r\n confirmButtonText?: string;\r\n cancelButtonText?: string;\r\n allowOutsideClick?: boolean;\r\n allowEscapeKey?: boolean;\r\n}\r\n\r\n// ─── Result ─────────────────────────────────────────────────\r\n\r\nexport interface DialogResult {\r\n isConfirmed: boolean;\r\n isCanceled: boolean;\r\n isDismissed: boolean;\r\n}\r\n\r\n// ─── State ──────────────────────────────────────────────────\r\n\r\nexport interface DialogState {\r\n open: boolean;\r\n dialogType: DialogType;\r\n icon: AlertIcon \| null;\r\n label: string;\r\n description: string;\r\n html: string;\r\n progress: number \| null;\r\n showConfirmButton: boolean;\r\n showCancelButton: boolean;\r\n confirmButtonText: string;\r\n cancelButtonText: string;\r\n allowOutsideClick: boolean;\r\n allowEscapeKey: boolean;\r\n queues: QueueItem[];\r\n steps: StepItem[];\r\n timer: number \| null;\r\n}\r\n\r\nexport const createInitialState = (): DialogState => ({\r\n open: false,\r\n dialogType: 'loading',\r\n icon: null,\r\n label: '',\r\n description: '',\r\n html: '',\r\n progress: null,\r\n showConfirmButton: true,\r\n showCancelButton: false,\r\n confirmButtonText: 'OK',\r\n cancelButtonText: 'キャンセル',\r\n allowOutsideClick: true,\r\n allowEscapeKey: true,\r\n queues: [],\r\n steps: [],\r\n timer: null,\r\n});\r\n","import {\r\n type AlertIcon,\r\n type AlertOptions,\r\n type ConfirmOptions,\r\n type DialogResult,\r\n type DialogState,\r\n type DialogType,\r\n type QueueItem,\r\n type ShowOptions,\r\n type StepItem,\r\n createInitialState,\r\n} from './types';\r\n\r\ntype Listener = (state: DialogState) => void;\r\ntype Resolver = (result: DialogResult) => void;\r\n\r\nexport class DialogController {\r\n #state: DialogState;\r\n #listeners = new Set<Listener>();\r\n #resolver: Resolver \| null = null;\r\n #timerId: ReturnType<typeof setTimeout> \| null = null;\r\n\r\n constructor() {\r\n this.#state = createInitialState();\r\n }\r\n\r\n // ─── Observable ──────────────────────────────────────────\r\n\r\n get state(): Readonly<DialogState> {\r\n return this.#state;\r\n }\r\n\r\n subscribe(fn: Listener): () => void {\r\n this.#listeners.add(fn);\r\n return () => this.#listeners.delete(fn);\r\n }\r\n\r\n #emit(): void {\r\n const snapshot = { ...this.#state };\r\n for (const fn of this.#listeners) fn(snapshot);\r\n }\r\n\r\n #update(patch: Partial<DialogState>): void {\r\n Object.assign(this.#state, patch);\r\n this.#emit();\r\n }\r\n\r\n // ─── Core ────────────────────────────────────────────────\r\n\r\n show(options: ShowOptions = { type: 'loading' }): void {\r\n this.#clearTimer();\r\n this.#update({\r\n open: true,\r\n dialogType: options.type,\r\n label: options.label ?? '',\r\n description: options.description ?? '',\r\n icon: options.icon ?? null,\r\n progress: options.progress ?? null,\r\n allowOutsideClick: options.allowOutsideClick ?? false,\r\n showConfirmButton: false,\r\n showCancelButton: false,\r\n });\r\n }\r\n\r\n hide(): void {\r\n this.#clearTimer();\r\n const wasOpen = this.#state.open;\r\n this.#update({ ...createInitialState(), open: false });\r\n if (wasOpen && this.#resolver) {\r\n this.#resolve({ isConfirmed: false, isCanceled: false, isDismissed: true });\r\n }\r\n }\r\n\r\n // ─── Alert ───────────────────────────────────────────────\r\n\r\n alert(optionsOrLabel: string \| AlertOptions): Promise<DialogResult> {\r\n this.#clearTimer();\r\n const opts: AlertOptions =\r\n typeof optionsOrLabel === 'string' ? { label: optionsOrLabel } : optionsOrLabel;\r\n\r\n this.#update({\r\n open: true,\r\n dialogType: 'alert',\r\n icon: opts.type ?? 'info',\r\n label: opts.label ?? '',\r\n description: opts.description ?? '',\r\n html: opts.html ?? '',\r\n showConfirmButton: true,\r\n showCancelButton: opts.showCancelButton ?? false,\r\n confirmButtonText: opts.confirmButtonText ?? 'OK',\r\n cancelButtonText: opts.cancelButtonText ?? 'キャンセル',\r\n allowOutsideClick: opts.allowOutsideClick ?? true,\r\n allowEscapeKey: opts.allowEscapeKey ?? true,\r\n progress: null,\r\n timer: opts.timer ?? null,\r\n });\r\n\r\n return this.#createPromise(opts.timer ?? null);\r\n }\r\n\r\n // ─── Confirm ─────────────────────────────────────────────\r\n\r\n confirm(optionsOrLabel: string \| ConfirmOptions): Promise<boolean> {\r\n this.#clearTimer();\r\n const opts: ConfirmOptions =\r\n typeof optionsOrLabel === 'string' ? { label: optionsOrLabel } : optionsOrLabel;\r\n\r\n this.#update({\r\n open: true,\r\n dialogType: 'confirm',\r\n icon: opts.type ?? 'warning',\r\n label: opts.label ?? '',\r\n description: opts.description ?? '',\r\n showConfirmButton: true,\r\n showCancelButton: true,\r\n confirmButtonText: opts.confirmButtonText ?? 'OK',\r\n cancelButtonText: opts.cancelButtonText ?? 'キャンセル',\r\n allowOutsideClick: opts.allowOutsideClick ?? false,\r\n allowEscapeKey: opts.allowEscapeKey ?? true,\r\n progress: null,\r\n timer: null,\r\n });\r\n\r\n return this.#createPromise(null).then((r) => r.isConfirmed);\r\n }\r\n\r\n // ─── Loading helpers ─────────────────────────────────────\r\n\r\n loading(label?: string): void {\r\n this.show({ type: 'loading', label });\r\n }\r\n\r\n progress(percent: number): void {\r\n this.#update({ progress: percent });\r\n }\r\n\r\n label(label: string): void {\r\n this.#update({ label });\r\n }\r\n\r\n description(description: string): void {\r\n this.#update({ description });\r\n }\r\n\r\n // ─── Queue ───────────────────────────────────────────────\r\n\r\n setQueues(labels: string[]): void {\r\n this.#update({\r\n queues: labels.map<QueueItem>((label) => ({ label, status: 'pending' })),\r\n });\r\n }\r\n\r\n queue(labels: string[]): void {\r\n this.setQueues(labels);\r\n this.show({ type: 'queue' });\r\n }\r\n\r\n startQueue(label: string): void {\r\n this.#updateItemStatus('queues', label, 'active');\r\n }\r\n\r\n finishQueue(label: string): void {\r\n this.#updateItemStatus('queues', label, 'done');\r\n }\r\n\r\n skipQueue(label: string): void {\r\n this.#updateItemStatus('queues', label, 'skipped');\r\n }\r\n\r\n errorQueue(label: string): void {\r\n this.#updateItemStatus('queues', label, 'error');\r\n }\r\n\r\n clearQueues(): void {\r\n this.#update({ queues: [] });\r\n }\r\n\r\n // ─── Steps ───────────────────────────────────────────────\r\n\r\n setSteps(labels: string[]): void {\r\n this.#update({\r\n steps: labels.map<StepItem>((label) => ({ label, status: 'pending' })),\r\n });\r\n }\r\n\r\n steps(labels: string[]): void {\r\n this.setSteps(labels);\r\n this.show({ type: 'steps' });\r\n }\r\n\r\n startStep(label: string): void {\r\n this.#updateItemStatus('steps', label, 'active');\r\n }\r\n\r\n finishStep(label: string): void {\r\n this.#updateItemStatus('steps', label, 'done');\r\n }\r\n\r\n skipStep(label: string): void {\r\n this.#updateItemStatus('steps', label, 'skipped');\r\n }\r\n\r\n errorStep(label: string): void {\r\n this.#updateItemStatus('steps', label, 'error');\r\n }\r\n\r\n clearSteps(): void {\r\n this.#update({ steps: [] });\r\n }\r\n\r\n // ─── Button actions (called from the component) ──────────\r\n\r\n onConfirm(): void {\r\n this.#clearTimer();\r\n const r: DialogResult = { isConfirmed: true, isCanceled: false, isDismissed: false };\r\n this.#update({ ...createInitialState(), open: false });\r\n this.#resolve(r);\r\n }\r\n\r\n onCancel(): void {\r\n this.#clearTimer();\r\n const r: DialogResult = { isConfirmed: false, isCanceled: true, isDismissed: false };\r\n this.#update({ ...createInitialState(), open: false });\r\n this.#resolve(r);\r\n }\r\n\r\n onOutsideClick(): void {\r\n if (!this.#state.allowOutsideClick) return;\r\n this.onCancel();\r\n }\r\n\r\n onEscapeKey(): void {\r\n if (!this.#state.allowEscapeKey) return;\r\n this.onCancel();\r\n }\r\n\r\n // ─── Internal ────────────────────────────────────────────\r\n\r\n #createPromise(timer: number \| null): Promise<DialogResult> {\r\n return new Promise<DialogResult>((resolve) => {\r\n this.#resolver = resolve;\r\n if (timer != null && timer > 0) {\r\n this.#timerId = setTimeout(() => {\r\n this.#update({ ...createInitialState(), open: false });\r\n resolve({ isConfirmed: false, isCanceled: false, isDismissed: true });\r\n this.#resolver = null;\r\n }, timer);\r\n }\r\n });\r\n }\r\n\r\n #resolve(result: DialogResult): void {\r\n const resolver = this.#resolver;\r\n this.#resolver = null;\r\n resolver?.(result);\r\n }\r\n\r\n #clearTimer(): void {\r\n if (this.#timerId != null) {\r\n clearTimeout(this.#timerId);\r\n this.#timerId = null;\r\n }\r\n }\r\n\r\n #updateItemStatus(\r\n key: 'queues' \| 'steps',\r\n label: string,\r\n status: QueueItem['status'] \| StepItem['status']\r\n ): void {\r\n const items = [...this.#state[key]];\r\n const idx = items.findIndex((i) => i.label === label);\r\n if (idx >= 0) {\r\n items[idx] = { ...items[idx], status: status as any };\r\n this.#update({ [key]: items });\r\n }\r\n }\r\n}\r\n","import { LitElement, html, nothing, type TemplateResult } from 'lit';\r\nimport { customElement, property, state } from 'lit/decorators.js';\r\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\r\nimport type { DialogController } from './controller';\r\nimport type { AlertIcon, DialogState, QueueItem, StepItem } from './types';\r\nimport { createInitialState } from './types';\r\nimport { overlayStyles } from './styles';\r\n\r\n@customElement('overlay-dialog')\r\nexport class OverlayDialog extends LitElement {\r\n static override styles = overlayStyles;\r\n\r\n @property({ attribute: false })\r\n controller!: DialogController;\r\n\r\n @state() private _state: DialogState = createInitialState();\r\n\r\n private _unsubscribe?: () => void;\r\n private _beforeUnloadHandler = (e: BeforeUnloadEvent) => e.preventDefault();\r\n\r\n override connectedCallback(): void {\r\n super.connectedCallback();\r\n if (this.controller) {\r\n this._state = { ...this.controller.state };\r\n this._unsubscribe = this.controller.subscribe((s) => {\r\n const wasOpen = this._state.open;\r\n this._state = s;\r\n this._syncBodyScroll(s.open);\r\n if (s.open && !wasOpen) {\r\n window.addEventListener('beforeunload', this._beforeUnloadHandler);\r\n } else if (!s.open && wasOpen) {\r\n window.removeEventListener('beforeunload', this._beforeUnloadHandler);\r\n }\r\n });\r\n }\r\n window.addEventListener('keydown', this._onKeyDown);\r\n }\r\n\r\n override disconnectedCallback(): void {\r\n super.disconnectedCallback();\r\n this._unsubscribe?.();\r\n this._syncBodyScroll(false);\r\n window.removeEventListener('beforeunload', this._beforeUnloadHandler);\r\n window.removeEventListener('keydown', this._onKeyDown);\r\n }\r\n\r\n private _syncBodyScroll(lock: boolean): void {\r\n if (lock) {\r\n document.body.style.overflow = 'hidden';\r\n } else {\r\n document.body.style.overflow = '';\r\n }\r\n }\r\n\r\n // ─── Event Handlers ──────────────────────────────────────\r\n\r\n private _onBackdropClick(e: MouseEvent): void {\r\n if (e.target === e.currentTarget) {\r\n this.controller.onOutsideClick();\r\n }\r\n }\r\n\r\n private _onKeyDown = (e: KeyboardEvent): void => {\r\n if (e.key === 'Escape' && this._state.open) {\r\n this.controller.onEscapeKey();\r\n }\r\n };\r\n\r\n // ─── Render Helpers ──────────────────────────────────────\r\n\r\n private _renderIcon(icon: AlertIcon \| null): TemplateResult \| typeof nothing {\r\n if (!icon) return nothing;\r\n\r\n if (icon === 'success') {\r\n return html`\r\n <svg\r\n class=\"icon-container\"\r\n viewBox=\"0 0 64 64\"\r\n style=\"width:64px;height:64px;background:none;\"\r\n >\r\n <circle class=\"check-circle\" cx=\"32\" cy=\"32\" r=\"30\" />\r\n <polyline class=\"check-mark\" points=\"20,34 28,42 44,24\" />\r\n </svg>\r\n `;\r\n }\r\n\r\n const paths: Record<string, TemplateResult> = {\r\n error: html`<svg\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n >\r\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\r\n <line x1=\"15\" y1=\"9\" x2=\"9\" y2=\"15\" />\r\n <line x1=\"9\" y1=\"9\" x2=\"15\" y2=\"15\" />\r\n </svg>`,\r\n warning: html`<svg\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n >\r\n <path\r\n d=\"M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z\"\r\n />\r\n <line x1=\"12\" y1=\"9\" x2=\"12\" y2=\"13\" />\r\n <line x1=\"12\" y1=\"17\" x2=\"12.01\" y2=\"17\" />\r\n </svg>`,\r\n info: html`<svg\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n >\r\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\r\n <line x1=\"12\" y1=\"16\" x2=\"12\" y2=\"12\" />\r\n <line x1=\"12\" y1=\"8\" x2=\"12.01\" y2=\"8\" />\r\n </svg>`,\r\n };\r\n\r\n return html` <div class=\"icon-container icon-${icon}\">${paths[icon] ?? nothing}</div> `;\r\n }\r\n\r\n private _renderSpinner(): TemplateResult {\r\n return html`\r\n <div class=\"spinner\">\r\n <div class=\"spinner-half\">\r\n <div class=\"spinner-inner\"></div>\r\n </div>\r\n </div>\r\n `;\r\n }\r\n\r\n private _renderTaskIcon(status: QueueItem['status']): TemplateResult {\r\n switch (status) {\r\n case 'active':\r\n return html`\r\n <div class=\"mini-spinner\">\r\n <div class=\"mini-spinner-half\">\r\n <div class=\"mini-spinner-inner\"></div>\r\n </div>\r\n </div>\r\n `;\r\n case 'done':\r\n return html`<svg\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"#22c55e\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n >\r\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\r\n <polyline points=\"9,12 11,14 15,10\" />\r\n </svg>`;\r\n case 'error':\r\n return html`<svg\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"#ef4444\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n >\r\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\r\n <line x1=\"15\" y1=\"9\" x2=\"9\" y2=\"15\" />\r\n <line x1=\"9\" y1=\"9\" x2=\"15\" y2=\"15\" />\r\n </svg>`;\r\n case 'skipped':\r\n return html`<svg\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"#9ca3af\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n >\r\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\r\n <line x1=\"8\" y1=\"12\" x2=\"16\" y2=\"12\" />\r\n </svg>`;\r\n case 'pending':\r\n default:\r\n return html`<svg\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"#d1d5db\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n >\r\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\r\n </svg>`;\r\n }\r\n }\r\n\r\n private _getQueueWindow(items: QueueItem[]): { start: number; end: number } {\r\n const WINDOW = 3;\r\n const total = items.length;\r\n if (total <= WINDOW) return { start: 0, end: total - 1 };\r\n\r\n // active なら中心に。なければ最後の完了済み+1 (次の pending) を中心とする。\r\n let centerIdx = items.findIndex((i) => i.status === 'active');\r\n if (centerIdx < 0) {\r\n const finishedStatuses = new Set<QueueItem['status']>(['done', 'skipped', 'error']);\r\n const lastFinishedIdx = items.reduce(\r\n (acc, item, i) => (finishedStatuses.has(item.status) ? i : acc),\r\n -1\r\n );\r\n centerIdx = lastFinishedIdx >= 0 ? Math.min(lastFinishedIdx + 1, total - 1) : 0;\r\n }\r\n\r\n const start = Math.max(0, Math.min(centerIdx - 1, total - WINDOW));\r\n const end = Math.min(total - 1, start + WINDOW - 1);\r\n return { start, end };\r\n }\r\n\r\n private _renderQueueList(items: QueueItem[]): TemplateResult {\r\n const total = items.length;\r\n const { start, end } = this._getQueueWindow(items);\r\n const visible = items.slice(start, end + 1);\r\n\r\n return html`\r\n <ul class=\"task-list\">\r\n ${start > 0\r\n ? html`<li class=\"queue-ellipsis\" aria-hidden=\"true\">\r\n <span></span><span></span><span></span>\r\n </li>`\r\n : nothing}\r\n ${visible.map(\r\n (item) => html`\r\n <li class=\"task-item\">\r\n <span class=\"task-icon\">${this._renderTaskIcon(item.status)}</span>\r\n <span class=\"task-label\" data-status=${item.status}>${item.label}</span>\r\n </li>\r\n `\r\n )}\r\n ${end < total - 1\r\n ? html`<li class=\"queue-ellipsis\" aria-hidden=\"true\">\r\n <span></span><span></span><span></span>\r\n </li>`\r\n : nothing}\r\n </ul>\r\n `;\r\n }\r\n\r\n private _renderStepsHeader(items: StepItem[]): TemplateResult {\r\n const fragments: TemplateResult[] = [];\r\n items.forEach((item, i) => {\r\n if (i > 0) {\r\n fragments.push(html`<div class=\"step-connector\"></div>`);\r\n }\r\n fragments.push(html`<div class=\"step-dot\" data-status=${item.status}></div>`);\r\n });\r\n return html`<div class=\"steps-header\">${fragments}</div>`;\r\n }\r\n\r\n private _renderStepsList(items: StepItem[]): TemplateResult {\r\n return html`\r\n ${this._renderStepsHeader(items)}\r\n <ul class=\"task-list\">\r\n ${items.map(\r\n (item) => html`\r\n <li class=\"task-item\">\r\n <span class=\"task-icon\">${this._renderTaskIcon(item.status)}</span>\r\n <span class=\"task-label\" data-status=${item.status}>${item.label}</span>\r\n </li>\r\n `\r\n )}\r\n </ul>\r\n `;\r\n }\r\n\r\n private _renderButtons(): TemplateResult \| typeof nothing {\r\n const s = this._state;\r\n if (!s.showConfirmButton && !s.showCancelButton) return nothing;\r\n\r\n return html`\r\n <div class=\"actions\">\r\n ${s.showConfirmButton\r\n ? html`<button class=\"btn btn-confirm\" @click=${() => this.controller.onConfirm()}>\r\n ${s.confirmButtonText}\r\n </button>`\r\n : nothing}\r\n ${s.showCancelButton\r\n ? html`<button class=\"btn btn-cancel\" @click=${() => this.controller.onCancel()}>\r\n ${s.cancelButtonText}\r\n </button>`\r\n : nothing}\r\n </div>\r\n `;\r\n }\r\n\r\n private _renderBody(): TemplateResult {\r\n const s = this._state;\r\n\r\n switch (s.dialogType) {\r\n case 'loading':\r\n return html`\r\n ${this._renderSpinner()} ${s.label ? html`<p class=\"label\">${s.label}</p>` : nothing}\r\n ${s.description ? html`<p class=\"description\">${s.description}</p>` : nothing}\r\n `;\r\n\r\n case 'alert':\r\n case 'confirm':\r\n return html`\r\n ${this._renderIcon(s.icon)} ${s.label ? html`<p class=\"label\">${s.label}</p>` : nothing}\r\n ${s.description ? html`<p class=\"description\">${s.description}</p>` : nothing}\r\n ${s.html ? html`<div class=\"html-content\">${unsafeHTML(s.html)}</div>` : nothing}\r\n ${this._renderButtons()}\r\n `;\r\n\r\n case 'queue':\r\n return html`\r\n ${s.label ? html`<p class=\"label\">${s.label}</p>` : nothing}\r\n ${this._renderQueueList(s.queues)}\r\n `;\r\n\r\n case 'steps':\r\n return html`\r\n ${s.label ? html`<p class=\"label\">${s.label}</p>` : nothing}\r\n ${this._renderStepsList(s.steps)}\r\n `;\r\n\r\n default:\r\n return html`${nothing}`;\r\n }\r\n }\r\n\r\n override render(): TemplateResult {\r\n const s = this._state;\r\n\r\n return html`\r\n <div class=\"backdrop\" ?data-open=${s.open} @click=${this._onBackdropClick}>\r\n <div class=\"card\">\r\n ${this._renderBody()}\r\n <div\r\n class=\"progress-bar\"\r\n style=\"width:${s.progress ?? 0}%;opacity:${s.progress !== null ? 1 : 0}\"\r\n ></div>\r\n </div>\r\n </div>\r\n `;\r\n }\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n 'overlay-dialog': OverlayDialog;\r\n }\r\n}\r\n","import { css } from 'lit';\r\n\r\nexport const overlayStyles = css`\r\n :host {\r\n /* ─── Customizable CSS Variables ─── /\r\n --dialog-font-family:\r\n 'Yu Gothic Medium', '游ゴシック', YuGothic, 'メイリオ', 'Hiragino Kaku Gothic ProN', Meiryo,\r\n sans-serif;\r\n --dialog-text-color: #356;\r\n --dialog-font-size: 14px;\r\n --dialog-font-size-desktop: 16px;\r\n --dialog-z-index: 1000;\r\n --dialog-backdrop-color: rgb(255 255 255 / 0.73);\r\n --dialog-backdrop-blur: 4px;\r\n --dialog-transition-duration: 250ms;\r\n\r\n / Card /\r\n --dialog-card-bg: #fff;\r\n --dialog-card-border: #f3f4f6;\r\n --dialog-card-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\r\n --dialog-card-radius: 4px;\r\n --dialog-card-width: 400px;\r\n --dialog-card-min-height: 200px;\r\n --dialog-card-padding: 24px;\r\n --dialog-card-padding-desktop: 32px;\r\n\r\n / Colors /\r\n --dialog-primary: #3b82f6;\r\n --dialog-primary-hover: #2563eb;\r\n --dialog-success: #22c55e;\r\n --dialog-error: #ef4444;\r\n --dialog-warning: #f59e0b;\r\n --dialog-info: #3b82f6;\r\n\r\n / Progress /\r\n --dialog-progress-height: 2px;\r\n --dialog-progress-color: var(--dialog-primary-hover);\r\n --dialog-progress-transition: all 350ms ease;\r\n\r\n / Button /\r\n --dialog-btn-radius: 6px;\r\n --dialog-btn-padding: 8px 24px;\r\n --dialog-btn-font-size: 14px;\r\n\r\n / Spinner /\r\n --dialog-spinner-size: 60px;\r\n --dialog-spinner-track: rgb(59 130 246 / 0.2);\r\n --dialog-spinner-arc: var(--dialog-primary);\r\n\r\n display: contents;\r\n font-family: var(--dialog-font-family);\r\n color: var(--dialog-text-color);\r\n font-size: var(--dialog-font-size);\r\n }\r\n\r\n / ─── Backdrop ─── /\r\n\r\n .backdrop {\r\n position: fixed;\r\n inset: 0;\r\n width: 100vw;\r\n height: 100vh;\r\n display: grid;\r\n place-items: end stretch;\r\n z-index: var(--dialog-z-index);\r\n overflow: hidden;\r\n background-color: var(--dialog-backdrop-color);\r\n backdrop-filter: blur(var(--dialog-backdrop-blur));\r\n box-sizing: border-box;\r\n transition: opacity var(--dialog-transition-duration) ease;\r\n opacity: 0;\r\n pointer-events: none;\r\n }\r\n\r\n .backdrop[data-open] {\r\n opacity: 1;\r\n pointer-events: all;\r\n }\r\n\r\n @media (min-width: 640px) {\r\n :host {\r\n font-size: var(--dialog-font-size-desktop);\r\n }\r\n .backdrop {\r\n place-items: center;\r\n }\r\n }\r\n\r\n / ─── Card ─── /\r\n\r\n .card {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 16px;\r\n padding: var(--dialog-card-padding);\r\n background-color: var(--dialog-card-bg);\r\n border-radius: 0;\r\n box-shadow: var(--dialog-card-shadow);\r\n border: 1px solid var(--dialog-card-border);\r\n min-height: var(--dialog-card-min-height);\r\n position: relative;\r\n overflow: hidden;\r\n transition: all var(--dialog-transition-duration) ease;\r\n }\r\n\r\n @media (min-width: 640px) {\r\n .card {\r\n width: var(--dialog-card-width);\r\n max-width: 90vw;\r\n border-radius: var(--dialog-card-radius);\r\n padding: var(--dialog-card-padding-desktop);\r\n }\r\n }\r\n\r\n / ─── Spinner ─── /\r\n\r\n .spinner {\r\n font-size: var(--dialog-spinner-size);\r\n width: 1em;\r\n height: 1em;\r\n border-radius: 50%;\r\n box-shadow: inset 0 0 0 1px var(--dialog-spinner-track);\r\n position: relative;\r\n animation: spin 1.2s infinite linear;\r\n }\r\n\r\n .spinner-half {\r\n position: absolute;\r\n left: 50%;\r\n top: 50%;\r\n width: 0.5em;\r\n height: 1em;\r\n margin-left: -0.5em;\r\n margin-top: -0.5em;\r\n overflow: hidden;\r\n transform-origin: 0.5em 0.5em;\r\n mask-image: linear-gradient(to bottom, #000f, #0000);\r\n -webkit-mask-image: linear-gradient(to bottom, #000f, #0000);\r\n }\r\n\r\n .spinner-inner {\r\n width: 1em;\r\n height: 1em;\r\n border-radius: 50%;\r\n box-shadow: inset 0 0 0 1px var(--dialog-spinner-arc);\r\n }\r\n\r\n @keyframes spin {\r\n 0% {\r\n transform: rotate(0deg);\r\n }\r\n 100% {\r\n transform: rotate(360deg);\r\n }\r\n }\r\n\r\n / ─── Icon ─── /\r\n\r\n .icon-container {\r\n width: 64px;\r\n height: 64px;\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n }\r\n\r\n .icon-container svg {\r\n width: 36px;\r\n height: 36px;\r\n }\r\n\r\n .icon-success {\r\n background-color: rgb(34 197 94 / 0.1);\r\n color: var(--dialog-success);\r\n }\r\n\r\n .icon-error {\r\n background-color: rgb(239 68 68 / 0.1);\r\n color: var(--dialog-error);\r\n }\r\n\r\n .icon-warning {\r\n background-color: rgb(245 158 11 / 0.1);\r\n color: var(--dialog-warning);\r\n }\r\n\r\n .icon-info {\r\n background-color: rgb(59 130 246 / 0.1);\r\n color: var(--dialog-info);\r\n }\r\n\r\n / ─── Check Animation ─── /\r\n\r\n .check-circle {\r\n width: 64px;\r\n height: 64px;\r\n border-radius: 50%;\r\n stroke-width: 2;\r\n stroke: var(--dialog-success);\r\n fill: none;\r\n stroke-dasharray: 200;\r\n stroke-dashoffset: 200;\r\n animation: check-circle-draw 0.6s ease forwards;\r\n }\r\n\r\n .check-mark {\r\n stroke: var(--dialog-success);\r\n stroke-width: 3;\r\n stroke-linecap: round;\r\n stroke-linejoin: round;\r\n fill: none;\r\n stroke-dasharray: 50;\r\n stroke-dashoffset: 50;\r\n animation: check-mark-draw 0.4s 0.4s ease forwards;\r\n }\r\n\r\n @keyframes check-circle-draw {\r\n to {\r\n stroke-dashoffset: 0;\r\n }\r\n }\r\n\r\n @keyframes check-mark-draw {\r\n to {\r\n stroke-dashoffset: 0;\r\n }\r\n }\r\n\r\n / ─── Text ─── /\r\n\r\n .label {\r\n font-size: 18px;\r\n font-weight: 600;\r\n color: #1f2937;\r\n text-align: center;\r\n margin: 0;\r\n word-break: break-word;\r\n }\r\n\r\n .description {\r\n font-size: 14px;\r\n color: #6b7280;\r\n text-align: center;\r\n margin: 0;\r\n word-break: break-word;\r\n line-height: 1.6;\r\n }\r\n\r\n .html-content {\r\n font-size: 14px;\r\n color: #6b7280;\r\n text-align: center;\r\n word-break: break-word;\r\n line-height: 1.6;\r\n width: 100%;\r\n }\r\n\r\n / ─── Progress ─── /\r\n\r\n .progress-bar {\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n width: 0%;\r\n height: var(--dialog-progress-height);\r\n background-color: var(--dialog-progress-color);\r\n transition: var(--dialog-progress-transition);\r\n }\r\n\r\n / ─── Buttons ─── /\r\n\r\n .actions {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n width: 100%;\r\n margin-top: 8px;\r\n }\r\n\r\n @media (min-width: 640px) {\r\n .actions {\r\n flex-direction: row;\r\n justify-content: center;\r\n }\r\n }\r\n\r\n .btn {\r\n padding: var(--dialog-btn-padding);\r\n font-size: var(--dialog-btn-font-size);\r\n font-family: inherit;\r\n border: none;\r\n border-radius: var(--dialog-btn-radius);\r\n cursor: pointer;\r\n font-weight: 500;\r\n transition:\r\n background-color 150ms ease,\r\n transform 80ms ease;\r\n min-width: 100px;\r\n text-align: center;\r\n }\r\n\r\n .btn:active {\r\n transform: scale(0.97);\r\n }\r\n\r\n .btn-confirm {\r\n background-color: var(--dialog-primary);\r\n color: #fff;\r\n }\r\n\r\n .btn-confirm:hover {\r\n background-color: var(--dialog-primary-hover);\r\n }\r\n\r\n .btn-cancel {\r\n background-color: #f3f4f6;\r\n color: #374151;\r\n }\r\n\r\n .btn-cancel:hover {\r\n background-color: #e5e7eb;\r\n }\r\n\r\n / ─── Queue / Steps list ─── /\r\n\r\n .task-list {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n width: 100%;\r\n padding: 0;\r\n margin: 0;\r\n list-style: none;\r\n }\r\n\r\n .task-item {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n font-size: 14px;\r\n }\r\n\r\n .task-icon {\r\n width: 24px;\r\n height: 24px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n }\r\n\r\n .task-icon svg {\r\n width: 20px;\r\n height: 20px;\r\n }\r\n\r\n .task-icon .mini-spinner {\r\n font-size: 20px;\r\n width: 1em;\r\n height: 1em;\r\n border-radius: 50%;\r\n box-shadow: inset 0 0 0 1px var(--dialog-spinner-track);\r\n position: relative;\r\n animation: spin 1.2s infinite linear;\r\n }\r\n\r\n .task-icon .mini-spinner-half {\r\n position: absolute;\r\n left: 50%;\r\n top: 50%;\r\n width: 0.5em;\r\n height: 1em;\r\n margin-left: -0.5em;\r\n margin-top: -0.5em;\r\n overflow: hidden;\r\n transform-origin: 0.5em 0.5em;\r\n mask-image: linear-gradient(to bottom, #000f, #0000);\r\n -webkit-mask-image: linear-gradient(to bottom, #000f, #0000);\r\n }\r\n\r\n .task-icon .mini-spinner-inner {\r\n width: 1em;\r\n height: 1em;\r\n border-radius: 50%;\r\n box-shadow: inset 0 0 0 1px var(--dialog-spinner-arc);\r\n }\r\n\r\n .task-label {\r\n color: #6b7280;\r\n }\r\n\r\n .task-label[data-status='active'] {\r\n color: var(--dialog-text-color);\r\n font-weight: 500;\r\n }\r\n\r\n .task-label[data-status='done'] {\r\n color: var(--dialog-success);\r\n }\r\n\r\n .task-label[data-status='error'] {\r\n color: var(--dialog-error);\r\n }\r\n\r\n .task-label[data-status='skipped'] {\r\n color: #9ca3af;\r\n text-decoration: line-through;\r\n }\r\n\r\n / ─── Queue ellipsis ─── /\r\n\r\n .queue-ellipsis {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 3px;\r\n padding: 4px 0;\r\n / アイコン列 (24px) の中央に配置: (24px - 4px dot) / 2 = 10px /\r\n padding-left: 10px;\r\n align-self: flex-start;\r\n list-style: none;\r\n }\r\n\r\n .queue-ellipsis span {\r\n display: block;\r\n width: 4px;\r\n height: 4px;\r\n border-radius: 50%;\r\n background-color: #d1d5db;\r\n }\r\n\r\n / ─── Steps indicator ─── */\r\n\r\n .steps-header {\r\n display: flex;\r\n align-items: center;\r\n gap: 4px;\r\n width: 100%;\r\n justify-content: center;\r\n margin-bottom: 8px;\r\n }\r\n\r\n .step-dot {\r\n width: 8px;\r\n height: 8px;\r\n border-radius: 50%;\r\n background-color: #d1d5db;\r\n transition: background-color 200ms ease;\r\n }\r\n\r\n .step-dot[data-status='active'] {\r\n background-color: var(--dialog-primary);\r\n box-shadow: 0 0 0 3px rgb(59 130 246 / 0.2);\r\n }\r\n\r\n .step-dot[data-status='done'] {\r\n background-color: var(--dialog-success);\r\n }\r\n\r\n .step-dot[data-status='error'] {\r\n background-color: var(--dialog-error);\r\n }\r\n\r\n .step-dot[data-status='skipped'] {\r\n background-color: #9ca3af;\r\n }\r\n\r\n .step-connector {\r\n flex: 1;\r\n max-width: 24px;\r\n height: 2px;\r\n background-color: #e5e7eb;\r\n }\r\n`;\r\n","import { DialogController } from './controller';\r\nimport type { AlertOptions, ConfirmOptions, DialogResult, ShowOptions } from './types';\r\nimport './overlay-dialog';\r\nimport type { OverlayDialog } from './overlay-dialog';\r\n\r\nclass DialogSingleton {\r\n readonly #controller = new DialogController();\r\n #element: OverlayDialog \| null = null;\r\n\r\n #ensureElement(): void {\r\n if (this.#element) return;\r\n if (typeof document === 'undefined') return;\r\n\r\n const el = document.createElement('overlay-dialog') as OverlayDialog;\r\n el.controller = this.#controller;\r\n document.body.appendChild(el);\r\n this.#element = el;\r\n }\r\n\r\n // ─── Core ────────────────────────────────────────────────\r\n\r\n show(options?: ShowOptions): void {\r\n this.#ensureElement();\r\n this.#controller.show(options);\r\n }\r\n\r\n hide(): void {\r\n this.#controller.hide();\r\n }\r\n\r\n // ─── Alert / Confirm ─────────────────────────────────────\r\n\r\n alert(optionsOrLabel: string \| AlertOptions): Promise<DialogResult> {\r\n this.#ensureElement();\r\n return this.#controller.alert(optionsOrLabel);\r\n }\r\n\r\n confirm(optionsOrLabel: string \| ConfirmOptions): Promise<boolean> {\r\n this.#ensureElement();\r\n return this.#controller.confirm(optionsOrLabel);\r\n }\r\n\r\n // ─── Loading helpers ─────────────────────────────────────\r\n\r\n loading(label?: string): void {\r\n this.#ensureElement();\r\n this.#controller.loading(label);\r\n }\r\n\r\n progress(percent: number): void {\r\n this.#controller.progress(percent);\r\n }\r\n\r\n label(label: string): void {\r\n this.#controller.label(label);\r\n }\r\n\r\n description(description: string): void {\r\n this.#controller.description(description);\r\n }\r\n\r\n // ─── Queue ───────────────────────────────────────────────\r\n\r\n setQueues(labels: string[]): void {\r\n this.#controller.setQueues(labels);\r\n }\r\n\r\n queue(labels: string[]): void {\r\n this.#ensureElement();\r\n this.#controller.queue(labels);\r\n }\r\n\r\n startQueue(label: string): void {\r\n this.#controller.startQueue(label);\r\n }\r\n\r\n finishQueue(label: string): void {\r\n this.#controller.finishQueue(label);\r\n }\r\n\r\n skipQueue(label: string): void {\r\n this.#controller.skipQueue(label);\r\n }\r\n\r\n errorQueue(label: string): void {\r\n this.#controller.errorQueue(label);\r\n }\r\n\r\n clearQueues(): void {\r\n this.#controller.clearQueues();\r\n }\r\n\r\n // ─── Steps ───────────────────────────────────────────────\r\n\r\n setSteps(labels: string[]): void {\r\n this.#controller.setSteps(labels);\r\n }\r\n\r\n steps(labels: string[]): void {\r\n this.#ensureElement();\r\n this.#controller.steps(labels);\r\n }\r\n\r\n startStep(label: string): void {\r\n this.#controller.startStep(label);\r\n }\r\n\r\n finishStep(label: string): void {\r\n this.#controller.finishStep(label);\r\n }\r\n\r\n skipStep(label: string): void {\r\n this.#controller.skipStep(label);\r\n }\r\n\r\n errorStep(label: string): void {\r\n this.#controller.errorStep(label);\r\n }\r\n\r\n clearSteps(): void {\r\n this.#controller.clearSteps();\r\n }\r\n\r\n // ─── Advanced ────────────────────────────────────────────\r\n\r\n get controller(): DialogController {\r\n return this.#controller;\r\n }\r\n}\r\n\r\nexport const dialog = new DialogSingleton();\r\n"],"mappings":"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AA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA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","names":["import_lit"]}

package/dist/index.d.cts CHANGED Viewed

@@ -1,128 +1,159 @@
-declare class Overlay {
-    #private;
-    /**
-     * オーバーレイをレンダリングするルート要素の`dataset`。
-     */
-    protected readonly _rootDataset: DOMStringMap;
-    /**
-     * オーバーレイが表示されているかどうか。
-     */
-    protected _shown: boolean;
-    /**
-     * オーバーレイを表示中にページを離れようとした場合にアラートを表示するかどうかを設定します。
-     */
-    protected _disableBeforeUnload: boolean;
-    constructor();
-    show(): void;
-    hide(): void;
-    protected render(): void;
-    /** JavaScript中にページを離れようとした場合にアラートを表示します */
-    private beforeunload;
-    protected get root(): HTMLDivElement;
-    /** @deprecated このメソッドは非推奨です。代わりに`show`メソッドを使用してください。 */
-    start(): void;
-    /** @deprecated このメソッドは非推奨です。代わりに`hide`メソッドを使用してください。 */
-    stop(): void;
+import * as lit from 'lit';
+import { LitElement, TemplateResult } from 'lit';
+type DialogType = 'loading' | 'alert' | 'confirm' | 'queue' | 'steps';
+type AlertIcon = 'success' | 'error' | 'warning' | 'info';
+type QueueItemStatus = 'pending' | 'active' | 'done' | 'skipped' | 'error';
+type StepItemStatus = 'pending' | 'active' | 'done' | 'skipped' | 'error';
+interface QueueItem {
+    label: string;
+    status: QueueItemStatus;
+}
+interface StepItem {
+    label: string;
+    status: StepItemStatus;
+}
+interface ShowOptions {
+    type: DialogType;
+    label?: string;
+    description?: string;
+    icon?: AlertIcon;
+    progress?: number;
+    allowOutsideClick?: boolean;
+}
+interface AlertOptions {
+    type?: AlertIcon;
+    label?: string;
+    description?: string;
+    html?: string;
+    showCancelButton?: boolean;
+    confirmButtonText?: string;
+    cancelButtonText?: string;
+    allowOutsideClick?: boolean;
+    allowEscapeKey?: boolean;
+    timer?: number;
+}
+interface ConfirmOptions {
+    label?: string;
+    description?: string;
+    type?: AlertIcon;
+    confirmButtonText?: string;
+    cancelButtonText?: string;
+    allowOutsideClick?: boolean;
+    allowEscapeKey?: boolean;
+}
+interface DialogResult {
+    isConfirmed: boolean;
+    isCanceled: boolean;
+    isDismissed: boolean;
+}
+interface DialogState {
+    open: boolean;
+    dialogType: DialogType;
+    icon: AlertIcon | null;
+    label: string;
+    description: string;
+    html: string;
+    progress: number | null;
+    showConfirmButton: boolean;
+    showCancelButton: boolean;
+    confirmButtonText: string;
+    cancelButtonText: string;
+    allowOutsideClick: boolean;
+    allowEscapeKey: boolean;
+    queues: QueueItem[];
+    steps: StepItem[];
+    timer: number | null;
 }
-type Label$2 = string | string[];
-type ConstructorProps$2 = Readonly<Partial<{
-    label: Label$2;
-    progress: number;
-}>>;
-declare const ATTRIBUTE_ANIMATION = "data-animation";
-declare class LoadingOverlay extends Overlay {
+type Listener = (state: DialogState) => void;
+declare class DialogController {
     #private;
-    protected readonly _loaderElement: HTMLDivElement;
-    protected readonly _progressElement: HTMLDivElement;
-    protected readonly _contentElement: HTMLDivElement;
-    constructor(props?: ConstructorProps$2);
-    show(): void;
+    constructor();
+    get state(): Readonly<DialogState>;
+    subscribe(fn: Listener): () => void;
+    show(options?: ShowOptions): void;
     hide(): void;
-    set label(label: Label$2);
-    set html(html: string);
-    /**
-     * 進捗状況を設定します。
-     * @param percent 進捗のパーセンテージ(0-100)
-     */
-    set progress(percent: number);
-    render(): void;
+    alert(optionsOrLabel: string | AlertOptions): Promise<DialogResult>;
+    confirm(optionsOrLabel: string | ConfirmOptions): Promise<boolean>;
+    loading(label?: string): void;
+    progress(percent: number): void;
+    label(label: string): void;
+    description(description: string): void;
+    setQueues(labels: string[]): void;
+    queue(labels: string[]): void;
+    startQueue(label: string): void;
+    finishQueue(label: string): void;
+    skipQueue(label: string): void;
+    errorQueue(label: string): void;
+    clearQueues(): void;
+    setSteps(labels: string[]): void;
+    steps(labels: string[]): void;
+    startStep(label: string): void;
+    finishStep(label: string): void;
+    skipStep(label: string): void;
+    errorStep(label: string): void;
+    clearSteps(): void;
+    onConfirm(): void;
+    onCancel(): void;
+    onOutsideClick(): void;
+    onEscapeKey(): void;
 }
-type Label$1 = string | string[];
-type TaskStatus = 'new' | 'in-progress' | 'done' | 'error';
-type Task = {
-    key: string;
-    label: Label$1;
-    status: TaskStatus;
-};
-type ConstructorProps$1 = Readonly<Partial<{
-    taskList: Task[];
-}>>;
-declare class TaskListOverlay extends Overlay {
-    #private;
-    protected readonly _contentElement: HTMLDivElement;
-    constructor(props?: ConstructorProps$1);
-    hide(): void;
-    done(key: string): void;
-    error(key: string): void;
-    inProgress(key: string): void;
-    addTask(...tasks: {
-        key: string;
-        label: Label$1;
-    }[]): void;
-    render(): void;
-    private renderTask;
-    private getTaskStatusElement;
-    private containerStyle;
-    private contentStyle;
-    private taskListContainerStyle;
-    private taskContainerStyle;
-    private taskLabelStyle;
-    private taskStatusStyle;
+declare class OverlayDialog extends LitElement {
+    static styles: lit.CSSResult;
+    controller: DialogController;
+    private _state;
+    private _unsubscribe?;
+    private _beforeUnloadHandler;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _syncBodyScroll;
+    private _onBackdropClick;
+    private _onKeyDown;
+    private _renderIcon;
+    private _renderSpinner;
+    private _renderTaskIcon;
+    private _getQueueWindow;
+    private _renderQueueList;
+    private _renderStepsHeader;
+    private _renderStepsList;
+    private _renderButtons;
+    private _renderBody;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'overlay-dialog': OverlayDialog;
+    }
 }
-type Label = string | string[];
-type ConstructorProps = Readonly<Partial<{
-    label: Label;
-    progress: number;
-}>>;
-declare class Modal extends Overlay {
+declare class DialogSingleton {
     #private;
-    protected readonly _containerElement: HTMLDivElement;
-    protected readonly _iconElement: HTMLDivElement;
-    protected readonly _titleElement: HTMLDivElement;
-    protected readonly _loaderElement: HTMLDivElement;
-    protected readonly _progressElement: HTMLDivElement;
-    protected readonly _contentElement: HTMLDivElement;
-    protected readonly _actionsElement: HTMLDivElement;
-    protected readonly _okButtonElement: HTMLButtonElement;
-    protected readonly _cancelButtonElement: HTMLButtonElement;
-    constructor(props?: ConstructorProps);
-    alert(params: {
-        title?: string;
-        text?: string;
-        icon?: string;
-        disableClose?: boolean;
-        disableEscape?: boolean;
-    }): Promise<any>;
-    loading(): void;
+    show(options?: ShowOptions): void;
     hide(): void;
-    set label(label: Label);
-    set html(html: string);
-    set progress(progress: number);
-    private changeState;
-    render(): void;
+    alert(optionsOrLabel: string | AlertOptions): Promise<DialogResult>;
+    confirm(optionsOrLabel: string | ConfirmOptions): Promise<boolean>;
+    loading(label?: string): void;
+    progress(percent: number): void;
+    label(label: string): void;
+    description(description: string): void;
+    setQueues(labels: string[]): void;
+    queue(labels: string[]): void;
+    startQueue(label: string): void;
+    finishQueue(label: string): void;
+    skipQueue(label: string): void;
+    errorQueue(label: string): void;
+    clearQueues(): void;
+    setSteps(labels: string[]): void;
+    steps(labels: string[]): void;
+    startStep(label: string): void;
+    finishStep(label: string): void;
+    skipStep(label: string): void;
+    errorStep(label: string): void;
+    clearSteps(): void;
+    get controller(): DialogController;
 }
+declare const dialog: DialogSingleton;
-/**
- * 指定された関数をラップし、実行中にローディングオーバーレイを表示する高階関数。
- *
- * @template T - 任意の引数を取り、任意の値を返す関数の型。
- * @param {T} fn - 実行する関数。
- * @param {string} [label='Loading...'] - ローディングオーバーレイに表示するラベル。デフォルトは 'Loading...'。
- * @returns {(...args: Parameters<T>) => Promise<ReturnType<T>>} - ラップされた関数。実行中にローディングオーバーレイを表示し、完了後に非表示にする。
- */
-declare const withLoading: <T extends (...args: any[]) => any>(fn: T, label?: string) => (...args: Parameters<T>) => Promise<ReturnType<T>>;
-export { ATTRIBUTE_ANIMATION, LoadingOverlay, Modal, TaskListOverlay, withLoading };
+export { type AlertIcon, type AlertOptions, type ConfirmOptions, DialogController, type DialogResult, type DialogState, type DialogType, OverlayDialog, type QueueItem, type QueueItemStatus, type ShowOptions, type StepItem, type StepItemStatus, dialog };