vueless 0.0.3 → 0.0.5

package/{ui.button → src/ui.button}/index.vue

@@ -16,10 +16,9 @@
 </template>
 
 <script setup>
-import UIService from "vueless/service.ui";
-import { getRandomId } from "vueless/service.ui";
+import UIService, { getRandomId } from "../service.ui";
 
-import ULoader from "vueless/ui.other-loader";
+import ULoader from "../ui.other-loader";
 
 import defaultConfig from "./configs/default.config";
 import { UButton } from "./constants";
@@ -85,7 +84,7 @@ const props = defineProps({
    */
   block: {
     type: Boolean,
-    default: UIService.get(defaultConfig, UButton).default.square,
+    default: UIService.get(defaultConfig, UButton).default.block,
   },
 
   /**

package/{ui.button-toggle → src/ui.button-link}/Docs.mdx

@@ -1,5 +1,5 @@
 import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/blocks";
-import { getSource } from "vueless/service.storybook";
+import { getSource } from "../service.storybook";
 
 import * as stories from "./index.stories";
 import defaultConfig from "./configs/default.config?raw"

package/{ui.button-link → src/ui.button-link}/composables/attrs.composable.js

@@ -1,7 +1,7 @@
 import { computed, useSlots } from "vue";
 
-import useUI from "vueless/composable.ui";
-import { cva, cx } from "vueless/service.ui";
+import useUI from "../../composable.ui";
+import { cva, cx } from "../../service.ui";
 
 import defaultConfig from "../configs/default.config";
 

package/{ui.button-link → src/ui.button-link}/configs/default.config.js

@@ -66,9 +66,9 @@ export default /*tw*/ {
     type: "link",
     size: "md",
     underlined: undefined,
-    dashed: false,
-    inline: false,
+    block: false,
     noRing: false,
+    dashed: false,
     disabled: false,
     targetBlank: false,
   },

package/{ui.button-link → src/ui.button-link}/index.stories.js

@@ -1,8 +1,8 @@
-import { getArgTypes, getSlotNames } from "vueless/service.storybook";
+import { getArgTypes, getSlotNames } from "../service.storybook";
 
-import ULink from "vueless/ui.button-link";
-import UButton from "vueless/ui.button";
-import URow from "vueless/ui.container-row";
+import ULink from "../ui.button-link";
+import UButton from "../ui.button";
+import URow from "../ui.container-row";
 export default {
   id: "1060",
   title: "Buttons & Links / Link",

package/{ui.button-link → src/ui.button-link}/index.vue

@@ -50,12 +50,12 @@
 
 <script setup>
 import { computed, useSlots } from "vue";
-import UIService from "vueless/service.ui";
+import UIService from "../service.ui";
 
 import { useAttrs } from "./composables/attrs.composable";
 import defaultConfig from "./configs/default.config";
 import { ULink } from "./constants";
-import { UButton } from "vueless/ui.button/constants/index.js";
+import { UButton } from "../ui.button/constants";
 
 /* Should be a string for correct web-types gen */
 defineOptions({ name: "ULink", inheritAttrs: false });
@@ -151,7 +151,7 @@ const props = defineProps({
    */
   block: {
     type: Boolean,
-    default: UIService.get(defaultConfig, UButton).default.square,
+    default: UIService.get(defaultConfig, UButton).default.block,
   },
 
   /**

package/{ui.button-link → src/ui.button-toggle}/Docs.mdx

@@ -1,5 +1,5 @@
 import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/blocks";
-import { getSource } from "vueless/service.storybook";
+import { getSource } from "../service.storybook";
 
 import * as stories from "./index.stories";
 import defaultConfig from "./configs/default.config?raw"

package/{ui.button-toggle → src/ui.button-toggle}/composables/attrs.composable.js

@@ -1,4 +1,4 @@
-import useUI from "vueless/composable.ui";
+import useUI from "../../composable.ui";
 
 import defaultConfig from "../configs/default.config";
 

package/{ui.button-toggle → src/ui.button-toggle}/index.stories.js

@@ -1,9 +1,9 @@
-import { getArgTypes, getSlotNames } from "vueless/service.storybook";
+import { getArgTypes, getSlotNames } from "../service.storybook";
 
-import UToggle from "vueless/ui.button-toggle";
-import UIcon from "vueless/ui.image-icon";
-import UToggleItem from "vueless/ui.button-toggle-item";
-import URow from "vueless/ui.container-row";
+import UToggle from "../ui.button-toggle";
+import UIcon from "../ui.image-icon";
+import UToggleItem from "../ui.button-toggle-item";
+import URow from "../ui.container-row";
 
 export default {
   title: "Buttons & Links / Toggle",

package/{ui.button-toggle → src/ui.button-toggle}/index.vue

@@ -17,12 +17,12 @@
 <script setup>
 import { computed, provide, readonly, ref } from "vue";
 
-import UIService from "vueless/service.ui";
+import UIService from "../service.ui";
 
 import defaultConfig from "./configs/default.config";
 import { UToggle, TYPE_RADIO, TYPE_CHECKBOX } from "./constants";
 import { useAttrs } from "./composables/attrs.composable";
-import { UButton } from "vueless/ui.button/constants/index.js";
+import { UButton } from "../ui.button/constants";
 
 /* Should be a string for correct web-types gen */
 defineOptions({ name: "UToggle", inheritAttrs: false });

package/{ui.button → src/ui.button-toggle-item}/Docs.mdx

@@ -1,5 +1,5 @@
 import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/blocks";
-import { getSource } from "vueless/service.storybook";
+import { getSource } from "../service.storybook";
 
 import * as stories from "./index.stories";
 import defaultConfig from "./configs/default.config?raw"

package/{ui.button-toggle-item → src/ui.button-toggle-item}/composables/attrs.composable.js

@@ -1,6 +1,6 @@
 import { computed, toValue } from "vue";
-import useUI from "vueless/composable.ui";
-import { cva } from "vueless/service.ui";
+import useUI from "../../composable.ui";
+import { cva } from "../../service.ui";
 
 import defaultConfig from "../configs/default.config";
 

package/{ui.button-toggle-item → src/ui.button-toggle-item}/index.stories.js

@@ -1,7 +1,7 @@
-import { getArgTypes, getSlotNames } from "vueless/service.storybook";
+import { getArgTypes, getSlotNames } from "../service.storybook";
 
-import UToggleItem from "vueless/ui.button-toggle-item";
-import UIcon from "vueless/ui.image-icon";
+import UToggleItem from "../ui.button-toggle-item";
+import UIcon from "../ui.image-icon";
 
 export default {
   title: "Buttons & Links / Toggle Item",

package/{ui.button-toggle-item → src/ui.button-toggle-item}/index.vue

@@ -29,9 +29,9 @@
 
 <script setup>
 import { inject, onMounted, ref } from "vue";
-import UIService, { getRandomId } from "vueless/service.ui";
+import UIService, { getRandomId } from "../service.ui";
 
-import { TYPE_RADIO } from "vueless/ui.button-toggle/constants";
+import { TYPE_RADIO } from "../ui.button-toggle/constants";
 
 import defaultConfig from "./configs/default.config";
 import { UToggleItem } from "./constants";

package/{ui.container-accordion → src/ui.container-accordion}/composables/attrs.composable.js

@@ -1,6 +1,6 @@
 import { computed } from "vue";
-import useUI from "vueless/composable.ui";
-import { cva } from "vueless/service.ui";
+import useUI from "../../composable.ui";
+import { cva } from "../../service.ui";
 
 import defaultConfig from "../configs/default.config";
 

package/{ui.container-accordion → src/ui.container-accordion}/index.stories.js

@@ -1,8 +1,8 @@
-import { getArgTypes } from "vueless/service.storybook";
+import { getArgTypes } from "../service.storybook";
 
-import UAccordion from "vueless/ui.container-accordion";
-import UCard from "vueless/ui.container-card";
-import UGroup from "vueless/ui.container-group";
+import UAccordion from "../ui.container-accordion";
+import UCard from "../ui.container-card";
+import UGroup from "../ui.container-group";
 
 export default {
   id: "5050",

package/{ui.container-accordion → src/ui.container-accordion}/index.vue

@@ -17,8 +17,8 @@
 <script setup>
 import { ref } from "vue";
 
-import UIcon from "vueless/ui.image-icon";
-import UIService, { getRandomId } from "vueless/service.ui";
+import UIcon from "../ui.image-icon";
+import UIService, { getRandomId } from "../service.ui";
 
 import { UAccordion } from "./constants/index";
 import defaultConfig from "./configs/default.config";

package/src/ui.container-card/Docs.mdx

@@ -0,0 +1,16 @@
+import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/blocks";
+import { getSource } from "../service.storybook";
+
+import * as stories from "./index.stories";
+import defaultConfig from "./configs/default.config?raw"
+
+<Meta of={stories} />
+<Title of={stories} />
+<Subtitle of={stories} />
+<Description of={stories} />
+<Primary of={stories}  />
+<Controls of={stories.Default} />
+<Stories of={stories} />
+
+## **Default config**
+<Source code={getSource(defaultConfig)} language="jsx" dark />

package/{ui.container-card → src/ui.container-card}/composable/attrs.composable.js

@@ -1,5 +1,5 @@
-import useUI from "vueless/composable.ui";
-import { cva, cx } from "vueless/service.ui";
+import useUI from "../../composable.ui";
+import { cva, cx } from "../../service.ui";
 
 import defaultConfig from "../configs/default.config";
 import { computed } from "vue";

package/{ui.container-card → src/ui.container-card}/index.stories.js

@@ -1,11 +1,11 @@
-import { getArgTypes } from "vueless/service.storybook";
+import { getArgTypes } from "../service.storybook";
 
-import UCard from "vueless/ui.container-card";
-import URow from "vueless/ui.container-row";
-import UInput from "vueless/ui.form-input";
-import UButton from "vueless/ui.button";
-import UIcon from "vueless/ui.image-icon";
-import UHeader from "vueless/ui.text-header";
+import UCard from "../ui.container-card";
+import URow from "../ui.container-row";
+import UInput from "../ui.form-input";
+import UButton from "../ui.button";
+import UIcon from "../ui.image-icon";
+import UHeader from "../ui.text-header";
 
 export default {
   id: "5060",

package/{ui.container-card → src/ui.container-card}/index.vue

@@ -42,9 +42,9 @@
 import { computed, useSlots } from "vue";
 import { useStore } from "vuex";
 
-import UIService from "vueless/service.ui";
-import UHeader from "vueless/ui.text-header";
-import UDivider from "vueless/ui.container-divider";
+import UIService from "../service.ui";
+import UHeader from "../ui.text-header";
+import UDivider from "../ui.container-divider";
 
 import { UCard } from "./constants";
 import defaultConfig from "./configs/default.config";

package/src/ui.container-divider/Docs.mdx

@@ -0,0 +1,16 @@
+import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/blocks";
+import { getSource } from "../service.storybook";
+
+import * as stories from "./index.stories";
+import defaultConfig from "./configs/default.config?raw"
+
+<Meta of={stories} />
+<Title of={stories} />
+<Subtitle of={stories} />
+<Description of={stories} />
+<Primary of={stories}  />
+<Controls of={stories.Default} />
+<Stories of={stories} />
+
+## **Default config**
+<Source code={getSource(defaultConfig)} language="jsx" dark />

package/{ui.container-divider → src/ui.container-divider}/composables/attrs.composable.js

@@ -1,5 +1,5 @@
-import useUI from "vueless/composable.ui";
-import { cva } from "vueless/service.ui";
+import useUI from "../../composable.ui";
+import { cva } from "../../service.ui";
 
 import defaultConfig from "../configs/default.config";
 import { computed } from "vue";

package/{ui.container-divider → src/ui.container-divider}/index.stories.js

@@ -1,7 +1,7 @@
-import { getArgTypes } from "vueless/service.storybook";
-import URow from "vueless/ui.container-row";
+import { getArgTypes } from "../service.storybook";
+import URow from "../ui.container-row";
 
-import UDivider from "vueless/ui.container-divider";
+import UDivider from "../ui.container-divider";
 
 export default {
   id: "5010",

package/{ui.container-divider → src/ui.container-divider}/index.vue

@@ -9,7 +9,7 @@
 </template>
 
 <script setup>
-import UIService from "vueless/service.ui";
+import UIService from "../service.ui";
 
 import { UDivider } from "./constants";
 import defaultConfig from "./configs/default.config";

package/src/ui.container-group/Docs.mdx

@@ -0,0 +1,16 @@
+import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/blocks";
+import { getSource } from "../service.storybook";
+
+import * as stories from "./index.stories";
+import defaultConfig from "./configs/default.config?raw"
+
+<Meta of={stories} />
+<Title of={stories} />
+<Subtitle of={stories} />
+<Description of={stories} />
+<Primary of={stories}  />
+<Controls of={stories.Default} />
+<Stories of={stories} />
+
+## **Default config**
+<Source code={getSource(defaultConfig)} language="jsx" dark />

package/{ui.container-group → src/ui.container-group}/composables/attrs.composable.js

@@ -1,5 +1,5 @@
-import useUI from "vueless/composable.ui";
-import { cva } from "vueless/service.ui";
+import useUI from "../../composable.ui";
+import { cva } from "../../service.ui";
 
 import defaultConfig from "../configs/default.config";
 import { computed } from "vue";

package/{ui.container-group → src/ui.container-group}/index.stories.js

@@ -1,8 +1,8 @@
-import { getArgTypes } from "vueless/service.storybook";
+import { getArgTypes } from "../service.storybook";
 
-import UGroup from "vueless/ui.container-group";
-import UInput from "vueless/ui.form-input";
-import UButton from "vueless/ui.button";
+import UGroup from "../ui.container-group";
+import UInput from "../ui.form-input";
+import UButton from "../ui.button";
 
 export default {
   id: "5030",

package/{ui.container-group → src/ui.container-group}/index.vue

@@ -32,9 +32,9 @@
 </template>
 
 <script setup>
-import UIService from "vueless/service.ui";
-import UDivider from "vueless/ui.container-divider";
-import UHeader from "vueless/ui.text-header";
+import UIService from "../service.ui";
+import UDivider from "../ui.container-divider";
+import UHeader from "../ui.text-header";
 
 import { UGroup } from "./constants";
 import defaultConfig from "./configs/default.config";

package/src/ui.container-groups/Docs.mdx

@@ -0,0 +1,16 @@
+import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/blocks";
+import { getSource } from "../service.storybook";
+
+import * as stories from "./index.stories";
+import defaultConfig from "./configs/default.config?raw"
+
+<Meta of={stories} />
+<Title of={stories} />
+<Subtitle of={stories} />
+<Description of={stories} />
+<Primary of={stories}  />
+<Controls of={stories.Default} />
+<Stories of={stories} />
+
+## **Default config**
+<Source code={getSource(defaultConfig)} language="jsx" dark />

package/{ui.container-groups → src/ui.container-groups}/composables/attrs.composable.js

@@ -1,4 +1,4 @@
-import useUI from "vueless/composable.ui";
+import useUI from "../../composable.ui";
 import defaultConfig from "../configs/default.config";
 
 export function useAttrs(props) {

package/{ui.container-groups → src/ui.container-groups}/index.stories.js

@@ -1,8 +1,8 @@
-import { getArgTypes } from "vueless/service.storybook";
+import { getArgTypes } from "../service.storybook";
 
-import UGroup from "vueless/ui.container-group";
-import UGroups from "vueless/ui.container-groups";
-import UInput from "vueless/ui.form-input";
+import UGroup from "../ui.container-group";
+import UGroups from "../ui.container-groups";
+import UInput from "../ui.form-input";
 
 export default {
   id: "5040",

package/src/ui.container-modal/Docs.mdx

@@ -0,0 +1,16 @@
+import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/blocks";
+import { getSource } from "../service.storybook";
+
+import * as stories from "./index.stories";
+import defaultConfig from "./configs/default.config?raw"
+
+<Meta of={stories} />
+<Title of={stories} />
+<Subtitle of={stories} />
+<Description of={stories} />
+<Primary of={stories}  />
+<Controls of={stories.Default} />
+<Stories of={stories} />
+
+## **Default config**
+<Source code={getSource(defaultConfig)} language="jsx" dark />

package/{ui.container-modal → src/ui.container-modal}/composables/attrs.composable.js

@@ -1,5 +1,5 @@
-import useUI from "vueless/composable.ui";
-import { cva, cx } from "vueless/service.ui";
+import useUI from "../../composable.ui";
+import { cva, cx } from "../../service.ui";
 
 import defaultConfig from "../configs/default.config";
 import { useStore } from "vuex";

package/{ui.container-modal → src/ui.container-modal}/index.stories.js

@@ -1,12 +1,12 @@
-import { getArgTypes } from "vueless/service.storybook";
-
-import UModal from "vueless/ui.container-modal";
-import UButton from "vueless/ui.button";
-import UIcon from "vueless/ui.image-icon";
-import UHeader from "vueless/ui.text-header";
-import UInput from "vueless/ui.form-input";
-import UTextarea from "vueless/ui.form-textarea";
-import URow from "vueless/ui.container-row";
+import { getArgTypes } from "../service.storybook";
+
+import UModal from "../ui.container-modal";
+import UButton from "../ui.button";
+import UIcon from "../ui.image-icon";
+import UHeader from "../ui.text-header";
+import UInput from "../ui.form-input";
+import UTextarea from "../ui.form-textarea";
+import URow from "../ui.container-row";
 
 export default {
   id: "5070",

package/{ui.container-modal → src/ui.container-modal}/index.vue

@@ -101,11 +101,11 @@
 <script setup>
 import { computed, useSlots, watch, ref } from "vue";
 
-import UIService, { getRandomId } from "vueless/service.ui";
+import UIService, { getRandomId } from "../service.ui";
 
-import UIcon from "vueless/ui.image-icon";
-import UHeader from "vueless/ui.text-header";
-import UDivider from "vueless/ui.container-divider";
+import UIcon from "../ui.image-icon";
+import UHeader from "../ui.text-header";
+import UDivider from "../ui.container-divider";
 
 import defaultConfig from "./configs/default.config";
 import { UModal } from "./constants/index";

package/src/ui.container-modal-confirm/Docs.mdx

@@ -0,0 +1,16 @@
+import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/blocks";
+import { getSource } from "../service.storybook";
+
+import * as stories from "./index.stories";
+import defaultConfig from "./configs/default.config?raw"
+
+<Meta of={stories} />
+<Title of={stories} />
+<Subtitle of={stories} />
+<Description of={stories} />
+<Primary of={stories}  />
+<Controls of={stories.Default} />
+<Stories of={stories} />
+
+## **Default config**
+<Source code={getSource(defaultConfig)} language="jsx" dark />

package/{ui.container-modal-confirm → src/ui.container-modal-confirm}/composable/attrs.composable.js

@@ -1,8 +1,8 @@
-import useUI from "vueless/composable.ui";
+import useUI from "../../composable.ui";
 import defaultConfig from "../configs/default.config";
 
 export function useAttrs(props) {
-  const { getAttrs, hasSlotContent } = useUI(defaultConfig, () => props.config);
+  const { config, getAttrs, hasSlotContent } = useUI(defaultConfig, () => props.config);
 
   const modalAttrs = getAttrs("modal", { isComponent: true });
   const footerLeftFallbackAttrs = getAttrs("footerLeftFallback");
@@ -10,6 +10,7 @@ export function useAttrs(props) {
   const cancelButtonAttrs = getAttrs("cancelButton", { isComponent: true });
 
   return {
+    config,
     footerLeftFallbackAttrs,
     modalAttrs,
     confirmButtonAttrs,

package/{ui.container-modal-confirm → src/ui.container-modal-confirm}/configs/default.config.js

@@ -3,6 +3,9 @@ export default /*tw*/ {
   footerLeftFallback: "flex space-x-4",
   confirmButton: "w-full",
   cancelButton: "w-full",
+  i18n: {
+    cancel: "Cancel",
+  },
   defaultVariants: {
     color: "brand",
     width: "sm",

package/{ui.container-modal-confirm → src/ui.container-modal-confirm}/index.stories.js

@@ -1,10 +1,10 @@
-import { getArgTypes } from "vueless/service.storybook";
+import { getArgTypes } from "../service.storybook";
 
-import UModalConfirm from "vueless/ui.container-modal-confirm";
-import UButton from "vueless/ui.button";
-import UHeader from "vueless/ui.text-header";
-import UIcon from "vueless/ui.image-icon";
-import URow from "vueless/ui.container-row";
+import UModalConfirm from "../ui.container-modal-confirm";
+import UButton from "../ui.button";
+import UHeader from "../ui.text-header";
+import UIcon from "../ui.image-icon";
+import URow from "../ui.container-row";
 
 export default {
   id: "5080",

package/{ui.container-modal-confirm → src/ui.container-modal-confirm}/index.vue

@@ -43,7 +43,7 @@
 
         <UButton
           v-if="cancelButton"
-          :label="i18n.cancel"
+          :label="config.i18n.cancel"
           variant="thirdary"
           filled
           :data-cy="`${dataCy}-close`"
@@ -62,11 +62,10 @@
 <script setup>
 import { computed } from "vue";
 
-import UIService from "vueless/service.ui";
-import I18nServiceDefault from "@vueless/services/i18n";
+import UIService from "../service.ui";
 
-import UButton from "vueless/ui.button";
-import UModal from "vueless/ui.container-modal";
+import UButton from "../ui.button";
+import UModal from "../ui.container-modal";
 
 import defaultConfig from "./configs/default.config";
 import { UModalConfirm } from "./constants/index";
@@ -153,8 +152,8 @@ const props = defineProps({
 
 const emit = defineEmits(["update:modelValue", "confirm", "close"]);
 
-const { getTranslation } = new I18nServiceDefault();
 const {
+  config,
   hasSlotContent,
   footerLeftFallbackAttrs,
   modalAttrs,
@@ -167,10 +166,6 @@ const isShownModal = computed({
   set: (value) => emit("update:modelValue", value),
 });
 
-const i18n = computed(() => ({
-  cancel: getTranslation("cancel"),
-}));
-
 function closeModal() {
   isShownModal.value = false;
 }
@@ -185,12 +180,3 @@ function emitConfirmAction() {
   closeModal();
 }
 </script>
-
-<i18n>
-en:
-  cancel: "Cancel"
-ru:
-  cancel: "Отмена"
-ua:
-  cancel: "Відміна"
-</i18n>

package/src/ui.container-page/Docs.mdx

@@ -0,0 +1,16 @@
+import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/blocks";
+import { getSource } from "../service.storybook";
+
+import * as stories from "./index.stories";
+import defaultConfig from "./configs/default.config?raw"
+
+<Meta of={stories} />
+<Title of={stories} />
+<Subtitle of={stories} />
+<Description of={stories} />
+<Primary of={stories}  />
+<Controls of={stories.Default} />
+<Stories of={stories} />
+
+## **Default config**
+<Source code={getSource(defaultConfig)} language="jsx" dark />