@onereach/ui-components 2.74.13-beta.2362.0 → 2.74.13-beta.2365.0

package/src/components/or-notification-v3/OrNotification.stories3.ts

@@ -24,10 +24,6 @@ export default {
       control: { type: 'select' },
       options: Object.values(NotificationVariant),
     },
-
-    disableClose: {
-      control: { type: 'boolean' },
-    },
   },
 
   parameters: {
@@ -72,51 +68,3 @@ Notification.args = {
   // Slots
   default: '<a href="#">Lorem ipsum</a> dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
 };
-
-export const WithoutCloseButton = Template.bind({});
-
-WithoutCloseButton.args = {
-  disableClose: true,
-  // Slots
-  default: '<a href="#">Lorem ipsum</a> dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
-};
-
-export const WithShadowOverride: StoryFn<typeof OrNotification> = (args) => ({
-  components: {
-    OrNotification,
-  },
-
-  setup() {
-    return {
-      args,
-      handleClose: action('close'),
-    };
-  },
-
-  template: `
-    <div class="flex flex-col gap-3xl w-full">
-      <OrNotification
-        v-bind="args"
-        @close="handleClose"
-      >
-       Default shadow
-      </OrNotification>
-      <OrNotification
-        v-bind="args"
-        @close="handleClose"
-        class="shadow-none"
-      >
-       Without shadow
-      </OrNotification>
-      <OrNotification
-        v-bind="args"
-        @close="handleClose"
-        class="shadow-modal"
-      >
-        Shadow like in modal
-      </OrNotification>
-    </div>
-  `,
-});
-
-WithShadowOverride.args = {};

package/src/components/or-notification-v3/OrNotification.vue

@@ -15,7 +15,6 @@
     </div>
 
     <OrIconButton
-      v-if="!disableClose"
       :icon="'close'"
       :size="'m'"
       @click.stop="$emit('close')"
@@ -43,11 +42,6 @@ export default defineComponent({
       type: String as PropType<NotificationVariant>,
       default: NotificationVariant.Info,
     },
-
-    disableClose: {
-      type: Boolean,
-      default: false,
-    },
   },
 
   expose: [

package/src/components/or-select-v3/OrSelect.stories3.ts

@@ -104,6 +104,10 @@ export default {
       control: { type: 'boolean' },
     },
 
+    disableDefaultStyles: {
+      control: { type: 'boolean' },
+    },
+
     enableSearch: {
       control: { type: 'boolean' },
     },

package/src/components/or-select-v3/OrSelect.vue

@@ -25,7 +25,7 @@
       :class="[popoverState === 'open' && 'rounded-b-0']"
       :variant="disableDefaultStyles ? 'unstyled' : 'styled'"
       :size="size"
-      :invalid="invalid"
+      :invalid="!!error"
       :readonly="readonly"
       :disabled="disabled"
     >
@@ -202,7 +202,7 @@
       </OrPopover>
     </OrInputBox>
 
-    <template v-if="!invalid">
+    <template v-if="!error">
       <template v-if="hint">
         <OrHint :disabled="disabled">
           {{ hint }}
@@ -210,7 +210,7 @@
       </template>
     </template>
 
-    <template v-else>
+    <template v-if="typeof error === 'string'">
       <OrError :disabled="disabled">
         {{ error }}
       </OrError>
@@ -306,7 +306,7 @@ export default defineComponent({
     },
 
     error: {
-      type: String,
+      type: [String, Boolean],
       default: undefined,
     },
 
@@ -416,7 +416,6 @@ export default defineComponent({
       }
     });
 
-    const invalid = computed(() => !!props.error);
     const readonly = computed(() => context.attrs.readonly as boolean);
 
     const selection = computed(() => {
@@ -519,7 +518,6 @@ export default defineComponent({
       noSearchResultsStyles,
       controlId,
       proxyModelValue,
-      invalid,
       readonly,
       selection,
       searchText,

package/src/components/or-select-v3/styles.ts

@@ -8,7 +8,10 @@ export const SelectRoot: string[] = [
 
 export const SelectControl: string[] = [
   // Layout
-  'layout-row grow',
+  'layout-row',
+
+  // Box
+  'w-full',
 
   // Overflow
   'overflow-hidden',

package/src/components/or-textarea-v3/OrTextarea.vue

@@ -20,7 +20,7 @@
 
     <OrInputBox
       :size="size"
-      :invalid="invalid"
+      :invalid="!!error"
       :readonly="readonly"
       :disabled="disabled"
     >
@@ -40,7 +40,7 @@
       />
     </OrInputBox>
 
-    <template v-if="!invalid">
+    <template v-if="!error">
       <template v-if="hint || maxLength">
         <OrHint :disabled="disabled">
           {{ hint }}
@@ -55,7 +55,7 @@
       </template>
     </template>
 
-    <template v-else>
+    <template v-if="typeof error === 'string'">
       <OrError :disabled="disabled">
         {{ error }}
 
@@ -122,7 +122,7 @@ export default defineComponent({
     },
 
     error: {
-      type: String,
+      type: [String, Boolean],
       default: undefined,
     },
 
@@ -191,8 +191,6 @@ export default defineComponent({
     const currentLength = computed(() => proxyModelValue.value?.toString().length ?? 0);
     const maxLength = computed(() => controlAttributes.maxlength);
 
-    const invalid = computed(() => !!props.error);
-
     // Methods
     function focus(): void {
       control.value?.focus();
@@ -211,7 +209,6 @@ export default defineComponent({
       proxyModelValue,
       currentLength,
       maxLength,
-      invalid,
       focus,
       blur,
     };

package/src/components/or-textarea-v3/styles.ts

@@ -7,8 +7,8 @@ export const TextareaRoot: string[] = [
 ];
 
 export const TextareaControl: string[] = [
-  // Layout
-  'grow',
+  // Box
+  'w-full',
 
   // Typography
   'typography-inherit',