@zipify/wysiwyg 4.12.0 → 4.13.0-beta.0

package/dist/types/components/toolbar/controls/LetterSpacingControl.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/types/enums/TextSetting.d.ts

@@ -7,6 +7,7 @@ export declare enum TextSetting {
     FONT_STYLE = "font_style",
     FONT_WEIGHT = "font_weight",
     LINE_HEIGHT = "line_height",
+    LETTER_SPACING = "letter_spacing",
     TEXT_DECORATION = "text_decoration",
     SUPERSCRIPT = "superscript",
     MARGIN = "margin",

package/dist/types/extensions/LetterSpacing.d.ts

@@ -0,0 +1,2 @@
+export const LetterSpacing: Mark<any, any>;
+import { Mark } from '@tiptap/vue-3';

package/dist/types/utils/convertEmToPx.d.ts

@@ -0,0 +1 @@
+export declare function convertEmToPx(value: string, wrapperEl: HTMLElement): number;

package/dist/types/utils/convertLetterSpacing.d.ts

@@ -0,0 +1 @@
+export declare function convertLetterSpacing(value: string, wrapperEl: HTMLElement): number;

package/dist/types/utils/index.d.ts

@@ -5,6 +5,7 @@ export { createKeyboardShortcut } from './createKeyboardShortcut';
 export { convertColor } from './convertColor';
 export { convertLineHeight } from './convertLineHeight';
 export { convertFontSize } from './convertFontSize';
+export { convertLetterSpacing } from './convertLetterSpacing';
 export { convertAlignment } from './convertAlignment';
 export { importIcon } from './importIcon';
 export { isWysiwygContent } from './isWysiwygContent';

package/dist/wysiwyg.css

@@ -249,7 +249,7 @@
     --zw-range-thumb-box-shadow: 0 0 0 12px rgba(240, 240, 240, 0.15);
 }
 
