@idevs/corelib 0.0.97 → 1.0.1

package/src/editors/checkboxButtonEditor.ts

@@ -1,184 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-/* eslint-disable @typescript-eslint/adjacent-overload-signatures */
-// reference: https://github-wiki-see.page/m/serenity-is/Serenity/wiki/CheckBox-Group-Editor
-
-import {
-  Decorators,
-  EditorProps,
-  EditorWidget,
-  Enum,
-  EnumKeyAttribute,
-  EnumTypeRegistry,
-  Fluent,
-  IReadOnly,
-  getCustomAttributes,
-  getLookup,
-  isEmptyOrNull,
-  toId,
-  tryGetText,
-} from '@serenity-is/corelib'
-
-export type CheckboxButtonEditorOptions = {
-  enumKey?: string
-  enumType?: any
-  lookupKey?: string
-  isStringId?: boolean
-}
-
-@Decorators.registerEditor('CheckboxButtonEditor')
-export class CheckboxButtonEditor<P extends CheckboxButtonEditorOptions = CheckboxButtonEditorOptions>
-  extends EditorWidget<P>
-  implements IReadOnly
-{
-  private _items: Array<{ [key: string]: any }>
-  private readonly _idField: string
-  private readonly _textField: string
-  private readonly _isStringId: boolean
-
-  static override createDefaultElement() {
-    return Fluent('div').getNode()
-  }
-  declare readonly domNode: HTMLElement
-
-  constructor(props: EditorProps<P>) {
-    super(props)
-
-    if (isEmptyOrNull(this.options.enumKey) && this.options.enumType == null && isEmptyOrNull(this.options.lookupKey)) {
-      return
-    }
-
-    this._isStringId = this.options.isStringId
-
-    if (!isEmptyOrNull(this.options.lookupKey)) {
-      const lookup = getLookup(this.options.lookupKey)
-      this._idField = lookup.idField
-      this._textField = lookup.textField
-      this.set_items(lookup.items as Array<{ [key: string]: any }>)
-    } else {
-      const enumType = this.options.enumType || EnumTypeRegistry.get(this.options.enumKey)
-      let enumKey = this.options.enumKey
-
-      if (enumKey == null && enumType != null) {
-        const enumKeyAttr = getCustomAttributes(enumType, EnumKeyAttribute, false)
-        if (enumKeyAttr.length > 0) {
-          enumKey = enumKeyAttr[0].value
-        }
-      }
-      const values = Enum.getValues(enumType)
-      for (const x of values) {
-        const name = Enum.toString(enumType, x)
-        this.addCheckbox(x.toString(), tryGetText('Enums.' + enumKey + '.' + name) ?? name)
-      }
-    }
-
-    this.domNode.classList.add('d-flex', 'flex-wrap')
-  }
-
-  protected renderCheckboxes() {
-    const childDivs = this.domNode.querySelectorAll('div')
-    childDivs.forEach(function (child) {
-      this.domNode.removeChild(child)
-    })
-
-    for (const item of this._items) {
-      const textValue = item[this._textField]
-      const text = textValue == null ? '' : textValue.toString()
-      const idValue = item[this._idField]
-      const id = idValue == null ? '' : idValue.toString()
-      this.addCheckbox(id, text)
-    }
-  }
-
-  protected addCheckbox(value: string, text: string) {
-    const div = $('<div class="col-12 col-sm-6 col-md-4 col-xl-3" />')
-    const label = $('<label/>').text(text.replace(/, /g, ',').replace(/,/g, ', '))
-    $('<input type="checkbox" class="me-2" />')
-      .attr('name', this.uniqueName)
-      .attr('id', this.uniqueName + '_' + value)
-      .attr('value', value)
-      .prependTo(label)
-    label.appendTo(div)
-    div.appendTo(this.domNode)
-  }
-
-  get_items(): Array<{ [key: string]: any }> {
-    return this._items
-  }
-
-  get items(): Array<{ [key: string]: any }> {
-    return this.get_items()
-  }
-
-  set_items(value: Array<{ [key: string]: any }>) {
-    this._items = value
-    this.renderCheckboxes()
-  }
-
-  set items(v: Array<{ [key: string]: any }>) {
-    this.set_items(v)
-  }
-
-  get_value() {
-    const val: string[] = []
-    const inputs = this.domNode.querySelectorAll('input:checked')
-
-    inputs.forEach((input: HTMLInputElement) => {
-      val.push(this._isStringId ? input.value : toId(input.value))
-    })
-
-    return val.join(',')
-  }
-
-  get value(): string {
-    return this.get_value()
-  }
-
-  set_value(value: string): void {
-    if (value !== this.get_value()) {
-      let values: unknown[] = []
-      if (!isEmptyOrNull(value)) {
-        values = this._isStringId ? value.split(',') : value.split(',').map(p => Number(p))
-      }
-      const inputs = this.domNode.querySelectorAll<HTMLInputElement>('input')
-      inputs.forEach(input => {
-        input.checked = false
-      })
-
-      values.forEach(v => {
-        const checks = Array.from(inputs).filter(input => (input as HTMLInputElement).value === v)
-        if (checks.length > 0) {
-          ;(checks[0] as HTMLInputElement).checked = true
-        }
-      })
-    }
-  }
-
-  set value(v: string) {
-    this.set_value(v)
-  }
-
-  get_readOnly(): boolean {
-    return this.domNode.getAttribute('disabled') != null
-  }
-
-  set_readOnly(value: boolean): void {
-    if (this.get_readOnly() !== value) {
-      if (value) {
-        this.domNode.setAttribute('disabled', 'disabled')
-        this.domNode.querySelectorAll<HTMLInputElement>('input').forEach(input => {
-          input.setAttribute('disabled', 'disabled')
-        })
-      } else {
-        this.domNode.removeAttribute('disabled')
-        this.domNode.querySelectorAll<HTMLInputElement>('input').forEach(input => {
-          input.removeAttribute('disabled')
-        })
-      }
-    }
-  }
-}
-
-export class idevsEditors {
-  // eslint-disable-next-line @typescript-eslint/no-empty-function
-  public static load() {}
-}

