@onereach/ui-components 2.75.1-beta.2383.0 → 2.75.1-beta.2385.0

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

@@ -6,7 +6,7 @@ export const ModalRoot: string[] = [
 
   // Box
   'w-full',
-  'h-full md:h-auto md:max-h-[min(calc(100%-(2*theme(spacing.3xl))),772px)]',
+  'h-full',
 
   // Shape
   'md:rounded-md',
@@ -36,16 +36,19 @@ export const ModalRootSizes: Record<ModalSize, string[]> = {
   'l': [
     // Box
     'md:w-[1050px]',
+    'md:h-auto',
   ],
 
   'm': [
     // Box
     'md:w-[700px]',
+    'md:h-auto',
   ],
 
   's': [
     // Box
     'md:w-[480px]',
+    'md:h-auto',
   ],
 };
 

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',