@platformatic/ui-components 0.1.31 → 0.1.33

package/src/stories/TextWithLabel.stories.jsx

@@ -1,25 +1,25 @@
-'use strict'
-
-import TextWithLabel from '../components/TextWithLabel'
-export default {
-  title: 'Platformatic/TextWithLabel',
-  component: TextWithLabel,
-  argTypes: {
-    label: { control: 'text' },
-    text: { control: 'text' }
-  }
-}
-const Template = (args) => <TextWithLabel {...args} />
-
-export const Standard = Template.bind({})
-
-Standard.args = {
-  label: 'Created By',
-  text: 'Platformatic Team'
-}
-
-export const WithLink = (args) => <TextWithLabel {...args}><a href='https://example.com'>Standard Link</a></TextWithLabel>
-
-WithLink.args = {
-  label: 'External Link'
-}
+'use strict'
+
+import TextWithLabel from '../components/TextWithLabel'
+export default {
+  title: 'Platformatic/TextWithLabel',
+  component: TextWithLabel,
+  argTypes: {
+    label: { control: 'text' },
+    text: { control: 'text' }
+  }
+}
+const Template = (args) => <TextWithLabel {...args} />
+
+export const Standard = Template.bind({})
+
+Standard.args = {
+  label: 'Created By',
+  text: 'Platformatic Team'
+}
+
+export const WithLink = (args) => <TextWithLabel {...args}><a href='https://example.com'>Standard Link</a></TextWithLabel>
+
+WithLink.args = {
+  label: 'External Link'
+}

package/src/stories/TwoColumnsLayout.stories.jsx

@@ -1,42 +1,42 @@
-'use strict'
-import TwoColumnsLayout from '../components/layouts/TwoColumnsLayout'
-import BorderedBox from '../components/BorderedBox'
-export default {
-  title: 'Platformatic/TwoColumnsLayout',
-  component: TwoColumnsLayout
-  // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
-  /* argTypes: {
-    gridTemplate: {
-      type: 'string',
-      control: {
-        type: 'radio',
-        options: ['Default', 'Columns', 'Rows', 'Responsive' ],
-      }
-    }
-  } */
-}
-
-// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
-const Template = (args) => <TwoColumnsLayout {...args}><BorderedBox>1st</BorderedBox><BorderedBox>2nd</BorderedBox></TwoColumnsLayout>
-
-export const Default = Template.bind({})
-
-Default.args = { }
-
-export const Columns = Template.bind({})
-
-Columns.args = {
-  gridTemplate: 'columns'
-}
-
-export const Rows = Template.bind({})
-
-Rows.args = {
-  gridTemplate: 'rows'
-}
-
-export const Responsive = Template.bind({})
-
-Responsive.args = {
-  gridTemplate: 'responsive'
-}
+'use strict'
+import TwoColumnsLayout from '../components/layouts/TwoColumnsLayout'
+import BorderedBox from '../components/BorderedBox'
+export default {
+  title: 'Platformatic/TwoColumnsLayout',
+  component: TwoColumnsLayout
+  // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
+  /* argTypes: {
+    gridTemplate: {
+      type: 'string',
+      control: {
+        type: 'radio',
+        options: ['Default', 'Columns', 'Rows', 'Responsive' ],
+      }
+    }
+  } */
+}
+
+// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
+const Template = (args) => <TwoColumnsLayout {...args}><BorderedBox>1st</BorderedBox><BorderedBox>2nd</BorderedBox></TwoColumnsLayout>
+
+export const Default = Template.bind({})
+
+Default.args = { }
+
+export const Columns = Template.bind({})
+
+Columns.args = {
+  gridTemplate: 'columns'
+}
+
+export const Rows = Template.bind({})
+
+Rows.args = {
+  gridTemplate: 'rows'
+}
+
+export const Responsive = Template.bind({})
+
+Responsive.args = {
+  gridTemplate: 'responsive'
+}

package/src/styles/main.css

