bootstrap-stubs/app.scss 0000644 00000000230 15152066042 0011370 0 ustar 00 // Fonts
@import url('https://fonts.bunny.net/css?family=Nunito');
// Variables
@import 'variables';
// Bootstrap
@import 'bootstrap/scss/bootstrap';
bootstrap-stubs/_variables.scss 0000644 00000000212 15152066042 0012717 0 ustar 00 // Body
$body-bg: #f8fafc;
// Typography
$font-family-sans-serif: 'Nunito', sans-serif;
$font-size-base: 0.9rem;
$line-height-base: 1.6;
bootstrap-stubs/vite.config.js 0000644 00000000470 15152066042 0012472 0 ustar 00 import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
export default defineConfig({
plugins: [
laravel({
input: [
'resources/sass/app.scss',
'resources/js/app.js',
],
refresh: true,
}),
],
});
bootstrap-stubs/bootstrap.js 0000644 00000002323 15152066042 0012273 0 ustar 00 import 'bootstrap';
/**
* We'll load the axios HTTP library which allows us to easily issue requests
* to our Laravel back-end. This library automatically handles sending the
* CSRF token as a header based on the value of the "XSRF" token cookie.
*/
import axios from 'axios';
window.axios = axios;
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
/**
* Echo exposes an expressive API for subscribing to channels and listening
* for events that are broadcast by Laravel. Echo and event broadcasting
* allows your team to easily build robust real-time web applications.
*/
// import Echo from 'laravel-echo';
// import Pusher from 'pusher-js';
// window.Pusher = Pusher;
// window.Echo = new Echo({
// broadcaster: 'pusher',
// key: import.meta.env.VITE_PUSHER_APP_KEY,
// cluster: import.meta.env.VITE_PUSHER_APP_CLUSTER ?? 'mt1',
// wsHost: import.meta.env.VITE_PUSHER_HOST ?? `ws-${import.meta.env.VITE_PUSHER_APP_CLUSTER}.pusher.com`,
// wsPort: import.meta.env.VITE_PUSHER_PORT ?? 80,
// wssPort: import.meta.env.VITE_PUSHER_PORT ?? 443,
// forceTLS: (import.meta.env.VITE_PUSHER_SCHEME ?? 'https') === 'https',
// enabledTransports: ['ws', 'wss'],
// });
Preset.php 0000644 00000003137 15152066042 0006524 0 ustar 00 <?php
namespace Laravel\Ui\Presets;
use Illuminate\Filesystem\Filesystem;
class Preset
{
/**
* Ensure the component directories we need exist.
*
* @return void
*/
protected static function ensureComponentDirectoryExists()
{
$filesystem = new Filesystem;
if (! $filesystem->isDirectory($directory = resource_path('js/components'))) {
$filesystem->makeDirectory($directory, 0755, true);
}
}
/**
* Update the "package.json" file.
*
* @param bool $dev
* @return void
*/
protected static function updatePackages($dev = true)
{
if (! file_exists(base_path('package.json'))) {
return;
}
$configurationKey = $dev ? 'devDependencies' : 'dependencies';
$packages = json_decode(file_get_contents(base_path('package.json')), true);
$packages[$configurationKey] = static::updatePackageArray(
array_key_exists($configurationKey, $packages) ? $packages[$configurationKey] : [],
$configurationKey
);
ksort($packages[$configurationKey]);
file_put_contents(
base_path('package.json'),
json_encode($packages, JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT).PHP_EOL
);
}
/**
* Remove the installed Node modules.
*
* @return void
*/
protected static function removeNodeModules()
{
tap(new Filesystem, function ($files) {
$files->deleteDirectory(base_path('node_modules'));
$files->delete(base_path('yarn.lock'));
});
}
}
Bootstrap.php 0000644 00000003143 15152066042 0007234 0 ustar 00 <?php
namespace Laravel\Ui\Presets;
use Illuminate\Filesystem\Filesystem;
class Bootstrap extends Preset
{
/**
* Install the preset.
*
* @return void
*/
public static function install()
{
static::updatePackages();
static::updateViteConfiguration();
static::updateSass();
static::updateBootstrapping();
static::removeNodeModules();
}
/**
* Update the given package array.
*
* @param array $packages
* @return array
*/
protected static function updatePackageArray(array $packages)
{
return [
'bootstrap' => '^5.2.3',
'@popperjs/core' => '^2.11.6',
'sass' => '^1.56.1',
] + $packages;
}
/**
* Update the Vite configuration.
*
* @return void
*/
protected static function updateViteConfiguration()
{
copy(__DIR__.'/bootstrap-stubs/vite.config.js', base_path('vite.config.js'));
}
/**
* Update the Sass files for the application.
*
* @return void
*/
protected static function updateSass()
{
(new Filesystem)->ensureDirectoryExists(resource_path('sass'));
copy(__DIR__.'/bootstrap-stubs/_variables.scss', resource_path('sass/_variables.scss'));
copy(__DIR__.'/bootstrap-stubs/app.scss', resource_path('sass/app.scss'));
}
/**
* Update the bootstrapping files.
*
* @return void
*/
protected static function updateBootstrapping()
{
copy(__DIR__.'/bootstrap-stubs/bootstrap.js', resource_path('js/bootstrap.js'));
}
}
React.php 0000644 00000005040 15152066042 0006313 0 ustar 00 <?php
namespace Laravel\Ui\Presets;
use Illuminate\Filesystem\Filesystem;
use Illuminate\Support\Arr;
class React extends Preset
{
/**
* Install the preset.
*
* @return void
*/
public static function install()
{
static::ensureComponentDirectoryExists();
static::updatePackages();
static::updateViteConfiguration();
static::updateBootstrapping();
static::updateComponent();
static::addViteReactRefreshDirective();
static::removeNodeModules();
}
/**
* Update the given package array.
*
* @param array $packages
* @return array
*/
protected static function updatePackageArray(array $packages)
{
return [
'@vitejs/plugin-react' => '^4.2.0',
'react' => '^18.2.0',
'react-dom' => '^18.2.0',
] + Arr::except($packages, [
'@vitejs/plugin-vue',
'vue'
]);
}
/**
* Update the Vite configuration.
*
* @return void
*/
protected static function updateViteConfiguration()
{
copy(__DIR__.'/react-stubs/vite.config.js', base_path('vite.config.js'));
}
/**
* Update the example component.
*
* @return void
*/
protected static function updateComponent()
{
(new Filesystem)->delete(
resource_path('js/components/ExampleComponent.vue')
);
copy(
__DIR__.'/react-stubs/Example.jsx',
resource_path('js/components/Example.jsx')
);
}
/**
* Update the bootstrapping files.
*
* @return void
*/
protected static function updateBootstrapping()
{
copy(__DIR__.'/react-stubs/app.js', resource_path('js/app.js'));
}
/**
* Add Vite's React Refresh Runtime
*
* @return void
*/
protected static function addViteReactRefreshDirective()
{
$view = static::getViewPath('layouts/app.blade.php');
if (! file_exists($view)) {
return;
}
file_put_contents(
$view,
str_replace('@vite(', '@viteReactRefresh'.PHP_EOL.' @vite(', file_get_contents($view))
);
}
/**
* Get full view path relative to the application's configured view path.
*
* @param string $path
* @return string
*/
protected static function getViewPath($path)
{
return implode(DIRECTORY_SEPARATOR, [
config('view.paths')[0] ?? resource_path('views'), $path,
]);
}
}
Vue.php 0000644 00000003320 15152066042 0006013 0 ustar 00 <?php
namespace Laravel\Ui\Presets;
use Illuminate\Filesystem\Filesystem;
use Illuminate\Support\Arr;
class Vue extends Preset
{
/**
* Install the preset.
*
* @return void
*/
public static function install()
{
static::ensureComponentDirectoryExists();
static::updatePackages();
static::updateViteConfiguration();
static::updateBootstrapping();
static::updateComponent();
static::removeNodeModules();
}
/**
* Update the given package array.
*
* @param array $packages
* @return array
*/
protected static function updatePackageArray(array $packages)
{
return [
'@vitejs/plugin-vue' => '^4.5.0',
'vue' => '^3.2.37',
] + Arr::except($packages, [
'@vitejs/plugin-react',
'react',
'react-dom',
]);
}
/**
* Update the Vite configuration.
*
* @return void
*/
protected static function updateViteConfiguration()
{
copy(__DIR__.'/vue-stubs/vite.config.js', base_path('vite.config.js'));
}
/**
* Update the example component.
*
* @return void
*/
protected static function updateComponent()
{
(new Filesystem)->delete(
resource_path('js/components/Example.js')
);
copy(
__DIR__.'/vue-stubs/ExampleComponent.vue',
resource_path('js/components/ExampleComponent.vue')
);
}
/**
* Update the bootstrapping files.
*
* @return void
*/
protected static function updateBootstrapping()
{
copy(__DIR__.'/vue-stubs/app.js', resource_path('js/app.js'));
}
}
react-stubs/app.js 0000644 00000000764 15152066042 0010126 0 ustar 00 /**
* First we will load all of this project's JavaScript dependencies which
* includes React and other helpers. It's a great starting point while
* building robust, powerful web applications using React + Laravel.
*/
import './bootstrap';
/**
* Next, we will create a fresh React component instance and attach it to
* the page. Then, you may begin adding components to this application
* or customize the JavaScript scaffolding to fit your unique needs.
*/
import './components/Example';
react-stubs/Example.jsx 0000644 00000001420 15152066042 0011117 0 ustar 00 import React from 'react';
import ReactDOM from 'react-dom/client';
function Example() {
return (
<div className="container">
<div className="row justify-content-center">
<div className="col-md-8">
<div className="card">
<div className="card-header">Example Component</div>
<div className="card-body">I'm an example component!</div>
</div>
</div>
</div>
</div>
);
}
export default Example;
if (document.getElementById('example')) {
const Index = ReactDOM.createRoot(document.getElementById("example"));
Index.render(
<React.StrictMode>
<Example/>
</React.StrictMode>
)
}
react-stubs/vite.config.js 0000644 00000000563 15152066042 0011556 0 ustar 00 import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import react from '@vitejs/plugin-react';
export default defineConfig({
plugins: [
laravel({
input: [
'resources/sass/app.scss',
'resources/js/app.js',
],
refresh: true,
}),
react(),
],
});
vue-stubs/app.js 0000644 00000002601 15152066042 0007617 0 ustar 00 /**
* First we will load all of this project's JavaScript dependencies which
* includes Vue and other libraries. It is a great starting point when
* building robust, powerful web applications using Vue and Laravel.
*/
import './bootstrap';
import { createApp } from 'vue';
/**
* Next, we will create a fresh Vue application instance. You may then begin
* registering components with the application instance so they are ready
* to use in your application's views. An example is included for you.
*/
const app = createApp({});
import ExampleComponent from './components/ExampleComponent.vue';
app.component('example-component', ExampleComponent);
/**
* The following block of code may be used to automatically register your
* Vue components. It will recursively scan this directory for the Vue
* components and automatically register them with their "basename".
*
* Eg. ./components/ExampleComponent.vue -> <example-component></example-component>
*/
// Object.entries(import.meta.glob('./**/*.vue', { eager: true })).forEach(([path, definition]) => {
// app.component(path.split('/').pop().replace(/\.\w+$/, ''), definition.default);
// });
/**
* Finally, we will attach the application instance to a HTML element with
* an "id" attribute of "app". This element is included with the "auth"
* scaffolding. Otherwise, you will need to add an element yourself.
*/
app.mount('#app');
vue-stubs/ExampleComponent.vue 0000644 00000001050 15152066042 0012475 0 ustar 00 <template>
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">Example Component</div>
<div class="card-body">
I'm an example component.
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
mounted() {
console.log('Component mounted.')
}
}
</script>
vue-stubs/vite.config.js 0000644 00000001206 15152066042 0011252 0 ustar 00 import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';
export default defineConfig({
plugins: [
laravel({
input: [
'resources/sass/app.scss',
'resources/js/app.js',
],
refresh: true,
}),
vue({
template: {
transformAssetUrls: {
base: null,
includeAbsolute: false,
},
},
}),
],
resolve: {
alias: {
vue: 'vue/dist/vue.esm-bundler.js',
},
},
});
