@yamato-daiwa/frontend-vue 0.3.0-alpha.1 → 0.3.0-alpha.2

package/Source/GUI_Components/Controls/Validatables/ValidatableControl.ts

@@ -1,268 +0,0 @@
-/* eslint-disable @typescript-eslint/member-ordering -- The secondary members has been organized to the end of the class. */
-
-import type { InputtedValueValidation, ValidatableControl as CorePackageValidatableControl } from "@yamato-daiwa/frontend";
-import type { ComponentPublicInstance as VueComponentPublicInstance } from "vue";
-import type { VueCons as VueClassComponent } from "vue-facing-decorator";
-import {
-  Logger,
-  UnexpectedEventError,
-  isArbitraryObject,
-  isUndefined,
-  isFunctionLike
-} from "@yamato-daiwa/es-extensions";
-import VueComponentNotFoundError from "../../_Errors/VueComponentNotFound/VueComponentNotFoundError";
-
-
-type ValidatableControl = CorePackageValidatableControl;
-
-
-namespace ValidatableControl {
-
-  export function isValidatableControl(potentialValidatableControl: unknown): potentialValidatableControl is ValidatableControl {
-    return isArbitraryObject(potentialValidatableControl) &&
-        isFunctionLike(potentialValidatableControl.highlightInvalidInput) &&
-        isFunctionLike(potentialValidatableControl.getRootElementOffsetCoordinates) &&
-        isFunctionLike(potentialValidatableControl.focus) &&
-        isFunctionLike(potentialValidatableControl.resetValidityHighlightingStateToInitial);
-  }
-
-
-  export function getValidatableControlInstanceByVueReferenceID(
-    compoundParameter: Readonly<{
-      parentVueComponentInstance: VueComponentPublicInstance | VueClassComponent;
-      vueReferenceID: string;
-    }>
-  ): ValidatableControl | null;
-
-  export function getValidatableControlInstanceByVueReferenceID(
-    compoundParameter: Readonly<{
-      parentVueComponentInstance: VueComponentPublicInstance | VueClassComponent;
-      vueReferenceID: string;
-      mustThrowErrorIsNotFoundOrNotValidatableControl: true;
-    }>
-  ): ValidatableControl;
-
-  export function getValidatableControlInstanceByVueReferenceID(
-    compoundParameter: Readonly<{
-      parentVueComponentInstance: VueComponentPublicInstance | VueClassComponent;
-      vueReferenceID: string;
-      mustThrowErrorIsNotFoundOrNotValidatableControl?: true;
-    }>
-  ): ValidatableControl | null {
-
-    const potentialValidatableControl: unknown =
-        /* eslint-disable-next-line @typescript-eslint/consistent-type-assertions --
-         * Types which `vue-facing-decorator` imports are not compatible with `VueComponentPublicInstance`, but actually
-         *   class components will be transformed to valid option API.  */
-        (compoundParameter.parentVueComponentInstance as VueComponentPublicInstance).$refs[compoundParameter.vueReferenceID];
-
-    if (isUndefined(potentialValidatableControl)) {
-
-      if (compoundParameter.mustThrowErrorIsNotFoundOrNotValidatableControl === true) {
-        Logger.throwErrorWithFormattedMessage({
-          errorInstance: new VueComponentNotFoundError({ vueReferenceID: compoundParameter.vueReferenceID }),
-          title: VueComponentNotFoundError.localization.defaultTitle,
-          occurrenceLocation: "ValidatableControl.getValidatableControlInstanceByVueReferenceID(compoundParameter)"
-        });
-      }
-
-
-      return null;
-
-   }
-
-
-    if (!isValidatableControl(potentialValidatableControl)) {
-
-      if (compoundParameter.mustThrowErrorIsNotFoundOrNotValidatableControl === true) {
-        Logger.throwErrorWithFormattedMessage({
-          errorType: "VueReferenceValueIsNotValidatableControlError",
-          title: "Vue Reference Value is not the Validatable Control",
-          description:
-              `The Vue reference "${ compoundParameter.vueReferenceID }" does not refer to the component implementing ` +
-                "the \"ValidatableControl\" interface.",
-          occurrenceLocation: "ValidatableControl.getValidatableControlInstanceByVueReferenceID(compoundParameter)"
-        });
-      }
-
-
-      return null;
-
-    }
-
-
-    return potentialValidatableControl;
-
-  }
-
-
-  export class Payload<ValidValue, InvalidValue, Validation extends InputtedValueValidation> {
-
-    /* ━━━ Fields ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
-    public readonly ID: string;
-    public readonly VUE_REFERENCE_ID: string;
-
-    public readonly value: ValidValue | InvalidValue;
-    public readonly validation: Validation;
-    public readonly lastChangeSourceID?: string;
-
-    protected readonly validationResult: InputtedValueValidation.Result;
-    protected readonly asynchronousChecksStatus: InputtedValueValidation.AsynchronousChecks.Status | null = null;
-
-
-    /* ━━━ Public Static Methods ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
-    public static createInitialInstance<ValidValue, InvalidValue, Validation extends InputtedValueValidation>(
-      {
-        initialValue,
-        validation,
-        vueReferenceID
-      }: Readonly<{
-        initialValue: ValidValue | InvalidValue;
-        validation: Validation;
-        vueReferenceID?: string;
-      }>
-    ): Payload<ValidValue, InvalidValue, Validation> {
-      return new Payload<ValidValue, InvalidValue, Validation>({
-        value: initialValue,
-        validation,
-        vueReferenceID
-      });
-    }
-
-
-    /* ━━━ Constructor ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
-    protected constructor(
-      {
-        ID,
-        vueReferenceID,
-        value,
-        validation,
-        summarizingValidationErrorsMessages = [],
-        lastChangeSourceID
-      }: Readonly<{
-
-        /** @description Immutable for each instance. */
-        value: ValidValue | InvalidValue;
-        validation: Validation;
-
-        summarizingValidationErrorsMessages?: ReadonlyArray<string>;
-        lastChangeSourceID?: string;
-
-        /** @description Need to be kept when creating the new instance based on outdated one. */
-        ID?: string;
-        vueReferenceID?: string;
-
-      }>
-    ) {
-
-      this.ID = ID ?? Payload.generateSelfID();
-      this.VUE_REFERENCE_ID = vueReferenceID ?? Payload.generateVueReferenceID_ForAssociatedComponent();
-
-      this.value = value;
-      this.validation = validation;
-      this.lastChangeSourceID = lastChangeSourceID;
-
-      if (summarizingValidationErrorsMessages.length === 0) {
-        this.validationResult = validation.validate(this.value);
-      } else {
-
-        const validationResult: InputtedValueValidation.Result = validation.validate(this.value);
-
-        const validationErrorsMessages: ReadonlyArray<string> = [
-          ...validationResult.isValid ? [] : validationResult.errorsMessages, ...summarizingValidationErrorsMessages
-        ];
-
-        this.validationResult = {
-          errorsMessages: validationErrorsMessages,
-          isValid: validationErrorsMessages.length === 0
-        };
-
-      }
-
-    }
-
-
-    /* ━━━ Public Instance Methods ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
-    /* ─── Updating ───────────────────────────────────────────────────────────────────────────────────────────────── */
-    public getComponentInstance(ownerComponent: VueComponentPublicInstance): ValidatableControl {
-      return getValidatableControlInstanceByVueReferenceID({
-        vueReferenceID: this.VUE_REFERENCE_ID,
-        parentVueComponentInstance: ownerComponent,
-        mustThrowErrorIsNotFoundOrNotValidatableControl: true
-      });
-    }
-
-
-    /* ─── Other ──────────────────────────────────────────────────────────────────────────────────────────────────── */
-    public updateImmutably(
-      {
-        newValue
-      }: {
-        newValue: ValidValue | InvalidValue;
-      }
-    ): Payload<ValidValue, InvalidValue, Validation> {
-      return new Payload<ValidValue, InvalidValue, Validation>({
-        value: newValue,
-        validation: this.validation
-      });
-    }
-
-
-    /* ━━━ Public Getters and Getter-like Methods ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
-    public getExpectedToBeValidValue(): ValidValue {
-
-      if (this.isInvalid) {
-        Logger.throwErrorWithFormattedMessage({
-          errorInstance: new UnexpectedEventError("Contrary to expectations, the value is still invalid."),
-          title: UnexpectedEventError.localization.defaultTitle,
-          occurrenceLocation: "ValidatableControl.Payload.getExpectedToBeValidValue()"
-        });
-      }
-
-
-      /* eslint-disable-next-line @typescript-eslint/consistent-type-assertions --
-       * In this case, we are guarantee the ValidValue by "this.isInvalid" check */
-      return this.value as ValidValue;
-
-    }
-
-    public get isEmpty(): boolean {
-      return this.validation.hasValueBeenOmitted(this.value);
-    }
-
-    public get isInvalid(): boolean {
-      return !this.validationResult.isValid;
-    }
-
-    public get validationErrorsMessages(): Array<string> {
-      return this.validationResult.isValid ? [] : [ ...this.validationResult.errorsMessages ];
-    }
-
-
-    /* ━━━ Routines ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
-    /* ─── IDs generating ─────────────────────────────────────────────────────────────────────────────────────────── */
-    protected static counterForSelfID_Generating: number = 0;
-
-    protected static generateSelfID(): string {
-      Payload.counterForSelfID_Generating++;
-      return `${ Payload.counterForSelfID_Generating }`;
-    }
-
-    protected static counterForAssociatedComponentVueReferenceID_Generating: number = 0;
-
-    protected static generateVueReferenceID_ForAssociatedComponent(): string {
-      Payload.counterForAssociatedComponentVueReferenceID_Generating++;
-      return `VALIDATABLE_CONTROL-${ Payload.counterForAssociatedComponentVueReferenceID_Generating }`;
-    }
-
-  }
-
-
-  export function VModelChecker(rawVModel: unknown, valueChecker: (rawValue: unknown) => boolean): boolean {
-    return isArbitraryObject(rawVModel) ? valueChecker(rawVModel.value) : false;
-  }
-
-}
-
-
-export default ValidatableControl;

