Merge pull request #5 from hashicorp/chore-setup-rose-addon
Chore setup rose addon
This commit is contained in:
64 files changed
+14755
-72
No files matched your search
@@ -23,3 +23,25 @@ jobs:
|
||||
node-version: '12.x'
|
||||
- run: yarn install
|
||||
- run: yarn audit
|
||||
|
||||
lint:
|
||||
name: Lint
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v2
|
||||
- uses: actions/setup-node@v1
|
||||
with:
|
||||
node-version: '12.x'
|
||||
- run: yarn install
|
||||
- run: yarn lint
|
||||
|
||||
test:
|
||||
name: Test
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v2
|
||||
- uses: actions/setup-node@v1
|
||||
with:
|
||||
node-version: '12.x'
|
||||
- run: yarn install
|
||||
- run: yarn test
|
||||
@@ -19,6 +19,8 @@ libpeerconnection.log
|
||||
npm-debug.log*
|
||||
testem.log
|
||||
yarn-error.log
|
||||
storybook-static
|
||||
**/.storybook/*.html
|
||||
|
||||
# ember-try
|
||||
.node_modules.ember-try
|
||||
|
||||
@@ -31,10 +31,14 @@ You will need the following things properly installed on your computer.
|
||||
* [Git][git]
|
||||
* [Node.js][node]
|
||||
* [Yarn][yarn] installed globally
|
||||
* [Google Chrome][chrome]
|
||||
* [Firefox][firefox]
|
||||
|
||||
[git]: https://git-scm.com/
|
||||
[node]: https://nodejs.org/
|
||||
[yarn]: https://classic.yarnpkg.com/lang/en/
|
||||
[chrome]: https://google.com/chrome/
|
||||
[firefox]: https://firefox.com/
|
||||
[yarn-workspaces]: https://classic.yarnpkg.com/en/docs/workspaces/
|
||||
|
||||
## Installation
|
||||
|
||||
@@ -0,0 +1,19 @@
|
||||
# EditorConfig helps developers define and maintain consistent
|
||||
# coding styles between different editors and IDEs
|
||||
# editorconfig.org
|
||||
|
||||
root = true
|
||||
|
||||
[*]
|
||||
end_of_line = lf
|
||||
charset = utf-8
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
|
||||
[*.hbs]
|
||||
insert_final_newline = false
|
||||
|
||||
[*.{diff,md}]
|
||||
trim_trailing_whitespace = false
|
||||
@@ -0,0 +1,9 @@
|
||||
{
|
||||
/**
|
||||
Ember CLI sends analytics information by default. The data is completely
|
||||
anonymous, but there are times when you might want to disable this behavior.
|
||||
|
||||
Setting `disableAnalytics` to true will prevent any data from being sent.
|
||||
*/
|
||||
"disableAnalytics": false
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
# unconventional js
|
||||
/blueprints/*/files/
|
||||
/vendor/
|
||||
|
||||
# compiled output
|
||||
/dist/
|
||||
/tmp/
|
||||
/storybook-static/
|
||||
|
||||
# dependencies
|
||||
/bower_components/
|
||||
/node_modules/
|
||||
|
||||
# misc
|
||||
main.js
|
||||
/coverage/
|
||||
!.*
|
||||
|
||||
# ember-try
|
||||
/.node_modules.ember-try/
|
||||
/bower.json.ember-try
|
||||
/package.json.ember-try
|
||||
|
||||
index.js
|
||||
@@ -0,0 +1,58 @@
|
||||
'use strict';
|
||||
|
||||
module.exports = {
|
||||
root: true,
|
||||
parser: 'babel-eslint',
|
||||
parserOptions: {
|
||||
ecmaVersion: 2018,
|
||||
sourceType: 'module',
|
||||
ecmaFeatures: {
|
||||
legacyDecorators: true
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
'ember'
|
||||
],
|
||||
extends: [
|
||||
'eslint:recommended',
|
||||
'plugin:ember/recommended'
|
||||
],
|
||||
env: {
|
||||
browser: true
|
||||
},
|
||||
rules: {
|
||||
'ember/no-jquery': 'error'
|
||||
},
|
||||
overrides: [
|
||||
// node files
|
||||
{
|
||||
files: [
|
||||
'.eslintrc.js',
|
||||
'.template-lintrc.js',
|
||||
'ember-cli-build.js',
|
||||
'index.js',
|
||||
'testem.js',
|
||||
'blueprints/*/index.js',
|
||||
'config/**/*.js',
|
||||
'tests/dummy/config/**/*.js'
|
||||
],
|
||||
excludedFiles: [
|
||||
'addon/**',
|
||||
'addon-test-support/**',
|
||||
'app/**',
|
||||
'tests/dummy/app/**'
|
||||
],
|
||||
parserOptions: {
|
||||
sourceType: 'script'
|
||||
},
|
||||
env: {
|
||||
browser: false,
|
||||
node: true
|
||||
},
|
||||
plugins: ['node'],
|
||||
rules: Object.assign({}, require('eslint-plugin-node').configs.recommended.rules, {
|
||||
// add your custom rules and overrides for node files here
|
||||
})
|
||||
}
|
||||
]
|
||||
};
|
||||
@@ -0,0 +1,32 @@
|
||||
# compiled output
|
||||
/dist/
|
||||
/tmp/
|
||||
|
||||
# dependencies
|
||||
/bower_components/
|
||||
|
||||
# misc
|
||||
/.bowerrc
|
||||
/.editorconfig
|
||||
/.ember-cli
|
||||
/.env*
|
||||
/.eslintignore
|
||||
/.eslintrc.js
|
||||
/.git/
|
||||
/.gitignore
|
||||
/.template-lintrc.js
|
||||
/.travis.yml
|
||||
/.watchmanconfig
|
||||
/bower.json
|
||||
/config/ember-try.js
|
||||
/CONTRIBUTING.md
|
||||
/ember-cli-build.js
|
||||
/testem.js
|
||||
/tests/
|
||||
/yarn.lock
|
||||
.gitkeep
|
||||
|
||||
# ember-try
|
||||
/.node_modules.ember-try/
|
||||
/bower.json.ember-try
|
||||
/package.json.ember-try
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"singleQuote": true,
|
||||
"printWidth": 80
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
files:
|
||||
include: 'app/styles/**/*.s+(a|c)ss'
|
||||
rules:
|
||||
leading-zero: 0
|
||||
mixins-before-declarations: 0
|
||||
nesting-depth: 0
|
||||
placeholder-in-extend: 0
|
||||
@@ -0,0 +1,9 @@
|
||||
module.exports = {
|
||||
stories: ['../stories/**/*.stories.js'],
|
||||
addons: [
|
||||
'@storybook/addon-knobs',
|
||||
'@storybook/addon-actions',
|
||||
'@storybook/addon-links',
|
||||
'@storybook/addon-storysource'
|
||||
]
|
||||
};
|
||||
@@ -0,0 +1,5 @@
|
||||
'use strict';
|
||||
|
||||
module.exports = {
|
||||
extends: 'octane'
|
||||
};
|
||||
@@ -0,0 +1,66 @@
|
||||
---
|
||||
language: node_js
|
||||
node_js:
|
||||
# we recommend testing addons with the same minimum supported node version as Ember CLI
|
||||
# so that your addon works for all apps
|
||||
- "10"
|
||||
|
||||
dist: trusty
|
||||
|
||||
addons:
|
||||
chrome: stable
|
||||
|
||||
cache:
|
||||
yarn: true
|
||||
|
||||
env:
|
||||
global:
|
||||
# See https://git.io/vdao3 for details.
|
||||
- JOBS=1
|
||||
|
||||
branches:
|
||||
only:
|
||||
- master
|
||||
# npm version tags
|
||||
- /^v\d+\.\d+\.\d+/
|
||||
|
||||
jobs:
|
||||
fast_finish: true
|
||||
allow_failures:
|
||||
- env: EMBER_TRY_SCENARIO=ember-canary
|
||||
|
||||
include:
|
||||
# runs linting and tests with current locked deps
|
||||
- stage: "Tests"
|
||||
name: "Tests"
|
||||
script:
|
||||
- yarn lint:hbs
|
||||
- yarn lint:js
|
||||
- yarn test
|
||||
|
||||
- stage: "Additional Tests"
|
||||
name: "Floating Dependencies"
|
||||
install:
|
||||
- yarn install --no-lockfile --non-interactive
|
||||
script:
|
||||
- yarn test
|
||||
|
||||
# we recommend new addons test the current and previous LTS
|
||||
# as well as latest stable release (bonus points to beta/canary)
|
||||
- env: EMBER_TRY_SCENARIO=ember-lts-3.12
|
||||
- env: EMBER_TRY_SCENARIO=ember-lts-3.16
|
||||
- env: EMBER_TRY_SCENARIO=ember-release
|
||||
- env: EMBER_TRY_SCENARIO=ember-beta
|
||||
- env: EMBER_TRY_SCENARIO=ember-canary
|
||||
- env: EMBER_TRY_SCENARIO=ember-default-with-jquery
|
||||
- env: EMBER_TRY_SCENARIO=ember-classic
|
||||
|
||||
before_install:
|
||||
- curl -o- -L https://yarnpkg.com/install.sh | bash
|
||||
- export PATH=$HOME/.yarn/bin:$PATH
|
||||
|
||||
install:
|
||||
- yarn install --non-interactive
|
||||
|
||||
script:
|
||||
- node_modules/.bin/ember try:one $EMBER_TRY_SCENARIO
|
||||
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"ignore_dirs": ["tmp", "dist"]
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2020
|
||||
|
||||
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.
|
||||
@@ -0,0 +1,85 @@
|
||||
# Rose - Style & Component Ember Addon for Project Watchtower
|
||||
|
||||
This addon contains common styles and components shared by
|
||||
Project Watchtower UIs.
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
**Table of Contents** *generated with [DocToc](https://github.com/thlorenz/doctoc)*
|
||||
|
||||
- [Add Styles to an App](#add-styles-to-an-app)
|
||||
- [Installation](#installation)
|
||||
- [Yarn Commands](#yarn-commands)
|
||||
- [Linting](#linting)
|
||||
- [Running tests](#running-tests)
|
||||
- [Running the dummy application](#running-the-dummy-application)
|
||||
- [Contributing](#contributing)
|
||||
- [Building ToC](#building-toc)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
## Add Styles to an App
|
||||
|
||||
Add this addon to an Ember application's `devDependencies` as:
|
||||
`"rose": "*"`, for applications included in this monorepo. Application's
|
||||
may then import rose styles by adding `@import 'rose';` to their stylesheets.
|
||||
|
||||
## Installation
|
||||
|
||||
See monorepo README for installation instructions.
|
||||
|
||||
## Yarn Commands
|
||||
|
||||
List of available project commands. `yarn run <command-name>`
|
||||
|
||||
| Command | Description |
|
||||
| ------- | ----------- |
|
||||
| build | Builds the dummy app in development mode. |
|
||||
| build:production | Builds the dummy app for production. |
|
||||
| lint | Runs all lint commands. |
|
||||
| lint:hbs | Lints template `hbs` files. |
|
||||
| lint:js | Lints `js` files. |
|
||||
| lint:sass | Lints `scss` files. |
|
||||
| format | Runs all auto-formatters. |
|
||||
| format:js | Auto-formats `js` files using Prettier. |
|
||||
| format:sass | Auto-formats `scss` files using Prettier. |
|
||||
| start | Runs the dummy app local server. |
|
||||
| test | Runs all tests. |
|
||||
| test:all | Runs tests across multiple Ember versions with ember-try. |
|
||||
| doc:toc | Automatically generates a table of contents for this README file. |
|
||||
|
||||
Additional commands in the monorepo package may affect this projects.
|
||||
|
||||
## Linting
|
||||
|
||||
* `yarn lint:hbs`
|
||||
* `yarn lint:js`
|
||||
* `yarn lint:js --fix`
|
||||
|
||||
## Formatting
|
||||
|
||||
Before submitting your work, be sure to run auto-formatters
|
||||
(see commands above). This helps to ensure consistency among authors.
|
||||
|
||||
* `yarn format`
|
||||
|
||||
## Running tests
|
||||
|
||||
* `yarn test` – Runs the test suite on the current Ember version
|
||||
* `yarn test --server` – Runs the test suite in "watch mode"
|
||||
* `yarn test:all` – Runs the test suite against multiple Ember versions
|
||||
|
||||
## Running the dummy application
|
||||
|
||||
* `yarn start`
|
||||
* Visit the dummy application at [http://localhost:4200](http://localhost:4200).
|
||||
|
||||
## Contributing
|
||||
|
||||
See monorepo README for more contribution instructions.
|
||||
|
||||
### Building ToC
|
||||
|
||||
To autogenerate a ToC (table of contents) for this README,
|
||||
run `yarn doc:toc`. Please update the ToC whenever editing the structure
|
||||
of README.
|
||||
Whitespace-only changes.
@@ -0,0 +1,13 @@
|
||||
import Component from '@ember/component';
|
||||
import layout from '../../templates/components/rose/button';
|
||||
|
||||
/**
|
||||
* A simple HTML `<button>` element.
|
||||
*
|
||||
* @example
|
||||
* <Rose::Button @submit={{true}} @style="primary">Save</Rose::Button>
|
||||
* <Rose::Button @disabled={{true}} @style="secondary">Disabled</Rose::Button>
|
||||
*/
|
||||
export default Component.extend({
|
||||
layout,
|
||||
});
|
||||
@@ -0,0 +1,3 @@
|
||||
@import 'reset';
|
||||
@import 'variables';
|
||||
@import 'components';
|
||||
@@ -0,0 +1,144 @@
|
||||
/* http://meyerweb.com/eric/tools/css/reset/
|
||||
v2.0 | 20110126
|
||||
License: none (public domain)
|
||||
*/
|
||||
|
||||
html,
|
||||
body,
|
||||
div,
|
||||
span,
|
||||
applet,
|
||||
object,
|
||||
iframe,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
blockquote,
|
||||
pre,
|
||||
a,
|
||||
abbr,
|
||||
acronym,
|
||||
address,
|
||||
big,
|
||||
cite,
|
||||
code,
|
||||
del,
|
||||
dfn,
|
||||
em,
|
||||
img,
|
||||
ins,
|
||||
kbd,
|
||||
q,
|
||||
s,
|
||||
samp,
|
||||
small,
|
||||
strike,
|
||||
strong,
|
||||
sub,
|
||||
sup,
|
||||
tt,
|
||||
var,
|
||||
b,
|
||||
u,
|
||||
i,
|
||||
center,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
ol,
|
||||
ul,
|
||||
li,
|
||||
fieldset,
|
||||
form,
|
||||
label,
|
||||
legend,
|
||||
table,
|
||||
caption,
|
||||
tbody,
|
||||
tfoot,
|
||||
thead,
|
||||
tr,
|
||||
th,
|
||||
td,
|
||||
article,
|
||||
aside,
|
||||
canvas,
|
||||
details,
|
||||
embed,
|
||||
figure,
|
||||
figcaption,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
output,
|
||||
ruby,
|
||||
section,
|
||||
summary,
|
||||
time,
|
||||
mark,
|
||||
audio,
|
||||
video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
blockquote,
|
||||
q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
&:before,
|
||||
&:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
|
||||
q {
|
||||
&:before,
|
||||
&:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
@@ -0,0 +1,56 @@
|
||||
@use '../utilities/button';
|
||||
|
||||
@include button.button-style(
|
||||
'primary',
|
||||
(
|
||||
color: var(--white),
|
||||
background-color: var(--info),
|
||||
border-color: var(--info-starker-2),
|
||||
box-shadow: 0px 4px 4px rgba(var(--stark-components), var(--opacity-2)),
|
||||
text-shadow: 0px 1px 1px rgba(var(--black-components), var(--opacity-2)),
|
||||
),
|
||||
(
|
||||
background-color: var(--info-subtler-1),
|
||||
box-shadow: (
|
||||
0px 4px 4px rgba(var(--stark-components), var(--opacity-3)),
|
||||
0px 4px 8px rgba(var(--stark-components), var(--opacity-4)),
|
||||
),
|
||||
),
|
||||
(
|
||||
background-color: var(--info-starker-1),
|
||||
box-shadow: none,
|
||||
),
|
||||
(
|
||||
opacity: var(--opacity-1),
|
||||
box-shadow: none,
|
||||
)
|
||||
);
|
||||
|
||||
@include button.button-style(
|
||||
'secondary',
|
||||
(
|
||||
color: var(--ui-gray-starker-3),
|
||||
background-color: var(--ui-gray-subtler-5),
|
||||
border-color: var(--ui-gray-subtler-2),
|
||||
box-shadow: 0px 4px 4px rgba(var(--stark-components), var(--opacity-2)),
|
||||
),
|
||||
(
|
||||
color: var(--ui-gray-starker-4),
|
||||
background-color: var(--subtle),
|
||||
border-color: var(--ui-gray-starker-1),
|
||||
box-shadow: (
|
||||
0px 4px 4px rgba(var(--stark-components), var(--opacity-3)),
|
||||
0px 4px 8px rgba(var(--stark-components), var(--opacity-4)),
|
||||
),
|
||||
),
|
||||
(
|
||||
color: var(--ui-gray-starker-4),
|
||||
background-color: var(--ui-gray-subtler-3),
|
||||
border-color: var(--ui-gray-starker-1),
|
||||
box-shadow: none,
|
||||
),
|
||||
(
|
||||
opacity: var(--opacity-1),
|
||||
box-shadow: none,
|
||||
)
|
||||
);
|
||||
@@ -0,0 +1 @@
|
||||
@import 'button';
|
||||
@@ -0,0 +1,80 @@
|
||||
@use 'sass:map';
|
||||
|
||||
@mixin button {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 5px 24px;
|
||||
line-height: 1.846; // targeting 24px
|
||||
border-radius: 2px;
|
||||
border: 1px solid;
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@mixin button-style($name, $default, $hover: &, $active: &, $disabled: &) {
|
||||
.rose-button-#{$name} {
|
||||
@include button;
|
||||
border-color: map.get($default, border-color);
|
||||
color: map.get($default, color);
|
||||
background-color: map.get($default, background-color);
|
||||
@if map.get($default, 'box-shadow') {
|
||||
box-shadow: map.get($default, 'box-shadow');
|
||||
}
|
||||
@if map.get($default, 'text-shadow') {
|
||||
text-shadow: map.get($default, 'text-shadow');
|
||||
}
|
||||
|
||||
&:not(:disabled) {
|
||||
@if $hover {
|
||||
&:hover {
|
||||
@if map.get($hover, 'border-color') {
|
||||
border-color: map.get($hover, 'border-color');
|
||||
}
|
||||
@if map.get($hover, 'color') {
|
||||
color: map.get($hover, 'color');
|
||||
}
|
||||
@if map.get($hover, 'background-color') {
|
||||
background-color: map.get($hover, 'background-color');
|
||||
}
|
||||
@if map.get($hover, 'box-shadow') {
|
||||
box-shadow: map.get($hover, 'box-shadow');
|
||||
}
|
||||
@if map.get($hover, 'text-shadow') {
|
||||
text-shadow: map.get($hover, 'text-shadow');
|
||||
}
|
||||
}
|
||||
}
|
||||
@if $active {
|
||||
&:active {
|
||||
@if map.get($active, 'border-color') {
|
||||
border-color: map.get($active, 'border-color');
|
||||
}
|
||||
@if map.get($active, 'color') {
|
||||
color: map.get($active, 'color');
|
||||
}
|
||||
@if map.get($active, 'background-color') {
|
||||
background-color: map.get($active, 'background-color');
|
||||
}
|
||||
@if map.get($active, 'box-shadow') {
|
||||
box-shadow: map.get($active, 'box-shadow');
|
||||
}
|
||||
@if map.get($active, 'text-shadow') {
|
||||
text-shadow: map.get($active, 'text-shadow');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@if $disabled {
|
||||
&:disabled {
|
||||
cursor: not-allowed;
|
||||
@if map.get($disabled, 'opacity') {
|
||||
opacity: map.get($disabled, 'opacity');
|
||||
}
|
||||
@if map.get($disabled, 'box-shadow') {
|
||||
box-shadow: map.get($disabled, 'box-shadow');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
@forward 'button';
|
||||
@@ -0,0 +1,2 @@
|
||||
@import 'color';
|
||||
@import 'opacity';
|
||||
@@ -0,0 +1,24 @@
|
||||
/**
|
||||
* Defines the opacity CSS custom properties that should be used throughout
|
||||
* these stylesheets.
|
||||
*/
|
||||
|
||||
// Light Mode
|
||||
:root {
|
||||
--opacity-4: 0.05;
|
||||
--opacity-3: 0.1;
|
||||
--opacity-2: 0.25;
|
||||
--opacity-1: 0.5;
|
||||
}
|
||||
|
||||
// Dark Mode
|
||||
// Subtler opacities look better in dark mode, so these are halved compared to
|
||||
// light mode.
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--opacity-4: 0.025;
|
||||
--opacity-3: 0.05;
|
||||
--opacity-2: 0.125;
|
||||
--opacity-1: 0.25;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,141 @@
|
||||
/**
|
||||
* CSS custom properties defining colors. These are the color variables that
|
||||
* should be consumed throughout these stylesheets (rather than SCSS vars).
|
||||
*/
|
||||
|
||||
// Light Mode
|
||||
:root {
|
||||
// absolutes
|
||||
--white: #{color(white)};
|
||||
--black: #{color(black)};
|
||||
--black-components: 0, 0, 0;
|
||||
|
||||
// poles
|
||||
--subtle: var(--white);
|
||||
--stark: var(--black);
|
||||
--stark-components: 0, 0, 0;
|
||||
|
||||
// brand colors
|
||||
--brand-black: #{brand-color(black)};
|
||||
--brand-white: #{brand-color(white)};
|
||||
--brand-secondary: #{brand-color(secondary)};
|
||||
--brand-gray-7: #{brand-color(gray-7)};
|
||||
--brand-gray-6: #{brand-color(gray-6)};
|
||||
--brand-gray-5: #{brand-color(gray-5)};
|
||||
--brand-gray-4: #{brand-color(gray-4)};
|
||||
--brand-gray-3: #{brand-color(gray-3)};
|
||||
--brand-gray-2: #{brand-color(gray-2)};
|
||||
--brand-gray-1: #{brand-color(gray-1)};
|
||||
|
||||
// theme colors
|
||||
--info-subtler-3: #{color(blue, 010)};
|
||||
--info-subtler-2: #{color(blue, 100)};
|
||||
--info-subtler-1: #{color(blue, 400)};
|
||||
--info: #{color(blue)};
|
||||
--info-starker-1: #{color(blue, 700)};
|
||||
--info-starker-2: #{color(blue, 800)};
|
||||
|
||||
--alert-subtler-2: #{color(orange, 010)};
|
||||
--alert-subtler-1: #{color(orange, 100)};
|
||||
--alert: #{color(orange)};
|
||||
--alert-starker-1: #{color(orange, 800)};
|
||||
|
||||
--warning-subtler-2: #{color(yellow, 010)};
|
||||
--warning-subtler-1: #{color(yellow, 100)};
|
||||
--warning: #{color(yellow)};
|
||||
--warning-starker-1: #{color(yellow, 800)};
|
||||
|
||||
--failure-subtler-2: #{color(red, 010)};
|
||||
--failure-subtler-1: #{color(red, 100)};
|
||||
--failure: #{color(red)};
|
||||
--failure-starker-1: #{color(red, 800)};
|
||||
|
||||
--success-subtler-2: #{color(green, 010)};
|
||||
--success-subtler-1: #{color(green, 100)};
|
||||
--success: #{color(green)};
|
||||
--success-starker-1: #{color(green, 800)};
|
||||
|
||||
--action-subtler-2: #{color(blue, 010)};
|
||||
--action-subtler-1: #{color(blue, 100)};
|
||||
--action: #{color(blue)};
|
||||
--action-starker-1: #{color(blue, 700)};
|
||||
|
||||
--ui-border-subtler-1: #{color(ui-gray, 200)};
|
||||
--ui-border: #{color(ui-gray, 300)};
|
||||
|
||||
--ui-gray-subtler-6: #{color(ui-gray, 010)};
|
||||
--ui-gray-subtler-5: #{color(ui-gray, 050)};
|
||||
--ui-gray-subtler-4: #{color(ui-gray, 100)};
|
||||
--ui-gray-subtler-3: #{color(ui-gray, 200)};
|
||||
--ui-gray-subtler-2: #{color(ui-gray, 300)};
|
||||
--ui-gray-subtler-1: #{color(ui-gray, 400)};
|
||||
--ui-gray: #{color(ui-gray)};
|
||||
--ui-gray-starker-1: #{color(ui-gray, 600)};
|
||||
--ui-gray-starker-2: #{color(ui-gray, 700)};
|
||||
--ui-gray-starker-3: #{color(ui-gray, 800)};
|
||||
--ui-gray-starker-4: #{color(ui-gray, 900)};
|
||||
}
|
||||
|
||||
// Dark Mode
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
// opacities
|
||||
--opacity-4: 0.025;
|
||||
--opacity-3: 0.05;
|
||||
--opacity-2: 0.15;
|
||||
--opacity-1: 0.35;
|
||||
|
||||
// poles
|
||||
--subtle: #{color(ui-cool-gray, 800)};
|
||||
--stark: var(--white);
|
||||
--stark-components: 255, 255, 255;
|
||||
|
||||
// theme colors
|
||||
--info-subtler-3: #{color(blue, 800)};
|
||||
--info-subtler-2: #{color(blue, 700)};
|
||||
--info-subtler-1: #{color(blue, 600)};
|
||||
--info: #{color(blue)};
|
||||
--info-starker-1: #{color(blue, 300)};
|
||||
--info-starker-2: #{color(blue, 200)};
|
||||
|
||||
--alert-subtler-2: #{color(orange, 900)};
|
||||
--alert-subtler-1: #{color(orange, 800)};
|
||||
--alert: #{color(orange)};
|
||||
--alert-starker-1: #{color(orange, 200)};
|
||||
|
||||
--warning-subtler-2: #{color(yellow, 900)};
|
||||
--warning-subtler-1: #{color(yellow, 800)};
|
||||
--warning: #{color(yellow)};
|
||||
--warning-starker-1: #{color(yellow, 200)};
|
||||
|
||||
--failure-subtler-2: #{color(red, 900)};
|
||||
--failure-subtler-1: #{color(red, 800)};
|
||||
--failure: #{color(red)};
|
||||
--failure-starker-1: #{color(red, 200)};
|
||||
|
||||
--success-subtler-2: #{color(green, 900)};
|
||||
--success-subtler-1: #{color(green, 800)};
|
||||
--success: #{color(green)};
|
||||
--success-starker-1: #{color(green, 200)};
|
||||
|
||||
--action-subtler-2: #{color(blue, 900)};
|
||||
--action-subtler-1: #{color(blue, 800)};
|
||||
--action: #{color(blue)};
|
||||
--action-starker-1: #{color(blue, 300)};
|
||||
|
||||
--ui-border-subtler-1: #{color(ui-gray, 800)};
|
||||
--ui-border: #{color(ui-gray, 700)};
|
||||
|
||||
--ui-gray-subtler-6: #{color(ui-gray, 900)};
|
||||
--ui-gray-subtler-5: #{color(ui-gray, 800)};
|
||||
--ui-gray-subtler-4: #{color(ui-gray, 700)};
|
||||
--ui-gray-subtler-3: #{color(ui-gray, 600)};
|
||||
--ui-gray-subtler-2: #{color(ui-gray, 500)};
|
||||
--ui-gray-subtler-1: #{color(ui-gray, 400)};
|
||||
--ui-gray: #{color(ui-gray, 300)};
|
||||
--ui-gray-starker-1: #{color(ui-gray, 200)};
|
||||
--ui-gray-starker-2: #{color(ui-gray, 100)};
|
||||
--ui-gray-starker-3: #{color(ui-gray, 050)};
|
||||
--ui-gray-starker-4: #{color(ui-gray, 010)};
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
@import 'sass';
|
||||
@import 'css';
|
||||
@@ -0,0 +1,107 @@
|
||||
@use 'sass:map';
|
||||
|
||||
/**
|
||||
* SASS variables defining colors. These should not be consumed
|
||||
* directly. See `_css.scss` for CSS custom properties, which are the primary
|
||||
* variables used throughout these stylesheets.
|
||||
*/
|
||||
|
||||
$colors: (
|
||||
magenta: #c62a71,
|
||||
ui-cool-gray: #7c8797,
|
||||
ui-gray: #6f7682,
|
||||
purple: #5c4ee5,
|
||||
cyan: #00bbff,
|
||||
teal: #25ba81,
|
||||
green: #2eb039,
|
||||
yellow: #fac402,
|
||||
orange: #fa8f37,
|
||||
blue: #1563ff,
|
||||
red: #c73445,
|
||||
black: rgb(0, 0, 0),
|
||||
white: rgb(255, 255, 255),
|
||||
) !default;
|
||||
|
||||
$color-values: (
|
||||
white: (
|
||||
500: map.get($colors, white),
|
||||
),
|
||||
black: (
|
||||
500: map.get($colors, black),
|
||||
),
|
||||
ui-gray: (
|
||||
010: #fbfbfc,
|
||||
050: #f7f8fa,
|
||||
100: #ebeef2,
|
||||
200: #dce0e6,
|
||||
300: #bac1cc,
|
||||
500: map.get($colors, ui-gray),
|
||||
600: #626873,
|
||||
800: #373a42,
|
||||
900: #1f2124,
|
||||
),
|
||||
ui-cool-gray: (
|
||||
500: map.get($colors, ui-cool-gray),
|
||||
800: #1d2126,
|
||||
900: #060708,
|
||||
),
|
||||
green: (
|
||||
010: #fafdfa,
|
||||
100: #c6e9c9,
|
||||
500: map.get($colors, green),
|
||||
800: #15501a,
|
||||
),
|
||||
yellow: (
|
||||
010: #fffdf6,
|
||||
100: #fdeeba,
|
||||
500: map.get($colors, yellow),
|
||||
800: #725a01,
|
||||
),
|
||||
orange: (
|
||||
010: #fffcfa,
|
||||
100: #fde0c8,
|
||||
500: map.get($colors, orange),
|
||||
800: #724119,
|
||||
),
|
||||
blue: (
|
||||
010: #fbfcff,
|
||||
100: #bfd4ff,
|
||||
200: #8ab1ff,
|
||||
300: #5b92ff,
|
||||
400: #387aff,
|
||||
500: map.get($colors, blue),
|
||||
600: #0f4fd1,
|
||||
700: #0e40a3,
|
||||
800: #0a2d74,
|
||||
900: #061b46,
|
||||
),
|
||||
red: (
|
||||
010: #fdfafb,
|
||||
100: #efc7cc,
|
||||
500: map.get($colors, red),
|
||||
800: #5b1820,
|
||||
),
|
||||
) !default;
|
||||
|
||||
// tokens: brand
|
||||
$brand: (
|
||||
black: map.get($colors, black),
|
||||
white: map.get($colors, white),
|
||||
secondary: map.get($colors, blue),
|
||||
gray-7: #f7f7f9,
|
||||
gray-6: #dcdde0,
|
||||
gray-5: #bdbec2,
|
||||
gray-4: #7f7f86,
|
||||
gray-3: #4c4c53,
|
||||
gray-2: #323339,
|
||||
gray-1: #1d1e23,
|
||||
) !default;
|
||||
|
||||
// functions to simplify color lookups
|
||||
@function brand-color($name) {
|
||||
@return map.get($brand, $name);
|
||||
}
|
||||
|
||||
@function color($name, $value: 500) {
|
||||
@return map.get(map.get($color-values, $name), $value);
|
||||
}
|
||||
@@ -0,0 +1,8 @@
|
||||
<button
|
||||
...attributes
|
||||
type={{if @submit "submit" "button"}}
|
||||
disabled={{if @disabled "disabled"}}
|
||||
class={{if @style (concat "rose-button-" @style)}}
|
||||
>
|
||||
{{yield}}
|
||||
</button>
|
||||
Whitespace-only changes.
@@ -0,0 +1 @@
|
||||
export { default } from 'rose/components/rose/button';
|
||||
@@ -0,0 +1 @@
|
||||
@import 'rose';
|
||||
@@ -0,0 +1,11 @@
|
||||
Dummy app index template
|
||||
|
||||
<Rose::Button @style="primary">Primary</Rose::Button>
|
||||
<br>
|
||||
<Rose::Button @style="primary" @disabled={{true}}>Primary</Rose::Button>
|
||||
<br>
|
||||
|
||||
<Rose::Button @style="secondary">Secondary</Rose::Button>
|
||||
<br>
|
||||
<Rose::Button @style="secondary" @disabled={{true}}>Secondary</Rose::Button>
|
||||
<br>
|
||||
@@ -0,0 +1,89 @@
|
||||
'use strict';
|
||||
|
||||
const getChannelURL = require('ember-source-channel-url');
|
||||
|
||||
module.exports = async function () {
|
||||
return {
|
||||
useYarn: true,
|
||||
scenarios: [
|
||||
{
|
||||
name: 'ember-lts-3.12',
|
||||
npm: {
|
||||
devDependencies: {
|
||||
'ember-source': '~3.12.0',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'ember-lts-3.16',
|
||||
npm: {
|
||||
devDependencies: {
|
||||
'ember-source': '~3.16.0',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'ember-release',
|
||||
npm: {
|
||||
devDependencies: {
|
||||
'ember-source': await getChannelURL('release'),
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'ember-beta',
|
||||
npm: {
|
||||
devDependencies: {
|
||||
'ember-source': await getChannelURL('beta'),
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'ember-canary',
|
||||
npm: {
|
||||
devDependencies: {
|
||||
'ember-source': await getChannelURL('canary'),
|
||||
},
|
||||
},
|
||||
},
|
||||
// The default `.travis.yml` runs this scenario via `yarn test`,
|
||||
// not via `ember try`. It's still included here so that running
|
||||
// `ember try:each` manually or from a customized CI config will run it
|
||||
// along with all the other scenarios.
|
||||
{
|
||||
name: 'ember-default',
|
||||
npm: {
|
||||
devDependencies: {},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'ember-default-with-jquery',
|
||||
env: {
|
||||
EMBER_OPTIONAL_FEATURES: JSON.stringify({
|
||||
'jquery-integration': true,
|
||||
}),
|
||||
},
|
||||
npm: {
|
||||
devDependencies: {
|
||||
'@ember/jquery': '^0.5.1',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'ember-classic',
|
||||
env: {
|
||||
EMBER_OPTIONAL_FEATURES: JSON.stringify({
|
||||
'application-template-wrapper': true,
|
||||
'default-async-observers': false,
|
||||
'template-only-glimmer-components': false,
|
||||
}),
|
||||
},
|
||||
npm: {
|
||||
ember: {
|
||||
edition: 'classic',
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
};
|
||||
@@ -0,0 +1,5 @@
|
||||
'use strict';
|
||||
|
||||
module.exports = function (/* environment, appConfig */) {
|
||||
return {};
|
||||
};
|
||||
@@ -0,0 +1,18 @@
|
||||
'use strict';
|
||||
|
||||
const EmberAddon = require('ember-cli/lib/broccoli/ember-addon');
|
||||
|
||||
module.exports = function (defaults) {
|
||||
let app = new EmberAddon(defaults, {
|
||||
// Add options here
|
||||
});
|
||||
|
||||
/*
|
||||
This build file specifies the options for the dummy test app of this
|
||||
addon, located in `/tests/dummy`
|
||||
This build file does *not* influence how the addon or the app using it
|
||||
behave. You most likely want to be modifying `./index.js` or app's build file
|
||||
*/
|
||||
|
||||
return app.toTree();
|
||||
};
|
||||
@@ -0,0 +1,37 @@
|
||||
'use strict';
|
||||
|
||||
var path = require('path');
|
||||
var Funnel = require('broccoli-funnel');
|
||||
var mergeTrees = require('broccoli-merge-trees');
|
||||
|
||||
module.exports = {
|
||||
name: require('./package').name,
|
||||
|
||||
/**
|
||||
* Finds this addon's styles folder and includes it into the running
|
||||
* application's `sassOptions.includePaths`, such that the application needs
|
||||
* no further configuration to import the styles.
|
||||
*/
|
||||
included(app) {
|
||||
this._super.included(app);
|
||||
|
||||
// Resolve a path to this addon's style folder `addon/styles/addon-name`,
|
||||
// where addon-name is resolved from package.json
|
||||
const addonPath = require.resolve(this.name);
|
||||
const stylePath = path.resolve(addonPath, `../addon/styles/${this.name}`);
|
||||
const styleTree = mergeTrees([
|
||||
new Funnel(stylePath, {
|
||||
destDir: this.name,
|
||||
include: ['**/*'],
|
||||
}),
|
||||
]);
|
||||
|
||||
// Setup default sassOptions on the running application
|
||||
app.options.sassOptions = app.options.sassOptions || {};
|
||||
app.options.sassOptions.includePaths =
|
||||
app.options.sassOptions.includePaths || [];
|
||||
|
||||
// Include the addon styles
|
||||
app.options.sassOptions.includePaths.push(styleTree);
|
||||
},
|
||||
};
|
||||
@@ -0,0 +1,81 @@
|
||||
{
|
||||
"name": "rose",
|
||||
"version": "0.0.0",
|
||||
"description": "Styles and components for Project Watchtower.",
|
||||
"license": "MPL-2.0",
|
||||
"author": "HashiCorp",
|
||||
"keywords": [
|
||||
"ember-addon"
|
||||
],
|
||||
"scripts": {
|
||||
"build": "ember build",
|
||||
"build:production": "ember build --environment=production",
|
||||
"lint": "yarn lint:hbs && yarn lint:js && yarn lint:sass",
|
||||
"lint:hbs": "ember-template-lint .",
|
||||
"lint:js": "eslint .",
|
||||
"lint:sass": "sass-lint -v -q",
|
||||
"format": "npm run format:js && npm run format:sass",
|
||||
"format:js": "prettier --write '{addon,app,config,stories,tests}/**/*.js' *.js",
|
||||
"format:sass": "prettier --write {addon,app}/**/*.scss",
|
||||
"start": "ember serve",
|
||||
"test": "ember test",
|
||||
"test:all": "ember try:each",
|
||||
"prestorybook": "yarn build && yarn storybook:build",
|
||||
"storybook": "start-storybook -p 6006 -s dist",
|
||||
"storybook:build": "build-storybook -s dist",
|
||||
"doc:toc": "doctoc README.md"
|
||||
},
|
||||
"dependencies": {
|
||||
"babel-loader": "^8.1.0",
|
||||
"ember-cli-babel": "^7.17.2",
|
||||
"ember-cli-htmlbars": "^4.2.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@ember/optional-features": "^1.3.0",
|
||||
"@glimmer/component": "^1.0.0",
|
||||
"@glimmer/tracking": "^1.0.0",
|
||||
"@storybook/addon-actions": "^5.3.18",
|
||||
"@storybook/addon-knobs": "^5.3.18",
|
||||
"@storybook/addon-links": "^5.3.18",
|
||||
"@storybook/addon-storysource": "^5.3.18",
|
||||
"@storybook/ember": "^5.3.18",
|
||||
"@storybook/ember-cli-storybook": "^0.2.1",
|
||||
"babel-eslint": "^10.0.3",
|
||||
"broccoli-asset-rev": "^3.0.0",
|
||||
"doctoc": "^1.4.0",
|
||||
"ember-auto-import": "^1.5.3",
|
||||
"ember-cli": "~3.16.1",
|
||||
"ember-cli-dependency-checker": "^3.2.0",
|
||||
"ember-cli-eslint": "^5.1.0",
|
||||
"ember-cli-inject-live-reload": "^2.0.2",
|
||||
"ember-cli-sass": "^10.0.1",
|
||||
"ember-cli-sri": "^2.1.1",
|
||||
"ember-cli-template-lint": "^1.0.0-beta.3",
|
||||
"ember-cli-uglify": "^3.0.0",
|
||||
"ember-disable-prototype-extensions": "^1.1.3",
|
||||
"ember-export-application-global": "^2.0.1",
|
||||
"ember-load-initializers": "^2.1.1",
|
||||
"ember-maybe-import-regenerator": "^0.1.6",
|
||||
"ember-qunit": "^4.6.0",
|
||||
"ember-resolver": "^7.0.0",
|
||||
"ember-source": "~3.12.0",
|
||||
"ember-source-channel-url": "^2.0.1",
|
||||
"ember-try": "^1.4.0",
|
||||
"eslint-plugin-ember": "^7.7.2",
|
||||
"eslint-plugin-node": "^11.0.0",
|
||||
"loader.js": "^4.7.0",
|
||||
"prettier": "^2.0.5",
|
||||
"qunit-dom": "^1.0.0",
|
||||
"sass": "^1.26.5",
|
||||
"sass-lint": "^1.13.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": "10.* || >= 12"
|
||||
},
|
||||
"ember": {
|
||||
"edition": "octane"
|
||||
},
|
||||
"ember-addon": {
|
||||
"configPath": "tests/dummy/config"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
import { hbs } from 'ember-cli-htmlbars';
|
||||
import { action } from '@storybook/addon-actions';
|
||||
import { text, boolean, select } from '@storybook/addon-knobs';
|
||||
|
||||
export default {
|
||||
title: 'Rose::Button',
|
||||
};
|
||||
|
||||
export const Normal = () => ({
|
||||
template: hbs`
|
||||
<Rose::Button
|
||||
@submit={{submit}}
|
||||
@disabled={{disabled}}
|
||||
@style={{style}}
|
||||
{{action onClick}}
|
||||
>
|
||||
{{text}}
|
||||
</Rose::Button>
|
||||
`,
|
||||
context: {
|
||||
text: text('text', 'Button 🌈'),
|
||||
submit: boolean('submit', false),
|
||||
disabled: boolean('disabled', false),
|
||||
style: select(
|
||||
'style',
|
||||
{
|
||||
primary: 'primary',
|
||||
secondary: 'secondary',
|
||||
warning: 'warning',
|
||||
ghost: 'ghost',
|
||||
},
|
||||
'primary'
|
||||
),
|
||||
onClick: action('clicked'),
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,25 @@
|
||||
'use strict';
|
||||
|
||||
module.exports = {
|
||||
test_page: 'tests/index.html?hidepassed',
|
||||
disable_watching: true,
|
||||
launch_in_ci: ['Chrome', 'Firefox'],
|
||||
launch_in_dev: ['Chrome', 'Firefox'],
|
||||
browser_start_timeout: 120,
|
||||
browser_args: {
|
||||
Chrome: {
|
||||
ci: [
|
||||
// --no-sandbox is needed when running Chrome inside a container
|
||||
process.env.CI ? '--no-sandbox' : null,
|
||||
'--headless',
|
||||
'--disable-dev-shm-usage',
|
||||
'--disable-gpu',
|
||||
//'--disable-software-rasterizer',
|
||||
'--mute-audio',
|
||||
'--remote-debugging-port=0',
|
||||
'--window-size=1440,900',
|
||||
].filter(Boolean),
|
||||
},
|
||||
Firefox: ['-headless', '--window-size=1440,900'],
|
||||
},
|
||||
};
|
||||
@@ -0,0 +1,12 @@
|
||||
import Application from '@ember/application';
|
||||
import Resolver from 'ember-resolver';
|
||||
import loadInitializers from 'ember-load-initializers';
|
||||
import config from './config/environment';
|
||||
|
||||
export default class App extends Application {
|
||||
modulePrefix = config.modulePrefix;
|
||||
podModulePrefix = config.podModulePrefix;
|
||||
Resolver = Resolver;
|
||||
}
|
||||
|
||||
loadInitializers(App, config.modulePrefix);
|
||||
Whitespace-only changes.
Whitespace-only changes.
Whitespace-only changes.
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<title>Dummy</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
{{content-for "head"}}
|
||||
|
||||
<link integrity="" rel="stylesheet" href="{{rootURL}}assets/vendor.css">
|
||||
<link integrity="" rel="stylesheet" href="{{rootURL}}assets/dummy.css">
|
||||
|
||||
{{content-for "head-footer"}}
|
||||
</head>
|
||||
<body>
|
||||
{{content-for "body"}}
|
||||
|
||||
<script src="{{rootURL}}assets/vendor.js"></script>
|
||||
<script src="{{rootURL}}assets/dummy.js"></script>
|
||||
|
||||
{{content-for "body-footer"}}
|
||||
</body>
|
||||
</html>
|
||||
Whitespace-only changes.
@@ -0,0 +1,9 @@
|
||||
import EmberRouter from '@ember/routing/router';
|
||||
import config from './config/environment';
|
||||
|
||||
export default class Router extends EmberRouter {
|
||||
location = config.locationType;
|
||||
rootURL = config.rootURL;
|
||||
}
|
||||
|
||||
Router.map(function () {});
|
||||
Whitespace-only changes.
Whitespace-only changes.
@@ -0,0 +1,3 @@
|
||||
<h2 id="title">Welcome to Ember</h2>
|
||||
|
||||
{{outlet}}
|
||||
@@ -0,0 +1,51 @@
|
||||
'use strict';
|
||||
|
||||
module.exports = function (environment) {
|
||||
let ENV = {
|
||||
modulePrefix: 'dummy',
|
||||
environment,
|
||||
rootURL: '/',
|
||||
locationType: 'auto',
|
||||
EmberENV: {
|
||||
FEATURES: {
|
||||
// Here you can enable experimental features on an ember canary build
|
||||
// e.g. EMBER_NATIVE_DECORATOR_SUPPORT: true
|
||||
},
|
||||
EXTEND_PROTOTYPES: {
|
||||
// Prevent Ember Data from overriding Date.parse.
|
||||
Date: false,
|
||||
},
|
||||
},
|
||||
|
||||
APP: {
|
||||
// Here you can pass flags/options to your application instance
|
||||
// when it is created
|
||||
},
|
||||
};
|
||||
|
||||
if (environment === 'development') {
|
||||
// ENV.APP.LOG_RESOLVER = true;
|
||||
// ENV.APP.LOG_ACTIVE_GENERATION = true;
|
||||
// ENV.APP.LOG_TRANSITIONS = true;
|
||||
// ENV.APP.LOG_TRANSITIONS_INTERNAL = true;
|
||||
// ENV.APP.LOG_VIEW_LOOKUPS = true;
|
||||
}
|
||||
|
||||
if (environment === 'test') {
|
||||
// Testem prefers this...
|
||||
ENV.locationType = 'none';
|
||||
|
||||
// keep test console output quieter
|
||||
ENV.APP.LOG_ACTIVE_GENERATION = false;
|
||||
ENV.APP.LOG_VIEW_LOOKUPS = false;
|
||||
|
||||
ENV.APP.rootElement = '#ember-testing';
|
||||
ENV.APP.autoboot = false;
|
||||
}
|
||||
|
||||
if (environment === 'production') {
|
||||
// here you can enable a production-specific feature
|
||||
}
|
||||
|
||||
return ENV;
|
||||
};
|
||||
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"application-template-wrapper": false,
|
||||
"default-async-observers": true,
|
||||
"jquery-integration": false,
|
||||
"template-only-glimmer-components": true
|
||||
}
|
||||
@@ -0,0 +1,18 @@
|
||||
'use strict';
|
||||
|
||||
const browsers = [
|
||||
'last 1 Chrome versions',
|
||||
'last 1 Firefox versions',
|
||||
'last 1 Safari versions',
|
||||
];
|
||||
|
||||
const isCI = !!process.env.CI;
|
||||
const isProduction = process.env.EMBER_ENV === 'production';
|
||||
|
||||
if (isCI || isProduction) {
|
||||
browsers.push('ie 11');
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
browsers,
|
||||
};
|
||||
@@ -0,0 +1,3 @@
|
||||
# http://www.robotstxt.org
|
||||
User-agent: *
|
||||
Disallow:
|
||||
Whitespace-only changes.
@@ -0,0 +1,33 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<title>Dummy Tests</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
{{content-for "head"}}
|
||||
{{content-for "test-head"}}
|
||||
|
||||
<link rel="stylesheet" href="{{rootURL}}assets/vendor.css">
|
||||
<link rel="stylesheet" href="{{rootURL}}assets/dummy.css">
|
||||
<link rel="stylesheet" href="{{rootURL}}assets/test-support.css">
|
||||
|
||||
{{content-for "head-footer"}}
|
||||
{{content-for "test-head-footer"}}
|
||||
</head>
|
||||
<body>
|
||||
{{content-for "body"}}
|
||||
{{content-for "test-body"}}
|
||||
|
||||
<script src="/testem.js" integrity=""></script>
|
||||
<script src="{{rootURL}}assets/vendor.js"></script>
|
||||
<script src="{{rootURL}}assets/test-support.js"></script>
|
||||
<script src="{{rootURL}}assets/dummy.js"></script>
|
||||
<script src="{{rootURL}}assets/tests.js"></script>
|
||||
|
||||
{{content-for "body-footer"}}
|
||||
{{content-for "test-body-footer"}}
|
||||
</body>
|
||||
</html>
|
||||
Whitespace-only changes.
@@ -0,0 +1,35 @@
|
||||
import { module, test } from 'qunit';
|
||||
import { setupRenderingTest } from 'ember-qunit';
|
||||
import { render, find } from '@ember/test-helpers';
|
||||
import hbs from 'htmlbars-inline-precompile';
|
||||
|
||||
module('Integration | Component | rose/button', function (hooks) {
|
||||
setupRenderingTest(hooks);
|
||||
|
||||
test('it renders', async function (assert) {
|
||||
await render(hbs`<Rose::Button>Button 🌈</Rose::Button>`);
|
||||
assert.equal(this.element.textContent.trim(), 'Button 🌈');
|
||||
});
|
||||
|
||||
test('it is type="button" by default', async function (assert) {
|
||||
await render(hbs`<Rose::Button>Button</Rose::Button>`);
|
||||
assert.equal(await find('button').type, 'button');
|
||||
});
|
||||
|
||||
test('it is type="submit" when @submit={{true}}', async function (assert) {
|
||||
await render(hbs`<Rose::Button @submit={{true}} />`);
|
||||
assert.equal(await find('button').type, 'submit');
|
||||
});
|
||||
|
||||
test('it is disabled when @disabled={{true}}', async function (assert) {
|
||||
await render(hbs`<Rose::Button @disabled={{true}} />`);
|
||||
assert.equal(await find('button').disabled, true);
|
||||
});
|
||||
|
||||
test('it adds a style class', async function (assert) {
|
||||
await render(hbs`<Rose::Button @style="primary" />`);
|
||||
assert.ok(await find('button.rose-button-primary'));
|
||||
await render(hbs`<Rose::Button @style="secondary" />`);
|
||||
assert.ok(await find('button.rose-button-secondary'));
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,8 @@
|
||||
import Application from '../app';
|
||||
import config from '../config/environment';
|
||||
import { setApplication } from '@ember/test-helpers';
|
||||
import { start } from 'ember-qunit';
|
||||
|
||||
setApplication(Application.create(config.APP));
|
||||
|
||||
start();
|
||||
Whitespace-only changes.
Vendored
Whitespace-only changes.
+6
-2
@@ -8,9 +8,13 @@
|
||||
"ui/*"
|
||||
],
|
||||
"scripts": {
|
||||
"precommit": "yarn compliance:licenses && yarn audit",
|
||||
"lint": "yarn lint:addons:rose",
|
||||
"lint:addons:rose": "echo \"\n\nlint: addons/rose\n\" && cd addons/rose && yarn lint",
|
||||
"test": "yarn test:addons:rose",
|
||||
"test:addons:rose": "echo \"\n\ntest: addons/rose\n\" && cd addons/rose && yarn test",
|
||||
"precommit": "yarn compliance:licenses && yarn audit && yarn lint && yarn test",
|
||||
"commit": "git-cz",
|
||||
"compliance:licenses": "license-checker --onlyAllow 'Apache License, Version 2.0;Apache-2.0;BSD;BSD-3-Clause;CC-BY-3.0;CC-BY-4.0;CC0-1.0;ISC;MIT;MPL-2.0;Public Domain;Unicode-TOU;Unlicense;WTFPL' --excludePackages 'watchtower-ui'",
|
||||
"compliance:licenses": "license-checker --onlyAllow 'Apache*;Apache License, Version 2.0;Apache-2.0;BSD;BSD-3-Clause;CC-BY-3.0;CC-BY-4.0;CC0-1.0;ISC;MIT;MPL-2.0;Public Domain;Unicode-TOU;Unlicense;WTFPL' --excludePackages 'watchtower-ui;base64-js@0.0.2'",
|
||||
"doc:toc": "doctoc README.md"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
Reference in new issue
Block a user