package/src/editors/dateMonthEditor.ts

@@ -1,47 +0,0 @@
-import { Decorators, EditorProps, SelectEditor, SelectEditorOptions, indexOf } from '@serenity-is/corelib'
-
-@Decorators.registerEditor('DateMonthEditor')
-export class DateMonthEditor<P extends DateMonthEditorOptions = DateMonthEditorOptions> extends SelectEditor<P> {
-  private months: string[]
-
-  constructor(props: EditorProps<P>) {
-    super(props)
-
-    this.updateItems()
-  }
-
-  get valueAsMonth() {
-    return indexOf(this.months, x => x == this.value)
-  }
-
-  getItems() {
-    const opt = this.options as DateMonthEditorOptions
-
-    if (opt.items != null && opt.items.length >= 1) {
-      return opt.items
-    }
-
-    const today = new Date()
-    this.months = []
-    const locale = opt.locale ?? 'en'
-    const options = { month: opt.display ?? '2-digit' }
-    const upperCase = opt.upperCase ?? false
-
-    for (let i = 0; i <= 11; i++) {
-      let m = new Date(today.getFullYear(), i, 1).toLocaleDateString(locale, options)
-      if (upperCase) {
-        m = m.toUpperCase()
-      }
-      this.months.push(m)
-    }
-
-    return this.months
-  }
-}
-
-// eslint-disable-next-line @typescript-eslint/consistent-type-definitions
-export interface DateMonthEditorOptions extends SelectEditorOptions {
-  display?: '2-digit' | 'short' | 'long'
-  locale?: 'en' | 'th'
-  upperCase?: boolean
-}

package/src/editors/index.ts

@@ -1,2 +0,0 @@
-export * from './checkboxButtonEditor'
-export * from './dateMonthEditor'

package/src/formatters/formatters.ts

