@abcnews/aunty 16.0.0 → 17.0.0-next.0

package/src/generators/component/templates/basic/component-with-d3.test.ts

@@ -1,7 +0,0 @@
-import <%= className %> from '.';
-
-test('it renders', () => {
-  const component = new <%= className %>();
-
-  expect(component.el.innerHTML).toContain('<svg');
-});

package/src/generators/component/templates/basic/component-with-d3.ts

@@ -1,30 +0,0 @@
-import { select<% if (isTS) { %>, Selection<% } %> } from 'd3-selection';
-import styles from './styles.scss';
-
-export default class <%= className %> {<% if (isTS) { %>
-  el: Element;
-  svg: Selection<SVGSVGElement, unknown, null, undefined>;
-  g: Selection<SVGGElement, unknown, null, undefined>;
-  rect: Selection<SVGRectElement, any, any, any>;
-<% } %>
-  constructor() {
-    this.el = document.createElement('div');
-    this.el.className = styles.root;
-
-    this.svg = select(this.el)
-      .append('svg')
-      .attr('width', 400)
-      .attr('height', 300);
-
-    this.g = this.svg.append('g').attr('fill', 'black');
-
-    this.rect = this.g
-      .append('rect')
-      .attr('x', 0)
-      .attr('y', 0)
-      .attr('rx', 3)
-      .attr('ry', 3)
-      .attr('width', '100%')
-      .attr('height', '100%');
-  }
-}

package/src/generators/component/templates/basic/component.test.ts

@@ -1,7 +0,0 @@
-import <%= className %> from '.';
-
-test('it renders', () => {
-  const component = new <%= className %>();
-
-  expect(component.el.innerHTML).toContain('Find me in');
-});

package/src/generators/component/templates/basic/component.ts

@@ -1,11 +0,0 @@
-import styles from './styles.scss';
-
-export default class <%= className %> {<% if (isTS) { %>
-  el: Element;
-<% } %>
-  constructor() {
-    this.el = document.createElement('div');
-    this.el.className = styles.root;
-    this.el.innerHTML = `Find me in <strong>src/components/<%= className %></strong>`;
-  }
-}

package/src/generators/component/templates/preact/component-with-d3.test.tsx

@@ -1,16 +0,0 @@
-import { h } from 'preact';
-import render from 'preact-render-to-string';
-import htmlLooksLike from 'html-looks-like';
-
-import <%= className %> from '.';
-
-describe('<%= className %>', () => {
-  test('It renders', () => {
-    const actual = render(<<%= className %> />);
-    const expected = `
-      <div></div>
-    `;
-
-    htmlLooksLike(actual, expected);
-  });
-});

package/src/generators/component/templates/preact/component-with-d3.tsx

@@ -1,45 +0,0 @@
-import { select<% if (isTS) { %>, Selection<% } %> } from 'd3-selection';
-import { h<% if (isTS) { %>, FunctionalComponent<% } %> } from 'preact';
-import { useEffect, useRef } from 'preact/hooks';
-import styles from './styles.scss';
-<% if (isTS) { %>
-type <%= className %>Props = {
-  color?: string;
-}
-<% } %>
-const <%= className %><% if (isTS) { %>: FunctionalComponent<<%= className %>Props><% } %> = ({ color = 'black' }) => {
-  const root = useRef<% if (isTS) { %><Element | null><% } %>(null);
-  const svg = useRef<% if (isTS) { %><Selection<SVGSVGElement, unknown, null, undefined> | null><% } %>(null);
-  const g = useRef<% if (isTS) { %><Selection<SVGGElement, unknown, null, undefined> | null><% } %>(null);
-  const rect = useRef<% if (isTS) { %><Selection<SVGRectElement, unknown, null, undefined> | null><% } %>(null);
-
-  useEffect(() => {
-    svg.current = select(root.current)
-      .append('svg')
-      .attr('width', 400)
-      .attr('height', 300);
-
-    g.current = svg.current.append('g');
-
-    rect.current = g.current
-      .append('rect')
-      .attr('x', 0)
-      .attr('y', 0)
-      .attr('rx', 3)
-      .attr('ry', 3)
-      .attr('width', '100%')
-      .attr('height', '100%');
-  }, []);
-
-  useEffect(() => {
-    if (!g.current) {
-      return;
-    }
-
-    g.current.attr('fill', color);
-  }, [color]);
-
-  return <div ref={root} className={styles.root}></div>;
-};
-
-export default <%= className %>;

