mediacube-ui 0.1.378 → 0.1.379

package/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.1.379](https://github.com/MediaCubeCo/mcui/compare/v0.1.378...v0.1.379) (2025-05-14)
+
 ### [0.1.378](https://github.com/MediaCubeCo/mcui/compare/v0.1.377...v0.1.378) (2025-05-08)
 
 ### [0.1.377](https://github.com/MediaCubeCo/mcui/compare/v0.1.376...v0.1.377) (2025-05-08)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mediacube-ui",
-  "version": "0.1.378",
+  "version": "0.1.379",
   "description": "Design system for Mediacube services",
   "author": "Mediacube",
   "private": false,

package/src/elements/McDatePicker/McDatePicker.vue

@@ -816,17 +816,27 @@ export default {
             display: flex;
             justify-content: space-between;
             align-items: center;
-            @include child-indent-right($space-200);
-            > * {
-                @include child-indent-right($space-300);
+            flex-direction: column;
+            row-gap: $space-150;
+            @media #{$media-query-m} {
+                flex-direction: row;
+                @include child-indent-right($space-200);
+                > * {
+                    @include child-indent-right($space-300);
+                }
             }
             &-periods {
-                @include child-indent-right(0);
-                column-gap: $space-300;
                 row-gap: $space-100;
                 align-items: center;
                 display: flex;
                 flex-wrap: wrap;
+                width: 100%;
+                justify-content: space-between;
+                @media #{$media-query-m} {
+                    width: auto;
+                    column-gap: $space-300;
+                    @include child-indent-right($space-zero);
+                }
             }
             .mc-button {
                 @include child-indent-right($space-zero);

package/src/elements/McField/McFieldText/McFieldText.vue

@@ -496,7 +496,7 @@ export default {
 
         inputAttrs() {
             return {
-                class: 'mc-field-text__input',
+                class: this.inputClasses,
                 style: this.inputStyles,
                 placeholder: this.placeholder,
                 value: this.computedValue,
@@ -507,6 +507,16 @@ export default {
                 tabindex: this.tabindex,
             }
         },
+        inputClasses() {
+            return {
+              'mc-field-text__input': true,
+              'mc-field-text__input--text-normalized': this.isPhoneType && this.isRtl,
+            }
+        },
+        
+        isPhoneType() {
+          return this.type === 'phone_number'
+        },
 
         isPasswordType() {
             return this.prettyType === 'password'
@@ -892,6 +902,10 @@ export default {
         @include input-placeholder() {
             color: $color-gray;
         }
+        &--text-normalized {
+            text-align: right;
+            unicode-bidi: plaintext;
+        }
     }
 
     &__footer {

package/src/patterns/McTable/McTable/McTable.vue

@@ -635,7 +635,7 @@ export default {
         display: flex;
         align-items: center;
         justify-content: center;
-        height: $size-700;
+        height: $size-500;
         background-color: $color-white;
         color: $color-outline-gray;
         @include child-indent-right($space-100);

package/src/styles/toast.scss

@@ -34,7 +34,10 @@
             margin-inline-end: $space-50;
           }
           &:first-of-type {
-            margin-inline-start: $space-600;
+            margin-inline-start: auto;
+            @media #{$media-query-s} {
+              margin-inline-start: $space-600;
+            }
           }
           &:last-child {
             margin-inline-end: -$space-300; // TODO: refactor negative margin