@konomi-app/ui 2.2.4 → 3.0.0

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,SAAS,CAAC"}
+{"version":3,"sources":["../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":["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":["css","css","css","css","css","containerStyle","progressStyle","containerStyle","progressStyle"]}

package/package.json

@@ -1,27 +1,36 @@
-{
-  "name": "@konomi-app/ui",
-  "version": "2.2.4",
-  "types": "dist/index.d.ts",
-  "main": "dist/index.js",
-  "author": "adachi",
-  "license": "MIT",
-  "scripts": {
-    "build": "rmdir dist /s /q & tsc",
-    "prepare": "yarn run build"
-  },
-  "dependencies": {
-    "@emotion/css": "^11.11.2"
-  },
-  "devDependencies": {
-    "typescript": "^5.3.3"
-  },
-  "prettier": {
-    "printWidth": 100,
-    "arrowParens": "always",
-    "singleQuote": true,
-    "jsxSingleQuote": true,
-    "tabWidth": 2,
-    "trailingComma": "es5",
-    "endOfLine": "lf"
-  }
-}
+{
+  "name": "@konomi-app/ui",
+  "version": "3.0.0",
+  "type": "module",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "author": "adachi",
+  "license": "MIT",
+  "peerDependencies": {
+    "@emotion/css": "^11.0.0"
+  },
+  "devDependencies": {
+    "@emotion/css": "^11.13.5",
+    "tsup": "^8.5.1",
+    "typescript": "^5.9.3"
+  },
+  "scripts": {
+    "build": "tsup"
+  }
+}

package/dist/loading-overlay/index.d.ts

@@ -1,21 +0,0 @@
-import { Overlay } from '../overlay';
-type Label = string | string[];
-type ConstructorProps = Readonly<Partial<{
-    label: Label;
-    progress: number;
-}>>;
-export declare const ATTRIBUTE_ANIMATION = "data-animation";
-export declare class LoadingOverlay extends Overlay {
-    #private;
-    protected readonly _loaderElement: HTMLDivElement;
-    protected readonly _progressElement: HTMLDivElement;
-    protected readonly _contentElement: HTMLDivElement;
-    constructor(props?: ConstructorProps);
-    show(): void;
-    hide(): void;
-    set label(label: Label);
-    set html(html: string);
-    set progress(progress: number);
-    render(): void;
-}
-export {};

package/dist/loading-overlay/index.js

@@ -1,72 +0,0 @@
-import { Overlay } from '../overlay';
-import { containerStyle, getLoaderStyle, progressStyle } from './style';
-export const ATTRIBUTE_ANIMATION = 'data-animation';
-export class LoadingOverlay extends Overlay {
-    #label;
-    #html;
-    #progress;
-    _loaderElement;
-    _progressElement;
-    _contentElement;
-    constructor(props = {}) {
-        super();
-        this.#label = props.label ?? '';
-        this.#html = '';
-        this.#progress = props.progress ?? null;
-        const container = document.createElement('div');
-        container.classList.add(containerStyle);
-        this._root.append(container);
-        const loaderElement = document.createElement('div');
-        loaderElement.innerHTML = '<div><div></div></div>';
-        loaderElement.classList.add(getLoaderStyle());
-        this._loaderElement = loaderElement;
-        container.append(loaderElement);
-        const progressElement = document.createElement('div');
-        progressElement.classList.add(progressStyle);
-        this._progressElement = progressElement;
-        container.append(progressElement);
-        const contentElement = document.createElement('div');
-        this._contentElement = contentElement;
-        container.append(contentElement);
-        this.render();
-    }
-    show() {
-        super.show();
-        this._loaderElement.setAttribute(ATTRIBUTE_ANIMATION, '');
-    }
-    hide() {
-        super.hide();
-        this._loaderElement.removeAttribute(ATTRIBUTE_ANIMATION);
-        this.#progress = 0;
-        this.#html = '';
-        this.#label = '';
-    }
-    set label(label) {
-        this.#label = label;
-        this.render();
-    }
-    set html(html) {
-        this.#html = html;
-        this.render();
-    }
-    set progress(progress) {
-        this.#progress = progress;
-        this.render();
-    }
-    render() {
-        super.render();
-        this._progressElement.style.width = `${this.#progress}%`;
-        if (this.#html) {
-            this._contentElement.innerHTML = this.#html;
-        }
-        else {
-            if (this.#label instanceof Array) {
-                this._contentElement.innerHTML = `<div>${this.#label.join('</div><div>')}</div>`;
-            }
-            else {
-                this._contentElement.innerText = this.#label;
-            }
-        }
-    }
-}
-//# sourceMappingURL=index.js.map

package/dist/loading-overlay/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/loading-overlay/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAKxE,MAAM,CAAC,MAAM,mBAAmB,GAAG,gBAAgB,CAAC;AAEpD,MAAM,OAAO,cAAe,SAAQ,OAAO;IACzC,MAAM,CAAQ;IACd,KAAK,CAAS;IACd,SAAS,CAAgB;IAEN,cAAc,CAAiB;IAC/B,gBAAgB,CAAiB;IACjC,eAAe,CAAiB;IAEnD,YAAmB,QAA0B,EAAE;QAC7C,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,KAAK,IAAI,EAAE,CAAC;QAChC,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,QAAQ,IAAI,IAAI,CAAC;QAExC,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAChD,SAAS,CAAC,SAAS,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;QACxC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;QAE7B,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACpD,aAAa,CAAC,SAAS,GAAG,wBAAwB,CAAC;QACnD,aAAa,CAAC,SAAS,CAAC,GAAG,CAAC,cAAc,EAAE,CAAC,CAAC;QAC9C,IAAI,CAAC,cAAc,GAAG,aAAa,CAAC;QACpC,SAAS,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC;QAEhC,MAAM,eAAe,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACtD,eAAe,CAAC,SAAS,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;QAC7C,IAAI,CAAC,gBAAgB,GAAG,eAAe,CAAC;QACxC,SAAS,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC;QAElC,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACrD,IAAI,CAAC,eAAe,GAAG,cAAc,CAAC;QACtC,SAAS,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;QAEjC,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEQ,IAAI;QACX,KAAK,CAAC,IAAI,EAAE,CAAC;QACb,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC,mBAAmB,EAAE,EAAE,CAAC,CAAC;IAC5D,CAAC;IAEQ,IAAI;QACX,KAAK,CAAC,IAAI,EAAE,CAAC;QACb,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,mBAAmB,CAAC,CAAC;QACzD,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC;QACnB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC;IACnB,CAAC;IAED,IAAW,KAAK,CAAC,KAAY;QAC3B,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,IAAW,IAAI,CAAC,IAAY;QAC1B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAClB,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,IAAW,QAAQ,CAAC,QAAgB;QAClC,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;QAC1B,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAEQ,MAAM;QACb,KAAK,CAAC,MAAM,EAAE,CAAC;QAEf,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,IAAI,CAAC,SAAS,GAAG,CAAC;QAEzD,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,IAAI,CAAC,eAAe,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC;QAC9C,CAAC;aAAM,CAAC;YACN,IAAI,IAAI,CAAC,MAAM,YAAY,KAAK,EAAE,CAAC;gBACjC,IAAI,CAAC,eAAe,CAAC,SAAS,GAAG,QAAQ,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC;YACnF,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,eAAe,CAAC,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC;YAC/C,CAAC;QACH,CAAC;IACH,CAAC;CACF"}

package/dist/loading-overlay/style.d.ts

@@ -1,3 +0,0 @@
-export declare const containerStyle: string;
-export declare const getLoaderStyle: () => string;
-export declare const progressStyle: string;

package/dist/loading-overlay/style.js

@@ -1,77 +0,0 @@
-import { css } from '@emotion/css';
-import { ATTRIBUTE_ANIMATION } from '.';
-export const containerStyle = css `
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: 32px;
-  padding: 24px;
-  background-color: #fff;
-  border-radius: 0;
-  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
-  border: 1px solid #f3f4f6;
-  min-height: 200px;
-  position: relative;
-  overflow: hidden;
-  transition: all 250ms ease;
-
-  @media (min-width: 640px) {
-    width: 400px;
-    max-width: 90vw;
-    border-radius: 4px;
-    padding: 32px;
-  }
-`;
-export const getLoaderStyle = () => css `
-  font-size: 60px;
-  width: 1em;
-  height: 1em;
-  border-radius: 50%;
-  box-shadow: inset 0 0 0 1px #3b82f633;
-  position: relative;
-
-  animation: none;
-  &[${ATTRIBUTE_ANIMATION}] {
-    animation: rotate 1.2s infinite linear;
-  }
-
-  > div {
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    width: 0.5em;
-    height: 1em;
-    margin-left: -0.5em;
-    margin-top: -0.5em;
-    overflow: hidden;
-    transform-origin: 0.5em 0.5em;
-    mask-image: linear-gradient(top, #000f, #0000);
-    -webkit-mask-image: -webkit-linear-gradient(top, #000f, #0000);
-
-    > div {
-      width: 1em;
-      height: 1em;
-      border-radius: 50%;
-      box-shadow: inset 0 0 0 1px #3b82f6;
-    }
-  }
-  @keyframes rotate {
-    0% {
-      transform: rotate(0deg);
-    }
-    100% {
-      transform: rotate(360deg);
-    }
-  }
-`;
-export const progressStyle = css `
-  position: absolute;
-  bottom: 0px;
-  left: 0;
-  width: 0%;
-  height: 2px;
-  background-color: #2563eb;
-  transition: all 350ms ease;
-`;
-//# sourceMappingURL=style.js.map

package/dist/loading-overlay/style.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"style.js","sourceRoot":"","sources":["../../src/loading-overlay/style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AACnC,OAAO,EAAE,mBAAmB,EAAE,MAAM,GAAG,CAAC;AAExC,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;CAsBhC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE,CAAC,GAAG,CAAA;;;;;;;;;MASjC,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgCxB,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,CAAA;;;;;;;;CAQ/B,CAAC"}

package/dist/modal/index.d.ts

@@ -1,34 +0,0 @@
-import { Overlay } from '../overlay';
-type Label = string | string[];
-type ConstructorProps = Readonly<Partial<{
-    label: Label;
-    progress: number;
-}>>;
-export declare class Modal extends Overlay {
-    #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;
-    hide(): void;
-    set label(label: Label);
-    set html(html: string);
-    set progress(progress: number);
-    private changeState;
-    render(): void;
-}
-export {};

package/dist/modal/index.js

@@ -1,177 +0,0 @@
-import { Overlay } from '../overlay';
-import { actionsStyle, containerStyle, iconStyle, loaderStyle, progressStyle, titleStyle, } from './style';
-export class Modal extends Overlay {
-    #title;
-    #html;
-    #label;
-    #progress;
-    #state;
-    _containerElement;
-    _iconElement;
-    _titleElement;
-    _loaderElement;
-    _progressElement;
-    _contentElement;
-    _actionsElement;
-    _okButtonElement;
-    _cancelButtonElement;
-    constructor(props = {}) {
-        super();
-        this.#title = '';
-        this.#html = '';
-        this.#label = props.label ?? '';
-        this.#progress = props.progress ?? null;
-        this.#state = 'hidden';
-        const container = document.createElement('div');
-        container.classList.add(containerStyle);
-        this._containerElement = container;
-        this._root.append(container);
-        const iconElement = document.createElement('div');
-        iconElement.classList.add(iconStyle);
-        this._iconElement = iconElement;
-        container.append(iconElement);
-        const titleElement = document.createElement('div');
-        titleElement.classList.add(titleStyle);
-        this._titleElement = titleElement;
-        container.append(titleElement);
-        const loaderElement = document.createElement('div');
-        loaderElement.innerHTML = '<div><div></div></div>';
-        loaderElement.classList.add(loaderStyle);
-        this._loaderElement = loaderElement;
-        const progressElement = document.createElement('div');
-        progressElement.classList.add(progressStyle);
-        this._progressElement = progressElement;
-        container.append(progressElement);
-        const contentElement = document.createElement('div');
-        this._contentElement = contentElement;
-        container.append(contentElement);
-        const actionsElement = document.createElement('div');
-        actionsElement.classList.add(actionsStyle);
-        this._actionsElement = actionsElement;
-        container.append(actionsElement);
-        const okButtonElement = document.createElement('button');
-        okButtonElement.type = 'button';
-        okButtonElement.textContent = 'OK';
-        this._okButtonElement = okButtonElement;
-        actionsElement.append(okButtonElement);
-        const cancelButtonElement = document.createElement('button');
-        cancelButtonElement.type = 'button';
-        cancelButtonElement.textContent = 'キャンセル';
-        this._cancelButtonElement = cancelButtonElement;
-        actionsElement.append(cancelButtonElement);
-        this.render();
-    }
-    alert(params) {
-        const { title = '', text = '', icon = '', disableClose = false, disableEscape = false, } = params;
-        this.#title = title;
-        this.#label = text;
-        this.changeState('alert');
-        this.show();
-        return new Promise((resolve) => {
-            this._okButtonElement.addEventListener('click', () => {
-                if (!disableClose) {
-                    this.hide();
-                }
-                resolve({
-                    isConfirmed: true,
-                });
-            });
-            this._cancelButtonElement.addEventListener('click', () => {
-                if (!disableClose) {
-                    this.hide();
-                }
-                resolve({
-                    isConfirmed: false,
-                });
-            });
-            this._root.addEventListener('click', (event) => {
-                if (event.currentTarget === event.target) {
-                    if (!disableClose) {
-                        this.hide();
-                    }
-                    resolve({
-                        isConfirmed: false,
-                    });
-                }
-            });
-            this._root.addEventListener('keydown', (event) => {
-                if (event.key === 'Escape') {
-                    if (!disableEscape) {
-                        this.hide();
-                    }
-                    resolve({
-                        isConfirmed: false,
-                    });
-                }
-            });
-        });
-    }
-    loading() {
-        this._iconElement.append(this._loaderElement);
-        this.changeState('loading');
-        this.show();
-    }
-    hide() {
-        this.#progress = 0;
-        this.#html = '';
-        this.#label = '';
-        this.changeState('hidden');
-        super.hide();
-    }
-    set label(label) {
-        this.#label = label;
-        this.render();
-    }
-    set html(html) {
-        this.#html = html;
-        this.render();
-    }
-    set progress(progress) {
-        this.#progress = progress;
-        this.render();
-    }
-    changeState(state) {
-        this.#state = state;
-        const elements = [
-            this._root,
-            this._actionsElement,
-            this._contentElement,
-            this._iconElement,
-            this._loaderElement,
-            this._progressElement,
-            this._titleElement,
-        ];
-        for (const element of elements) {
-            element.dataset.state = state;
-        }
-        this.render();
-    }
-    render() {
-        super.render();
-        this._progressElement.style.width = `${this.#progress}%`;
-        switch (this.#state) {
-            case 'loading':
-                break;
-            case 'alert':
-                this._iconElement.innerHTML = '';
-                break;
-            case 'hidden':
-            default:
-                this._iconElement.innerHTML = '';
-                break;
-        }
-        this._titleElement.textContent = this.#title;
-        if (this.#html) {
-            this._contentElement.innerHTML = this.#html;
-        }
-        else {
-            if (this.#label instanceof Array) {
-                this._contentElement.innerHTML = `<div>${this.#label.join('</div><div>')}</div>`;
-            }
-            else {
-                this._contentElement.textContent = this.#label;
-            }
-        }
-    }
-}
-//# sourceMappingURL=index.js.map

package/dist/modal/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/modal/index.ts"],"names":[],"mappings":"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"}

package/dist/modal/style.d.ts

@@ -1,6 +0,0 @@
-export declare const containerStyle: string;
-export declare const iconStyle: string;
-export declare const titleStyle: string;
-export declare const loaderStyle: string;
-export declare const progressStyle: string;
-export declare const actionsStyle: string;

package/dist/modal/style.js

@@ -1,94 +0,0 @@
-import { css } from '@emotion/css';
-export const containerStyle = css `
-  display: grid;
-  gap: 2px;
-  padding: 24px;
-  background-color: #fff;
-  border-radius: 0;
-  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
-  border: 1px solid #f3f4f6;
-  min-height: 200px;
-  position: relative;
-  overflow: hidden;
-  transition: all 250ms ease;
-
-  @media (min-width: 640px) {
-    width: 400px;
-    max-width: 90vw;
-    border-radius: 4px;
-    padding: 32px;
-  }
-`;
-export const iconStyle = css ``;
-export const titleStyle = css `
-  font-size: 18px;
-  font-weight: 600;
-  color: #1f2937;
-  text-align: center;
-  @media (min-width: 640px) {
-    text-align: left;
-  }
-`;
-export const loaderStyle = css `
-  font-size: 60px;
-  width: 1em;
-  height: 1em;
-  border-radius: 50%;
-  box-shadow: inset 0 0 0 1px #3b82f633;
-  position: relative;
-
-  animation: none;
-  &[data-state='loading'] {
-    animation: rotate 1s linear infinite;
-  }
-
-  > div {
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    width: 0.5em;
-    height: 1em;
-    margin-left: -0.5em;
-    margin-top: -0.5em;
-    overflow: hidden;
-    transform-origin: 0.5em 0.5em;
-    mask-image: linear-gradient(top, #000f, #0000);
-    -webkit-mask-image: -webkit-linear-gradient(top, #000f, #0000);
-
-    > div {
-      width: 1em;
-      height: 1em;
-      border-radius: 50%;
-      box-shadow: inset 0 0 0 1px #3b82f6;
-    }
-  }
-  @keyframes rotate {
-    0% {
-      transform: rotate(0deg);
-    }
-    100% {
-      transform: rotate(360deg);
-    }
-  }
-`;
-export const progressStyle = css `
-  position: absolute;
-  bottom: 0px;
-  left: 0;
-  width: 0%;
-  height: 2px;
-  background-color: #2563eb;
-  transition: all 350ms ease;
-`;
-export const actionsStyle = css `
-  display: flex;
-  flex-direction: column;
-  justify-content: flex-end;
-  align-items: flex-end;
-  gap: 8px;
-
-  @media (min-width: 640px) {
-    flex-direction: row;
-  }
-`;
-//# sourceMappingURL=style.js.map

package/dist/modal/style.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"style.js","sourceRoot":"","sources":["../../src/modal/style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAEnC,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;CAmBhC,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAA,EAAE,CAAC;AAE/B,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAAA;;;;;;;;CAQ5B,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyC7B,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,CAAA;;;;;;;;CAQ/B,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAAA;;;;;;;;;;CAU9B,CAAC"}