package/src/generators/component/templates/preact/component.test.tsx

@@ -1,18 +0,0 @@
-import { h } from 'preact';
-import render from 'preact-render-to-string';
-import htmlLooksLike from 'html-looks-like';
-
-import <%= className %> from '.';
-
-describe('<%= className %>', () => {
-  test('It renders', () => {
-    const actual = render(<<%= className %> />);
-    const expected = `
-      <div>
-        Find me in {{ ... }}
-      </div>
-    `;
-
-    htmlLooksLike(actual, expected);
-  });
-});

package/src/generators/component/templates/preact/component.tsx

@@ -1,14 +0,0 @@
-import { h<% if (isTS) { %>, FunctionalComponent<% } %> } from 'preact';
-import styles from './styles.scss';
-<% if (isTS) { %>
-type <%= className %>Props = {}
-<% } %>
-const <%= className %><% if (isTS) { %>: FunctionalComponent<<%= className %>Props><% } %> = () => {
-  return (
-    <div className={styles.root}>
-      Find me in <strong>src/components/<%= className %></strong>
-    </div>
-  );
-};
-
-export default <%= className %>;

package/src/generators/component/templates/react/component-with-d3.test.tsx

@@ -1,13 +0,0 @@
-import React from 'react';
-import renderer from 'react-test-renderer';
-
-import <%= className %> from '.';
-
-describe('<%= className %>', () => {
-  test('It renders', () => {
-    const component = renderer.create(<<%= className %> />);
-
-    let tree = component.toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-});

package/src/generators/component/templates/react/component-with-d3.tsx

@@ -1,44 +0,0 @@
-import { select<% if (isTS) { %>, Selection<% } %> } from 'd3-selection';
-import React, { useEffect, useRef } from 'react';
-import styles from './styles.scss';
-<% if (isTS) { %>
-type <%= className %>Props = {
-  color?: string;
-}
-<% } %>
-const <%= className %><% if (isTS) { %>: React.FC<<%= className %>Props><% } %> = ({ color = 'black' }) => {
-  const root = useRef<% if (isTS) { %><HTMLDivElement | null><% } %>(null);
-  const svg = useRef<% if (isTS) { %><Selection<SVGSVGElement, unknown, null, undefined> | null><% } %>(null);
-  const g = useRef<% if (isTS) { %><Selection<SVGGElement, unknown, null, undefined> | null><% } %>(null);
-  const rect = useRef<% if (isTS) { %><Selection<SVGRectElement, unknown, null, undefined> | null><% } %>(null);
-
-  useEffect(() => {
-    svg.current = select(root.current)
-      .append('svg')
-      .attr('width', 400)
-      .attr('height', 300);
-
-    g.current = svg.current.append('g');
-
-    rect.current = g.current
-      .append('rect')
-      .attr('x', 0)
-      .attr('y', 0)
-      .attr('rx', 3)
-      .attr('ry', 3)
-      .attr('width', '100%')
-      .attr('height', '100%');
-  }, []);
-
-  useEffect(() => {
-    if (!g.current) {
-      return;
-    }
-
-    g.current.attr('fill', color);
-  }, [color]);
-
-  return <div ref={root} className={styles.root}></div>;
-};
-
-export default <%= className %>;

package/src/generators/component/templates/react/component.test.tsx

@@ -1,13 +0,0 @@
-import React from 'react';
-import renderer from 'react-test-renderer';
-
-import <%= className %> from '.';
-
-describe('<%= className %>', () => {
-  test('It renders', () => {
-    const component = renderer.create(<<%= className %> />);
-
-    let tree = component.toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-});

package/src/generators/component/templates/react/component.tsx

@@ -1,14 +0,0 @@
-import React from 'react';
-import styles from './styles.scss';
-<% if (isTS) { %>
-type <%= className %>Props = {}
-<% } %>
-const <%= className %><% if (isTS) { %>: React.FC<<%= className %>Props><% } %> = () => {
-  return (
-    <div className={styles.root}>
-      Find me in <strong>src/components/<%= className %></strong>
-    </div>
-  );
-}
-
-export default <%= className %>;

package/src/generators/component/templates/svelte/component-with-d3.svelte

@@ -1,46 +0,0 @@
-<script<% if (isTS) { %> lang="ts"<% } %>>
-  export let color<% if (isTS) { %>: string<% } %> = 'black';
-
-  import { select } from 'd3-selection';<% if (isTS) { %>
-  import type { Selection } from 'd3-selection';<% } %>
-  import { afterUpdate, onMount } from 'svelte';
-
-  let root<% if (isTS) { %>: HTMLDivElement<% } %>;
-  let svg<% if (isTS) { %>: Selection<SVGSVGElement, unknown, null, undefined><% } %>;
-  let g<% if (isTS) { %>: Selection<SVGGElement, unknown, null, undefined><% } %>;
-  let rect<% if (isTS) { %>: Selection<SVGRectElement, unknown, null, undefined><% } %>;
-
-  onMount(() => {
-    svg = select(root)
-      .append('svg')
-      .attr('width', 400)
-      .attr('height', 300);
-
-    g = svg.append('g').attr('fill', color);
-
-    rect = g
-      .append('rect')
-      .attr('x', 0)
-      .attr('y', 0)
-      .attr('rx', 3)
-      .attr('ry', 3)
-      .attr('width', '100%')
-      .attr('height', '100%');
-  });
-
-  afterUpdate(() => {
-    g.attr('fill', color);
-  });
-</script>
-
-<div bind:this={root} />
-
-<style lang="scss">
-  div {
-    border: 1px solid rgb(255, 115, 0);
-    padding: 20px;
-    text-align: center;
-    color: black;
-  }
-</style>
-

package/src/generators/component/templates/svelte/component-with-d3.test.ts

@@ -1,10 +0,0 @@
-import { render } from '@testing-library/svelte'
-import <%= className %> from './<%= className %>.svelte';
-
-describe('<%= className %>', () => {
-  it('renders a snapshot', () => {
-    const { container } = render(<%= className %>);
-
-    expect(container).toMatchSnapshot();
-  });
-});

package/src/generators/component/templates/svelte/component.svelte

@@ -1,17 +0,0 @@
-<script<% if (isTS) { %> lang="ts"<% } %>>
-
-</script>
-
-<div>
-  Find me in
-  <strong>src/components/<%= className %></strong>
-</div>
-
-<style lang="scss">
-  div {
-    border: 1px solid rgb(255, 115, 0);
-    padding: 20px;
-    text-align: center;
-    color: black;
-  }
-</style>

package/src/generators/component/templates/svelte/component.test.ts

@@ -1,10 +0,0 @@
-import { render } from '@testing-library/svelte'
-import <%= className %> from './<%= className %>.svelte';
-
-describe('<%= className %>', () => {
-  it('renders a snapshot', () => {
-    const { container } = render(<%= className %>);
-
-    expect(container).toMatchSnapshot();
-  });
-});

package/src/generators/project/index.js

@@ -1,244 +0,0 @@
-// Native
-const path = require('path');
-
-// External
-const getAllPaths = require('get-all-paths');
-const makeDir = require('make-dir');
-const requireg = require('requireg');
-const Generator = require('yeoman-generator');
-const { to: wrap } = require('await-to-js');
-const importLazy = require('import-lazy')(require);
-
-// Ours
-const { OUTPUT_DIRECTORY_NAME } = require('../../constants');
-const { cmd, hvy, opt } = require('../../utils/color');
-const { success } = require('../../utils/logging');
-const { installDependencies } = require('../../utils/npm');
-const { combine } = require('../../utils/structures');
-const { sluggify } = require('../../utils/text');
-const { projectExists } = require('../../utils/ftp');
-const { log, warn, info } = importLazy('../../utils/logging');
-
-module.exports = class extends Generator {
-  constructor(args, opts) {
-    super(args, {
-      ...opts,
-      localConfigOnly: true
-    });
-
-    this.argument('name', {
-      description: `Project name. Create this directory if ${opt('--here')} is not specified`,
-      required: false
-    });
-    this.option('here', { description: `Assume ${opt('<name>')} is current working directory`, type: Boolean });
-    this.option('template', { description: 'Type of project [basic|preact|react|svelte]', type: String });
-  }
-
-  usage() {
-    return `${cmd('aunty generate project')} -- ${opt('[options] [<name>]')}
-
-  Two shorthands are available - ${cmd('aunty new')} and ${cmd('aunty init')} - for quick project creation.
-
-Shorthand examples (assuming xyz is your project name):
-
-  ${cmd('aunty new')}        ==>    ${cmd('aunty generate project')}
-  ${cmd('aunty new')} ${opt('xyz')}    ==>    ${cmd('aunty generate project')} -- ${opt('xyz')}
-  ${cmd('aunty init')}       ==>    ${cmd('aunty generate project')} -- ${opt('--here')}
-`;
-  }
-
-  async prompting() {
-    let prompts = [];
-
-    if (this.options.here) {
-      const currentDirectory = path.basename(process.cwd());
-
-      info(`Info: Using currect directory name as project name:`, currentDirectory);
-      log('Checking project name. This may take a few seconds...');
-
-      const [err, exists] = await wrap(projectExists(sluggify(currentDirectory)));
-
-      if (exists)
-        warn(
-          'Warning: Project with the same name detected externally. ' +
-            'Danger of data loss if you continue. ' +
-            'Press ctrl+c to exit and rename project directory.'
-        );
-
-      if (err)
-        warn(
-          'Warning: Unable to check if project name already exists, most likely ' +
-            'due to a connection or credentials error. Please check manually before deploying.\n'
-        );
-
-      this.options.projectName = currentDirectory;
-    } else {
-      prompts.push({
-        type: 'input',
-        name: 'projectName',
-        message: 'What is your project called?',
-        default: this.options.projectName || 'New Project',
-        validate: async input => {
-          log('\nChecking project name. This may take a few seconds...');
-
-          const [err, exists] = await wrap(projectExists(sluggify(input)));
-
-          if (exists)
-            return (
-              'Error: Project seems to aleady exist on the FTP server and is in ' +
-              'danger of being overwritten. Please try a different name.'
-            );
-
-          if (err)
-            warn(
-              'Warning: Unable to check if project name already exists, most likely ' +
-                'due to a connection or credentials error. Please check manually before deploying.\n'
-            );
-
-          return true;
-        }
-      });
-    }
-
-    if (!this.options.template) {
-      prompts.push({
-        type: 'list',
-        name: 'template',
-        message: 'What type of project is it?',
-        choices: [
-          { name: 'Basic', value: 'basic' },
-          { name: 'Preact', value: 'preact' },
-          { name: 'React', value: 'react' },
-          { name: 'Svelte', value: 'svelte' }
-        ]
-      });
-    }
-
-    prompts.push({
-      type: 'confirm',
-      name: 'typescript',
-      message: 'Will you be authoring your project in TypeScript?',
-      default: true
-    });
-
-    prompts.push({
-      type: 'confirm',
-      name: 'odyssey',
-      message: 'Will this project render components inside an Odyssey?',
-      default: false
-    });
-
-    const answers = await this.prompt(prompts);
-
-    this.options = combine(this.options, answers);
-
-    this.options.projectName = this.options.projectName.replace(/[^\w\-\_\s]/g, '');
-
-    this.options.projectNameSlug = sluggify(this.options.projectName);
-
-    this.options.projectNameFlat = this.options.projectNameSlug.replace(/-/g, '');
-
-    if (this.options.here) {
-      this.options.path = process.cwd();
-    } else {
-      this.options.path = process.cwd() + '/' + this.options.projectNameSlug;
-    }
-  }
-
-  async configuring() {
-    const directory = this.options.path;
-
-    await makeDir(directory);
-    process.chdir(directory);
-    this.destinationRoot(directory);
-  }
-
-  writing() {
-    const context = {
-      OUTPUT_DIRECTORY_NAME,
-      projectName: this.options.projectName,
-      projectNameSlug: this.options.projectNameSlug,
-      projectNameFlat: this.options.projectNameFlat,
-      projectType: this.options.template,
-      isTS: this.options.typescript,
-      isOdyssey: this.options.odyssey,
-      authorName: this.user.git.name(),
-      authorEmail: this.user.git.email()
-    };
-
-    const hasSFCs = this.options.template === 'svelte';
-    const templateDirs = [this.options.template, '_common'].concat(hasSFCs ? [] : ['_non_sfc']);
-    const templateDirPaths = templateDirs.map(dir => this.templatePath(dir));
-    const pathExclusions = [].concat(this.options.typescript ? [] : ['tsconfig.json']);
-    const pathReplacements = templateDirPaths
-      .map(dirPath => [`${dirPath}/`, ''])
-      .concat(this.options.typescript ? [] : [[/\.tsx?/, '.js']], [['_.', '.']]);
-
-    getAllPaths(...templateDirPaths).forEach(filePath => {
-      if (pathExclusions.some(exclusion => filePath.includes(exclusion))) {
-        return;
-      }
-
-      this.fs.copyTpl(
-        filePath,
-        this.destinationPath(
-          pathReplacements.reduce((filePath, replacement) => filePath.replace(...replacement), filePath)
-        ),
-        context
-      );
-    });
-  }
-
-  async install() {
-    let auntyVersion;
-
-    try {
-      auntyVersion = requireg('@abcnews/aunty/package.json').version;
-    } catch (ex) {
-      // Nothing
-    }
-
-    const devDependencies = [`@abcnews/aunty${auntyVersion ? `@${auntyVersion}` : ''}`].concat(
-      this.options.typescript ? ['@types/jest', '@types/webpack-env'] : []
-    );
-    const dependencies = ['@abcnews/alternating-case-to-object', '@abcnews/env-utils', '@abcnews/mount-utils'];
-
-    switch (this.options.template) {
-      case 'preact':
-        devDependencies.push('html-looks-like', 'preact-render-to-string');
-        dependencies.push('preact');
-        break;
-      case 'react':
-        devDependencies.push(
-          'react-test-renderer',
-          ...(this.options.typescript ? ['@types/react', '@types/react-dom', '@types/react-test-renderer'] : [])
-        );
-        dependencies.push('react', 'react-dom');
-        break;
-      case 'svelte':
-        devDependencies.push('@testing-library/svelte');
-        dependencies.push('svelte@5');
-        break;
-      default:
-        break;
-    }
-
-    const allDependencies = [].concat(devDependencies).concat(dependencies);
-    const projectDirectoryName = this.options.path.split('/').reverse()[0];
-
-    if (allDependencies.includes(projectDirectoryName)) {
-      throw new Error(
-        `npm will refuse to install a package ("${projectDirectoryName}") which matches the project directory name.`
-      );
-    }
-
-    await installDependencies(devDependencies.sort(), ['--save-dev'], this.log);
-    await installDependencies(dependencies.sort(), null, this.log);
-  }
-
-  end() {
-    const where = this.options.here ? 'the current directory' : `./${this.options.projectNameSlug}`;
-
-    success(`Created ${hvy(this.options.projectName)} project in ${hvy(where)}`);
-  }
-};

package/src/generators/project/templates/_common/.editorconfig

@@ -1,12 +0,0 @@
-root = true
-
-[*]
-indent_style = space
-indent_size = 2
-end_of_line = lf
-charset = utf-8
-trim_trailing_whitespace = true
-insert_final_newline = false
-
-[*.md]
-trim_trailing_whitespace = false

package/src/generators/project/templates/_common/.prettierrc

@@ -1,6 +0,0 @@
-{
-  "arrowParens": "avoid",
-  "printWidth": 120,
-  "singleQuote": true,
-  "trailingComma": "none"
-}

package/src/generators/project/templates/_common/LICENSE

@@ -1,21 +0,0 @@
-The MIT License (MIT)
-
-Copyright (c) <%= new Date().getFullYear() %> ABC News
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/src/generators/project/templates/_common/README.md

@@ -1,3 +0,0 @@
-# <%= projectName %>
-
-A project generated from [aunty](https://github.com/abcnews/aunty)'s `<%= projectType %>` project template.

package/src/generators/project/templates/_common/_.gitignore

@@ -1,12 +0,0 @@
-# dependencies
-/node_modules
-
-# environment
-.env
-
-# output
-/<%= OUTPUT_DIRECTORY_NAME %>
-
-# misc
-.DS_Store
-npm-debug.log

package/src/generators/project/templates/_common/package.json

@@ -1,18 +0,0 @@
-{
-  "name": "<%= projectNameSlug %>",
-  "version": "1.0.0-pre",
-  "description": "A project generated from aunty's <%= projectType %> project template.",
-  "license": "MIT",
-  "private": true,
-  "contributors": [
-    "<%= authorName %> <<%= authorEmail %>>"
-  ],
-  "aunty": {
-    "type": "<%= projectType %>"
-  },
-  "scripts": {
-    "start": "aunty serve",
-    "dev": "aunty serve",
-    "test": "aunty test"
-  }
-}