@nexxtmove/ui 1.22.0 → 1.24.0

package/dist/components/editor/molecules/EditorColor/EditorColor.vue.d.ts

@@ -0,0 +1,80 @@
+/**
+ * The CSS property the chosen colour is written to. It is the prefix of the
+ * Tailwind class the model carries, so it decides whether the colour becomes a
+ * background or a text colour. `border` is deliberately not offered: a border
+ * is colour plus width, and that pair gets a component of its own.
+ */
+export type EditorColorProperty = 'bg' | 'text';
+/**
+ * The colour as the editor needs it: a Tailwind arbitrary-value class such as
+ * `'bg-[#1777EA]'`, so the consumer can put the model value straight on the
+ * element it styles.
+ */
+export type EditorColorValue = `${EditorColorProperty}-[#${string}]`;
+/** Overridable copy of the picker. Every key is optional. */
+export interface EditorColorMessages {
+    /** Text shown while no colour is set. Defaults to `'Kies kleur...'`. */
+    placeholder?: string;
+}
+export interface NexxtEditorColorProps {
+    /**
+     * Header text of the settings block. Defaults to the Dutch `'Kleur'`; the
+     * library has no i18n layer, so a consumer in another language passes its
+     * own copy in.
+     */
+    label?: string;
+    /**
+     * Render a switch next to the label that collapses and expands the picker.
+     * The switch state is the `enabled` model; the colour itself is kept while
+     * the block is collapsed.
+     */
+    switchable?: boolean;
+    /**
+     * The prefix of the class that is written: `'bg'` for a background colour,
+     * `'text'` for a text colour. Changing it rewrites the current value, so the
+     * model never disagrees with this prop.
+     */
+    property?: EditorColorProperty;
+    /**
+     * Copy of the picker. Merged per key, so overriding one key keeps the
+     * defaults of the others. Copy is never translated inside the component.
+     */
+    messages?: EditorColorMessages;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import('vue').DefineComponent<NexxtEditorColorProps & {
+    /**
+     * The chosen colour, as the Tailwind class to apply.
+     *
+     * Beware: Tailwind only generates an arbitrary class for text it finds in the
+     * source at build time. A value that arrives at runtime -- from a database,
+     * say -- therefore gets no CSS of its own; the consumer either translates it
+     * into an inline style or safelists the classes it can produce. The hex is
+     * always parseable out of the string, which is what makes that translation
+     * possible.
+     */
+    modelValue: EditorColorValue;
+    /** Open state of the block. Only has an effect when `switchable` is `true`. */
+    enabled?: boolean;
+}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: `text-[#${string}]` | `bg-[#${string}]`) => any;
+    "update:enabled": (value: boolean) => any;
+}, string, import('vue').PublicProps, Readonly<NexxtEditorColorProps & {
+    /**
+     * The chosen colour, as the Tailwind class to apply.
+     *
+     * Beware: Tailwind only generates an arbitrary class for text it finds in the
+     * source at build time. A value that arrives at runtime -- from a database,
+     * say -- therefore gets no CSS of its own; the consumer either translates it
+     * into an inline style or safelists the classes it can produce. The hex is
+     * always parseable out of the string, which is what makes that translation
+     * possible.
+     */
+    modelValue: EditorColorValue;
+    /** Open state of the block. Only has an effect when `switchable` is `true`. */
+    enabled?: boolean;
+}> & Readonly<{
+    "onUpdate:modelValue"?: ((value: `text-[#${string}]` | `bg-[#${string}]`) => any) | undefined;
+    "onUpdate:enabled"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/editor/molecules/EditorHeadingType/EditorHeadingType.vue.d.ts

@@ -66,10 +66,10 @@ declare const __VLS_export: import('vue').DefineComponent<NexxtEditorHeadingType
     /** The selected heading, as the Tailwind font-size class to apply. */
     modelValue: EditorHeadingTypeValue;
 }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (value: "text-lg" | "text-base" | "text-xl" | "text-2xl" | "text-4xl" | "text-3xl") => any;
