@burh/nuxt-core 1.0.291 → 1.0.292

package/components/argon-core/BaseDropdown.vue

@@ -1,114 +1,114 @@
-<template>
-	<component
-		:is="tag"
-		:class="[{ show: isOpen }, `drop${direction}`]"
-		@click="toggleDropDown"
-		v-click-outside="closeDropDown"
-	>
-		<slot name="title-container" :is-open="isOpen">
-			<component
-				:is="titleTag"
-				class="btn-rotate"
-				:class="[{'dropdown-toggle': hasToggle}, titleClasses]"
-				:aria-expanded="isOpen"
-				data-toggle="dropdown"
-			>
-				<slot name="title" :is-open="isOpen">
-					<i :class="icon"></i> {{ title }}
-				</slot>
-			</component>
-		</slot>
-		<ul
-			class="dropdown-menu"
-			:class="[
-				{ show: isOpen },
-				{ 'dropdown-menu-right': menuOnRight },
-				menuClasses
-			]"
-		>
-			<slot></slot>
-		</ul>
-	</component>
-</template>
-<script>
-export default {
-	name: 'base-dropdown',
-	props: {
-		tag: {
-			type: String,
-			default: 'div',
-			description: 'Dropdown html tag (e.g div, ul etc)'
-		},
-		titleTag: {
-			type: String,
-			default: 'button',
-			description: 'Dropdown title (toggle) html tag'
-		},
-		title: {
-			type: String,
-			description: 'Dropdown title'
-		},
-		direction: {
-			type: String,
-			default: 'down', // up | down
-			description: 'Dropdown menu direction (up|down)'
-		},
-		icon: {
-			type: String,
-			description: 'Dropdown icon'
-		},
-		titleClasses: {
-			type: [String, Object, Array],
-			description: 'Title css classes'
-		},
-		menuClasses: {
-			type: [String, Object],
-			description: 'Menu css classes'
-		},
-		menuOnRight: {
-			type: Boolean,
-			description: 'Whether menu should appear on the right'
-		},
-		hasToggle: {
-			type: Boolean,
-			description: 'Whether dropdown has arrow icon shown',
-			default: true
-		},
-		isDropdownOpen: {
-			type: Boolean,
-			default: false
-		}
-	},
-	data() {
-		return {
-			isOpen: false
-		};
-	},
-	watch: {
-		isOpen() {
-			if (this.isOpen === false) {
-				this.$emit('close');
-			}
-		},
-		isDropdownOpen() {
-			this.isOpen = this.isDropdownOpen;
-		}
-	},
-	methods: {
-		toggleDropDown() {
-			this.isOpen = !this.isOpen;
-			this.$emit('change', this.isOpen);
-		},
-		closeDropDown() {
-			this.isOpen = false;
-			this.$emit('change', false);
-		}
-	}
-};
-</script>
-<style lang="scss" scoped>
-.dropdown {
-  cursor: pointer;
-  user-select: none;
-}
-</style>
+<template>
+	<component
+		:is="tag"
+		:class="[{ show: isOpen }, `drop${direction}`]"
+		@click="toggleDropDown"
+		v-click-outside="closeDropDown"
+	>
+		<slot name="title-container" :is-open="isOpen">
+			<component
+				:is="titleTag"
+				class="btn-rotate"
+				:class="[{'dropdown-toggle': hasToggle}, titleClasses]"
+				:aria-expanded="isOpen"
+				data-toggle="dropdown"
+			>
+				<slot name="title" :is-open="isOpen">
+					<i :class="icon"></i> {{ title }}
+				</slot>
+			</component>
+		</slot>
+		<ul
+			class="dropdown-menu"
+			:class="[
+				{ show: isOpen },
+				{ 'dropdown-menu-right': menuOnRight },
+				menuClasses
+			]"
+		>
+			<slot></slot>
+		</ul>
+	</component>
+</template>
+<script>
+export default {
+	name: 'base-dropdown',
+	props: {
+		tag: {
+			type: String,
+			default: 'div',
+			description: 'Dropdown html tag (e.g div, ul etc)'
+		},
+		titleTag: {
+			type: String,
+			default: 'button',
+			description: 'Dropdown title (toggle) html tag'
+		},
+		title: {
+			type: String,
+			description: 'Dropdown title'
+		},
+		direction: {
+			type: String,
+			default: 'down', // up | down
+			description: 'Dropdown menu direction (up|down)'
+		},
+		icon: {
+			type: String,
+			description: 'Dropdown icon'
+		},
+		titleClasses: {
+			type: [String, Object, Array],
+			description: 'Title css classes'
+		},
+		menuClasses: {
+			type: [String, Object],
+			description: 'Menu css classes'
+		},
+		menuOnRight: {
+			type: Boolean,
+			description: 'Whether menu should appear on the right'
+		},
+		hasToggle: {
+			type: Boolean,
+			description: 'Whether dropdown has arrow icon shown',
+			default: true
+		},
+		isDropdownOpen: {
+			type: Boolean,
+			default: false
+		}
+	},
+	data() {
+		return {
+			isOpen: false
+		};
+	},
+	watch: {
+		isOpen() {
+			if (this.isOpen === false) {
+				this.$emit('close');
+			}
+		},
+		isDropdownOpen() {
+			this.isOpen = this.isDropdownOpen;
+		}
+	},
+	methods: {
+		toggleDropDown() {
+			this.isOpen = !this.isOpen;
+			this.$emit('change', this.isOpen);
+		},
+		closeDropDown() {
+			this.isOpen = false;
+			this.$emit('change', false);
+		}
+	}
+};
+</script>
+<style lang="scss" scoped>
+.dropdown {
+  cursor: pointer;
+  user-select: none;
+}
+</style>