@@ -1,185 +0,0 @@
-import { Decorators } from '@serenity-is/corelib'
-import { FormatterContext } from '@serenity-is/sleekgrid'
-import { getLookup, htmlEncode } from '@serenity-is/corelib'
-
-export type Formatter = {
-  format(ctx: FormatterContext): string
-}
-
-@Decorators.registerFormatter('Idevs.ZeroDisplayFormatter')
-export class ZeroDisplayFormatter implements Formatter {
-  constructor(public readonly props: { displayText?: string } = {}) {
-    this.props ??= {}
-    this.props.displayText ??= ''
-  }
-
-  get displayText() {
-    return this.props.displayText
-  }
-  set displayText(value: string) {
-    this.props.displayText = value
-  }
-
-  format(ctx: FormatterContext): string {
-    return ZeroDisplayFormatter.format(ctx.value, this.displayText)
-  }
-
-  static format(src: string, displayText?: string): string {
-    const value = parseFloat(String(src || '0').replace(',', ''))
-    if (value == 0) {
-      return htmlEncode(displayText)
-    }
-
-    return htmlEncode(src)
-  }
-}
-
-@Decorators.registerFormatter('Idevs.CheckboxFormatter')
-export class CheckboxFormatter implements Formatter {
-  constructor(
-    public readonly props: {
-      trueText?: string
-      falseText?: string
-      cssClass?: string
-      trueValueIcon?: string
-      falseValueIcon?: string
-    },
-  ) {
-    this.props.cssClass ??= 'text-center fs-2 text-gray-1'
-    this.props.trueText ??= '1'
-    this.props.falseText ??= '0'
-    this.props.trueValueIcon ??= 'mdi mdi-checkbox-marked-outline'
-    this.props.falseValueIcon ??= 'mdi mdi-checkbox-blank-outline'
-  }
-
-  get cssClass() {
-    return this.props.cssClass
-  }
-  set cssClass(value: string) {
-    this.props.cssClass = value
-  }
-
-  get trueText() {
-    return this.props.trueText
-  }
-  set trueText(value: string) {
-    this.props.trueText = value
-  }
-
-  get falseText() {
-    return this.props.falseText
-  }
-  set falseText(value: string) {
-    this.props.falseText = value
-  }
-
-  get trueValueIcon() {
-    return this.props.trueValueIcon
-  }
-  set trueValueIcon(value: string) {
-    this.props.trueValueIcon = value
-  }
-
-  get falseValueIcon() {
-    return this.props.falseValueIcon
-  }
-  set falseValueIcon(value: string) {
-    this.props.falseValueIcon = value
-  }
-
-  format(ctx: FormatterContext): string {
-    return CheckboxFormatter.format(
-      ctx.value,
-      this.cssClass,
-      this.trueText,
-      this.falseText,
-      this.trueValueIcon,
-      this.falseValueIcon,
-    )
-  }
-
-  static format(
-    src: string,
-    cssClass?: string,
-    trueText?: string,
-    falseText?: string,
-    trueValueIcon?: string,
-    falseValueIcon?: string,
-  ): string {
-    if (src == trueText) {
-      return `<i class="${trueValueIcon} ${cssClass}"></i>`
-    } else if (src == falseText) {
-      return `<i class="${falseValueIcon} ${cssClass}"></i>`
-    } else {
-      return htmlEncode(src)
-    }
-  }
-}
-
-@Decorators.registerFormatter('Idevs.LookupFormatter')
-export class LookupFormatter implements Formatter {
-  constructor(public readonly props: { lookupKey?: string } = {}) {
-    this.props ??= {}
-  }
-
-  get lookupKey() {
-    return this.props.lookupKey
-  }
-  set lookupKey(value: string) {
-    this.props.lookupKey = value
-  }
-
-  format(ctx: FormatterContext): string {
-    return LookupFormatter.format(ctx.value, this.lookupKey)
-  }
-
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  static format(src: any, lookupKey?: string): string {
-    if (!src) return ''
-
-    if (!lookupKey) return src
-
-    const lookup = getLookup(lookupKey)
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const items = lookup.items as Array<{ [key: string]: any }>
-    const idField = lookup.idField
-    const textField = lookup.textField
-    const idList = src.toString().split(',')
-
-    return (
-      idList
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        .map((x: any) => {
-          const g = items.find(i => i[idField] == x)
-          if (!g) return x
-
-          return htmlEncode(g[textField])
-        })
-        .join(', ')
-    )
-  }
-}
-
-@Decorators.registerFormatter('Idevs.DateMonthFormatter')
-export class DateMonthFormatter implements Formatter {
-  @Decorators.option()
-  public display: '2-digit' | 'short' | 'long'
-
-  @Decorators.option()
-  public locale: 'en' | 'th'
-
-  format(ctx: FormatterContext): string {
-    const src = ctx.value as number
-    if (!src) return ''
-
-    const locale = this.locale ?? 'en'
-    const options = { month: this.display ?? '2-digit' }
-
-    return new Date(2000, src - 1, 1).toLocaleDateString(locale, options)
-  }
-}
-
-export class idevsFormatters {
-  // eslint-disable-next-line @typescript-eslint/no-empty-function
-  public static load() {}
-}

package/src/formatters/index.ts

@@ -1 +0,0 @@
-export * from './formatters'