adata-ui 0.3.57 → 0.3.60

package/src/components/TextError/TextError.vue

@@ -1,57 +1,57 @@
-<template>
-  <div class="adt-text-error">
-    <div class="adt-text-error__icon">
-      <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-        <g clip-path="url(#clip0_508_13640)">
-          <path
-              d="M8.00016 14.6666C11.6821 14.6666 14.6668 11.6818 14.6668 7.99992C14.6668 4.31802 11.6821 1.33325 8.00016 1.33325C4.31826 1.33325 1.3335 4.31802 1.3335 7.99992C1.3335 11.6818 4.31826 14.6666 8.00016 14.6666Z"
-              stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
-          <path d="M8 10.6667H8.00667" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-          <path d="M8 5.33325V7.99992" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-        </g>
-        <defs>
-          <clipPath id="clip0_508_13640">
-            <rect width="16" height="16" fill="white"/>
-          </clipPath>
-        </defs>
-      </svg>
-    </div>
-    <p class="adt-text-error__text">{{ errorText }}</p>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "TextError",
-  props: {
-    errorText: {
-      type: String,
-      default: ""
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.adt-text-error {
-  display: flex;
-  background: rgba(255, 46, 67, 0.12);
-  border-radius: 4px;
-  overflow: hidden;
-  color: #2c3e50;
-  margin-top: 8px;
-
-  &__icon {
-    background: #FF2E43;
-    padding: 4px 8px;
-    display: grid;
-    place-content: center;
-  }
-
-  &__text {
-    font-size: 12px;
-    line-height: 20px;
-    padding: 2px 16px;
-  }
-}
-</style>
+<template>
+  <div class="adt-text-error">
+    <div class="adt-text-error__icon">
+      <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <g clip-path="url(#clip0_508_13640)">
+          <path
+              d="M8.00016 14.6666C11.6821 14.6666 14.6668 11.6818 14.6668 7.99992C14.6668 4.31802 11.6821 1.33325 8.00016 1.33325C4.31826 1.33325 1.3335 4.31802 1.3335 7.99992C1.3335 11.6818 4.31826 14.6666 8.00016 14.6666Z"
+              stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
+          <path d="M8 10.6667H8.00667" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+          <path d="M8 5.33325V7.99992" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+        </g>
+        <defs>
+          <clipPath id="clip0_508_13640">
+            <rect width="16" height="16" fill="white"/>
+          </clipPath>
+        </defs>
+      </svg>
+    </div>
+    <p class="adt-text-error__text">{{ errorText }}</p>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "TextError",
+  props: {
+    errorText: {
+      type: String,
+      default: ""
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.adt-text-error {
+  display: flex;
+  background: rgba(255, 46, 67, 0.12);
+  border-radius: 4px;
+  overflow: hidden;
+  color: #2c3e50;
+  margin-top: 8px;
+
+  &__icon {
+    background: #FF2E43;
+    padding: 4px 8px;
+    display: grid;
+    place-content: center;
+  }
+
+  &__text {
+    font-size: 12px;
+    line-height: 20px;
+    padding: 2px 16px;
+  }
+}
+</style>

package/src/components/TextField/TextField.stories.js

@@ -1,17 +1,17 @@
-import ATextField from "./TextField.vue";
-
-export default {
-    title: 'TextField',
-    component: ATextField,
-    data: () => ({ value: "" }),
-    template: "<a-text-field @input='(val) => {this.value = val}' label='Example'></a-text-field>>"
-}
-
-const Template = (args, { argTypes }) => ({
-    components: { ATextField },
-    props: Object.keys(argTypes),
-    template: '<a-text-field v-bind="$props"></a-text-field>'
-})
-
-export const Clearable = Template.bind({});
-Clearable.args = {label: 'Clearable', clearable: true}
+import ATextField from "./TextField.vue";
+
+export default {
+    title: 'TextField',
+    component: ATextField,
+    data: () => ({ value: "" }),
+    template: "<a-text-field @input='(val) => {this.value = val}' label='Example'></a-text-field>>"
+}
+
+const Template = (args, { argTypes }) => ({
+    components: { ATextField },
+    props: Object.keys(argTypes),
+    template: '<a-text-field v-bind="$props"></a-text-field>'
+})
+
+export const Clearable = Template.bind({});
+Clearable.args = {label: 'Clearable', clearable: true}

package/src/components/TextField/TextField.vue

@@ -1,107 +1,107 @@
-<template>
-  <div class="adt-text-block">
-    <div :class="['adt-text-block__field', { error: !!errorText }]">
-      <input
-        :id="id"
-        ref="input"
-        :type="type"
-        :value="value"
-        :placeholder="placeholder"
-        required
-        @input="$emit('input', $event.target.value)"
-        @keyup.enter="enterPressed"
-        class="adt-text-block__input"
-        :class="{ error: !!errorText }"
-      />
-      <label :for="id" class="adt-text-block__label">
-        {{ label }}
-        <span v-if="required" class="adt-text-block__required">*</span>
-      </label>
-      <div
-        class="adt-text-block__icon desktop"
-        v-if="clearable && value && value.length > 0"
-        @click="$emit('input', '')"
-      >
-        <svg
-          width="12"
-          height="12"
-          fill="none"
-          xmlns="http://www.w3.org/2000/svg"
-          viewBox="0 0 16 16"
-          id="clearIcon"
-        >
-          <path
-            d="M2 2l12 12m0-12L2 14"
-            stroke="#2C3E50"
-            stroke-linecap="round"
-            stroke-linejoin="round"
-          ></path>
-        </svg>
-      </div>
-    </div>
-    <text-error v-if="!!errorText" :errorText="errorText" />
-  </div>
-</template>
-<script>
-import "@/assets/style.scss";
-import TextError from "@/components/TextError/TextError";
-
-export default {
-  name: "TextField",
-  components: {
-    TextError
-  },
-  props: {
-    id: {
-      type: String,
-      default: ""
-    },
-    errorText: {
-      type: String,
-      default: "",
-    },
-    label: {
-      type: String,
-      required: true,
-    },
-    type: {
-      type: String,
-      default: "text",
-    },
-    value: {
-      type: String,
-      default: "",
-    },
-    placeholder: {
-      type: String,
-      default: "",
-    },
-    clearable: {
-      type: Boolean,
-      default: false,
-    },
-    required: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  data() {
-    return {
-      showPlaceholder: false,
-    };
-  },
-  computed: {
-    inputPlaceholder() {
-      return this.showPlaceholder ? this.placeholder : "";
-    },
-  },
-  methods: {
-    enterPressed() {
-      this.$emit("enterPressed", this.value);
-    },
-    inputHandler(e) {
-      this.$emit("input", e.target.value);
-    },
-  },
-};
-</script>
+<template>
+  <div class="adt-text-block">
+    <div :class="['adt-text-block__field', { error: !!errorText }]">
+      <input
+        :id="id"
+        ref="input"
+        :type="type"
+        :value="value"
+        :placeholder="placeholder"
+        required
+        @input="$emit('input', $event.target.value)"
+        @keyup.enter="enterPressed"
+        class="adt-text-block__input"
+        :class="{ error: !!errorText }"
+      />
+      <label :for="id" class="adt-text-block__label">
+        {{ label }}
+        <span v-if="required" class="adt-text-block__required">*</span>
+      </label>
+      <div
+        class="adt-text-block__icon desktop"
+        v-if="clearable && value && value.length > 0"
+        @click="$emit('input', '')"
+      >
+        <svg
+          width="12"
+          height="12"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 16 16"
+          id="clearIcon"
+        >
+          <path
+            d="M2 2l12 12m0-12L2 14"
+            stroke="#2C3E50"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          ></path>
+        </svg>
+      </div>
+    </div>
+    <text-error v-if="!!errorText" :errorText="errorText" />
+  </div>
+</template>
+<script>
+import "@/assets/style.scss";
+import TextError from "@/components/TextError/TextError";
+
+export default {
+  name: "TextField",
+  components: {
+    TextError
+  },
+  props: {
+    id: {
+      type: String,
+      default: ""
+    },
+    errorText: {
+      type: String,
+      default: "",
+    },
+    label: {
+      type: String,
+      required: true,
+    },
+    type: {
+      type: String,
+      default: "text",
+    },
+    value: {
+      type: String,
+      default: "",
+    },
+    placeholder: {
+      type: String,
+      default: "",
+    },
+    clearable: {
+      type: Boolean,
+      default: false,
+    },
+    required: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      showPlaceholder: false,
+    };
+  },
+  computed: {
+    inputPlaceholder() {
+      return this.showPlaceholder ? this.placeholder : "";
+    },
+  },
+  methods: {
+    enterPressed() {
+      this.$emit("enterPressed", this.value);
+    },
+    inputHandler(e) {
+      this.$emit("input", e.target.value);
+    },
+  },
+};
+</script>

package/src/components/index.js

@@ -1,54 +1,54 @@
-import Vue from "vue";
-import ACheckbox from "./Checkbox/ACheckbox";
-import ACheckboxMenu from "./CheckboxMenu/CheckboxMenu";
-import AButton from "./Button/AButton";
-import ATextField from "./TextField/TextField";
-import ATextArea from "./TextArea/TextArea";
-import APasswordField from "./PasswordField/PasswordField";
-import AAlert from "./Alert/Alert";
-import AHeader from "./Header/Header";
-import AFooter from "./Footer/Footer";
-import AFooterNew from "./newComponents/FooterNew/FooterNew";
-import ASearchTextField from "./SearchTextField/SearchTextField";
-import AMailTo from "./MailTo/MailTo";
-import ATable from "./Table/ATable";
-import ALoader from "./Loader/Loader";
-import ABottomNavigationBar from "./BottomNavigationBar/ABottomNavigationBar";
-import ANavIcon from "./NavIcon/ANavIcon";
-import AServiceSlider from "./ServiceSlider/AServiceSlider";
-// import ABadGateway from "./ErrorPages/BadGateway";
-// import AForbidden from "./ErrorPages/Forbidden";
-// import AInternalServerError from "./ErrorPages/InternalServerError";
-// import ANotFound from "./ErrorPages/NotFound";
-// import AUnavailable from "./ErrorPages/Unavailable";
-
-const Components = {
-  ACheckbox,
-  AButton,
-  ATextField,
-  ATextArea,
-  APasswordField,
-  AAlert,
-  AHeader,
-  AFooter,
-  AFooterNew,
-  ASearchTextField,
-  AMailTo,
-  ATable,
-  ALoader,
-  ACheckboxMenu,
-  ABottomNavigationBar,
-  ANavIcon,
-  AServiceSlider
-  // ABadGateway,
-  // AForbidden,
-  // AInternalServerError,
-  // ANotFound,
-  // AUnavailable,
-};
-
-Object.keys(Components).forEach((name) => {
-  Vue.component(name, Components[name]);
-});
-
-export default Components;
+import Vue from "vue";
+import ACheckbox from "./Checkbox/ACheckbox";
+import ACheckboxMenu from "./CheckboxMenu/CheckboxMenu";
+import AButton from "./Button/AButton";
+import ATextField from "./TextField/TextField";
+import ATextArea from "./TextArea/TextArea";
+import APasswordField from "./PasswordField/PasswordField";
+import AAlert from "./Alert/Alert";
+import AHeader from "./Header/Header";
+import AFooter from "./Footer/Footer";
+import AFooterNew from "./newComponents/FooterNew/FooterNew";
+import ASearchTextField from "./SearchTextField/SearchTextField";
+import AMailTo from "./MailTo/MailTo";
+import ATable from "./Table/ATable";
+import ALoader from "./Loader/Loader";
+import ABottomNavigationBar from "./BottomNavigationBar/ABottomNavigationBar";
+import ANavIcon from "./NavIcon/ANavIcon";
+import AServiceSlider from "./ServiceSlider/AServiceSlider";
+// import ABadGateway from "./ErrorPages/BadGateway";
+// import AForbidden from "./ErrorPages/Forbidden";
+// import AInternalServerError from "./ErrorPages/InternalServerError";
+// import ANotFound from "./ErrorPages/NotFound";
+// import AUnavailable from "./ErrorPages/Unavailable";
+
+const Components = {
+  ACheckbox,
+  AButton,
+  ATextField,
+  ATextArea,
+  APasswordField,
+  AAlert,
+  AHeader,
+  AFooter,
+  AFooterNew,
+  ASearchTextField,
+  AMailTo,
+  ATable,
+  ALoader,
+  ACheckboxMenu,
+  ABottomNavigationBar,
+  ANavIcon,
+  AServiceSlider
+  // ABadGateway,
+  // AForbidden,
+  // AInternalServerError,
+  // ANotFound,
+  // AUnavailable,
+};
+
+Object.keys(Components).forEach((name) => {
+  Vue.component(name, Components[name]);
+});
+
+export default Components;