@mouseless/baked 1.8.6 → 1.9.0

package/dist/runtime/components/InputMoney.vue

@@ -0,0 +1,53 @@
+<template>
+  <AwaitLoading
+    :skeleton="{
+      height: label?.mode === 'ifta' ? '3.6rem' : '2.6rem',
+      class: 'min-w-60'
+    }"
+  >
+    <Validation>
+      <InputGroup class="w-auto">
+        <Labeler
+          :label
+          :path
+        >
+          <InputNumber
+            ref="number"
+            v-model="model"
+            v-bind="$attrs"
+            class="min-w-60"
+            :min="0"
+            @input="onInput"
+          />
+        </Labeler>
+        <InputGroupAddon
+          class="
+              bg-slate-200 text-slate-500
+              dark:bg-zinc-700 dark:text-zinc-300
+            "
+        >
+          <i :class="`pi ${icon}`" />
+        </InputGroupAddon>
+      </InputGroup>
+    </Validation>
+  </AwaitLoading>
+</template>
+
+<script setup>
+import { InputNumber, InputGroup, InputGroupAddon } from "primevue";
+import { useRuntimeConfig } from "#app";
+import { useContext } from "#imports";
+import { AwaitLoading, Labeler, Validation } from "#components";
+const context = useContext();
+const runtimeConfig = useRuntimeConfig();
+const { schema } = defineProps({
+  schema: { type: null, required: true }
+});
+const model = defineModel({ type: null, required: true });
+const { label, icon: schemaIcon } = schema;
+const icon = schemaIcon ?? runtimeConfig.public.components?.InputMoney?.icon ?? "pi-dollar";
+const path = context.injectPath();
+function onInput({ value }) {
+  model.value = value;
+}
+</script>

package/dist/runtime/components/InputMoney.vue.d.ts

@@ -0,0 +1,25 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/runtime/components/InputRate.d.vue.ts

@@ -0,0 +1,25 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/runtime/components/InputRate.vue

@@ -0,0 +1,86 @@
+<template>
+  <AwaitLoading
+    :skeleton="{
+      height: label?.mode === 'ifta' ? '3.6rem' : '2.6rem',
+      class: 'min-w-60'
+    }"
+  >
+    <Validation>
+      <Labeler
+        :label
+        :path
+      >
+        <InputNumber
+          ref="number"
+          v-model="inputModel"
+          v-bind="$attrs"
+          class="min-w-60"
+          prefix="%"
+          min="0"
+          :max="MAX_VALUE"
+          :min-fraction-digits="0"
+          :max-fraction-digits="2"
+          :disabled
+          @input="onInput"
+          @keydown="onKeydown"
+        />
+      </Labeler>
+    </Validation>
+  </AwaitLoading>
+</template>
+
+<script setup>
+import { ref, watch } from "vue";
+import { InputNumber } from "primevue";
+import { useContext } from "#imports";
+import { AwaitLoading, Labeler, Validation } from "#components";
+const context = useContext();
+const { schema } = defineProps({
+  schema: { type: null, required: true }
+});
+const model = defineModel({ type: null, required: true });
+const inputModel = ref();
+const { label, disabled, max } = schema;
+const MAX_VALUE = max || Number.MAX_SAFE_INTEGER;
+const path = context.injectPath();
+watch(
+  () => model.value,
+  (newVal) => {
+    if (newVal != null) {
+      inputModel.value = newVal * 100;
+    }
+  },
+  { immediate: true }
+);
+function onInput(event) {
+  if (event.value > MAX_VALUE) {
+    inputModel.value = MAX_VALUE;
+    return;
+  }
+  model.value = event.value / 100;
+}
+function onKeydown(event) {
+  const ALLOWED_KEYS = [
+    "Backspace",
+    "Delete",
+    "Tab",
+    "Escape",
+    "Enter",
+    "ArrowLeft",
+    "ArrowRight",
+    "ArrowUp",
+    "ArrowDown"
+  ];
+  if (event.ctrlKey || event.metaKey || ALLOWED_KEYS.includes(event.key)) {
+    return;
+  }
+  const isDigit = /^[0-9]$/.test(event.key);
+  if (!isDigit) {
+    return;
+  }
+  const currentValue = inputModel.value ?? 0;
+  if (currentValue >= MAX_VALUE) {
+    event.preventDefault();
+  }
+}
+</script>

package/dist/runtime/components/InputRate.vue.d.ts

@@ -0,0 +1,25 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/runtime/components/InputText.vue

