generator-folklore 3.0.20 → 3.0.22

package/lib/generators/build/index.js

@@ -80,7 +80,7 @@ module.exports = class AppGenerator extends _generator.default {
       },
       dependencies() {
         this.addDevDependencies({
-          '@folklore/cli': '^0.0.50'
+          '@folklore/cli': '^0.1.9'
         });
       }
     };

package/lib/generators/eslint/index.js

@@ -30,8 +30,8 @@ module.exports = class EslintGenerator extends _generator.default {
           '@babel/eslint-parser': '^7.18.9',
           eslint: '^8.0.0',
           'eslint-config-airbnb': '^19.0.4',
-          'eslint-config-prettier': '^8.6.0',
-          'eslint-plugin-prettier': '^4.2.1',
+          'eslint-config-prettier': '^9.1.0',
+          'eslint-plugin-prettier': '^5.1.3',
           'eslint-plugin-import': '^2.26.0',
           'eslint-plugin-jsx-a11y': '^6.6.1',
           'eslint-plugin-react': '^7.30.1',

package/lib/generators/intl/index.js

@@ -68,7 +68,7 @@ module.exports = class IntlGenerator extends _generator.default {
       },
       dependencies() {
         this.addDevDependencies({
-          '@folklore/cli': '^0.0.50'
+          '@folklore/cli': '^0.1.9'
         });
       }
     };

package/lib/generators/laravel-auth/templates/resources/assets/js/components/Auth.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 // import PropTypes from 'prop-types';
-import { Route, Switch } from 'react-router';
+import { Route, Switch } from 'wouter';
 import { withUrlGenerator } from '@folklore/react-container';
 
 import * as AppPropTypes from '../lib/PropTypes';

package/lib/generators/laravel-auth/templates/resources/assets/js/components/forms/Login.jsx

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
-import { Link } from 'react-router-dom';
+import { Link } from 'wouter';
 import classNames from 'classnames';
 import { withUrlGenerator } from '@folklore/react-container';
 import { useForm } from '@folklore/forms';
