@sveltia/ui 0.30.3 → 0.31.1

package/dist/components/text-editor/constants.js

@@ -17,6 +17,11 @@ export const AVAILABLE_BUTTONS = {
     icon: 'format_italic',
     inline: true,
   },
+  strikethrough: {
+    labelKey: 'strikethrough',
+    icon: 'strikethrough_s',
+    inline: true,
+  },
   code: {
     labelKey: 'code',
     icon: 'code',
@@ -87,7 +92,7 @@ export const AVAILABLE_BUTTONS = {
 /**
  * @type {TextEditorFormatType[]}
  */
-export const TEXT_FORMAT_BUTTON_TYPES = ['bold', 'italic', 'code'];
+export const TEXT_FORMAT_BUTTON_TYPES = ['bold', 'italic', 'strikethrough', 'code'];
 
 /**
  * @type {TextEditorInlineType[]}

package/dist/components/text-editor/core.js

@@ -89,10 +89,11 @@ const editorConfig = {
   theme: {
     text: {
       /**
-       * Enable bold+italic styling.
+       * Enable bold+italic and strikethrough styling.
        * @see https://github.com/facebook/lexical/discussions/4381
        */
       italic: 'italic',
+      strikethrough: 'strikethrough',
     },
     list: {
       nested: {

package/dist/components/text-editor/lexical-root.svelte

@@ -162,6 +162,9 @@
 .lexical-root :global(strong.italic) {
   font-style: italic;
 }
+.lexical-root :global(.strikethrough) {
+  text-decoration: line-through;
+}
 .lexical-root :global(li.nested) {
   list-style-type: none;
 }

package/dist/components/text-editor/toolbar/toolbar-wrapper.svelte

@@ -42,7 +42,7 @@
   top: 0;
   z-index: 1;
   display: flex;
-  gap: 8px;
+  gap: 4px;
   border-width: 1px 1px 0;
   border-style: solid;
   border-color: var(--sui-textbox-border-color);
@@ -50,7 +50,8 @@
   border-start-end-radius: var(--sui-textbox-border-radius);
   border-end-start-radius: 0;
   border-end-end-radius: 0;
-  padding: 8px;
+  padding: 0 4px;
+  height: 40px;
   background-color: var(--sui-tertiary-background-color);
 }
 @media (width < 768px) {

package/dist/locales/en.d.ts

@@ -54,6 +54,7 @@ export namespace strings {
         export let code_block: string;
         export let bold: string;
         export let italic: string;
+        export let strikethrough: string;
         export let code: string;
         export let link: string;
         export let insert_link: string;

package/dist/locales/en.js

@@ -53,6 +53,7 @@ export const strings = {
     code_block: 'Code Block',
     bold: 'Bold',
     italic: 'Italic',
+    strikethrough: 'Strikethrough',
     code: 'Code',
     link: 'Link',
     insert_link: 'Insert Link',

package/dist/locales/ja.d.ts

@@ -54,6 +54,7 @@ export namespace strings {
         export let code_block: string;
         export let bold: string;
         export let italic: string;
+        export let strikethrough: string;
         export let code: string;
         export let link: string;
         export let insert_link: string;

package/dist/locales/ja.js

@@ -53,6 +53,7 @@ export const strings = {
     code_block: 'コードブロック',
     bold: '太字',
     italic: '斜体',
+    strikethrough: '取り消し線',
     code: 'コード',
     link: 'リンク',
     insert_link: 'リンクを挿入',

package/dist/typedefs.d.ts

@@ -587,7 +587,7 @@ export type InputEventHandlers = {
 export type PopupPosition = ("top-left" | "top-right" | "right-top" | "right-bottom" | "bottom-left" | "bottom-right" | "left-top" | "left-bottom");
 export type ToastPosition = "auto" | "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
 export type TextEditorBlockType = "paragraph" | "heading-1" | "heading-2" | "heading-3" | "heading-4" | "heading-5" | "heading-6" | "bulleted-list" | "numbered-list" | "blockquote" | "code-block";
-export type TextEditorFormatType = "bold" | "italic" | "code";
+export type TextEditorFormatType = "bold" | "italic" | "strikethrough" | "code";
 export type TextEditorInlineType = TextEditorFormatType | "link";
 export type TextEditorMode = "rich-text" | "plain-text";
 export type TextEditorComponent = {

package/dist/typedefs.js

@@ -237,7 +237,7 @@
  */
 
 /**
- * @typedef {'bold' | 'italic' | 'code'} TextEditorFormatType
+ * @typedef {'bold' | 'italic' | 'strikethrough' | 'code'} TextEditorFormatType
  */
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sveltia/ui",
-  "version": "0.30.3",
+  "version": "0.31.1",
   "license": "MIT",
   "type": "module",
   "repository": {