@@ -1,16 +1,16 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-:root {
-  @apply bg-main-dark-blue;
-  font-family: 'Montserrat';
-}
-a {
-  @apply text-tertiary-blue;
-}
-
-input {
-  background-color: transparent;
-
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+:root {
+  @apply bg-main-dark-blue;
+  font-family: 'Montserrat';
+}
+a {
+  @apply text-tertiary-blue;
+}
+
+input {
+  background-color: transparent;
+
 }

package/tailwind.config.cjs

@@ -1,37 +1,37 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-  content: ['./src/**/*.{html,jsx}'],
-  theme: {
-    container: {
-      center: true
-    },
-    extend: {
-      screens: {
-        'lg': '1440px',
-        // => @media (min-width: 1440px) { ... }
-      },  
-    },
-    colors: {
-      'main-green': '#21FA90',
-      'dark-green': '#02783F',
-      'light-green': '#21F190',
-      'main-dark-blue': '#00283D',
-      'dark-blue': '#00344F',
-      white: '#FFFFFF',
-      'error-red': '#FA2121',
-      'tertiary-blue': '#2588E4'
-    },
-    fontFamily: {
-      sans: ['Montserrat']
-    }
-  },
-  safelist: [
-    'border-error-red',
-    'border-main-green',
-    'text-3xl',
-    'text-4xl',
-    'text-5xl',
-    'text-6xl'
-  ],
-  plugins: []
-}
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: ['./src/**/*.{html,jsx}'],
+  theme: {
+    container: {
+      center: true
+    },
+    extend: {
+      screens: {
+        'lg': '1440px',
+        // => @media (min-width: 1440px) { ... }
+      },  
+    },
+    colors: {
+      'main-green': '#21FA90',
+      'dark-green': '#02783F',
+      'light-green': '#21F190',
+      'main-dark-blue': '#00283D',
+      'dark-blue': '#00344F',
+      white: '#FFFFFF',
+      'error-red': '#FA2121',
+      'tertiary-blue': '#2588E4'
+    },
+    fontFamily: {
+      sans: ['Montserrat']
+    }
+  },
+  safelist: [
+    'border-error-red',
+    'border-main-green',
+    'text-3xl',
+    'text-4xl',
+    'text-5xl',
+    'text-6xl'
+  ],
+  plugins: []
+}

package/vite.config.js

@@ -1,6 +1,6 @@
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
-/** @type {import('vite').UserConfig} */
-export default defineConfig({
-  plugins: [react()]
-})
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+/** @type {import('vite').UserConfig} */
+export default defineConfig({
+  plugins: [react()]
+})

package/vitest.config.js

@@ -1,14 +1,14 @@
-/// <reference types="vitest" />
-
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
-
-export default defineConfig({
-  plugins: [react()],
-  test: {
-    globals: true,
-    environment: 'happy-dom',
-    exclude: ['node_modules']
-  }
-
-})
+/// <reference types="vitest" />
+
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+export default defineConfig({
+  plugins: [react()],
+  test: {
+    globals: true,
+    environment: 'happy-dom',
+    exclude: ['node_modules']
+  }
+
+})

package/dist/api-icon-closed.svg

@@ -1,6 +0,0 @@
-<svg width="38" height="42" viewBox="0 0 38 42" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M8.12022 22.3583C4.18631 22.3583 1 19.1696 1 15.2381C1 11.3065 4.18631 8.11784 8.11784 8.12022C8.11784 4.18631 11.3065 1 15.2381 1C18.1449 1 20.6433 2.74124 21.7492 5.23965C21.9498 5.22054 22.1529 5.21099 22.3583 5.21099C25.6377 5.21099 28.3965 7.42994 29.2229 10.4467C29.7627 10.289 30.3336 10.203 30.9236 10.203C34.2795 10.203 37 12.926 37 16.2818C37 19.6377 34.2795 22.3583 30.9236 22.3583" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M13 11.5V18.5M13 31V28M13 25V21.5" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M25 13V19M25 34.5V31M25 28V22" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M19 15.4L19 22.5M19 40.5L19 36.5M19 25.5L19 33.5" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

package/dist/api-icon.svg

@@ -1,9 +0,0 @@
-<svg width="38" height="56" viewBox="0 0 38 56" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M8.12022 22.3583C4.18631 22.3583 1 19.1696 1 15.2381C1 11.3065 4.18631 8.11784 8.11784 8.12022C8.11784 4.18631 11.3065 1 15.2381 1C18.1449 1 20.6433 2.74124 21.7492 5.23965C21.9498 5.22054 22.1529 5.21099 22.3583 5.21099C25.6377 5.21099 28.3965 7.42994 29.2229 10.4467C29.7627 10.289 30.3336 10.203 30.9236 10.203C34.2795 10.203 37 12.926 37 16.2818C37 19.6377 34.2795 22.3583 30.9236 22.3583" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M13 11.5V31H11.5" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M25 13V31H28" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M19 15.4L19 51.2L30.4 51.2" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<circle cx="7" cy="31" r="3" stroke="white" stroke-width="2"/>
-<circle cx="31" cy="31" r="3" stroke="white" stroke-width="2"/>
-<circle cx="34" cy="51.2" r="3" stroke="white" stroke-width="2"/>
-</svg>