@@ -35,7 +35,7 @@ const { label, targetProp } = schema;
 const path = context.injectPath();
 const input = ref("");
 watch(model, (newValue) => {
-  input.value = newValue;
+  input.value = (newValue && targetProp ? newValue[targetProp] : newValue) ?? "";
 }, { immediate: true });
 function onUpdate(value) {
   input.value = value;

package/dist/runtime/components/InputUrl.d.vue.ts

@@ -0,0 +1,25 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/runtime/components/InputUrl.vue

@@ -0,0 +1,59 @@
+<template>
+  <AwaitLoading
+    :skeleton="{
+      height: label.mode === 'ifta' ? '3.6rem' : '2.6rem',
+      class: 'min-w-60'
+    }"
+  >
+    <Validation>
+      <Labeler
+        :label
+        :path
+        class="w-full"
+      >
+        <InputText
+          :id="path"
+          v-model="inputModel"
+          type="url"
+          v-bind="$attrs"
+          class="min-w-60"
+          placeholder="https://"
+          @input="onInput"
+        />
+      </Labeler>
+    </Validation>
+  </AwaitLoading>
+</template>
+
+<script setup>
+import { ref, watch } from "vue";
+import { InputText } from "primevue";
+import { useContext, useInputValidator } from "#imports";
+import { AwaitLoading, Labeler, Validation } from "#components";
+const context = useContext();
+const { url: validator } = useInputValidator();
+const { schema } = defineProps({
+  schema: { type: null, required: true }
+});
+const model = defineModel({ type: null, required: true });
+const { label } = schema;
+const path = context.injectPath();
+const inputModel = ref("");
+watch(model, (newModel) => {
+  inputModel.value = validator.validate(newModel, { silent: true }) ? newModel : inputModel.value;
+}, { immediate: true });
+function onInput(event) {
+  const normalized = normalize(event.target.value);
+  model.value = validator.validate(normalized) ? normalized : null;
+}
+function normalize(value) {
+  if (!value) {
+    return value;
+  }
+  const trimmed = value.trim();
+  if (/^(?:https?|ftp):\/\//i.test(trimmed)) {
+    return trimmed;
+  }
+  return `https://${trimmed}`;
+}
+</script>

package/dist/runtime/components/InputUrl.vue.d.ts

@@ -0,0 +1,25 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/runtime/components/MissingComponent.vue

