@dpa-id-components/dpa-shared-components 8.9.6 → 8.10.0

package/dist/UseBreakpoints.stories.ts

@@ -0,0 +1,22 @@
+import UseBreakpoints from "./UseBreakpoints.vue";
+import type { Meta, StoryObj } from "@storybook/vue3";
+
+const meta = {
+  title: "tailwind/UseBreakpoints.ts",
+  component: UseBreakpoints,
+  argTypes: {},
+  parameters: {},
+} satisfies Meta<typeof UseBreakpoints>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  render: (args: any) => ({
+    setup() {
+      return { args };
+    },
+    components: { UseBreakpoints },
+    template: `<div><UseBreakpoints /></div>`,
+  }),
+};

package/dist/UseBreakpoints.vue

@@ -0,0 +1,12 @@
+<template>
+  <UiButton v-if="lg">Button for LG</UiButton>
+  <UiIconButton v-else icon-name="emoji" />
+</template>
+
+<script setup lang="ts">
+import useBreakpoints from "./useBreakpoints";
+import UiIconButton from "@/components/UiIconButton/UiIconButton.vue";
+import UiButton from "@/components/UiButton/UiButton.vue";
+
+const { lg } = useBreakpoints();
+</script>