@onereach/ui-components-vue2 21.3.0 → 21.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -22,12 +22,12 @@ import '@onereach/styles/tailwind.config.json';
22
22
  import '../../constants-2e3ea701.js';
23
23
  import '../or-icon-v3/index.js';
24
24
  import '../or-tooltip-v3/index.js';
25
+ import '../../style-inject.es-87955792.js';
25
26
  import '@floating-ui/dom';
26
27
  import '../or-bottom-sheet-v3/index.js';
27
28
  import '../or-overlay-v3/index.js';
28
29
  import '../or-teleport-v3/index.js';
29
30
  import 'portal-vue';
30
- import '../../style-inject.es-87955792.js';
31
31
  import '../or-tag-v3/index.js';
32
32
  import '../or-button-v3/index.js';
33
33
  import '../../props-bba3dca8.js';
@@ -1,5 +1,5 @@
1
1
  import { defineComponent, ref, computed, inject, toRef, watch, reactive } from 'vue-demi';
2
- import { a as re } from '../../useValidationAttributes-BpeWsfb0-24439d6f.js';
2
+ import { n as ne, a as re } from '../../useValidationAttributes-BpeWsfb0-24439d6f.js';
3
3
  import { OrIconV3 as OrIcon } from '../or-icon-v3/index.js';
4
4
  import { n as normalizeComponent } from '../../normalize-component-cf2db48b.js';
5
5
  import '../../dom-qGGG2YCX-4d4cca6e.js';
@@ -22,7 +22,7 @@ const RatingVariants = {
22
22
  'layout-row'],
23
23
  [RatingVariant.Fitted]: [
24
24
  // Layout
25
- 'layout-row justify-between']
25
+ 'layout-row md:justify-between']
26
26
  };
27
27
  const RatingStar = [
28
28
  // Layout
@@ -30,11 +30,14 @@ const RatingStar = [
30
30
  // Interactivity
31
31
  'interactivity-click',
32
32
  // Box
33
- 'w-[28px] md:w-[24px]', 'h-[28px] md:h-[24px]',
33
+ 'w-[32px] md:w-[24px]', 'h-[32px] md:h-[24px]',
34
34
  // Theme (activated)
35
35
  'activated:text-warning-hover', 'dark:activated:text-warning-hover-dark',
36
36
  // Theme (disabled)
37
37
  'disabled:text-disabled', 'dark:disabled:text-disabled-dark'];
38
+ const RatingStarMobile = [
39
+ // Typography;
40
+ 'text-[32px]'];
38
41
 
39
42
  const RATING_LENGTH = Symbol();
40
43
  var script = defineComponent({
@@ -69,8 +72,11 @@ var script = defineComponent({
69
72
  setup(props, context) {
70
73
  // Refs & Styles
71
74
  const root = ref();
75
+ const {
76
+ isMobile
77
+ } = ne();
72
78
  const rootStyles = computed(() => ['or-rating-v3', ...Rating, ...RatingVariants[props.variant]]);
73
- const starStyles = computed(() => [...RatingStar, ...(props.readonly ? ['interactivity-none'] : [])]);
79
+ const starStyles = computed(() => [...RatingStar, ...(props.readonly ? ['interactivity-none'] : []), ...(isMobile.value ? RatingStarMobile : [])]);
74
80
  // Options
75
81
  const length = inject(RATING_LENGTH, 5);
76
82
  // State
@@ -84,6 +90,17 @@ var script = defineComponent({
84
90
  immediate: true
85
91
  });
86
92
  const hoverIndex = reactive(Array(length).fill(false));
93
+ const starSize = computed(() => {
94
+ return index => {
95
+ if (props.variant === 'fitted' || isMobile.value) {
96
+ return 'inherit';
97
+ }
98
+ if (hoverIndex[index]) {
99
+ return 'xl';
100
+ }
101
+ return 'l';
102
+ };
103
+ });
87
104
  // Handlers
88
105
  function onMouseEnter(event, index) {
89
106
  hoverIndex[index] = true;
@@ -103,8 +120,10 @@ var script = defineComponent({
103
120
  root,
104
121
  rootStyles,
105
122
  starStyles,
123
+ starSize,
106
124
  model,
107
125
  draft,
126
+ isMobile,
108
127
  hoverIndex,
109
128
  onMouseEnter,
110
129
  onMouseMove,
@@ -156,7 +175,7 @@ var __vue_render__ = function () {
156
175
  attrs: {
157
176
  "icon": _vm.draft - value + 1 === 0.5 ? 'star_half' : 'star',
158
177
  "variant": value <= _vm.draft ? 'filled' : 'outlined',
159
- "size": _vm.variant === 'fitted' ? 'inherit' : _vm.hoverIndex[value - 1] ? 'xl' : 'l'
178
+ "size": _vm.starSize(value - 1)
160
179
  }
161
180
  })], 1);
162
181
  }), 0);
@@ -2,3 +2,4 @@ import { RatingVariant } from './types';
2
2
  export declare const Rating: string[];
3
3
  export declare const RatingVariants: Record<RatingVariant, string[]>;
4
4
  export declare const RatingStar: string[];
5
+ export declare const RatingStarMobile: string[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@onereach/ui-components-vue2",
3
- "version": "21.3.0",
3
+ "version": "21.3.2",
4
4
  "description": "Vue components library for v2",
5
5
  "license": "Apache-2.0",
6
6
  "sideEffects": false,
@@ -40,8 +40,8 @@
40
40
  "@codemirror/view": "^6",
41
41
  "@floating-ui/dom": "1.5.3",
42
42
  "@lezer/highlight": "*",
43
- "@onereach/styles": "^21.3.0",
44
- "@onereach/ui-components-common": "^21.3.0",
43
+ "@onereach/styles": "^21.3.2",
44
+ "@onereach/ui-components-common": "^21.3.2",
45
45
  "@splidejs/splide": "4.0.6",
46
46
  "@tiptap/core": "2.0.3",
47
47
  "@tiptap/extension-blockquote": "2.0.3",
@@ -105,5 +105,5 @@
105
105
  "access": "public"
106
106
  },
107
107
  "npmUnpacked": "4.15.2",
108
- "gitHead": "0562fbf641d1e41aa2243922423a78e07b11fc4e"
108
+ "gitHead": "fa5876d40691fa509d8575963492da0c2cce65d0"
109
109
  }