@@ -111,28 +111,28 @@ const highlightedData = computed(() => {
   return highlightJson(JSON.stringify(data, null, 2));
 });
 function renderTypeSample([type]) {
-  return String.raw`builder.Conventions.AddTypeComponent${component ? `<${component}>` : ""}(
+  return String.raw`conventions.AddTypeComponent${component ? `<${component}>` : ""}(
     when: c => c.Type.Is<${type}>(),
     where: cc => cc.Path.EndsWith(${path.map((p) => `"${p}"`).join(", ")}),
     component: () => ${component ? "..." : "B.Text()"}
 );`;
 }
 function renderPropertySample([type, property]) {
-  return String.raw`builder.Conventions.AddPropertyComponent${component ? `<${component}>` : ""}(
+  return String.raw`conventions.AddPropertyComponent${component ? `<${component}>` : ""}(
     when: c => c.Type.Is<${type}>() && c.Property.Name == nameof(${type}.${property}),
     where: cc => cc.Path.EndsWith(${path.map((p) => `"${p}"`).join(", ")}),
     component: () => ${component ? "..." : "B.Text()"}
 );`;
 }
 function renderMethodSample([type, method]) {
-  return String.raw`builder.Conventions.AddMethodComponent${component ? `<${component}>` : ""}(
+  return String.raw`conventions.AddMethodComponent${component ? `<${component}>` : ""}(
     when: c => c.Type.Is<${type}>() && c.Method.Name == nameof(${type}.${method}),
     where: cc => cc.Path.EndsWith(${path.map((p) => `"${p}"`).join(", ")}),
     component: () => ${component ? "..." : "B.DataTable()"}
 );`;
 }
 function renderParameterSample([type, method, parameter]) {
-  return String.raw`builder.Conventions.AddParameterComponent${component ? `<${component}>` : ""}(
+  return String.raw`conventions.AddParameterComponent${component ? `<${component}>` : ""}(
     when: c => c.Type.Is<${type}>() && c.Method.Name == nameof(${type}.${method}) && c.Parameter.Name == "${parameter}",
     where: cc => cc.Path.EndsWith(${path.map((p) => `"${p}"`).join(", ")}),
     component: () => ${component ? "..." : "B.InputText()"}

package/dist/runtime/components/MultiSelect.d.vue.ts

@@ -0,0 +1,33 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    data: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    data: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/runtime/components/MultiSelect.vue

@@ -0,0 +1,98 @@
+<template>
+  <AwaitLoading
+    :skeleton="{
+      height: label?.mode === 'ifta' ? '3.6rem' : '2.6rem',
+      class: 'min-w-40'
+    }"
+  >
+    <Validation>
+      <Labeler
+        :label
+        :path
+      >
+        <MultiSelect
+          v-bind="$attrs"
+          v-model="selected"
+          :input-id="path"
+          :options="data"
+          :option-label="optionLabel"
+          :option-value="optionValue"
+          :placeholder
+          :show-clear
+          :filter
+          :auto-filter-focus="filter"
+          :filter-fields="[optionLabel]"
+          :show-toggle-all
+          reset-filter-on-hide
+          class="w-full"
+          :pt="{
+            hiddenInput: { placeholder: null }
+          }"
+        >
+          <template #value="{ value }">
+            <template v-if="value?.length">
+              <template v-if="value.length <= maxSelectedLabels">
+                {{ getValueLabel(value) }}
+              </template>
+              <span v-else>{{ lc("{number} items selected", { number: value.length }) }}</span>
+            </template>
+          </template>
+          <template #option="slotProps">
+            <span>
+              {{ getOptionLabel(slotProps) }}
+            </span>
+          </template>
+        </MultiSelect>
+      </Labeler>
+    </Validation>
+  </AwaitLoading>
+</template>
+
+<script setup>
+import { MultiSelect } from "primevue";
+import { useContext, useLocalization, useUiStates, useSelection } from "#imports";
+import { AwaitLoading, Labeler, Validation } from "#components";
+const context = useContext();
+const { localize: l } = useLocalization();
+const { localize: lc } = useLocalization({ group: "MultiSelect" });
+const { value: { selectStates } } = useUiStates();
+const { schema, data } = defineProps({
+  schema: { type: null, required: true },
+  data: { type: null, required: true }
+});
+const model = defineModel({ type: null, required: true });
+const {
+  maxSelectedLabels = 3,
+  showToggleAll = false,
+  filter,
+  label,
+  localizeOptionLabels,
+  optionLabel,
+  optionValue,
+  showClear,
+  stateful,
+  targetProp
+} = schema;
+const path = context.injectPath();
+const { selected } = useSelection({
+  data,
+  model,
+  path,
+  stateStore: selectStates,
+  stateful,
+  targetProp,
+  mode: "multi"
+});
+const placeholder = label?.text ? l(label.text) : null;
+function getOptionLabel(slotProps) {
+  const result = slotProps.option[optionLabel] ?? slotProps.option;
+  return localizeOptionLabels ? l(result) : result;
+}
+function getValueLabel(value) {
+  return value.map(findLabel).map((label2) => localizeOptionLabels ? l(label2) : label2).join(", ");
+}
+function findLabel(value) {
+  const option = optionValue ? data?.find((o) => o[optionValue] === value) : data?.find((o) => o === value);
+  return optionLabel ? option?.[optionLabel] : option;
+}
+</script>

package/dist/runtime/components/MultiSelect.vue.d.ts

@@ -0,0 +1,33 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    data: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    data: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/runtime/components/MultiSelectButton.d.vue.ts

@@ -0,0 +1,33 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    data: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    data: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/runtime/components/MultiSelectButton.vue

@@ -0,0 +1,74 @@
+<template>
+  <AwaitLoading
+    :skeleton="{
+      height: label.mode === 'ifta' ? '3.6rem' : '2.6rem',
+      class: 'min-w-60'
+    }"
+  >
+    <Validation>
+      <Labeler
+        :label="{
+          ...label,
+          mode: label?.mode === 'ifta' ? label.mode : null,
+          text: label?.mode === 'ifta' ? label.text : null
+        }"
+        :path
+        :dt="{
+          colorScheme: {
+            light: {
+              top: '-1rem',
+            },
+            dark: {
+              top: '-1rem'
+            }
+          }
+        }"
+      >
+        <SelectButton
+          v-if="data"
+          v-model="selected"
+          :options="data"
+          multiple
+          :allow-empty
+          :data-key="optionValue"
+          :option-label
+          :option-value
+          :pt="{ pcToggleButton: { root: { class: 'text-[length:inherit]' } } }"
+        >
+          <template #option="slotProps">
+            <span>{{ getOptionLabel(slotProps) }}</span>
+          </template>
+        </SelectButton>
+      </Labeler>
+    </Validation>
+  </AwaitLoading>
+</template>
+
+<script setup>
+import { SelectButton } from "primevue";
+import { useContext, useLocalization, useUiStates, useSelection } from "#imports";
+import { AwaitLoading, Labeler, Validation } from "#components";
+const context = useContext();
+const { localize: l } = useLocalization();
+const { value: { selectButtonStates } } = useUiStates();
+const { schema, data } = defineProps({
+  schema: { type: null, required: true },
+  data: { type: null, required: true }
+});
+const model = defineModel({ type: null, required: true });
+const { allowEmpty = false, label, localizeOptionLabels, optionLabel, optionValue, stateful, targetProp } = schema;
+const path = context.injectPath();
+const { selected } = useSelection({
+  data,
+  model,
+  path,
+  stateStore: selectButtonStates,
+  stateful,
+  targetProp,
+  mode: "multi"
+});
+function getOptionLabel(slotProps) {
+  const result = slotProps.option[optionLabel] ?? slotProps.option;
+  return localizeOptionLabels ? l(result) : result;
+}
+</script>

package/dist/runtime/components/MultiSelectButton.vue.d.ts

@@ -0,0 +1,33 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    data: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    schema: {
+        type: null;
+        required: true;
+    };
+    data: {
+        type: null;
+        required: true;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+        required: true;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;