@xleddyl/443-components-vue 0.8.2 → 0.8.3

package/dist/locale/de.mjs

@@ -40,7 +40,10 @@ export const de = {
       maxItems: "W\xE4hle h\xF6chstens {count} Eintrag | W\xE4hle h\xF6chstens {count} Eintr\xE4ge",
       pattern: "Ung\xFCltiges Format",
       invalid: "Ung\xFCltiger Wert",
-      requiredHint: "(erforderlich)"
+      requiredHint: "(erforderlich)",
+      optional: "Optional",
+      characterCount: "{count} von {max} Zeichen",
+      characterLimitReached: "Zeichenlimit erreicht"
     },
     editor: {
       bold: "Fett",
@@ -59,6 +62,13 @@ export const de = {
       linkUrl: "Link-URL",
       applyLink: "\xDCbernehmen",
       removeLink: "Link entfernen",
+      linkType: "Linktyp",
+      linkTypeUrl: "Webadresse",
+      linkTypeEmail: "E-Mail",
+      linkTypePhone: "Telefon",
+      linkEmail: "E-Mail-Adresse",
+      linkPhone: "Telefonnummer",
+      linkText: "Linktext",
       characters: "{count} Zeichen | {count} Zeichen",
       limit: "{count} von {max} Zeichen",
       limitReached: "Zeichenlimit erreicht"

package/dist/locale/en.mjs

@@ -40,7 +40,10 @@ export const en = {
       maxItems: "Select at most {count} item | Select at most {count} items",
       pattern: "Invalid format",
       invalid: "Invalid value",
-      requiredHint: "(required)"
+      requiredHint: "(required)",
+      optional: "Optional",
+      characterCount: "{count} of {max} characters",
+      characterLimitReached: "Character limit reached"
     },
     editor: {
       bold: "Bold",
@@ -59,6 +62,13 @@ export const en = {
       linkUrl: "Link URL",
       applyLink: "Apply",
       removeLink: "Remove link",
+      linkType: "Link type",
+      linkTypeUrl: "Web address",
+      linkTypeEmail: "Email",
+      linkTypePhone: "Phone",
+      linkEmail: "Email address",
+      linkPhone: "Phone number",
+      linkText: "Link text",
       characters: "{count} character | {count} characters",
       limit: "{count} of {max} characters",
       limitReached: "Character limit reached"

package/dist/locale/it.mjs

@@ -40,7 +40,10 @@ export const it = {
       maxItems: "Seleziona al massimo {count} elemento | Seleziona al massimo {count} elementi",
       pattern: "Formato non valido",
       invalid: "Valore non valido",
-      requiredHint: "(obbligatorio)"
+      requiredHint: "(obbligatorio)",
+      optional: "Facoltativo",
+      characterCount: "{count} di {max} caratteri",
+      characterLimitReached: "Limite di caratteri raggiunto"
     },
     editor: {
       bold: "Grassetto",
@@ -59,6 +62,13 @@ export const it = {
       linkUrl: "URL del link",
       applyLink: "Applica",
       removeLink: "Rimuovi link",
+      linkType: "Tipo di link",
+      linkTypeUrl: "Indirizzo web",
+      linkTypeEmail: "Email",
+      linkTypePhone: "Telefono",
+      linkEmail: "Indirizzo email",
+      linkPhone: "Numero di telefono",
+      linkText: "Testo del link",
       characters: "{count} carattere | {count} caratteri",
       limit: "{count} di {max} caratteri",
       limitReached: "Limite di caratteri raggiunto"

package/dist/locale/types.d.ts

@@ -39,6 +39,9 @@ export interface KMessages {
         pattern: string;
         invalid: string;
         requiredHint: string;
+        optional: string;
+        characterCount: string;
+        characterLimitReached: string;
     };
     editor: {
         bold: string;
@@ -57,6 +60,13 @@ export interface KMessages {
         linkUrl: string;
         applyLink: string;
         removeLink: string;
+        linkType: string;
+        linkTypeUrl: string;
+        linkTypeEmail: string;
+        linkTypePhone: string;
+        linkEmail: string;
+        linkPhone: string;
+        linkText: string;
         characters: string;
         limit: string;
         limitReached: string;

package/dist/styles/core/form-field.css

@@ -37,6 +37,12 @@
    color: var(--k-danger-text);
 }
 
+.k-form-field-optional {
+   font-size: 0.75rem;
+   font-weight: var(--k-font-weight, 400);
+   color: var(--k-text-muted);
+}
+
 .k-form-field-hint {
    margin-left: auto;
    font-size: 0.75rem;

package/dist/styles/core/input.css

@@ -134,3 +134,32 @@
 .k-input.has-trail .k-field {
    padding-right: 2.125rem;
 }
+
+.k-field-counter {
+   font-size: 0.75rem;
+   line-height: 1;
+   color: var(--k-text-muted);
+   white-space: nowrap;
+   pointer-events: none;
+}
+
+.k-field-counter.is-over {
+   color: var(--k-danger-text);
+}
+
+.k-input > .k-field-counter {
+   position: absolute;
+   right: 0.6875rem;
+}
+
+.k-input.has-trail > .k-field-counter {
+   right: 2.125rem;
+}
+
+.k-input.has-counter .k-field {
+   padding-right: calc(var(--k-input-counter-chars) * 0.5rem + 1rem);
+}
+
+.k-input.has-counter.has-trail .k-field {
+   padding-right: calc(var(--k-input-counter-chars) * 0.5rem + 2.5rem);
+}

package/dist/styles/core/textarea.css

@@ -37,3 +37,13 @@
 .k-textarea-box.has-trail .k-textarea {
    padding-right: 2.125rem;
 }
+
+.k-textarea-box > .k-field-counter {
+   position: absolute;
+   right: 1.25rem;
+   bottom: 0.5rem;
+}
+
+.k-textarea-box.has-counter .k-textarea {
+   padding-bottom: 1.5rem;
+}

package/dist/styles/forms/choice.css

@@ -25,6 +25,12 @@
    gap: 0.5rem 1.25rem;
 }
 
+.k-choice-group.has-columns > .k-choice-group-items {
+   display: grid;
+   grid-template-columns: repeat(var(--k-choice-columns), minmax(0, 1fr));
+   gap: 0.625rem 1.25rem;
+}
+
 .k-radio-group-card > .k-choice-group-items {
    gap: 0.5rem;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xleddyl/443-components-vue",
-  "version": "0.8.2",
+  "version": "0.8.3",
   "description": "Compact, scoped dashboard components for Vue and Nuxt",
   "license": "MIT",
   "author": "Edoardo Alberti (https://github.com/xleddyl)",