@onereach/ui-components 4.1.1-beta.2536.0 → 4.1.1-beta.2537.0

package/dist/bundled/v2/components/OrFormGroupV3/OrFormGroup.js

@@ -91,23 +91,15 @@ var __vue_render__ = function () {
     }, [_vm._v("\n        " + _vm._s(_vm.label) + "\n\n        ")]) : _vm._e()];
   })], 2), _vm._v(" "), _c('div', {
     class: _vm.contentStyles
-  }, [_vm._t("default")], 2), _vm._v(" "), _vm.hint ? [_c('OrHint', {
+  }, [_vm._t("default")], 2), _vm._v(" "), _vm.hint && !_vm.error ? [_c('OrHint', {
     attrs: {
       "disabled": _vm.disabled
     }
-  }, [_vm._v("\n      " + _vm._s(_vm.hint) + "\n    ")])] : _vm._e(), _vm._v(" "), _c('div', {
-    directives: [{
-      name: "show",
-      rawName: "v-show",
-      value: typeof _vm.error === 'string',
-      expression: "typeof error === 'string'"
-    }],
-    class: ['contents']
-  }, [_c('OrError', {
+  }, [_vm._v("\n      " + _vm._s(_vm.hint) + "\n    ")])] : _vm._e(), _vm._v(" "), typeof _vm.error === 'string' ? [_c('OrError', {
     attrs: {
       "disabled": _vm.disabled
     }
-  }, [_vm._v("\n      " + _vm._s(_vm.error) + "\n    ")])], 1)], 2);
+  }, [_vm._v("\n      " + _vm._s(_vm.error) + "\n    ")])] : _vm._e()], 2);
 };
 var __vue_staticRenderFns__ = [];
 

package/dist/bundled/v3/components/OrFormGroupV3/OrFormGroup.js

@@ -7,7 +7,7 @@ import '../OrHintV3/OrHint.js';
 import { s as script$1 } from '../../OrLabel.vue_vue_type_script_lang-3e11ab8a.js';
 import { s as script$2 } from '../../OrError.vue_vue_type_script_lang-df7b5e32.js';
 import { s as script$3 } from '../../OrHint.vue_vue_type_script_lang-0f5e8377.js';
-import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, createBlock, withCtx, createTextVNode, toDisplayString, createCommentVNode, withDirectives, createVNode, vShow } from 'vue';
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, createBlock, withCtx, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
 import '../OrLabelV3/props.js';
 import '../OrLabelV3/styles.js';
 import '../OrErrorV3/styles.js';
@@ -67,9 +67,6 @@ var script = defineComponent({
 const _hoisted_1 = {
   class: "flex flex-row"
 };
-const _hoisted_2 = {
-  class: /*#__PURE__*/normalizeClass(['contents'])
-};
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_OrLabel = resolveComponent("OrLabel");
   const _component_OrHint = resolveComponent("OrHint");
@@ -89,20 +86,21 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3 /* FORWARDED */
   }, 8 /* PROPS */, ["required", "disabled"])) : createCommentVNode("v-if", true)])]), createElementVNode("div", {
     class: normalizeClass(_ctx.contentStyles)
-  }, [renderSlot(_ctx.$slots, "default")], 2 /* CLASS */), _ctx.hint ? (openBlock(), createBlock(_component_OrHint, {
+  }, [renderSlot(_ctx.$slots, "default")], 2 /* CLASS */), _ctx.hint && !_ctx.error ? (openBlock(), createBlock(_component_OrHint, {
     key: 0,
     disabled: _ctx.disabled
   }, {
     default: withCtx(() => [createTextVNode(toDisplayString(_ctx.hint), 1 /* TEXT */)]),
 
     _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["disabled"])) : createCommentVNode("v-if", true), withDirectives(createElementVNode("div", _hoisted_2, [createVNode(_component_OrError, {
+  }, 8 /* PROPS */, ["disabled"])) : createCommentVNode("v-if", true), typeof _ctx.error === 'string' ? (openBlock(), createBlock(_component_OrError, {
+    key: 1,
     disabled: _ctx.disabled
   }, {
     default: withCtx(() => [createTextVNode(toDisplayString(_ctx.error), 1 /* TEXT */)]),
 
     _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["disabled"])], 512 /* NEED_PATCH */), [[vShow, typeof _ctx.error === 'string']])], 2 /* CLASS */);
+  }, 8 /* PROPS */, ["disabled"])) : createCommentVNode("v-if", true)], 2 /* CLASS */);
 }
 
 script.render = render;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onereach/ui-components",
-  "version": "4.1.1-beta.2536.0",
+  "version": "4.1.1-beta.2537.0",
   "description": "Vue components library for v2/3",
   "sideEffects": false,
   "main": "./dist/auto/index.js",

package/src/components/or-form-group-v3/OrFormGroup.stories3.ts

@@ -3,6 +3,7 @@ import { ref } from 'vue-demi';
 import { Meta, StoryFn } from '@storybook/vue3';
 import { OrRadioV3 as OrRadio } from '../or-radio-v3';
 import { OrCheckboxV3 as OrCheckbox } from '../or-checkbox-v3';
+import { OrSwitchV3 as OrSwitch } from '../or-switch-v3';
 import { Direction } from './props';
 export default {
   title: 'Components/Forms/Group',
@@ -31,7 +32,7 @@ const RadioTemplate: StoryFn<typeof OrFormGroup> = (args) => ({
     OrRadio,
   },
   setup() {
-    const modelValue = ref(false);
+    const modelValue = ref('');
     return {
       args,
       modelValue,
@@ -82,3 +83,32 @@ CheckboxGroup.args = {
   label: 'Checkbox Group',
   hint: 'This is a hint',
 };
+
+const SwitchTemplate: StoryFn<typeof OrFormGroup> = (args) => ({
+  components: {
+    OrFormGroup,
+    OrSwitch,
+  },
+  setup() {
+    const modelValue = ref([]);
+    return {
+      args,
+      modelValue,
+    };
+  },
+  template: `
+    <OrFormGroup
+      v-bind="args"
+    >
+      <OrSwitch :label="'Option 1'" value="1" v-model="modelValue"/>
+      <OrSwitch :label="'Option 2'" value="3" v-model="modelValue"/>
+      <OrSwitch :label="'Option 3'" value="4" v-model="modelValue"/>
+    </OrFormGroup>
+    `,
+});
+
+export const SwitchGroup = SwitchTemplate.bind({});
+SwitchGroup.args = {
+  label: 'Switch Group',
+  hint: 'This is a hint',
+};

package/src/components/or-form-group-v3/OrFormGroup.vue

@@ -24,19 +24,20 @@
     >
       <slot />
     </div>
-    <template v-if="hint">
+
+    <template v-if="hint && !error">
       <OrHint :disabled="disabled">
         {{ hint }}
       </OrHint>
     </template>
-    <div
-      v-show="typeof error === 'string'"
-      :class="['contents']"
+
+    <template
+      v-if="typeof error === 'string'"
     >
       <OrError :disabled="disabled">
         {{ error }}
       </OrError>
-    </div>
+    </template>
   </div>
 </template>