-.zw-number-field[data-v-e462abc1] {
+.zw-number-field[data-v-962cf185] {
     --border-color: rgb(var(--zw-color-n60));
     --text-color: rgb(var(--zw-color-n85));
     --buttons-color: rgb(var(--zw-color-n70));
@@ -259,16 +259,16 @@
     align-items: stretch;
     display: flex;
 }
-.zw-number-field[data-v-e462abc1]:hover {
+.zw-number-field[data-v-962cf185]:hover {
     --border-color: rgb(var(--zw-color-n80));
     --text-color: rgb(var(--zw-color-n85));
 }
-.zw-number-field[data-v-e462abc1]:focus,
-.zw-number-field[data-v-e462abc1]:focus-within {
+.zw-number-field[data-v-962cf185]:focus,
+.zw-number-field[data-v-962cf185]:focus-within {
     --border-color: rgb(var(--zw-color-white));
     --text-color: rgb(var(--zw-color-white));
 }
-.zw-number-field__input[data-v-e462abc1] {
+.zw-number-field__input[data-v-962cf185] {
     color: var(--text-color);
     background-color: rgb(var(--zw-color-n15));
     border: 0;
@@ -279,69 +279,69 @@
     font-size: var(--zw-font-size-xs);
     -moz-appearance: textfield;
 }
-.zw-number-field__buttons[data-v-e462abc1] {
+.zw-number-field__buttons[data-v-962cf185] {
     display: none;
     flex-direction: column;
     height: 100%;
 }
-.zw-number-field:hover .zw-number-field__buttons[data-v-e462abc1],
-.zw-number-field:focus .zw-number-field__buttons[data-v-e462abc1],
-.zw-number-field:focus-within .zw-number-field__buttons[data-v-e462abc1] {
+.zw-number-field:hover .zw-number-field__buttons[data-v-962cf185],
+.zw-number-field:focus .zw-number-field__buttons[data-v-962cf185],
+.zw-number-field:focus-within .zw-number-field__buttons[data-v-962cf185] {
     display: flex;
 }
-.zw-number-field__input[data-v-e462abc1]::placeholder {
+.zw-number-field__input[data-v-962cf185]::placeholder {
     color: var(--text-color);
 }
-.zw-number-field__input[data-v-e462abc1]::-webkit-outer-spin-button,
-.zw-number-field__input[data-v-e462abc1]::-webkit-inner-spin-button {
+.zw-number-field__input[data-v-962cf185]::-webkit-outer-spin-button,
+.zw-number-field__input[data-v-962cf185]::-webkit-inner-spin-button {
     color: var(--text-color);
     -webkit-appearance: none;
 }
-.zw-number-field__controls[data-v-e462abc1] {
+.zw-number-field__controls[data-v-962cf185] {
     min-width: var(--zw-offset-sm);
 }
-.zw-number-field--disabled[data-v-e462abc1] {
+.zw-number-field--disabled[data-v-962cf185] {
     opacity: 0.5;
 }
-.zw-number-field--disabled[data-v-e462abc1],
-.zw-number-field--disabled .zw-number-field__input[data-v-e462abc1] {
+.zw-number-field--disabled[data-v-962cf185],
+.zw-number-field--disabled .zw-number-field__input[data-v-962cf185] {
     cursor: not-allowed;
 }
-.zw-number-field__increment-button[data-v-e462abc1],
-.zw-number-field__decrement-button[data-v-e462abc1] {
+.zw-number-field__increment-button[data-v-962cf185],
+.zw-number-field__decrement-button[data-v-962cf185] {
     width: 100%;
     height: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
 }
-.zw-number-field__increment-button[data-v-e462abc1]::after,
-.zw-number-field__decrement-button[data-v-e462abc1]::after {
+.zw-number-field__increment-button[data-v-962cf185]::after,
+.zw-number-field__decrement-button[data-v-962cf185]::after {
     content: "";
     border-left: 3px solid transparent;
     border-right: 3px solid transparent;
 }
-.zw-number-field__increment-button[data-v-e462abc1]::after {
+.zw-number-field__increment-button[data-v-962cf185]::after {
     border-bottom: 3px solid var(--buttons-color);
 }
-.zw-number-field__decrement-button[data-v-e462abc1]::after {
+.zw-number-field__decrement-button[data-v-962cf185]::after {
     border-top: 3px solid var(--buttons-color);
 }
-.zw-number-field__increment-button[data-v-e462abc1]:hover,
-.zw-number-field__decrement-button[data-v-e462abc1]:hover {
+.zw-number-field__increment-button[data-v-962cf185]:hover,
+.zw-number-field__decrement-button[data-v-962cf185]:hover {
     background-color: rgb(var(--zw-color-n20));
     --buttons-color: rgb(var(--zw-color-white));
 }
-.zw-number-field__units[data-v-e462abc1] {
+.zw-number-field__units[data-v-962cf185] {
     color: rgb(var(--zw-color-n70));
     font-size: var(--zw-font-size-xs);
-    line-height: var(--zw-line-height-md);
     text-align: center;
     display: inline-block;
     width: 100%;
+    vertical-align: middle;
 }
-.zw-number-field:hover .zw-number-field__units[data-v-e462abc1],
-.zw-number-field:focus .zw-number-field__units[data-v-e462abc1] {
+.zw-number-field:hover .zw-number-field__units[data-v-962cf185],
+.zw-number-field:has(:focus, :active) .zw-number-field__units[data-v-962cf185] {
     display: none;
 }
 
@@ -577,6 +577,21 @@
     margin-left: var(--zw-offset-sm);
 }
 
+.zw-letter-spacing-control__modal[data-v-62d3e8b2] {
+    padding: var(--zw-offset-sm);
+}
+.zw-letter-spacing-control__row[data-v-62d3e8b2] {
+    display: flex;
+    align-items: center;
+}
+.zw-letter-spacing-control__range[data-v-62d3e8b2] {
+    width: 156px;
+}
+.zw-letter-spacing-control__field[data-v-62d3e8b2] {
+    width: 64px;
+    margin-left: var(--zw-offset-sm);
+}
+
 .zpa-list-control[data-v-55962f5e] {
     display: flex;
 }
@@ -821,6 +836,7 @@ h4.zw-style.zw-style.zw-style {
         font-size: var(--zw-font-size-desktop, var(--zw-preset-font-size-desktop));
         text-align: var(--zw-alignment-desktop, var(--zw-preset-alignment-desktop));
         line-height: var(--zw-line-height-desktop, var(--zw-preset-line-height-desktop));
+        letter-spacing: var(--zw-letter-spacing-desktop, var(--zw-preset-letter-spacing-desktop));
 }
 }
 @media (min-width: 769px) and (max-width: 1199.98px) {
@@ -828,6 +844,7 @@ h4.zw-style.zw-style.zw-style {
         font-size: var(--zw-font-size-tablet, var(--zw-preset-font-size-tablet));
         text-align: var(--zw-alignment-tablet, var(--zw-preset-alignment-tablet));
         line-height: var(--zw-line-height-tablet, var(--zw-preset-line-height-tablet));
+        letter-spacing: var(--zw-letter-spacing-tablet, var(--zw-preset-letter-spacing-tablet));
 }
 }
 @media (max-width: 768.98px) {
@@ -835,6 +852,7 @@ h4.zw-style.zw-style.zw-style {
         font-size: var(--zw-font-size-mobile, var(--zw-preset-font-size-mobile));
         text-align: var(--zw-alignment-mobile, var(--zw-preset-alignment-mobile));
         line-height: var(--zw-line-height-mobile, var(--zw-preset-line-height-mobile));
+        letter-spacing: var(--zw-letter-spacing-mobile, var(--zw-preset-letter-spacing-mobile));
 }
 }