+    "update:modelValue": (value: "text-4xl" | "text-3xl" | "text-2xl" | "text-xl" | "text-lg" | "text-base") => any;
 }, string, import('vue').PublicProps, Readonly<NexxtEditorHeadingTypeProps & {
     /** The selected heading, as the Tailwind font-size class to apply. */
     modelValue: EditorHeadingTypeValue;
 }> & Readonly<{
-    "onUpdate:modelValue"?: ((value: "text-lg" | "text-base" | "text-xl" | "text-2xl" | "text-4xl" | "text-3xl") => any) | undefined;
+    "onUpdate:modelValue"?: ((value: "text-4xl" | "text-3xl" | "text-2xl" | "text-xl" | "text-lg" | "text-base") => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/editor/molecules/EditorTextAlign/EditorTextAlign.vue.d.ts

@@ -0,0 +1,44 @@
+/**
+ * The text alignment as the editor needs it: the Tailwind class itself, so the
+ * consumer can put the model value straight on the element it styles.
+ */
+export type EditorTextAlignValue = 'text-left' | 'text-center' | 'text-right' | 'text-justify';
+/** Overridable copy for the four options. Every key is optional. */
+export interface EditorTextAlignMessages {
+    /** Accessible name of the `text-left` option. Defaults to `'Links'`. */
+    left?: string;
+    /** Accessible name of the `text-center` option. Defaults to `'Midden'`. */
+    center?: string;
+    /** Accessible name of the `text-right` option. Defaults to `'Rechts'`. */
+    right?: string;
+    /** Accessible name of the `text-justify` option. Defaults to `'Uitvullen'`. */
+    justify?: string;
+}
+export interface NexxtEditorTextAlignProps {
+    /**
+     * Header text of the settings block. Defaults to the Dutch
+     * `'Tekst uitlijning'`; the library has no i18n layer, so a consumer in
+     * another language passes its own copy in.
+     */
+    label?: string;
+    /**
+     * Copy of the four options. The options are icon-only and show no tooltip, so
+     * this copy is purely the accessible name of each button. Defaults are Dutch
+     * and are merged per key, so overriding one keeps the defaults of the others.
+     * Copy is never translated inside the component.
+     */
+    messages?: EditorTextAlignMessages;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import('vue').DefineComponent<NexxtEditorTextAlignProps & {
+    /** The selected text alignment, as the Tailwind class to apply. */
+    modelValue: EditorTextAlignValue;
+}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: EditorTextAlignValue) => any;
+}, string, import('vue').PublicProps, Readonly<NexxtEditorTextAlignProps & {
+    /** The selected text alignment, as the Tailwind class to apply. */
+    modelValue: EditorTextAlignValue;
+}> & Readonly<{
+    "onUpdate:modelValue"?: ((value: EditorTextAlignValue) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/organisms/ColorPicker/ColorPicker.vue.d.ts

@@ -20,11 +20,11 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_PublicProps, {},
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {
-    placeholder: string;
-    fullWidth: boolean;
     matchWidth: boolean;
+    placeholder: string;
     showAlpha: boolean;
     formats: ColorFormat[];
+    fullWidth: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/index.d.ts

@@ -8,7 +8,10 @@ export type { NexxtTabItem } from './components/molecules/Tabs/Tabs.vue';
 export type { EditorAlignItemsMessages, EditorAlignItemsValue, } from './components/editor/molecules/EditorAlignItems/EditorAlignItems.vue';
 export type { EditorFlexDirectionMessages, EditorFlexDirectionValue, } from './components/editor/molecules/EditorFlexDirection/EditorFlexDirection.vue';
 export type { EditorGapMessages, EditorGapValue, } from './components/editor/molecules/EditorGap/EditorGap.vue';
+export type { EditorColorMessages, EditorColorProperty, EditorColorValue, } from './components/editor/molecules/EditorColor/EditorColor.vue';
+export type { EditorHeadingTypeMessages, EditorHeadingTypeValue, } from './components/editor/molecules/EditorHeadingType/EditorHeadingType.vue';
 export type { EditorRadiusMessages, EditorRadiusValue, } from './components/editor/molecules/EditorRadius/EditorRadius.vue';
+export type { EditorTextAlignMessages, EditorTextAlignValue, } from './components/editor/molecules/EditorTextAlign/EditorTextAlign.vue';
 export type { EditorJustifyContentMessages, EditorJustifyContentValue, } from './components/editor/molecules/EditorJustifyContent/EditorJustifyContent.vue';
 export type { EditorPaddingMessages } from './components/editor/molecules/EditorPadding/EditorPadding.vue';
 export type { NexxtTemplateCardContentFeature, NexxtTemplateCardProps, NexxtTemplateCardSlots, } from './components/molecules/TemplateCard/TemplateCard.vue';
@@ -30,6 +33,7 @@ export { default as NexxtDatePicker } from './components/organisms/DatePicker/Da
 export { default as NexxtDoughnutChart } from './components/molecules/DoughnutChart/DoughnutChart.vue';
 export { default as NexxtDropdownButton } from './components/organisms/DropdownButton/DropdownButton.vue';
 export { default as NexxtEditorAlignItems } from './components/editor/molecules/EditorAlignItems/EditorAlignItems.vue';
+export { default as NexxtEditorColor } from './components/editor/molecules/EditorColor/EditorColor.vue';
 export { default as NexxtEditorFlexDirection } from './components/editor/molecules/EditorFlexDirection/EditorFlexDirection.vue';
 export { default as NexxtEditorGap } from './components/editor/molecules/EditorGap/EditorGap.vue';
 export { default as NexxtEditorHeadingType } from './components/editor/molecules/EditorHeadingType/EditorHeadingType.vue';
@@ -37,6 +41,7 @@ export { default as NexxtEditorJustifyContent } from './components/editor/molecu
 export { default as NexxtEditorPadding } from './components/editor/molecules/EditorPadding/EditorPadding.vue';
 export { default as NexxtEditorRadius } from './components/editor/molecules/EditorRadius/EditorRadius.vue';
 export { default as NexxtEditorSettingsBlock } from './components/editor/atoms/EditorSettingsBlock/EditorSettingsBlock.vue';
+export { default as NexxtEditorTextAlign } from './components/editor/molecules/EditorTextAlign/EditorTextAlign.vue';
 export { default as NexxtEnergyLabel } from './components/atoms/EnergyLabel/EnergyLabel.vue';
 export { default as NexxtFloatingPanel } from './components/atoms/FloatingPanel/FloatingPanel.vue';
 export { default as NexxtHeader } from './components/organisms/Header/Header.vue';