@@ -71,7 +71,7 @@ const LoginForm = ({
                     helpText={(
                         <div className={styles.forgot}>
                             <Link
-                                to={urlGenerator.route('auth.password.request')}
+                                href={urlGenerator.route('auth.password.request')}
                                 className={styles.link}
                             >
                                 <FormattedMessage {...messages.forgotPassword} />

package/lib/generators/laravel-panneau/templates/app/Http/Resources/BlockResource.php

@@ -6,6 +6,8 @@ use Illuminate\Http\Resources\Json\JsonResource;
 use Folklore\Contracts\Resources\HasBlocks;
 use Folklore\Http\Resources\LocalizedResource;
 use App\Contracts\Resources\Blocks\Text as TextBlock;
+use App\Contracts\Resources\Blocks\ImageBlock as ImageBlock;
+use Folklore\Http\Resources\MediaResource;
 
 class BlockResource extends JsonResource
 {
@@ -18,7 +20,6 @@ class BlockResource extends JsonResource
     public function toArray($request)
     {
         $type = $this->type();
-        $locale = $request->locale();
         return [
             'id' => $this->id(),
             'type' => $type,
@@ -27,9 +28,27 @@ class BlockResource extends JsonResource
                 return !is_null($blocks) ? new BlocksCollection($blocks) : [];
             }),
 
-            $this->mergeWhen($this->resource instanceof TextBlock, function () use ($locale) {
+            $this->mergeWhen($this->resource instanceof TextBlock, function () {
                 return [
-                    'body' => $this->body($locale),
+                    'title' => new LocalizedResource(function ($locale) {
+                        return $this->title($locale);
+                    }),
+                    'body' => new LocalizedResource(function ($locale) {
+                        return $this->body($locale);
+                    }),
+                ];
+            }),
+
+            $this->mergeWhen($this->resource instanceof ImageBlock, function () {
+                $image = $this->image();
+                return [
+                    'image' => !empty($image) ? new MediaResource($image) : null,
+                    'caption' => new LocalizedResource(function ($locale) {
+                        return $this->caption($locale);
+                    }),
+                    'credits' => new LocalizedResource(function ($locale) {
+                        return $this->credits($locale);
+                    }),
                 ];
             }),
         ];

package/lib/generators/laravel-panneau/templates/app/Models/Block.php

@@ -11,7 +11,7 @@ class Block extends BaseBlock
 {
     use HasFactory;
 
-    protected $typeResources = [
+    protected $typedResources = [
         'text' => \App\Resources\Blocks\TextBlock::class,
         'image' => \App\Resources\Blocks\ImageBlock::class,
     ];

package/lib/generators/laravel-panneau/templates/app/Models/Page.php

@@ -19,4 +19,9 @@ class Page extends BasePage
     {
         return $this->toTypedResource() ?? new PageResource($this);
     }
+
+    public function blocks()
+    {
+        return $this->morphToMany(Block::class, 'blockable', 'blocks_pivot');
+    }
 }

package/lib/generators/laravel-panneau/templates/app/Panneau/Http/Resources/BlockResource.php

@@ -3,9 +3,11 @@
 namespace App\Panneau\Http\Resources;
 
 use Illuminate\Http\Resources\Json\JsonResource;
-use App\Contracts\Resources\HasBlocks;
+use Folklore\Contracts\Resources\HasBlocks;
 use Folklore\Http\Resources\LocalizedResource;
 use App\Contracts\Resources\Blocks\Text as TextBlock;
+use App\Contracts\Resources\Blocks\Image as ImageBlock;
+use Folklore\Http\Resources\MediaResource;
 
 class BlockResource extends JsonResource
 {
@@ -18,7 +20,6 @@ class BlockResource extends JsonResource
     public function toArray($request)
     {
         $type = $this->type();
-
         return [
             'id' => $this->id(),
             'type' => $type,
@@ -29,11 +30,27 @@ class BlockResource extends JsonResource
 
             $this->mergeWhen($this->resource instanceof TextBlock, function () {
                 return [
+                    'title' => new LocalizedResource(function ($locale) {
+                        return $this->title($locale);
+                    }),
                     'body' => new LocalizedResource(function ($locale) {
                         return $this->body($locale);
                     }),
                 ];
             }),
+
+            $this->mergeWhen($this->resource instanceof ImageBlock, function () {
+                $image = $this->image();
+                return [
+                    'image' => !empty($image) ? new MediaResource($image) : null,
+                    'caption' => new LocalizedResource(function ($locale) {
+                        return $this->caption($locale);
+                    }),
+                    'credits' => new LocalizedResource(function ($locale) {
+                        return $this->credits($locale);
+                    }),
+                ];
+            }),
         ];
     }
 }

package/lib/generators/laravel-panneau/templates/resources/assets/js/components/Panneau.jsx

@@ -1,12 +1,13 @@
-import React, { useState, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import Panneau from '@panneau/app';
 import { getCSRFHeaders } from '@folklore/fetch';
-
+import Panneau from '@panneau/app';
 import { FIELDS_NAMESPACE } from '@panneau/core/contexts';
-import * as fieldsComponents from './panneau/fields';
+import PropTypes from 'prop-types';
+import React, { useState, useEffect } from 'react';
+
 import * as AppPropTypes from '../lib/PropTypes';
 
+import * as fieldsComponents from './panneau/fields';
+
 import '../../styles/panneau.scss';
 
 const propTypes = {
@@ -26,7 +27,6 @@ const defaultProps = {
 const PanneauContainer = ({ definition, user, baseUrl, uploadEndpoint, statusCode }) => {
     const { routes = {} } = definition;
     const isAuthorized = statusCode !== 401 && statusCode !== 403;
-
     const [localeLoaded, setLocaleLoaded] = useState(false);
 
     useEffect(() => {

package/lib/generators/laravel-panneau/templates/resources/assets/js/components/panneau/fields/PageSlug.jsx

@@ -4,7 +4,7 @@ import TextField from '@panneau/field-text';
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
-import { generatePath } from 'react-router';
+import { generatePath } from '@folklore/routes';
 
 const propTypes = {
     fieldLocale: PropTypes.string,

package/lib/generators/laravel-panneau/templates/resources/assets/styles/panneau.scss

@@ -1,2 +1,4 @@
+@import '~@panneau/app/scss/styles';
+
 @import '~@panneau/themes/scss/styles';
 @import '~@panneau/themes/scss/vendor';

package/lib/generators/micromag-project/index.js

@@ -0,0 +1,114 @@
+"use strict";
+
+var _chalk = _interopRequireDefault(require("chalk"));
+var _lodash = _interopRequireDefault(require("lodash"));
+var _path = _interopRequireDefault(require("path"));
+var _generator = _interopRequireDefault(require("../../lib/generator"));
+var _utils = require("../../lib/utils");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+module.exports = class MicromagProjectGenerator extends _generator.default {
+  // The name `constructor` is important here
+  constructor(...args) {
+    super(...args);
+    this.argument('project-name', {
+      type: String,
+      required: false
+    });
+    this.option('src-path', {
+      type: String,
+      desc: 'Path for source',
+      defaults: './src'
+    });
+    this.option('dest-path', {
+      type: String,
+      desc: 'Path for build',
+      defaults: './dist'
+    });
+    this.srcPath = filePath => this.destinationPath(_path.default.join(this.options['src-path'], filePath));
+  }
+  get prompting() {
+    return {
+      welcome() {
+        if (this.options.quiet) {
+          return;
+        }
+        console.log(_chalk.default.yellow('\n----------------------'));
+        console.log('Micromag Project Generator');
+        console.log(_chalk.default.yellow('----------------------\n'));
+      },
+      prompts() {
+        const prompts = [];
+        if (!this.options['project-name']) {
+          prompts.push(_generator.default.prompts.project_name);
+        }
+        if (!prompts.length) {
+          return null;
+        }
+        return this.prompt(prompts).then(answers => {
+          if (answers['project-name']) {
+            this.options['project-name'] = answers['project-name'];
+          }
+        });
+      }
+    };
+  }
+  async configuring() {
+    const {
+      'project-name': projectName,
+      'src-path': srcPath,
+      'dest-path': destPath
+    } = this.options;
+    await this.composeWith('folklore:html-project', {
+      'skip-install': true,
+      quiet: true,
+      'project-name': projectName,
+      'src-path': srcPath,
+      'dest-path': destPath
+    });
+  }
+  get conflicts() {
+    return {
+      home() {
+        const {
+          'src-path': srcPath
+        } = this.options;
+        const templateData = {
+          getRelativeStylesPath: (from, src) => _path.default.relative(this.destinationPath(_path.default.dirname(_path.default.join(srcPath, from))), this.destinationPath(_path.default.join(_path.default.join(srcPath, 'styles'), src)))
+        };
+        this.fs.delete(this.srcPath('components/pages/Home.jsx'));
+        this.fs.delete(this.srcPath('styles/pages/home.module.scss'));
+        this.fs.copyTpl(this.templatePath('Home.jsx'), this.srcPath('components/pages/Home.jsx'), templateData);
+        this.fs.copyTpl(this.templatePath('home.module.scss'), this.srcPath('styles/pages/home.module.scss'), templateData);
+      },
+      routes() {
+        const {
+          'src-path': srcPath
+        } = this.options;
+        const templateData = {
+          getRelativeStylesPath: (from, src) => _path.default.relative(this.destinationPath(_path.default.dirname(_path.default.join(srcPath, from))), this.destinationPath(_path.default.join(_path.default.join(srcPath, 'styles'), src)))
+        };
+        this.fs.delete(this.srcPath('components/Routes.jsx'));
+        this.fs.copyTpl(this.templatePath('Routes.jsx'), this.srcPath('components/Routes.jsx'), templateData);
+      },
+      styles() {
+        this.fs.delete(this.srcPath('styles/styles.scss'));
+        this.fs.copyTpl(this.templatePath('styles.scss'), this.srcPath('styles/styles.scss'));
+      },
+      micromag() {
+        this.fs.copyTpl(this.templatePath('data.json'), this.srcPath('micromag/data.json'));
+      },
+      dependencies() {
+        this.addDependencies({
+          '@micromag/viewer': '^0.3.492',
+          '@micromag/intl': '^0.3.488'
+        });
+      }
+    };
+  }
+  async install() {
+    if (this.options['skip-install']) {
+      return;
+    }
+    await this.spawnCommand('npm', ['install']);
+  }
+};

package/lib/generators/micromag-project/templates/Home.jsx

@@ -0,0 +1,33 @@
+import '@micromag/intl/locale/fr';
+import Micromag from '@micromag/viewer';
+import React from 'react';
+import { useIntl } from 'react-intl';
+
+// import * as AppPropTypes from '../../lib/PropTypes';
+import story from '../../micromag/data.json';
+
+import styles from '<%= getRelativeStylesPath('components/pages/Home.jsx', 'pages/home.module.scss') %>';
+
+const propTypes = {
+    // intl: AppPropTypes.intl.isRequired,
+};
+
+function HomePage() {
+    const { locale } = useIntl();
+    return (
+        <div className={styles.container}>
+            <Micromag
+                story={story}
+                locale={locale}
+                // basePath={basePath}
+                // memoryRouter
+                pathWithIndex
+                className={styles.micromag}
+            />
+        </div>
+    );
+}
+
+HomePage.propTypes = propTypes;
+
+export default HomePage;

package/lib/generators/micromag-project/templates/Routes.jsx

@@ -0,0 +1,34 @@
+import React from 'react';
+// import PropTypes from 'prop-types';
+import { Route, Switch } from 'wouter';
+import { useRoutes } from '@folklore/routes';
+
+// import { useUrlGenerator } from '@folklore/routes';
+// import * as AppPropTypes from '../lib/PropTypes';
+import MainLayout from './layouts/Main';
+import ErrorPage from './pages/Error';
+import HomePage from './pages/Home';
+
+import '<%= getRelativeStylesPath('components/App.jsx', 'styles.scss') %>';
+
+const propTypes = {};
+
+const defaultProps = {};
+
+function Routes() {
+    const routes = useRoutes() || {};
+    return (
+        <Switch>
+            <Route>
+                <MainLayout>
+                    <HomePage />
+                </MainLayout>
+            </Route>
+        </Switch>
+    );
+}
+
+Routes.propTypes = propTypes;
+Routes.defaultProps = defaultProps;
+
+export default Routes;

package/lib/generators/micromag-project/templates/data.json

@@ -0,0 +1,38 @@
+{
+    "components": [
+        {
+            "id": "screen1",
+            "type": "text-title",
+            "background": {
+                "color": { "color": "#ffcc00", "alpha": 1 },
+                "image": null,
+                "fit": "contain",
+                "repeat": true
+            },
+            "layout": "middle",
+            "title": {
+                "body": "<h1>Écran 1</h1>"
+            },
+            "text": {
+                "body": "<p>Texte</p>"
+            }
+        },
+        {
+            "id": "screen2",
+            "type": "text-title",
+            "background": {
+                "color": { "color": "#cc0000", "alpha": 1 },
+                "image": null,
+                "fit": "contain",
+                "repeat": true
+            },
+            "layout": "middle",
+            "title": {
+                "body": "<h1>Écran 2</h1>"
+            },
+            "text": {
+                "body": "<p>Texte</p>"
+            }
+        }
+    ]
+}

package/lib/generators/micromag-project/templates/home.module.scss

@@ -0,0 +1,19 @@
+@import '../commons/variables';
+@import '../commons/placeholders';
+@import '../commons/mixins';
+
+.container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+
+    .micromag {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+    }
+}

package/lib/generators/micromag-project/templates/styles.scss

@@ -0,0 +1,2 @@
+@import '~@micromag/core/scss/styles';
+@import '~@micromag/viewer/scss/styles';

package/lib/generators/prettier/index.js

@@ -25,8 +25,8 @@ module.exports = class PrettierGenerator extends _generator.default {
       },
       dependencies() {
         this.addDevDependencies({
-          prettier: '^2.8.4',
-          '@prettier/plugin-php': '^0.19.3',
+          prettier: '^3.2.5',
+          '@prettier/plugin-php': '^0.22.2',
           '@trivago/prettier-plugin-sort-imports': '^4.1.1'
         });
       }

package/lib/generators/react-app/index.js

@@ -92,16 +92,15 @@ module.exports = class ReactAppGenerator extends _generator.default {
           'react-dom': '^18.0.0',
           'prop-types': '^15.0.0',
           'react-intl': '^6.0.0',
-          'react-router': '^6.0.0',
-          'react-router-dom': '^6.0.0',
+          'wouter': '^3.0.0',
           'react-helmet': '^6.0.0',
           classnames: '^2.3.1',
-          '@folklore/routes': '^0.1.1',
-          '@folklore/fonts': '^0.0.11',
-          '@folklore/forms': '^0.0.19',
+          '@folklore/routes': '^0.2.31',
+          '@folklore/fonts': '^0.0.13',
+          '@folklore/forms': '^0.0.22',
           '@folklore/fetch': '^0.1.15',
-          '@folklore/hooks': '^0.0.27',
-          '@folklore/tracking': '^0.0.14',
+          '@folklore/hooks': '^0.0.42',
+          '@folklore/tracking': '^0.0.16',
           // Polyfills
           intl: '^1.2.5',
           '@formatjs/intl-locale': '^3.0.5',

package/lib/generators/react-app/templates/src/components/App.jsx

@@ -2,7 +2,7 @@ import { RoutesProvider } from '@folklore/routes';
 import PropTypes from 'prop-types';
 import React from 'react';
 import { IntlProvider } from 'react-intl';
-import { BrowserRouter } from 'react-router-dom';
+import { Router } from 'wouter';
 
 // import * as AppPropTypes from '../lib/PropTypes';
 import Routes from './Routes';
@@ -20,18 +20,20 @@ const propTypes = {
 
 const defaultProps = {
     intl: null,
-    routes: {},
+    routes: {
+        home: '/'
+    },
 };
 
 function App({ intl, routes }) {
     const { locale = 'fr', messages = {} } = intl || {};
     return (
         <IntlProvider locale={locale} messages={messages[locale] || messages}>
-            <BrowserRouter>
+            <Router>
                 <RoutesProvider routes={routes}>
                     <Routes />
                 </RoutesProvider>
-            </BrowserRouter>
+            </Router>
         </IntlProvider>
     );
 }

package/lib/generators/react-app/templates/src/components/Routes.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 // import PropTypes from 'prop-types';
-import { Route, Routes } from 'react-router-dom';
+import { Route, Switch } from 'wouter';
 import { useRoutes } from '@folklore/routes';
 
 // import { useUrlGenerator } from '@folklore/routes';
@@ -18,25 +18,18 @@ const defaultProps = {};
 function Routes() {
     const routes = useRoutes() || {};
     return (
-        <Routes>
-            <Route
-                path={routes.home || '/'}
-                exact
-                element={
-                    <MainLayout>
-                        <HomePage />
-                    </MainLayout>
-                }
-            />
-            <Route
-                path="*"
-                element={
-                    <MainLayout>
-                        <ErrorPage />
-                    </MainLayout>
-                }
-            />
-        </Routes>
+        <Switch>
+            <Route path={routes.home || '/'}>
+                <MainLayout>
+                    <HomePage />
+                </MainLayout>
+            </Route>
+            <Route>
+                <MainLayout>
+                    <ErrorPage />
+                </MainLayout>
+            </Route>
+        </Switch>
     );
 }
 

package/lib/generators/react-app/templates/src/components/buttons/Button.jsx

@@ -2,7 +2,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import { Link } from 'react-router-dom';
+import { Link } from 'wouter';
 
 import * as AppPropTypes from '../../lib/PropTypes';
 
@@ -140,7 +140,7 @@ function Button({
                 {content}
             </a>
         ) : (
-            <Link to={href} className={buttonClassNames} onClick={onClick}>
+            <Link href={href} className={buttonClassNames} onClick={onClick}>
                 {content}
             </Link>
         );

package/lib/generators/react-app/templates/src/components/menus/Menu.jsx

@@ -2,7 +2,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import { Link } from 'react-router-dom';
+import { Link } from 'wouter';
 
 import * as AppPropTypes from '../../lib/PropTypes';
 
@@ -44,7 +44,7 @@ function Menu({ items, className }) {
                                 {label}
                             </a>
                         ) : (
-                            <Link to={url} className={styles.link}>
+                            <Link href={url} className={styles.link}>
                                 {label}
                             </Link>
                         )}

package/lib/generators/react-app/templates/src/components/pages/Error.jsx

@@ -1,7 +1,7 @@
 /* eslint-disable react/jsx-props-no-spreading */
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Link } from 'react-router-dom';
+import { Link } from 'wouter';
 import { defineMessages, FormattedMessage } from 'react-intl';
 import { useUrlGenerator } from '@folklore/routes';
 
@@ -90,7 +90,7 @@ function ErrorPage({ statusCode }) {
                     <FormattedMessage {...messages[`description${statusCode || 404}`]} />
                 </p>
                 <div className={styles.actions}>
-                    <Link to={url('home')}>
+                    <Link href={url('home')}>
                         <FormattedMessage {...messages.gotoHome} />
                     </Link>
                 </div>

package/lib/generators/stylelint/index.js

@@ -31,10 +31,10 @@ module.exports = class StylelintGenerator extends _generator.default {
       },
       dependencies() {
         this.addDevDependencies({
-          stylelint: '^15.0.0',
-          'stylelint-config-standard-scss': '^7.0.1',
-          'stylelint-config-idiomatic-order': '^9.0.0',
-          'stylelint-config-standard': '^30.0.1'
+          stylelint: '^16.2.1',
+          'stylelint-config-standard-scss': '^13.0.0',
+          'stylelint-config-idiomatic-order': '^10.0.0',
+          'stylelint-config-standard': '^36.0.0'
         });
       }
     };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "generator-folklore",
-    "version": "3.0.20",
+    "version": "3.0.22",
     "description": "Yeoman generator for projects at Folklore",
     "keywords": [
         "yeoman-generator"
@@ -40,5 +40,5 @@
         "yeoman-generator": "^5.7.0",
         "yeoman-remote": "^1.0.1"
     },
-    "gitHead": "1a9d97a88dd685576bbe9fb306ea7a10b2ab9f03"
+    "gitHead": "299c4d804aaa15455627b5ae353d3936da9fd692"
 }