✨ ajout des components

Author: mckenziearts

resources/js/app.js

@@ -1,11 +1,10 @@
-import Alpine from 'alpinejs';
+import Alpine from 'alpinejs'
 
-// Alpine plugins.
-import internationalNumber from "./plugins/internationalNumber";
-
-require('./helpers');
-require('./editor');
-require('./scrollspy');
+import internationalNumber from './plugins/internationalNumber'
+import './elements'
+import './helpers'
+import './editor'
+import './scrollspy'
 
 // Add Alpine to window object.
 window.Alpine = Alpine;

resources/js/components/Button.jsx

@@ -0,0 +1,37 @@
+import Loader from '@components/Loader';
+import { classNames } from '@helpers/dom.js'
+
+export function PrimaryButton ({ children, ...props }) {
+  return (
+    <Button className='border border-transparent text-white bg-green-600 hover:bg-green-700' {...props}>
+      {children}
+    </Button>
+  )
+}
+
+export function DefaultButton ({ children, ...props }) {
+  return (
+    <Button className='border border-skin-input shadow-sm bg-skin-button text-skin-base hover:bg-skin-button-hover' {...props}>
+      {children}
+    </Button>
+  )
+}
+
+/**
+ *
+ * @param {*} children
+ * @param {string} className
+ * @param {string} size
+ * @param {boolean} loading
+ * @param {Object} props
+ * @return {*}
+ */
+export function Button ({ children, className = '', loading = false, ...props }) {
+  className = classNames('inline-flex items-center justify-center py-2 px-4 text-sm font-medium rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-body focus:ring-green-500', className)
+  return (
+    <button className={className} disabled={loading} {...props}>
+      {loading && <Loader />}
+      {children}
+    </button>
+  )
+}