package/components/argon-core/BaseProgress.vue

@@ -1,121 +1,121 @@
-<template>
-  <div class="wrapper">
-    <div :class="`progress-${type}`" v-if="showLabel">
-      <div class="progress-label">
-        <slot name="label">
-          <span>{{label}}</span>
-        </slot>
-      </div>
-      <div class="progress-percentage">
-        <slot>
-          <span>{{value}}%</span>
-        </slot>
-      </div>
-    </div>
-    <div class="progress"
-         :class="[{[`progress-${size}`]: size}, progressClasses]"
-         :style="`height: ${height}px;`">
-      <div class="progress-bar"
-           :class="computedClasses"
-           role="progressbar"
-           :aria-valuenow="value"
-           aria-valuemin="0"
-           aria-valuemax="100"
-           :style="`width: ${value}%;`">
-      </div>
-      <!-- <span v-if="star" :style="`left:${star}%;`" class="star-progress bg-secondary"><font-awesome-icon :icon="['fas', 'star']"/></span> -->
-    </div>
-  </div>
-</template>
-<script>
-  export default {
-    name: "base-progress",
-    props: {
-      star: {
-        type: Boolean,
-        default: false
-      },
-      striped: {
-        type: Boolean,
-        description: "Whether progress is striped"
-      },
-      animated: {
-        type: Boolean,
-        description:
-          "Whether progress is animated (works only with `striped` prop together)"
-      },
-      label: {
-        type: String,
-        description: "Progress label (shown on the left above progress)"
-      },
-      height: {
-        type: Number,
-        default: 3,
-        description: "Progress line height"
-      },
-      type: {
-        type: String,
-        default: "default",
-        description: "Progress type (e.g danger, primary etc)"
-      },
-      showLabel: {
-        type: Boolean,
-        default: false
-      },
-      progressClasses: {
-        type: [Array, String],
-        default: '',
-        description: 'Progress css classes'
-      },
-      size: {
-        type: String,
-        default: ''
-      },
-      value: {
-        type: Number,
-        default: 0,
-        validator: value => {
-          return value >= 0 && value <= 100;
-        },
-        description: "Progress value"
-      }
-    },
-    computed: {
-      computedClasses() {
-        return [
-          { "progress-bar-striped": this.striped },
-          { "progress-bar-animated": this.animated },
-          { [`bg-${this.type}`]: this.type }
-        ];
-      }
-    }
-  };
-</script>
-<style>
-.progress-bar::after {
-  font-family: "Font Awesome 5 Free";
-  font-weight: 900;
-  line-height: 29px;
-  content:'\f005';
-  width:30px;
-  height:30px;
-  border-radius: 100%;
-  background: #FDDF00 !important;
-  color: #fff;
-  align-self: flex-end;
-  position: absolute;
-  margin-left: 10px;
-}
-.progress-bar {
-  background: linear-gradient(to left, #8965e0, #4460F4);
-}
-.star-progress {
-  height: 25px;
-  width: 25px;
-  border-radius: 1000px;
-  text-align: center;
-  color: #fff;
-  line-height: 24px;
-  position: absolute;
-}
-</style>
+<template>
+  <div class="wrapper">
+    <div :class="`progress-${type}`" v-if="showLabel">
+      <div class="progress-label">
+        <slot name="label">
+          <span>{{label}}</span>
+        </slot>
+      </div>
+      <div class="progress-percentage">
+        <slot>
+          <span>{{value}}%</span>
+        </slot>
+      </div>
+    </div>
+    <div class="progress"
+         :class="[{[`progress-${size}`]: size}, progressClasses]"
+         :style="`height: ${height}px;`">
+      <div class="progress-bar"
+           :class="computedClasses"
+           role="progressbar"
+           :aria-valuenow="value"
+           aria-valuemin="0"
+           aria-valuemax="100"
+           :style="`width: ${value}%;`">
+      </div>
+      <!-- <span v-if="star" :style="`left:${star}%;`" class="star-progress bg-secondary"><font-awesome-icon :icon="['fas', 'star']"/></span> -->
+    </div>
+  </div>
+</template>
+<script>
+  export default {
+    name: "base-progress",
+    props: {
+      star: {
+        type: Boolean,
+        default: false
+      },
+      striped: {
+        type: Boolean,
+        description: "Whether progress is striped"
+      },
+      animated: {
+        type: Boolean,
+        description:
+          "Whether progress is animated (works only with `striped` prop together)"
+      },
+      label: {
+        type: String,
+        description: "Progress label (shown on the left above progress)"
+      },
+      height: {
+        type: Number,
+        default: 3,
+        description: "Progress line height"
+      },
+      type: {
+        type: String,
+        default: "default",
+        description: "Progress type (e.g danger, primary etc)"
+      },
+      showLabel: {
+        type: Boolean,
+        default: false
+      },
+      progressClasses: {
+        type: [Array, String],
+        default: '',
+        description: 'Progress css classes'
+      },
+      size: {
+        type: String,
+        default: ''
+      },
+      value: {
+        type: Number,
+        default: 0,
+        validator: value => {
+          return value >= 0 && value <= 100;
+        },
+        description: "Progress value"
+      }
+    },
+    computed: {
+      computedClasses() {
+        return [
+          { "progress-bar-striped": this.striped },
+          { "progress-bar-animated": this.animated },
+          { [`bg-${this.type}`]: this.type }
+        ];
+      }
+    }
+  };
+</script>
+<style>
+.progress-bar::after {
+  font-family: "Font Awesome 5 Free";
+  font-weight: 900;
+  line-height: 29px;
+  content:'\f005';
+  width:30px;
+  height:30px;
+  border-radius: 100%;
+  background: #FDDF00 !important;
+  color: #fff;
+  align-self: flex-end;
+  position: absolute;
+  margin-left: 10px;
+}
+.progress-bar {
+  background: linear-gradient(to left, #8965e0, #4460F4);
+}
+.star-progress {
+  height: 25px;
+  width: 25px;
+  border-radius: 1000px;
+  text-align: center;
+  color: #fff;
+  line-height: 24px;
+  position: absolute;
+}
+</style>