package/Source/GUI_Components/Controls/Validatables/ValidatableControlsGroup.ts

@@ -1,176 +0,0 @@
-import ValidatableControl from "./ValidatableControl";
-import type { InputtedValueValidation } from "@yamato-daiwa/frontend";
-
-import type { ComponentPublicInstance as VueComponentPublicInstance } from "vue";
-import type { Vue as VueClassComponent } from "vue-facing-decorator";
-
-import {
-  Logger,
-  UnexpectedEventError,
-  isNull,
-  isNotUndefined,
-  DOM_ElementRetrievingFailedError
-} from "@yamato-daiwa/es-extensions";
-import type { ArbitraryObject } from "@yamato-daiwa/es-extensions";
-import { getExpectedToBeSingleDOM_Element } from "@yamato-daiwa/es-extensions-browserjs";
-
-
-export default class ValidatableControlsGroup<ValidData extends ArbitraryObject | Array<unknown>> {
-
-  public readonly isInvalid: boolean;
-  public readonly payload: ValidData | null;
-  public readonly SCROLLING_CONTAINER_HTML_ID?: string;
-
-  protected readonly controlsPayload: ValidatableControlsGroup.GeneralizedControlsPayload;
-
-
-  /* ━━━ Public Static Methods ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
-  public static initialize<ValidData extends ArbitraryObject | Array<unknown>>(
-    compoundParameter: Readonly<{ scrollingContainerHTML_ID?: string; }>
-  ): ValidatableControlsGroup<ValidData> {
-    return new ValidatableControlsGroup<ValidData>({
-      isInvalid: true,
-      payload: null,
-      controlsPayload: {},
-      scrollingContainerHTML_ID: compoundParameter.scrollingContainerHTML_ID
-    });
-  }
-
-  public static hasInvalidInputs(
-    controlsPayload: ValidatableControlsGroup.GeneralizedControlsPayload
-  ): boolean {
-    return (Array.isArray(controlsPayload) ? controlsPayload : Object.values(controlsPayload)).
-        some(
-          (validatableControlPayload: ValidatableControl.Payload<unknown, unknown, InputtedValueValidation>): boolean =>
-              validatableControlPayload.isInvalid
-        );
-  }
-
-  public static pointOutValidationErrors(
-    {
-      controlsPayload,
-      parentVueComponentInstance,
-      scrollingContainerHTML_ID
-    }: Readonly<{
-      controlsPayload: ValidatableControlsGroup.GeneralizedControlsPayload;
-      parentVueComponentInstance: VueComponentPublicInstance | InstanceType<typeof VueClassComponent>;
-      scrollingContainerHTML_ID?: string;
-    }>
-  ): void {
-
-    let isCurrentControlTheFirstInvalidOne: boolean = true;
-
-    for (const validatableControlPayload of Array.isArray(controlsPayload) ? controlsPayload : Object.values(controlsPayload)) {
-
-      if (validatableControlPayload.isInvalid) {
-
-        const componentInstance: ValidatableControl | null = ValidatableControl.getValidatableControlInstanceByVueReferenceID({
-          parentVueComponentInstance, vueReferenceID: validatableControlPayload.VUE_REFERENCE_ID
-        });
-
-        if (isNull(componentInstance)) {
-
-          Logger.logError({
-            errorType: DOM_ElementRetrievingFailedError.NAME,
-            title: DOM_ElementRetrievingFailedError.localization.defaultTitle,
-            description: "Unable to retrieve the validatable control instance with Vue reference ID " +
-                `"${ validatableControlPayload.VUE_REFERENCE_ID }". Make sure that dedicated component has been mounted ` +
-                "and \"ref\" attribute has been explicitly specified.",
-            occurrenceLocation: "ValidatableControlsGroup.pointOutValidationErrors(compoundParameter)"
-          });
-
-          continue;
-
-        }
-
-
-        componentInstance.highlightInvalidInput();
-
-        if (isCurrentControlTheFirstInvalidOne) {
-
-          componentInstance.focus();
-
-          /* eslint-disable-next-line max-depth -- Here are all conditions are required. */
-          if (isNotUndefined(scrollingContainerHTML_ID)) {
-            getExpectedToBeSingleDOM_Element({ selector: `#${ scrollingContainerHTML_ID }` }).scroll({
-              top: componentInstance.getRootElementOffsetCoordinates().top,
-              behavior: "smooth"
-            });
-          }
-
-          isCurrentControlTheFirstInvalidOne = false;
-
-        }
-
-      }
-
-    }
-
-  }
-
-
-  /* ━━━ Instancing ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
-  public constructor(
-    compoundParameter:
-        Readonly<
-          (
-            {
-              isInvalid: false;
-              payload: ValidData;
-            } | {
-              isInvalid: true;
-              payload: null;
-              controlsPayload: ValidatableControlsGroup.GeneralizedControlsPayload;
-            }
-          ) & {
-            scrollingContainerHTML_ID?: string;
-          }
-        >
-  ) {
-
-    this.isInvalid = compoundParameter.isInvalid;
-    this.payload = compoundParameter.payload;
-
-    this.controlsPayload = "controlsPayload" in compoundParameter ? compoundParameter.controlsPayload : {};
-
-    if (isNotUndefined(this.SCROLLING_CONTAINER_HTML_ID)) {
-      this.SCROLLING_CONTAINER_HTML_ID = compoundParameter.scrollingContainerHTML_ID;
-    }
-
-  }
-
-
-  /* ━━━ Instance Methods ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
-  public getExpectedToBeValidPayload(): ValidData {
-
-    if (isNull(this.payload)) {
-      Logger.throwErrorWithFormattedMessage({
-        errorInstance: new UnexpectedEventError("Contrary to expectations the payload is still invalid."),
-        title: UnexpectedEventError.localization.defaultTitle,
-        occurrenceLocation: "validatableControlsGroup.getExpectedToBeValidPayload()"
-      });
-    }
-
-
-    return this.payload;
-
-  }
-
-  public pointOutValidationErrors(parentVueComponentInstance: VueComponentPublicInstance): void {
-    ValidatableControlsGroup.pointOutValidationErrors({
-      controlsPayload: this.controlsPayload,
-      parentVueComponentInstance,
-      scrollingContainerHTML_ID: this.SCROLLING_CONTAINER_HTML_ID
-    });
-  }
-
-}
-
-
-namespace ValidatableControlsGroup {
-
-  export type GeneralizedControlsPayload =
-      Readonly<{ [controlKey: string]: ValidatableControl.Payload<unknown, unknown, InputtedValueValidation>; }> |
-      Array<ValidatableControl.Payload<unknown, unknown, InputtedValueValidation>>;
-
-}

package/Source/GUI_Components/OverflowSafeSingleLineLabel.vue

@@ -1,32 +0,0 @@
-<template lang="pug">
-
-component.OverflowSafeSingleLineLabel(
-  :is="rootElementTag"
-)
-  span.OverflowSafeSingleLineLabel-TextWithIncreasedLineHeight
-    slot
-
-</template>
-
-
-<script lang="ts">
-
-  import {
-    Component as VueComponentOptions,
-    Vue as VueComponent,
-    Prop as VueProperty,
-    toNative as transformToOptionAPI_Component
-  } from "vue-facing-decorator";
-
-
-  @VueComponentOptions({ name: "OverflowSafeSingleLineLabel--YDF" })
-  class OverflowSafeSingleLineLabel extends VueComponent {
-
-    @VueProperty({ type: String, default: "div" })
-    protected readonly rootElementTag!: string;
-
-  }
-
-  export default transformToOptionAPI_Component(OverflowSafeSingleLineLabel);
-
-</script>

package/Source/GUI_Components/ThemesShowcase.vue

@@ -1,123 +0,0 @@
-<template lang="pug">
-
-ul.ThemesShowcase--YDF
-
-  li(
-    v-for="(themeValue, themeKey) of themes"
-    :key="`THEME-${ themeKey }`"
-  )
-
-    span.ThemesShowcase--YDF-Label {{ themeKeyLabelPrefix }}{{ themeKey }}
-
-    ul.ThemesShowcase--YDF-ChildList
-
-      li(
-        v-for="(geometricVariationValue, geometricVariationKey) of geometricVariations"
-        :key="`GEOMETRIC_VARIATION-${ themeKey }-${ geometricVariationKey }`"
-      )
-
-        span.ThemesShowcase--YDF-Label {{ geometricVariationLabelPrefix }}{{ geometricVariationKey }}
-
-        component.ThemesShowcase--YDF-ChildList(
-          :is="decorativeVariationsWrapperTag"
-          :class="decorativeVariationsWrapperAdditionalCSS_Classes"
-        )
-
-          template(
-            v-for="(decorativeVariationValue, decorativeVariationKey) of decorativeVariations"
-            :key="`DECORATIVE_VARIATION-${ themeKey }-${ decorativeVariationKey }`"
-          )
-
-            li(
-              v-if="decorativeVariationsWrapperTag === 'ul'"
-            )
-
-              span.ThemesShowcase--YDF-Label {{ decorativeVariationLabelPrefix }}{{ decorativeVariationKey }}
-
-              slot(
-                :theme="{ key: themeKey, value: themeValue }"
-                :geometricVariation="{ key: geometricVariationKey, value: geometricVariationValue }"
-                :decorativeVariation="{ key: decorativeVariationKey, value: decorativeVariationValue }"
-              )
-
-            template(
-              v-else
-            )
-
-              slot(
-                :theme="{ key: themeKey, value: themeValue }"
-                :geometricVariation="{ key: geometricVariationKey, value: geometricVariationValue }"
-                :decorativeVariation="{ key: decorativeVariationKey, value: decorativeVariationValue }"
-              )
-
-</template>
-
-
-<script lang="ts">
-
-  import {
-    Component as VueComponentOptions,
-    Vue as VueComponent,
-    Prop as VueProperty,
-    toNative as transformToOptionAPI_Component
-  } from "vue-facing-decorator";
-
-
-  @VueComponentOptions({ name: "ThemesShowcase--YDF" })
-  class ThemesShowcase extends VueComponent {
-
-    @VueProperty({
-      type: Object,
-      required: true
-    })
-    protected readonly themes!: Readonly<{ [themeKey: string]: string; }>;
-
-    @VueProperty({
-      type: String,
-      required: false
-    })
-    protected readonly themeKeyLabelPrefix?: string;
-
-
-    @VueProperty({
-      type: Object,
-      required: true
-    })
-    protected readonly geometricVariations!: Readonly<{ [themeKey: string]: string; }>;
-
-    @VueProperty({
-      type: String,
-      required: false
-    })
-    protected readonly geometricVariationLabelPrefix?: string;
-
-
-    @VueProperty({
-      type: Object,
-      required: true
-    })
-    protected readonly decorativeVariations!: Readonly<{ [themeKey: string]: string; }>;
-
-    @VueProperty({
-      type: String,
-      required: false
-    })
-    protected readonly decorativeVariationLabelPrefix?: string;
-
-    @VueProperty({
-      type: String,
-      default: "ul"
-    })
-    protected readonly decorativeVariationsWrapperTag!: string;
-
-    @VueProperty({
-      type: Array,
-      required: false
-    })
-    protected readonly decorativeVariationsWrapperAdditionalCSS_Classes?: ReadonlyArray<string>;
-
-  }
-
-  export default transformToOptionAPI_Component(ThemesShowcase);
-
-</script>