@frankenstyle/uikit 0.0.1

package/CONTRIBUTING.md

@@ -0,0 +1,96 @@
+# Contributing to UIkit
+
+You want to contribute to UIkit? Awesome. Please take a few moments to
+review the following guidelines to get you started. Cheers.
+
+* [Communication channels](#communication)
+* [Team members](#team)
+* [Documentation](#documentation)
+* [Issue tracker](#issues)
+* [Bug reports](#bugs)
+* [Pull requests](#pull-requests)
+* [Versioning](#versioning)
+* [License](#license)
+
+<a name="communication"></a>
+## Communication channels
+
+Before you get lost in the repository, here are a few starting points
+for you to check out. You might find that others have had similar
+questions or that your question rather belongs in one place than another.
+
+* Chat: https://discord.gg/NEt4Pv7
+* Website: https://getuikit.com
+* Twitter: https://twitter.com/getuikit
+
+
+<a name="team"></a>
+## Team members
+
+UIkit is developed as an open source project by [YOOtheme](http://yootheme.com)
+in Hamburg, Germany. The core maintainers you will encounter in this project
+are all part of YOOtheme.
+
+## Documentation
+
+The UIkit documentation is maintained as a collection of Markdown files in its
+[own repository](https://github.com/uikit/uikit-site). Any pull requests are highly appreciated.
+
+<a name="issues"></a>
+## Using the issue tracker
+
+The issue tracker is the preferred channel for [bug reports](#bugs),
+[features requests](#features) and [submitting pull
+requests](#pull-requests), but please respect the following restriction:
+
+Please **do not** use the issue tracker for personal support requests (use [Discord chat](https://discord.gg/NEt4Pv7)).
+
+<a name="bugs"></a>
+## Bug reports
+
+A bug is a _demonstrable problem_ that is caused by the code in the repository.
+Good bug reports are extremely helpful - thank you!
+
+A good bug report shouldn't leave others needing to chase you up for more
+information. Please try to be as detailed as possible in your report. What is
+your environment? What steps will reproduce the issue? What would you expect to
+be the outcome? All these details will help people to fix any potential bugs.
+
+<a name="pull-requests"></a>
+## Pull requests
+
+Good pull requests - patches, improvements, new features - are a fantastic
+help. Thanks for taking the time to contribute.
+
+**Please ask first** before embarking on any significant pull request,
+otherwise you risk spending a lot of time working on something that the
+project's developers might not want to merge into the project.
+
+UIkit follows the [GitFlow branching model](http://nvie.com/posts/a-successful-git-branching-model). The ```main``` branch always reflects a production-ready state while the latest development is taking place in the ```develop``` branch.
+
+Each time you want to work on a fix or a new feature, create a new branch based on the ```develop``` branch: ```git checkout -b BRANCH_NAME develop```. Only pull requests to the ```develop``` branch will be merged.
+
+<a name="commit-message-convention"></a>
+## Commit Message Convention
+
+UIkit adapts the [Vue's commit convention](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md). Commit messages can have the following types:
+
+- `build:` Changes that affect the build system or external dependencies
+- `chore:` Changes to readme, etc
+- `ci:` Changes to our CI configuration files and scripts
+- `docs:` Documentation only changes
+- `feat:` A new feature
+- `fix:` A bug fix
+- `perf:` A code change that improves performance
+- `refactor:` A code change that neither fixes a bug nor adds a feature
+- `style:` Changes that do not affect the meaning of the code (white-space, formatting, etc.)
+- `test:` Adding missing tests or correcting existing tests
+
+## Versioning
+
+UIkit is maintained by using the [Semantic Versioning Specification (SemVer)](http://semver.org).
+
+<a name="license"></a>
+## License
+
+By contributing your code, you agree to license your contribution under the [MIT license](LICENSE)

package/LICENSE.md

@@ -0,0 +1,7 @@
+Copyright (c) 2013-2020 YOOtheme GmbH, getuikit.com
+
+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/README.md

@@ -0,0 +1,65 @@
+[![uikit banner](https://cloud.githubusercontent.com/assets/321047/21769911/474d7d9e-d681-11e6-9fe0-d95f8ccfd3a9.jpg)](https://getuikit.com/)
+
+# UIkit
+
+[![Discord](https://img.shields.io/badge/chat-on%20discord-7289da.svg)](https://discord.gg/NEt4Pv7)
+[![Build](https://circleci.com/gh/uikit/uikit.svg?style=shield)](https://circleci.com/gh/uikit/uikit)
+[![jsdelivr](https://data.jsdelivr.com/v1/package/npm/uikit/badge?style=rounded)](https://www.jsdelivr.com/package/npm/uikit)
+
+UIkit is a lightweight and modular front-end framework for developing fast and powerful web interfaces.
+
+* [Homepage](https://getuikit.com) - Learn more about UIkit
+* [@getuikit](https://twitter.com/getuikit) - Get the latest buzz on Twitter
+* [Discord Chat](https://discord.gg/NEt4Pv7) - Join our developer chat on Discord.
+
+---
+
+<p align="center">
+  <b>UIkit is an Open Source project developed by YOOtheme.</b>
+  <br><br>
+  <a href="https://yootheme.com" align="center">
+      <img width="134" height="30" src="https://yootheme.com/site/images/yootheme-logo.svg" alt="YOOtheme">
+  </a>
+</p>
+
+---
+
+## Getting started
+
+You have the following options to get UIkit:
+
+- Download the [latest release](https://github.com/uikit/uikit/releases/latest) with pre-built CSS and JS.
+- Install with [npm](https://npmjs.com) to get all source files as they are available on GitHub: ```npm install uikit```
+- Install with [yarn](https://yarnpkg.com/) to get all source files as they are available on GitHub: ```yarn add uikit```
+- Install with [pnpm](https://pnpm.io/) to get all source files as they are available on GitHub: ```pnpm add uikit```
+- Directly load UIkit from [jsDelivr](https://www.jsdelivr.com): https://www.jsdelivr.com/package/npm/uikit
+- Clone the repo to get all source files including build scripts: `git clone git@github.com:uikit/uikit.git`
+
+## Developers
+
+To always have the latest development version of UIkit, even before a release, you may want to use npm or yarn with the `dev` tag.
+
+- Using npm: ```npm install uikit@dev```
+- Using yarn: ```yarn add uikit@dev```
+- Using pnpm: ```pnpm add uikit@dev```
+- Using [cdn](cdn.jsdelivr.net): https://cdn.jsdelivr.net/npm/uikit@dev
+
+## Contributing
+
+Finding bugs, sending pull requests or improving our docs - any contribution is welcome and highly appreciated. To get started, head over to our [contribution guidelines](CONTRIBUTING.md). Thanks!
+
+## Versioning
+
+UIkit is maintained by using the [Semantic Versioning Specification (SemVer)](https://semver.org).
+
+## Browser Support
+
+| ![Firefox](https://raw.github.com/alrra/browser-logos/main/src/firefox/firefox_48x48.png) | ![Safari](https://raw.github.com/alrra/browser-logos/main/src/safari/safari_48x48.png) | ![Chrome](https://raw.github.com/alrra/browser-logos/main/src/chrome/chrome_48x48.png) | ![Edge](https://raw.github.com/alrra/browser-logos/main/src/edge/edge_48x48.png) | ![Opera](https://raw.github.com/alrra/browser-logos/main/src/opera/opera_48x48.png) |
+|-------------------------------------------------------------------------------------------|----------------------------------------------------------------------------------------|----------------------------------------------------------------------------------------|----------------------------------------------------------------------------------|-------------------------------------------------------------------------------------|
+| Latest ✔                                                                                  | Latest ✔                                                                               | Latest ✔                                                                               | Latest ✔                                                                         | Latest ✔                                                                            |
+
+Tested With<br>[![BrowserStack](https://user-images.githubusercontent.com/355427/27389060-9f716c82-569d-11e7-923c-bd5fe7f1c55a.png)](https://www.browserstack.com)
+
+## Copyright and License
+
+Copyright [YOOtheme](https://yootheme.com) GmbH under the [MIT license](LICENSE.md).

package/build/build.js

@@ -0,0 +1,95 @@
+import camelize from 'camelcase';
+import { glob } from 'glob';
+import pLimit from 'p-limit';
+import path from 'path';
+import { args, compile, icons } from './util.js';
+
+const limit = pLimit(Number(process.env.cpus || 2));
+
+const bundles = getBundleTasks();
+const components = await getComponentTasks();
+const buildAll =
+    args.all ||
+    !Object.keys(args).filter((name) => !['d', 'debug', 'nominify', 'watch', '_'].includes(name))
+        .length;
+
+if (args.h || args.help) {
+    console.log(`
+        usage:
+
+        build.js [componentA, componentB, ...] [-d|debug|nominify|watch]
+
+        examples:
+
+        build.js // builds all of uikit, including icons, components and does minification (implies 'all')
+        build.js uikit icons -d // builds uikit and the icons, skipping the minification and components
+        build.js core lightbox -d // builds uikit-core and the lightbox, skipping the minification
+
+        available components:
+
+        bundles: ${Object.keys(bundles).join(', ')}
+        components: ${Object.keys(components).join(', ')}
+
+    `);
+    process.exit(0);
+}
+
+let tasks;
+const allTasks = { ...bundles, ...components };
+if (buildAll) {
+    tasks = allTasks;
+} else if (args.components) {
+    tasks = components;
+} else {
+    tasks = Object.keys(args)
+        .map((step) => allTasks[step])
+        .filter((t) => t);
+}
+
+await Promise.all(Object.values(tasks).map((task) => limit(task)));
+
+function getBundleTasks() {
+    return {
+        core: () => compile('src/js/uikit-core.js', 'dist/js/uikit-core'),
+
+        uikit: () => compile('src/js/uikit.js', 'dist/js/uikit'),
+
+        icons: async () =>
+            compile('build/wrapper/icons.js', 'dist/js/uikit-icons', {
+                name: 'icons',
+                replaces: {
+                    ICONS: await icons('custom/icons/*.svg', 'src/images/icons/*.svg'),
+                },
+            }),
+
+        tests: async () =>
+            compile('tests/js/index.js', 'tests/js/test', {
+                name: 'test',
+                replaces: { TESTS: await getTestFiles() },
+            }),
+    };
+}
+
+async function getComponentTasks() {
+    const components = await glob('src/js/components/!(index).js');
+
+    return components.reduce((components, file) => {
+        const name = path.basename(file, '.js');
+
+        components[name] = () =>
+            compile('build/wrapper/component.js', `dist/js/components/${name}`, {
+                name,
+                external: ['uikit', 'uikit-util'],
+                globals: { uikit: 'UIkit', 'uikit-util': 'UIkit.util' },
+                aliases: { component: path.resolve('src/js/components', name) },
+                replaces: { NAME: `'${camelize(name)}'` },
+            });
+
+        return components;
+    }, {});
+}
+
+async function getTestFiles() {
+    const files = await glob('tests/!(index).html');
+    return JSON.stringify(files.sort().map((file) => path.basename(file, '.html')));
+}

package/build/icons.js

@@ -0,0 +1,35 @@
+import { glob } from 'glob';
+import { args, compile, icons } from './util.js';
+
+if (args.h || args.help) {
+    console.log(`
+
+        Builds additional custom uikit icons found in './custom/*/icons'
+
+        usage:
+
+        icons.js [custom|name]
+
+        -c|--custom
+            Specify custom folder to look for icons (default: './custom/*/icons')
+        -n|--name
+            Specify name regex to match against folder (default: '([a-z]+)/icons$')
+
+    `);
+    process.exit(0);
+}
+
+const path = args.c || args.custom || 'custom/*/icons';
+const match = args.n || args.name || '([a-z]+)[\\/]icons$';
+
+await Promise.all((await glob(path)).map(compileIcons));
+
+async function compileIcons(folder) {
+    const [, name] = folder.match(new RegExp(match, 'i'));
+    return compile('build/wrapper/icons.js', `dist/js/uikit-icons-${name}`, {
+        name,
+        replaces: {
+            ICONS: await icons(`${folder}/*.svg`, 'src/images/icons/*.svg'),
+        },
+    });
+}

package/build/less.js

@@ -0,0 +1,95 @@
+import fs from 'fs-extra';
+import { glob } from 'glob';
+import path from 'path';
+import rtlcss from 'rtlcss';
+import { args, banner, minify, read, renderLess, write } from './util.js';
+
+const { rtl } = args;
+const develop = args.develop || args.debug || args.d || args.nominify;
+const sources = [
+    { src: 'src/less/uikit.less', dist: `dist/css/uikit-core${rtl ? '-rtl' : ''}.css` },
+    { src: 'src/less/uikit.theme.less', dist: `dist/css/uikit${rtl ? '-rtl' : ''}.css` },
+];
+
+const themes = (await fs.pathExists('themes.json')) ? await fs.readJson('themes.json') : {};
+
+for (const src of await glob('custom/*.less')) {
+    const theme = path.basename(src, '.less');
+    const dist = `dist/css/uikit.${theme}${rtl ? '-rtl' : ''}.css`;
+
+    themes[theme] = { css: `../${dist}` };
+
+    if (await fs.pathExists(`dist/js/uikit-icons-${theme}.js`)) {
+        themes[theme].icons = `../dist/js/uikit-icons-${theme}.js`;
+    }
+
+    sources.push({ src, dist });
+}
+
+await Promise.all(sources.map(({ src, dist }) => compile(src, dist, develop, rtl)));
+
+if (!rtl && (Object.keys(themes).length || !(await fs.pathExists('themes.json')))) {
+    await write('themes.json', JSON.stringify(themes));
+}
+
+async function compile(file, dist, develop, rtl) {
+    const less = await read(file);
+
+    let output = (
+        await renderLess(less, {
+            rewriteUrls: 'all',
+            rootpath: '../../',
+            paths: ['src/less/', 'custom/'],
+        })
+    ).replace(/\.\.\/dist\//g, '');
+
+    if (rtl) {
+        output = rtlcss.process(
+            output,
+            {
+                stringMap: [
+                    {
+                        name: 'previous-next',
+                        priority: 100,
+                        search: ['previous', 'Previous', 'PREVIOUS'],
+                        replace: ['next', 'Next', 'NEXT'],
+                        options: {
+                            scope: '*',
+                            ignoreCase: false,
+                        },
+                    },
+                ],
+            },
+            [
+                {
+                    name: 'customNegate',
+                    priority: 50,
+                    directives: {
+                        control: {},
+                        value: [],
+                    },
+                    processors: [
+                        {
+                            expr: ['--uk-position-translate-x', 'stroke-dashoffset'].join('|'),
+                            action(prop, value, context) {
+                                return { prop, value: context.util.negate(value) };
+                            },
+                        },
+                    ],
+                },
+            ],
+            {
+                pre(root, postcss) {
+                    root.prepend(postcss.comment({ text: 'rtl:begin:rename' }));
+                    root.append(postcss.comment({ text: 'rtl:end:rename' }));
+                },
+            },
+        );
+    }
+
+    await write(dist, banner + output);
+
+    if (!develop) {
+        await minify(dist);
+    }
+}

package/build/package.json

@@ -0,0 +1,4 @@
+{
+    "private": true,
+    "type": "module"
+}

package/build/prefix.js

@@ -0,0 +1,76 @@
+import { glob } from 'glob';
+import inquirer from 'inquirer';
+import { args, read, replaceInFile } from './util.js';
+
+if (args.h || args.help) {
+    console.log(`
+        usage:
+
+        prefix.js [-p{refix}=prefix] [-s{ource}=folder to replace prefix in]
+
+        example:
+
+        prefix.js // will prompt for a prefix to replace the current one with
+        prefix.js -p=xyz // will replace any existing prefix with xyz
+
+    `);
+    process.exit(0);
+}
+
+const path = args.s || args.source || 'dist';
+const currentPrefix = await findExistingPrefix();
+const prefix = await getPrefix();
+
+if (currentPrefix === prefix) {
+    throw new Error(`already prefixed with: ${prefix}`);
+}
+
+await replacePrefix(currentPrefix, prefix);
+
+async function findExistingPrefix() {
+    return (await read(`${path}/css/uikit.css`)).match(
+        /([a-zA-Z_\x7f-\xff][a-zA-Z0-9_\x7f-\xff]*)(-[a-z]+)?-grid/,
+    )?.[1];
+}
+
+async function getPrefix() {
+    const prefixFromInput = args.p || args.prefix;
+
+    if (!prefixFromInput) {
+        const prompt = inquirer.createPromptModule();
+
+        return (
+            await prompt({
+                name: 'prefix',
+                message: 'enter a prefix',
+                validate: (val) => isValidPrefix(val) || 'invalid prefix',
+            })
+        ).prefix;
+    }
+
+    if (isValidPrefix(prefixFromInput)) {
+        return prefixFromInput;
+    } else {
+        throw `Illegal prefix: ${prefixFromInput}`;
+    }
+}
+
+function isValidPrefix(prefix) {
+    return Boolean(prefix.match(/^[a-zA-Z_\x7f-\xff][a-zA-Z0-9_\x7f-\xff]*$/));
+}
+
+async function replacePrefix(from, to) {
+    for (const file of await glob(`${path}/**/*.css`)) {
+        await replaceInFile(file, (data) =>
+            data.replace(new RegExp(`${from}-([a-z\\d-]+)`, 'g'), `${to}-$1`),
+        );
+    }
+
+    for (const file of await glob(`${path}/**/*.js`)) {
+        await replaceInFile(file, (data) =>
+            data
+                .replace(new RegExp(`${from}-`, 'g'), `${to}-`)
+                .replace(new RegExp(`(${from})?UIkit`, 'g'), `${to === 'uk' ? '' : to}UIkit`),
+        );
+    }
+}

package/build/publishDev.js

@@ -0,0 +1,33 @@
+import { $ } from 'execa';
+import semver from 'semver';
+import { args, getVersion } from './util.js';
+
+const $$ = $({ stdio: 'inherit' });
+
+// default exec options
+if (args.f || args.force || (await isDevCommit())) {
+    // increase version patch number
+    const version = semver.inc(await getVersion(), 'patch');
+
+    // get current git hash
+    const hash = (await $`git rev-parse --short HEAD`).stdout.trim();
+
+    // set version of package.json
+    await $$`pnpm version ${version}-dev.${hash} --no-git-tag-version`;
+
+    // create dist files
+    await $$`pnpm compile`;
+    await $$`pnpm compile-rtl`;
+    await $$`pnpm build-scss`;
+
+    // publish to dev tag
+    await $$`pnpm publish --tag dev --no-git-checks`;
+}
+
+async function isDevCommit() {
+    // check for changes to publish (%B: raw body (unwrapped subject and body)
+    const message = (await $`git log -1 --pretty=%B`).stdout.trim();
+
+    // https://www.conventionalcommits.org/en/v1.0.0/
+    return Boolean(message.match(/^(revert: )?(feat|fix|refactor|perf)(\(.+\))?: .{1,50}/));
+}

package/build/release.js

@@ -0,0 +1,123 @@
+import archiver from 'archiver';
+import dateFormat from 'dateformat/lib/dateformat.js';
+import { $ } from 'execa';
+import fs from 'fs';
+import { glob } from 'glob';
+import inquirer from 'inquirer';
+import semver from 'semver';
+import { args, getVersion, logFile, read, replaceInFile } from './util.js';
+
+const $$ = $({ stdio: 'inherit' });
+const prompt = inquirer.createPromptModule();
+
+if ((await $`git status --porcelain`).stdout.trim()) {
+    throw 'Repository contains uncommitted changes.';
+}
+
+const prevVersion = await getVersion();
+const version = await inquireVersion(args.v || args.version);
+
+await raiseVersion(version);
+
+await $$`pnpm compile`;
+await $$`pnpm compile-rtl`;
+await $$`pnpm build-scss`;
+
+await createPackage(version);
+
+if (args.d || args.deploy || (await inquireDeploy())) {
+    await deploy(version);
+}
+
+function isValidVersion(version) {
+    return semver.valid(version) && semver.gt(version, prevVersion);
+}
+
+async function inquireVersion(version) {
+    if (isValidVersion(version)) {
+        return version;
+    }
+
+    return (
+        await prompt({
+            name: 'version',
+            message: 'Enter a version',
+            default: () =>
+                semver.inc(prevVersion, semver.prerelease(prevVersion) ? 'prerelease' : 'patch'),
+            validate: (val) => isValidVersion(val) || 'Invalid version',
+        })
+    ).version;
+}
+
+function raiseVersion(version) {
+    return Promise.all([
+        $$`npm version ${version} --git-tag-version false`,
+        replaceInFile('CHANGELOG.md', (data) =>
+            data.replace(
+                /^##\s*WIP/m,
+                `## ${versionFormat(version)} (${dateFormat(Date.now(), 'mmmm d, yyyy')})`,
+            ),
+        ),
+        replaceInFile('.github/ISSUE_TEMPLATE/bug-report.md', (data) =>
+            data.replace(prevVersion, version),
+        ),
+    ]);
+}
+
+async function createPackage(version) {
+    const dest = `dist/uikit-${version}.zip`;
+    const archive = archiver('zip');
+
+    archive.pipe(fs.createWriteStream(dest));
+
+    for (const file of await glob('dist/{js,css}/uikit?(-icons|-rtl)?(.min).{js,css}')) {
+        archive.file(file, { name: file.slice(5) });
+    }
+
+    await archive.finalize();
+    await logFile(dest);
+}
+
+function versionFormat(version) {
+    return [semver.coerce(version).version].concat(semver.prerelease(version) || []).join(' ');
+}
+
+async function inquireDeploy() {
+    return (
+        await prompt({
+            name: 'deploy',
+            type: 'confirm',
+            message: 'Do you want to deploy the release?',
+            default: true,
+        })
+    ).deploy;
+}
+
+async function deploy(version) {
+    const tag = `v${version}`;
+    const branch = `release/v${version}`;
+
+    await $$`git checkout -b ${branch}`;
+    await $$`git stage --all`;
+    await $$`git commit -am v${version}`;
+
+    await $$`git checkout main`;
+    await $$`git merge ${branch} --commit --no-ff -m ${`Merge branch '${branch}'`}`;
+    await $$`git tag ${tag}`;
+
+    await $$`git push origin main --tags`;
+
+    await $$`pnpm publish --no-git-checks`;
+
+    const notes = (await read('./Changelog.md'))
+        .match(/## \d.*?$\s*(.*?)\s*(?=## \d)/ms)[1]
+        .replace(/(["`])/g, '\\$1');
+    await $$`gh release create v${version} --repo uikit/uikit --notes ${notes} ./dist/uikit-${version}.zip`;
+
+    await $$`git checkout develop`;
+    await $$`git merge ${tag} --commit --no-ff -m ${`Merge tag '${tag}' into develop`}`;
+
+    await $$`git branch --delete ${branch}`;
+
+    await $$`git push origin develop`;
+}