├── .editorconfig ├── .github └── workflows │ ├── coverage.yml │ ├── publish.yml │ └── tests.yml ├── .gitignore ├── .jsbeautifyrc ├── .nvmrc ├── .prettierrc.yaml ├── Code-of-Conduct.md ├── Contributing.md ├── LICENSE ├── README.md ├── aurelia_project ├── aurelia.json ├── environments │ ├── dev.ts │ ├── prod.ts │ └── stage.ts ├── generators │ ├── attribute.json │ ├── attribute.ts │ ├── binding-behavior.json │ ├── binding-behavior.ts │ ├── element.json │ ├── element.ts │ ├── generator.json │ ├── generator.ts │ ├── task.json │ ├── task.ts │ ├── value-converter.json │ └── value-converter.ts └── tasks │ ├── build-plugin.ts │ ├── build-serve-watch.ts │ ├── build.json │ ├── build.ts │ ├── clear-cache.json │ ├── clear-cache.ts │ ├── copy-files.ts │ ├── jest.json │ ├── jest.ts │ ├── lint.json │ ├── lint.ts │ ├── process-css.ts │ ├── process-json.ts │ ├── process-markup.ts │ ├── run.json │ ├── run.ts │ ├── test.json │ ├── test.ts │ ├── transpile.ts │ └── watch.ts ├── dev-app ├── app.html ├── app.ts ├── assets │ └── fonts │ │ ├── HN57Con.woff │ │ ├── HN57ConIt.woff │ │ ├── HN67Con.woff │ │ ├── HN67ConIt.woff │ │ ├── NHGD55.woff │ │ ├── NHGD56It.woff │ │ ├── NHGD75.woff │ │ └── NHGD76It.woff ├── environment.ts ├── main.ts ├── routes │ ├── access-modifiers │ │ ├── index.html │ │ ├── index.ts │ │ └── overview │ │ │ ├── index.html │ │ │ └── index.ts │ ├── components │ │ ├── button │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── methods │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── copy │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── methods │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── slots │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── forms │ │ │ ├── add-remove │ │ │ │ ├── actions │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ └── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── checkbox-radio-container │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── slots │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── checkbox │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── methods │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── date │ │ │ │ ├── actions │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── slots │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── file │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── methods │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── slots │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── image │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── label │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── radio │ │ │ │ ├── actions │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── select │ │ │ │ ├── actions │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── slots │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── slider │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── methods │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── slots │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── text │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── methods │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── slots │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── textarea │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── slots │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ └── toggle │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── methods │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── index.html │ │ ├── index.ts │ │ ├── modal │ │ │ ├── body.html │ │ │ ├── body.ts │ │ │ ├── footer.html │ │ │ ├── footer.ts │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── usage │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── navs │ │ │ ├── horizontal │ │ │ │ ├── horizontal-nav-item │ │ │ │ │ ├── index.html │ │ │ │ │ ├── index.ts │ │ │ │ │ ├── methods │ │ │ │ │ │ ├── index.html │ │ │ │ │ │ └── index.ts │ │ │ │ │ ├── properties │ │ │ │ │ │ ├── index.html │ │ │ │ │ │ └── index.ts │ │ │ │ │ └── theming │ │ │ │ │ │ ├── index.html │ │ │ │ │ │ └── index.ts │ │ │ │ └── horizontal-nav │ │ │ │ │ ├── index.html │ │ │ │ │ ├── index.ts │ │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ └── vertical │ │ │ │ ├── vertical-nav-item │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── methods │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── vertical-nav-sliding │ │ │ │ ├── html │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── singleton │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── templates │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── vertical-nav │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ │ ├── slots │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── notification │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── overview │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── pill │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── methods │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── tables │ │ │ ├── fixed-header-table │ │ │ │ ├── actions │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── horizontal-scroll-table │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ └── table │ │ │ │ ├── actions │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ │ ├── cols-and-rows │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ │ ├── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ │ └── views-and-view-models │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── tip-actions.html │ │ │ │ ├── tip-actions.ts │ │ │ │ ├── tip-text.html │ │ │ │ └── tip-text.ts │ │ ├── tile │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── methods │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── replaceable-parts │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── timeline │ │ │ ├── actions │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── demo │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── tip │ │ │ ├── actions │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── slots │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── toasts │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── usage │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── type │ │ │ ├── code │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── headlines │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── list-container │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── list-item │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ ├── list │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ ├── slots │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ │ ├── index.html │ │ │ │ │ └── index.ts │ │ │ └── p │ │ │ │ ├── index.html │ │ │ │ ├── index.ts │ │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ │ └── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ └── utilities │ │ │ ├── dividers │ │ │ ├── index.html │ │ │ └── index.ts │ │ │ ├── drag-handle │ │ │ ├── index.html │ │ │ └── index.ts │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── label-box │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── methods │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── slots │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ ├── spinners │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── theming │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── status │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── properties │ │ │ ├── index.html │ │ │ └── index.ts │ │ │ └── theming │ │ │ ├── index.html │ │ │ └── index.ts │ ├── elements │ │ ├── delete-confirm │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── methods │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── index.html │ │ ├── index.ts │ │ ├── media-object │ │ │ ├── index.html │ │ │ └── index.ts │ │ └── overview │ │ │ ├── index.html │ │ │ └── index.ts │ ├── home │ │ ├── index.html │ │ └── index.ts │ ├── introduction │ │ ├── contribute │ │ │ ├── contribute.html │ │ │ └── contribute.ts │ │ ├── design-assets │ │ │ ├── design-assets.html │ │ │ └── design-assets.ts │ │ ├── getting-started │ │ │ ├── getting-started.html │ │ │ └── getting-started.ts │ │ ├── index.html │ │ ├── index.ts │ │ ├── modular-scale │ │ │ ├── modular-scale.html │ │ │ └── modular-scale.ts │ │ └── theming │ │ │ ├── theming.html │ │ │ └── theming.ts │ ├── layout-examples │ │ ├── basic-centered │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── basic │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── index.html │ │ ├── index.ts │ │ ├── nested-cover-scrolling │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── nested-cover-table-horizontal-scrolling │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── nested-cover-table-scrolling │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── nested-sidebar-scrolling │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── sidebar-scrolling │ │ │ ├── index.html │ │ │ └── index.ts │ │ └── sidebar │ │ │ ├── index.html │ │ │ └── index.ts │ ├── layouts │ │ ├── box-link │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── box │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── center │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── cluster │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── cover │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── examples │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── grid │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── methods │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── icon │ │ │ ├── index.html │ │ │ ├── index.ts │ │ │ ├── methods │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ │ └── properties │ │ │ │ ├── index.html │ │ │ │ └── index.ts │ │ ├── index.html │ │ ├── index.ts │ │ ├── overview │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── sidebar │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── stack │ │ │ ├── index.html │ │ │ └── index.ts │ │ └── switcher │ │ │ ├── index.html │ │ │ └── index.ts │ ├── playground │ │ ├── index.html │ │ └── index.ts │ ├── tokens │ │ ├── color │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── fonts │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── global-properties │ │ │ ├── index.html │ │ │ └── index.ts │ │ ├── index.html │ │ ├── index.ts │ │ ├── overview │ │ │ ├── index.html │ │ │ └── index.ts │ │ └── transitions │ │ │ ├── index.html │ │ │ └── index.ts │ └── value-converters │ │ ├── boolean-yes-no │ │ ├── index.html │ │ └── index.ts │ │ ├── capitalize │ │ ├── index.html │ │ └── index.ts │ │ ├── count │ │ ├── index.html │ │ └── index.ts │ │ ├── csv-to-array │ │ ├── index.html │ │ └── index.ts │ │ ├── datetime │ │ ├── index.html │ │ └── index.ts │ │ ├── default-value │ │ ├── index.html │ │ └── index.ts │ │ ├── empty-number-null │ │ ├── index.html │ │ └── index.ts │ │ ├── empty-string-null │ │ ├── index.html │ │ └── index.ts │ │ ├── index.html │ │ ├── index.ts │ │ ├── keys │ │ ├── index.html │ │ └── index.ts │ │ ├── millisec-to-date │ │ ├── index.html │ │ └── index.ts │ │ ├── millisec-to-duration │ │ ├── index.html │ │ └── index.ts │ │ ├── money-format │ │ ├── index.html │ │ └── index.ts │ │ ├── not-applicable │ │ ├── index.html │ │ └── index.ts │ │ ├── object-keys │ │ ├── index.html │ │ └── index.ts │ │ ├── overview │ │ ├── index.html │ │ └── index.ts │ │ ├── pluralize │ │ ├── index.html │ │ └── index.ts │ │ ├── regex-escape │ │ ├── index.html │ │ └── index.ts │ │ ├── sanitize │ │ ├── index.html │ │ └── index.ts │ │ └── string-to-number │ │ ├── index.html │ │ └── index.ts └── stylesheets │ ├── dev-app.css │ └── fonts.css ├── favicon.ico ├── index.html ├── jest.config.js ├── jest.global-setup.js ├── jest1.js ├── package.json ├── redirect.html ├── resources └── img │ ├── bindable-change-chart.png │ ├── bindable-home-header.jpg │ ├── bindable-large.svg │ └── css-modules-logo.png ├── src ├── components │ ├── buttons │ │ └── c-button │ │ │ ├── c-button.css │ │ │ ├── c-button.html │ │ │ ├── c-button.test.ts │ │ │ └── c-button.ts │ ├── copy │ │ └── c-copy │ │ │ ├── c-copy.css │ │ │ ├── c-copy.html │ │ │ ├── c-copy.test.ts │ │ │ └── c-copy.ts │ ├── forms │ │ ├── c-disabled │ │ │ ├── c-disabled.css │ │ │ ├── c-disabled.html │ │ │ ├── c-disabled.test.ts │ │ │ └── c-disabled.ts │ │ ├── c-form-error │ │ │ ├── c-form-error.css │ │ │ ├── c-form-error.html │ │ │ ├── c-form-error.test.ts │ │ │ └── c-form-error.ts │ │ ├── c-form-image │ │ │ ├── c-form-image.css │ │ │ ├── c-form-image.html │ │ │ ├── c-form-image.test.ts │ │ │ └── c-form-image.ts │ │ ├── c-form-info │ │ │ ├── c-form-info.css │ │ │ ├── c-form-info.html │ │ │ ├── c-form-info.test.ts │ │ │ └── c-form-info.ts │ │ ├── c-form-warning │ │ │ ├── c-form-warning.css │ │ │ ├── c-form-warning.html │ │ │ ├── c-form-warning.test.ts │ │ │ └── c-form-warning.ts │ │ ├── c-label │ │ │ ├── c-label.css │ │ │ ├── c-label.html │ │ │ ├── c-label.test.ts │ │ │ └── c-label.ts │ │ ├── checkbox-radio │ │ │ ├── c-form-checkbox-radio-container │ │ │ │ ├── c-form-checkbox-radio-container.css │ │ │ │ ├── c-form-checkbox-radio-container.html │ │ │ │ ├── c-form-checkbox-radio-container.test.ts │ │ │ │ └── c-form-checkbox-radio-container.ts │ │ │ ├── checkbox │ │ │ │ ├── c-checkbox-input │ │ │ │ │ ├── c-checkbox-input.css │ │ │ │ │ ├── c-checkbox-input.html │ │ │ │ │ ├── c-checkbox-input.test.ts │ │ │ │ │ └── c-checkbox-input.ts │ │ │ │ ├── c-checkbox-label │ │ │ │ │ ├── c-checkbox-label.css │ │ │ │ │ ├── c-checkbox-label.html │ │ │ │ │ ├── c-checkbox-label.test.ts │ │ │ │ │ └── c-checkbox-label.ts │ │ │ │ └── c-form-checkbox │ │ │ │ │ ├── c-form-checkbox.css │ │ │ │ │ ├── c-form-checkbox.html │ │ │ │ │ ├── c-form-checkbox.test.ts │ │ │ │ │ └── c-form-checkbox.ts │ │ │ ├── radio │ │ │ │ ├── c-form-radio │ │ │ │ │ ├── c-form-radio.html │ │ │ │ │ ├── c-form-radio.test.ts │ │ │ │ │ └── c-form-radio.ts │ │ │ │ ├── c-radio-input │ │ │ │ │ ├── c-radio-input.css │ │ │ │ │ ├── c-radio-input.html │ │ │ │ │ ├── c-radio-input.test.ts │ │ │ │ │ └── c-radio-input.ts │ │ │ │ └── c-radio-label │ │ │ │ │ ├── c-radio-label.css │ │ │ │ │ ├── c-radio-label.html │ │ │ │ │ ├── c-radio-label.test.ts │ │ │ │ │ └── c-radio-label.ts │ │ │ └── toggle │ │ │ │ ├── c-form-toggle │ │ │ │ ├── c-form-toggle.css │ │ │ │ ├── c-form-toggle.html │ │ │ │ ├── c-form-toggle.test.ts │ │ │ │ └── c-form-toggle.ts │ │ │ │ ├── c-toggle-input │ │ │ │ ├── c-toggle-input.css │ │ │ │ ├── c-toggle-input.html │ │ │ │ ├── c-toggle-input.test.ts │ │ │ │ └── c-toggle-input.ts │ │ │ │ └── c-toggle-label │ │ │ │ ├── c-toggle-label.css │ │ │ │ ├── c-toggle-label.html │ │ │ │ ├── c-toggle-label.test.ts │ │ │ │ └── c-toggle-label.ts │ │ ├── date │ │ │ └── c-form-date │ │ │ │ ├── c-form-date.css │ │ │ │ ├── c-form-date.html │ │ │ │ ├── c-form-date.test.ts │ │ │ │ └── c-form-date.ts │ │ ├── file │ │ │ ├── c-file-input │ │ │ │ ├── c-file-input.css │ │ │ │ ├── c-file-input.html │ │ │ │ ├── c-file-input.test.ts │ │ │ │ └── c-file-input.ts │ │ │ └── c-form-file │ │ │ │ ├── c-form-file.css │ │ │ │ ├── c-form-file.html │ │ │ │ ├── c-form-file.test.ts │ │ │ │ └── c-form-file.ts │ │ ├── select │ │ │ ├── c-form-add-remove │ │ │ │ ├── c-form-add-remove-interfaces.ts │ │ │ │ ├── c-form-add-remove.css │ │ │ │ ├── c-form-add-remove.html │ │ │ │ ├── c-form-add-remove.test.ts │ │ │ │ └── c-form-add-remove.ts │ │ │ └── c-form-select │ │ │ │ ├── c-form-select.css │ │ │ │ ├── c-form-select.html │ │ │ │ ├── c-form-select.test.ts │ │ │ │ ├── c-form-select.ts │ │ │ │ └── select2.css │ │ ├── slider │ │ │ ├── c-form-slider │ │ │ │ ├── c-form-slider.css │ │ │ │ ├── c-form-slider.html │ │ │ │ ├── c-form-slider.test.ts │ │ │ │ └── c-form-slider.ts │ │ │ └── c-slider │ │ │ │ ├── c-slider.css │ │ │ │ ├── c-slider.html │ │ │ │ ├── c-slider.test.ts │ │ │ │ └── c-slider.ts │ │ ├── text │ │ │ ├── c-form-text │ │ │ │ ├── c-form-text.css │ │ │ │ ├── c-form-text.html │ │ │ │ ├── c-form-text.test.ts │ │ │ │ └── c-form-text.ts │ │ │ └── c-text-input │ │ │ │ ├── c-text-input.css │ │ │ │ ├── c-text-input.html │ │ │ │ ├── c-text-input.test.ts │ │ │ │ └── c-text-input.ts │ │ └── textarea │ │ │ ├── c-form-textarea │ │ │ ├── c-form-textarea.css │ │ │ ├── c-form-textarea.html │ │ │ ├── c-form-textarea.test.ts │ │ │ └── c-form-textarea.ts │ │ │ └── c-textarea-input │ │ │ ├── c-textarea-input.css │ │ │ ├── c-textarea-input.html │ │ │ ├── c-textarea-input.test.ts │ │ │ └── c-textarea-input.ts │ ├── modal │ │ └── c-modal │ │ │ ├── c-modal.css │ │ │ ├── c-modal.html │ │ │ ├── c-modal.test.ts │ │ │ └── c-modal.ts │ ├── navs │ │ ├── c-nav-horizontal-item │ │ │ ├── c-nav-horizontal-item.css │ │ │ ├── c-nav-horizontal-item.html │ │ │ ├── c-nav-horizontal-item.test.ts │ │ │ └── c-nav-horizontal-item.ts │ │ ├── c-nav-horizontal │ │ │ ├── c-nav-horizontal.css │ │ │ ├── c-nav-horizontal.html │ │ │ ├── c-nav-horizontal.test.ts │ │ │ ├── c-nav-horizontal.ts │ │ │ └── mobile-nav-open.ts │ │ ├── c-nav-vertical-item │ │ │ ├── c-nav-vertical-item.css │ │ │ ├── c-nav-vertical-item.html │ │ │ ├── c-nav-vertical-item.test.ts │ │ │ └── c-nav-vertical-item.ts │ │ ├── c-nav-vertical-sliding │ │ │ ├── c-nav-vertical-sliding-interfaces.ts │ │ │ ├── c-nav-vertical-sliding.css │ │ │ ├── c-nav-vertical-sliding.html │ │ │ ├── c-nav-vertical-sliding.test.ts │ │ │ ├── c-nav-vertical-sliding.ts │ │ │ ├── shared-nav-service.test.ts │ │ │ └── shared-nav-service.ts │ │ └── c-nav-vertical │ │ │ ├── c-nav-vertical.css │ │ │ ├── c-nav-vertical.html │ │ │ ├── c-nav-vertical.test.ts │ │ │ └── c-nav-vertical.ts │ ├── notifications │ │ └── c-notification │ │ │ ├── c-notification.css │ │ │ ├── c-notification.html │ │ │ ├── c-notification.test.ts │ │ │ └── c-notification.ts │ ├── pills │ │ └── c-pill │ │ │ ├── c-pill.css │ │ │ ├── c-pill.html │ │ │ ├── c-pill.test.ts │ │ │ └── c-pill.ts │ ├── popover │ │ └── c-popover │ │ │ ├── c-popover-service.ts │ │ │ ├── c-popover.css │ │ │ ├── c-popover.html │ │ │ ├── c-popover.test.ts │ │ │ └── c-popover.ts │ ├── tables │ │ ├── c-table-fixed-header │ │ │ ├── c-table-fixed-header.css │ │ │ ├── c-table-fixed-header.html │ │ │ ├── c-table-fixed-header.test.ts │ │ │ └── c-table-fixed-header.ts │ │ ├── c-table │ │ │ ├── c-table-interfaces.ts │ │ │ ├── c-table.css │ │ │ ├── c-table.html │ │ │ ├── c-table.test.ts │ │ │ └── c-table.ts │ │ ├── c-td │ │ │ ├── c-td.css │ │ │ ├── c-td.html │ │ │ ├── c-td.test.ts │ │ │ └── c-td.ts │ │ └── td-contents │ │ │ ├── c-td-action │ │ │ ├── c-td-action.css │ │ │ ├── c-td-action.html │ │ │ ├── c-td-action.test.ts │ │ │ └── c-td-action.ts │ │ │ ├── c-td-button │ │ │ ├── c-td-button.html │ │ │ ├── c-td-button.test.ts │ │ │ └── c-td-button.ts │ │ │ ├── c-td-check │ │ │ ├── c-td-check.html │ │ │ ├── c-td-check.test.ts │ │ │ └── c-td-check.ts │ │ │ ├── c-td-drag-check │ │ │ ├── c-td-drag-check.html │ │ │ ├── c-td-drag-check.test.ts │ │ │ └── c-td-drag-check.ts │ │ │ ├── c-td-drag │ │ │ ├── c-td-drag.html │ │ │ ├── c-td-drag.test.ts │ │ │ └── c-td-drag.ts │ │ │ ├── c-td-image │ │ │ ├── c-td-image.css │ │ │ ├── c-td-image.html │ │ │ ├── c-td-image.test.ts │ │ │ └── c-td-image.ts │ │ │ ├── c-td-pill │ │ │ ├── c-td-pill.css │ │ │ ├── c-td-pill.html │ │ │ ├── c-td-pill.test.ts │ │ │ └── c-td-pill.ts │ │ │ ├── c-td-radio │ │ │ ├── c-td-radio.html │ │ │ ├── c-td-radio.test.ts │ │ │ └── c-td-radio.ts │ │ │ ├── c-td-text-input │ │ │ ├── c-td-text-input.html │ │ │ ├── c-td-text-input.test.ts │ │ │ └── c-td-text-input.ts │ │ │ ├── c-td-tip │ │ │ ├── c-td-tip.html │ │ │ ├── c-td-tip.test.ts │ │ │ └── c-td-tip.ts │ │ │ ├── c-td-toggle │ │ │ ├── c-td-toggle.html │ │ │ ├── c-td-toggle.test.ts │ │ │ └── c-td-toggle.ts │ │ │ └── c-td-truncate │ │ │ ├── c-td-truncate.css │ │ │ ├── c-td-truncate.html │ │ │ ├── c-td-truncate.test.ts │ │ │ └── c-td-truncate.ts │ ├── tile │ │ └── c-tile │ │ │ ├── c-tile.css │ │ │ ├── c-tile.html │ │ │ ├── c-tile.test.ts │ │ │ └── c-tile.ts │ ├── timeline │ │ ├── c-time-entry │ │ │ ├── c-time-entry-popover.html │ │ │ ├── c-time-entry-popover.ts │ │ │ ├── c-time-entry.css │ │ │ ├── c-time-entry.html │ │ │ ├── c-time-entry.test.ts │ │ │ └── c-time-entry.ts │ │ ├── c-timeline-block │ │ │ ├── c-timeline-block.css │ │ │ ├── c-timeline-block.html │ │ │ ├── c-timeline-block.test.ts │ │ │ └── c-timeline-block.ts │ │ ├── c-timeline-container │ │ │ ├── c-timeline-container.css │ │ │ ├── c-timeline-container.html │ │ │ ├── c-timeline-container.test.ts │ │ │ └── c-timeline-container.ts │ │ ├── c-timeline-month-container │ │ │ ├── c-timeline-month-container.css │ │ │ ├── c-timeline-month-container.html │ │ │ ├── c-timeline-month-container.test.ts │ │ │ └── c-timeline-month-container.ts │ │ ├── c-timeline-month-item │ │ │ ├── c-timeline-month-item.css │ │ │ ├── c-timeline-month-item.html │ │ │ ├── c-timeline-month-item.test.ts │ │ │ └── c-timeline-month-item.ts │ │ ├── c-timeline-week-container │ │ │ ├── c-timeline-week-container.css │ │ │ ├── c-timeline-week-container.html │ │ │ ├── c-timeline-week-container.test.ts │ │ │ └── c-timeline-week-container.ts │ │ └── c-timeline │ │ │ ├── c-time-entries-value-converter.ts │ │ │ ├── c-timeline-interfaces.ts │ │ │ ├── c-timeline.html │ │ │ ├── c-timeline.test.ts │ │ │ ├── c-timeline.ts │ │ │ ├── workers.test.ts │ │ │ └── workers.ts │ ├── tip │ │ └── c-tip │ │ │ ├── c-tip-interfaces.ts │ │ │ ├── c-tip.css │ │ │ ├── c-tip.html │ │ │ ├── c-tip.test.ts │ │ │ └── c-tip.ts │ ├── toasts │ │ └── c-toasts │ │ │ ├── c-toasts-service.test.ts │ │ │ ├── c-toasts-service.ts │ │ │ ├── c-toasts.css │ │ │ ├── c-toasts.html │ │ │ ├── c-toasts.test.ts │ │ │ └── c-toasts.ts │ ├── type │ │ ├── code-sample │ │ │ ├── c-code-sample.html │ │ │ ├── c-code-sample.test.ts │ │ │ └── c-code-sample.ts │ │ ├── code │ │ │ ├── c-code.css │ │ │ ├── c-code.html │ │ │ ├── c-code.test.ts │ │ │ └── c-code.ts │ │ ├── h1 │ │ │ ├── c-h1.css │ │ │ ├── c-h1.html │ │ │ ├── c-h1.test.ts │ │ │ └── c-h1.ts │ │ ├── h2 │ │ │ ├── c-h2.css │ │ │ ├── c-h2.html │ │ │ ├── c-h2.test.ts │ │ │ └── c-h2.ts │ │ ├── h3 │ │ │ ├── c-h3.css │ │ │ ├── c-h3.html │ │ │ ├── c-h3.test.ts │ │ │ └── c-h3.ts │ │ ├── h4 │ │ │ ├── c-h4.css │ │ │ ├── c-h4.html │ │ │ ├── c-h4.test.ts │ │ │ └── c-h4.ts │ │ ├── h5 │ │ │ ├── c-h5.css │ │ │ ├── c-h5.html │ │ │ ├── c-h5.test.ts │ │ │ └── c-h5.ts │ │ ├── list │ │ │ ├── c-list-container │ │ │ │ ├── c-list-container.css │ │ │ │ ├── c-list-container.html │ │ │ │ ├── c-list-container.test.ts │ │ │ │ └── c-list-container.ts │ │ │ ├── c-list-item │ │ │ │ ├── c-list-item.css │ │ │ │ ├── c-list-item.html │ │ │ │ ├── c-list-item.test.ts │ │ │ │ └── c-list-item.ts │ │ │ └── c-list │ │ │ │ ├── c-list.css │ │ │ │ ├── c-list.html │ │ │ │ ├── c-list.test.ts │ │ │ │ └── c-list.ts │ │ └── p │ │ │ ├── c-p.css │ │ │ ├── c-p.html │ │ │ ├── c-p.test.ts │ │ │ └── c-p.ts │ └── utilities │ │ ├── c-divider │ │ ├── c-divider.css │ │ ├── c-divider.html │ │ ├── c-divider.test.ts │ │ └── c-divider.ts │ │ ├── c-drag-handle │ │ ├── c-drag-handle.css │ │ ├── c-drag-handle.html │ │ ├── c-drag-handle.test.ts │ │ └── c-drag-handle.ts │ │ ├── c-label-box │ │ ├── c-label-box.css │ │ ├── c-label-box.html │ │ ├── c-label-box.test.ts │ │ └── c-label-box.ts │ │ ├── c-spinner │ │ ├── c-spinner.css │ │ ├── c-spinner.html │ │ ├── c-spinner.test.ts │ │ └── c-spinner.ts │ │ └── c-status │ │ ├── c-status.css │ │ ├── c-status.html │ │ ├── c-status.test.ts │ │ └── c-status.ts ├── custom-attributes │ ├── drag-draggable.ts │ └── drag-dropzone.ts ├── decorators │ ├── auth-state.ts │ ├── dirty-check-prompt │ │ ├── index.test.ts │ │ ├── index.ts │ │ └── modal │ │ │ ├── body.html │ │ │ ├── body.test.ts │ │ │ ├── body.ts │ │ │ ├── footer.html │ │ │ ├── footer.test.ts │ │ │ └── footer.ts │ └── event-listeners.ts ├── elements │ ├── delete-confirm │ │ └── e-delete-confirm │ │ │ ├── e-delete-confirm.html │ │ │ ├── e-delete-confirm.test.ts │ │ │ └── e-delete-confirm.ts │ └── media-object │ │ └── e-media-object │ │ ├── e-media-object.css │ │ ├── e-media-object.html │ │ ├── e-media-object.test.ts │ │ └── e-media-object.ts ├── global-styles │ ├── assets │ │ └── images │ │ │ ├── td-building.gif │ │ │ └── td-processing.gif │ ├── global.css │ ├── reset.css │ └── themes │ │ └── main.css ├── helpers │ ├── copy-to-clipboard.test.ts │ ├── copy-to-clipboard.ts │ ├── generate-random.ts │ ├── highlight-phrases.test.ts │ ├── highlight-phrases.ts │ ├── highlight-text.ts │ ├── lazy-load-check.ts │ ├── local-storage.test.ts │ ├── local-storage.ts │ ├── multi-index-splicer.test.ts │ ├── multi-index-splicer.ts │ ├── sleep.ts │ ├── sort-drop-data.test.ts │ ├── sort-drop-data.ts │ ├── sorting.test.ts │ └── sorting.ts ├── index.ts ├── interfaces │ └── event-listeners.ts ├── layouts │ ├── l-box-link │ │ ├── l-box-link.html │ │ ├── l-box-link.test.ts │ │ └── l-box-link.ts │ ├── l-box │ │ ├── l-box.css │ │ ├── l-box.html │ │ ├── l-box.test.ts │ │ └── l-box.ts │ ├── l-center │ │ ├── l-center.css │ │ ├── l-center.html │ │ ├── l-center.test.ts │ │ └── l-center.ts │ ├── l-cluster │ │ ├── l-cluster.css │ │ ├── l-cluster.html │ │ ├── l-cluster.test.ts │ │ └── l-cluster.ts │ ├── l-cover │ │ ├── l-cover.css │ │ ├── l-cover.html │ │ ├── l-cover.test.ts │ │ └── l-cover.ts │ ├── l-grid │ │ ├── l-grid.css │ │ ├── l-grid.html │ │ ├── l-grid.test.ts │ │ └── l-grid.ts │ ├── l-icon │ │ ├── l-icon.css │ │ ├── l-icon.html │ │ ├── l-icon.test.ts │ │ └── l-icon.ts │ ├── l-sidebar │ │ ├── l-sidebar.css │ │ ├── l-sidebar.html │ │ ├── l-sidebar.test.ts │ │ └── l-sidebar.ts │ ├── l-stack │ │ ├── l-stack.css │ │ ├── l-stack.html │ │ ├── l-stack.test.ts │ │ └── l-stack.ts │ └── l-switcher │ │ ├── l-switcher.css │ │ ├── l-switcher.html │ │ ├── l-switcher.test.ts │ │ └── l-switcher.ts └── value-converters │ ├── async-binding.ts │ ├── boolean-yes-no.ts │ ├── capitalize.ts │ ├── count.ts │ ├── csv-to-array.ts │ ├── datetime.test.ts │ ├── datetime.ts │ ├── default-value.ts │ ├── empty-number-null.ts │ ├── empty-string-null.ts │ ├── filter.ts │ ├── get-property.ts │ ├── keys.test.ts │ ├── keys.ts │ ├── meta.test.ts │ ├── meta.ts │ ├── metric-name-chart.ts │ ├── metric-name.ts │ ├── metric-value.ts │ ├── millisec-to-date.ts │ ├── millisec-to-duration.ts │ ├── money-format.ts │ ├── not-applicable.ts │ ├── object-keys.ts │ ├── pager.ts │ ├── pluralize.ts │ ├── regex-escape.ts │ ├── sanitize.ts │ ├── slicer-health-classification.ts │ ├── slicer-health.ts │ ├── sort.ts │ ├── string-to-number.ts │ ├── th-class-for.ts │ └── vsort.ts ├── test ├── empty-module.js ├── jest-pretest.ts └── jest-setup.ts ├── tsconfig.json ├── tslint.json ├── types └── global.d.ts ├── update-version.js └── yarn.lock /.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig is awesome: http://EditorConfig.org 2 | 3 | # top-most EditorConfig file 4 | root = true 5 | 6 | # Unix-style newlines with a newline ending every file 7 | [*] 8 | end_of_line = lf 9 | insert_final_newline = true 10 | # 4 space indentation 11 | indent_style = space 12 | indent_size = 4 13 | max_line_length = 120 14 | -------------------------------------------------------------------------------- /.github/workflows/coverage.yml: -------------------------------------------------------------------------------- 1 | name: Test Coverage 2 | 3 | on: 4 | push: 5 | branches: 6 | - master 7 | 8 | jobs: 9 | coverage: 10 | runs-on: ubuntu-20.04 11 | 12 | steps: 13 | - uses: actions/checkout@master 14 | - name: Checks Test Coverage 15 | uses: actions/setup-node@v1 16 | with: 17 | node-version: '14.18.0' 18 | - run: npm install -g jest 19 | - run: npm install -g yarn 20 | - run: yarn 21 | - run: yarn test:ci 22 | - name: Coveralls 23 | uses: coverallsapp/github-action@master 24 | with: 25 | github-token: ${{ secrets.GITHUB_TOKEN }} 26 | path-to-lcov: ./test/coverage-jest/lcov.info 27 | -------------------------------------------------------------------------------- /.github/workflows/publish.yml: -------------------------------------------------------------------------------- 1 | name: Publish to NPM 2 | 3 | on: 4 | release: 5 | types: [created] 6 | 7 | jobs: 8 | publish: 9 | runs-on: ubuntu-20.04 10 | steps: 11 | - uses: actions/checkout@master 12 | - uses: actions/setup-node@v1 13 | with: 14 | node-version: '14.18.0' 15 | registry-url: https://registry.npmjs.org/ 16 | - run: npm install -g yarn 17 | - run: yarn 18 | - run: npm publish --access public 19 | env: 20 | NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }} 21 | -------------------------------------------------------------------------------- /.github/workflows/tests.yml: -------------------------------------------------------------------------------- 1 | name: Run Tests on PRs 2 | 3 | on: 4 | pull_request: 5 | branches: 6 | - master 7 | 8 | jobs: 9 | tests: 10 | runs-on: ubuntu-20.04 11 | 12 | steps: 13 | - uses: actions/checkout@master 14 | - name: Runs Tests 15 | uses: actions/setup-node@v1 16 | with: 17 | node-version: '14.18.0' 18 | - run: npm install -g jest 19 | - run: npm install -g yarn 20 | - run: yarn 21 | - run: yarn test:ci 22 | - name: Coveralls 23 | uses: coverallsapp/github-action@master 24 | with: 25 | github-token: ${{ secrets.GITHUB_TOKEN }} 26 | path-to-lcov: ./test/coverage-jest/lcov.info 27 | -------------------------------------------------------------------------------- /.jsbeautifyrc: -------------------------------------------------------------------------------- 1 | { 2 | "end_with_newline": true, 3 | "brace-style": "none", 4 | "indent_level": 0, 5 | "preserve_newlines": true, 6 | "max_preserve_newlines": 4, 7 | "brace_style": "expand", 8 | "wrap_line_length": 120, 9 | "wrap-attributes": "force-expand-multiline" 10 | } -------------------------------------------------------------------------------- /.nvmrc: -------------------------------------------------------------------------------- 1 | 14.18.0 2 | -------------------------------------------------------------------------------- /.prettierrc.yaml: -------------------------------------------------------------------------------- 1 | # github max line length for code reviews is 125 2 | printWidth: 120 3 | trailingComma: 'all' 4 | tabWidth: 4 5 | semi: true 6 | singleQuote: true 7 | bracketSpacing: false 8 | overrides: 9 | - files: '{package*.json,jsconfig.json,aurelia.json,build/**/*.js}' 10 | options: 11 | trailingComma: 'es5' 12 | tabWidth: 2 13 | -------------------------------------------------------------------------------- /aurelia_project/environments/dev.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | debug: true, 3 | testing: true 4 | }; 5 | -------------------------------------------------------------------------------- /aurelia_project/environments/prod.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | debug: false, 3 | testing: false 4 | }; 5 | -------------------------------------------------------------------------------- /aurelia_project/environments/stage.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | debug: true, 3 | testing: false 4 | }; 5 | -------------------------------------------------------------------------------- /aurelia_project/generators/attribute.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "attribute", 3 | "description": "Creates a custom attribute class and places it in the project resources." 4 | } -------------------------------------------------------------------------------- /aurelia_project/generators/binding-behavior.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "binding-behavior", 3 | "description": "Creates a binding behavior class and places it in the project resources." 4 | } -------------------------------------------------------------------------------- /aurelia_project/generators/element.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "element", 3 | "description": "Creates a custom element class and template, placing them in the project resources." 4 | } -------------------------------------------------------------------------------- /aurelia_project/generators/generator.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "generator", 3 | "description": "Creates a generator class and places it in the project generators folder." 4 | } -------------------------------------------------------------------------------- /aurelia_project/generators/task.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "task", 3 | "description": "Creates a task and places it in the project tasks folder." 4 | } -------------------------------------------------------------------------------- /aurelia_project/generators/value-converter.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "value-converter", 3 | "description": "Creates a value converter class and places it in the project resources." 4 | } -------------------------------------------------------------------------------- /aurelia_project/tasks/build-serve-watch.ts: -------------------------------------------------------------------------------- 1 | import * as gulp from 'gulp'; 2 | 3 | import {buildPackage} from './build-plugin'; 4 | import {serve, reload} from './run'; 5 | import {watchAlt} from './watch'; 6 | 7 | export default gulp.series( 8 | gulp.parallel(buildPackage, serve), 9 | done => { watchAlt(reload); done(); } 10 | ); 11 | -------------------------------------------------------------------------------- /aurelia_project/tasks/build.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "build", 3 | "description": "Builds and processes all application assets.", 4 | "flags": [ 5 | { 6 | "name": "env", 7 | "description": "Sets the build environment.", 8 | "type": "string" 9 | }, 10 | { 11 | "name": "watch", 12 | "description": "Watches source files for changes and refreshes the bundles automatically.", 13 | "type": "boolean" 14 | } 15 | ] 16 | } -------------------------------------------------------------------------------- /aurelia_project/tasks/clear-cache.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "clear-cache", 3 | "description": "Clear both transpile cache (only for esnext), and tracing-cache (for CLI built-in tracer)." 4 | } -------------------------------------------------------------------------------- /aurelia_project/tasks/clear-cache.ts: -------------------------------------------------------------------------------- 1 | import * as gulp from 'gulp'; 2 | import {build} from 'aurelia-cli'; 3 | 4 | export default function clearCache() { 5 | return build.clearCache(); 6 | } 7 | -------------------------------------------------------------------------------- /aurelia_project/tasks/jest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "jest", 3 | "description": "Runs Jest and reports the results.", 4 | "flags": [ 5 | { 6 | "name": "watch", 7 | "description": "Watches test files for changes and re-runs the tests automatically.", 8 | "type": "boolean" 9 | } 10 | ] 11 | } -------------------------------------------------------------------------------- /aurelia_project/tasks/jest.ts: -------------------------------------------------------------------------------- 1 | export {default} from './test'; 2 | -------------------------------------------------------------------------------- /aurelia_project/tasks/lint.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "lint", 3 | "description": "Lint source files", 4 | "flags": [] 5 | } -------------------------------------------------------------------------------- /aurelia_project/tasks/lint.ts: -------------------------------------------------------------------------------- 1 | import * as gulp from 'gulp'; 2 | import tslint from 'gulp-tslint'; 3 | import * as project from '../aurelia.json'; 4 | 5 | export default function lint() { 6 | return gulp.src(project.transpiler.source) 7 | .pipe(tslint({ 8 | tslint: require("tslint"), 9 | formatter: 'prose' 10 | })) 11 | .pipe(tslint.report()); 12 | } 13 | -------------------------------------------------------------------------------- /aurelia_project/tasks/process-json.ts: -------------------------------------------------------------------------------- 1 | import * as gulp from 'gulp'; 2 | import * as project from '../aurelia.json'; 3 | import {build} from 'aurelia-cli'; 4 | 5 | export default function processJson() { 6 | return gulp.src(project.jsonProcessor.source, {since: gulp.lastRun(processJson)}) 7 | .pipe(build.bundle()); 8 | } 9 | 10 | export function pluginJson(dest) { 11 | return function processPluginJson() { 12 | return gulp.src(project.plugin.source.json) 13 | .pipe(gulp.dest(dest)); 14 | }; 15 | } 16 | -------------------------------------------------------------------------------- /aurelia_project/tasks/run.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "run", 3 | "description": "Builds the application and serves up the assets via a local web server, watching files for changes as you work.", 4 | "flags": [ 5 | { 6 | "name": "env", 7 | "description": "Sets the build environment.", 8 | "type": "string" 9 | }, 10 | { 11 | "name": "open", 12 | "description": "Open the default browser at the application location.", 13 | "type": "boolean" 14 | }, 15 | { 16 | "name": "port", 17 | "description": "Set port number of the dev server", 18 | "type": "string" 19 | } 20 | ] 21 | } -------------------------------------------------------------------------------- /aurelia_project/tasks/test.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "test", 3 | "description": "Runs Jest and reports the results.", 4 | "flags": [ 5 | { 6 | "name": "watch", 7 | "description": "Watches test files for changes and re-runs the tests automatically.", 8 | "type": "boolean" 9 | } 10 | ] 11 | } -------------------------------------------------------------------------------- /aurelia_project/tasks/test.ts: -------------------------------------------------------------------------------- 1 | import * as jest from 'jest-cli'; 2 | import * as path from 'path'; 3 | import * as packageJson from '../../package.json'; 4 | 5 | import { CLIOptions } from 'aurelia-cli'; 6 | 7 | export default (cb) => { 8 | let options = packageJson.jest; 9 | 10 | if (CLIOptions.hasFlag('watch')) { 11 | Object.assign(options, { watchAll: true}); 12 | } 13 | 14 | 15 | jest.runCLI(options, [path.resolve(__dirname, '../../')]).then(({ results }) => { 16 | if (results.numFailedTests || results.numFailedTestSuites) { 17 | cb('Tests Failed'); 18 | } else { 19 | cb(); 20 | } 21 | }); 22 | }; 23 | -------------------------------------------------------------------------------- /dev-app/assets/fonts/HN57Con.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/dev-app/assets/fonts/HN57Con.woff -------------------------------------------------------------------------------- /dev-app/assets/fonts/HN57ConIt.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/dev-app/assets/fonts/HN57ConIt.woff -------------------------------------------------------------------------------- /dev-app/assets/fonts/HN67Con.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/dev-app/assets/fonts/HN67Con.woff -------------------------------------------------------------------------------- /dev-app/assets/fonts/HN67ConIt.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/dev-app/assets/fonts/HN67ConIt.woff -------------------------------------------------------------------------------- /dev-app/assets/fonts/NHGD55.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/dev-app/assets/fonts/NHGD55.woff -------------------------------------------------------------------------------- /dev-app/assets/fonts/NHGD56It.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/dev-app/assets/fonts/NHGD56It.woff -------------------------------------------------------------------------------- /dev-app/assets/fonts/NHGD75.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/dev-app/assets/fonts/NHGD75.woff -------------------------------------------------------------------------------- /dev-app/assets/fonts/NHGD76It.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/dev-app/assets/fonts/NHGD76It.woff -------------------------------------------------------------------------------- /dev-app/environment.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | debug: true, 3 | testing: true 4 | }; 5 | -------------------------------------------------------------------------------- /dev-app/routes/access-modifiers/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 26 | -------------------------------------------------------------------------------- /dev-app/routes/access-modifiers/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {autoinject} from 'aurelia-framework'; 7 | import {PLATFORM} from 'aurelia-pal'; 8 | import {Router} from 'aurelia-router'; 9 | 10 | @autoinject() 11 | export class AccessModifiers { 12 | public router: Router; 13 | public routes = [ 14 | { 15 | redirect: 'overview', 16 | route: '', 17 | }, 18 | { 19 | moduleId: PLATFORM.moduleName('./overview/index'), 20 | name: 'overview', 21 | nav: true, 22 | route: 'overview', 23 | title: 'Overview', 24 | }, 25 | ]; 26 | 27 | public configureRouter(config, router) { 28 | this.router = router; 29 | config.map(this.routes); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /dev-app/routes/components/button/methods/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 28 | -------------------------------------------------------------------------------- /dev-app/routes/components/button/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/copy/slots/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class CopySlots { 7 | public copyColsSlots = [ 8 | { 9 | _class: 'monospaced', 10 | colClass: 't150', 11 | colHeadName: 'name', 12 | colHeadValue: 'Name', 13 | }, 14 | { 15 | colHeadName: 'description', 16 | colHeadValue: 'Description', 17 | }, 18 | ]; 19 | 20 | public copyOptionsSlots = [ 21 | { 22 | description: 'Use when you need to put a tip next to the label.', 23 | name: 'tip', 24 | }, 25 | ]; 26 | } 27 | -------------------------------------------------------------------------------- /dev-app/routes/components/copy/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/add-remove/actions/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 16 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/checkbox-radio-container/slots/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class CheckboxRadioContainerSlots { 7 | public formCheckboxRadioContainerColsSlots = [ 8 | { 9 | _class: 'monospaced', 10 | colClass: 't150', 11 | colHeadName: 'name', 12 | colHeadValue: 'Name', 13 | }, 14 | { 15 | colHeadName: 'description', 16 | colHeadValue: 'Description', 17 | }, 18 | ]; 19 | 20 | public formCheckboxRadioContainerOptionsSlots = [ 21 | { 22 | description: 'Use when you need to put a tip next to the label of the group.', 23 | name: 'tip', 24 | }, 25 | ]; 26 | } 27 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/checkbox/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/date/actions/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 16 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/date/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 23 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/date/slots/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class DateInputSlots { 7 | public formDateColsSlots = [ 8 | { 9 | _class: 'monospaced', 10 | colClass: 't150', 11 | colHeadName: 'name', 12 | colHeadValue: 'Name', 13 | }, 14 | { 15 | colHeadName: 'description', 16 | colHeadValue: 'Description', 17 | }, 18 | ]; 19 | 20 | public formDateOptionsSlots = [ 21 | { 22 | description: 'Use when you need to put a tip next to the label.', 23 | name: 'tip', 24 | }, 25 | ]; 26 | } 27 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/date/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/file/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 23 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/file/slots/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class FileSlots { 7 | public formFileColsSlots = [ 8 | { 9 | _class: 'monospaced', 10 | colClass: 't150', 11 | colHeadName: 'name', 12 | colHeadValue: 'Name', 13 | }, 14 | { 15 | colHeadName: 'description', 16 | colHeadValue: 'Description', 17 | }, 18 | ]; 19 | 20 | public formFileOptionsSlots = [ 21 | { 22 | description: 'Use when you need to put a tip next to the label.', 23 | name: 'tip', 24 | }, 25 | ]; 26 | } 27 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/file/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 21 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/file/theming/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class FileThemeProperties {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/image/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 23 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/image/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/label/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 29 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/radio/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 24 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/slider/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/text/slots/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class TextInputSlots { 7 | public formTextColsSlots = [ 8 | { 9 | _class: 'monospaced', 10 | colClass: 't150', 11 | colHeadName: 'name', 12 | colHeadValue: 'Name', 13 | }, 14 | { 15 | colHeadName: 'description', 16 | colHeadValue: 'Description', 17 | }, 18 | ]; 19 | 20 | public formTextOptionsSlots = [ 21 | { 22 | description: 'Use when you need to put a tip next to the label.', 23 | name: 'tip', 24 | }, 25 | ]; 26 | } 27 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/textarea/slots/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class TextAreaSlots { 7 | public formTextareaColsSlots = [ 8 | { 9 | _class: 'monospaced', 10 | colClass: 't150', 11 | colHeadName: 'name', 12 | colHeadValue: 'Name', 13 | }, 14 | { 15 | colHeadName: 'description', 16 | colHeadValue: 'Description', 17 | }, 18 | ]; 19 | 20 | public formTextareaOptionsSlots = [ 21 | { 22 | description: 'Use when you need to put a tip next to the label.', 23 | name: 'tip', 24 | }, 25 | ]; 26 | } 27 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/textarea/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 21 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/textarea/theming/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class TextareaThemeProperties {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/components/forms/toggle/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 26 | -------------------------------------------------------------------------------- /dev-app/routes/components/modal/body.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | 7 | export class Body { 8 | public controller; 9 | 10 | public activate(model) { 11 | this.controller = model.controller; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /dev-app/routes/components/modal/footer.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 14 | -------------------------------------------------------------------------------- /dev-app/routes/components/modal/footer.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class Footer { 7 | public controller; 8 | 9 | public activate(model) { 10 | this.controller = model.controller; 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /dev-app/routes/components/navs/horizontal/horizontal-nav-item/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/navs/horizontal/horizontal-nav/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/navs/vertical/vertical-nav-item/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/navs/vertical/vertical-nav-sliding/html/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class VerticalSlidingHTML {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/components/navs/vertical/vertical-nav-sliding/singleton/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 20 | -------------------------------------------------------------------------------- /dev-app/routes/components/navs/vertical/vertical-nav-sliding/templates/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 16 | -------------------------------------------------------------------------------- /dev-app/routes/components/navs/vertical/vertical-nav-sliding/templates/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class VerticalSlidingTemplates { 7 | public verticalCols3 = [ 8 | { 9 | _class: 'monospaced', 10 | colClass: 't150', 11 | colHeadName: 'template', 12 | colHeadValue: 'Template', 13 | }, 14 | { 15 | colHeadName: 'description', 16 | colHeadValue: 'Description', 17 | }, 18 | ]; 19 | 20 | public verticalOptions3 = [ 21 | { 22 | description: 'HTML of what you want to render below the repeated nav items.', 23 | template: 'below', 24 | }, 25 | ]; 26 | } 27 | -------------------------------------------------------------------------------- /dev-app/routes/components/navs/vertical/vertical-nav-sliding/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/navs/vertical/vertical-nav/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/notification/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/overview/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class ComponentsOverview {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/components/pill/methods/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 29 | -------------------------------------------------------------------------------- /dev-app/routes/components/pill/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/tables/fixed-header-table/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/tables/table/views-and-view-models/tip-actions.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class TipActions {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/components/tables/table/views-and-view-models/tip-text.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 9 | -------------------------------------------------------------------------------- /dev-app/routes/components/tables/table/views-and-view-models/tip-text.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class TipText {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/components/tile/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 23 | -------------------------------------------------------------------------------- /dev-app/routes/components/timeline/actions/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 17 | -------------------------------------------------------------------------------- /dev-app/routes/components/timeline/demo/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 20 | -------------------------------------------------------------------------------- /dev-app/routes/components/tip/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 23 | -------------------------------------------------------------------------------- /dev-app/routes/components/toasts/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/toasts/usage/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {inject} from 'aurelia-framework'; 7 | import {CToastsService} from 'components/toasts/c-toasts/c-toasts-service'; 8 | 9 | @inject(CToastsService) 10 | export class ToastsUsage { 11 | constructor(public vToastsService: CToastsService) { 12 | this.vToastsService.success('I am going to disappear.'); 13 | this.vToastsService.error('I am error.', undefined, 80000); 14 | this.vToastsService.warning('I am warning.', 'Custom Title', 90000); 15 | this.vToastsService.info('I am info', undefined, 100000); 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /dev-app/routes/components/type/code/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 18 | -------------------------------------------------------------------------------- /dev-app/routes/components/type/list-container/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 23 | -------------------------------------------------------------------------------- /dev-app/routes/components/type/list-item/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/type/list/slots/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class ListSlots { 7 | public listColsSlots = [ 8 | { 9 | _class: 'monospaced', 10 | colClass: 't150', 11 | colHeadName: 'name', 12 | colHeadValue: 'Name', 13 | }, 14 | { 15 | colHeadName: 'description', 16 | colHeadValue: 'Description', 17 | }, 18 | ]; 19 | 20 | public listOptionsSlots = [ 21 | { 22 | description: 'Use when you need to put a tip next to the label.', 23 | name: 'tip', 24 | }, 25 | ]; 26 | } 27 | -------------------------------------------------------------------------------- /dev-app/routes/components/type/list/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/type/p/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 23 | -------------------------------------------------------------------------------- /dev-app/routes/components/type/p/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /dev-app/routes/components/utilities/dividers/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 24 | -------------------------------------------------------------------------------- /dev-app/routes/components/utilities/label-box/slots/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class ListSlots { 7 | public labelBoxCols = [ 8 | { 9 | _class: 'monospaced', 10 | colClass: 't150', 11 | colHeadName: 'name', 12 | colHeadValue: 'Name', 13 | }, 14 | { 15 | colHeadName: 'description', 16 | colHeadValue: 'Description', 17 | }, 18 | ]; 19 | 20 | public labelBoxSlots = [ 21 | { 22 | description: 'Use when you need to put a tip next to the label.', 23 | name: 'tip', 24 | }, 25 | ]; 26 | } 27 | -------------------------------------------------------------------------------- /dev-app/routes/components/utilities/spinners/properties/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 28 | -------------------------------------------------------------------------------- /dev-app/routes/components/utilities/spinners/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 23 | -------------------------------------------------------------------------------- /dev-app/routes/components/utilities/status/theming/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 23 | -------------------------------------------------------------------------------- /dev-app/routes/elements/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 26 | -------------------------------------------------------------------------------- /dev-app/routes/elements/overview/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class ElementsOverview {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/home/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class Home { 7 | public testDelete() { 8 | alert('Delete Function Here'); 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /dev-app/routes/introduction/contribute/contribute.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | 7 | export class Contribute { 8 | 9 | } 10 | -------------------------------------------------------------------------------- /dev-app/routes/introduction/design-assets/design-assets.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 24 | -------------------------------------------------------------------------------- /dev-app/routes/introduction/design-assets/design-assets.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class DesignAssets{} 7 | -------------------------------------------------------------------------------- /dev-app/routes/introduction/getting-started/getting-started.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class GettingStarted {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/introduction/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 26 | -------------------------------------------------------------------------------- /dev-app/routes/introduction/modular-scale/modular-scale.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class ModularScale {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/introduction/theming/theming.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class Theming {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/layout-examples/basic-centered/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class BasicCentered {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/layout-examples/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 9 | -------------------------------------------------------------------------------- /dev-app/routes/layout-examples/nested-cover-scrolling/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class NestedCoverScrolling {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/layout-examples/nested-sidebar-scrolling/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class NestedSidebarScrolling {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/layout-examples/sidebar-scrolling/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class SidebarScrollingLayout {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/layout-examples/sidebar/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class SidebarLayout {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/layouts/examples/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class ExampleLayouts { 7 | public goToExample(url) { 8 | // window.location.href = `#/${url}`; 9 | window.open(`#/${url}`, '_blank'); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /dev-app/routes/layouts/grid/methods/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 16 | -------------------------------------------------------------------------------- /dev-app/routes/layouts/icon/methods/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 27 | -------------------------------------------------------------------------------- /dev-app/routes/layouts/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | -------------------------------------------------------------------------------- /dev-app/routes/layouts/overview/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class LayoutsOverview {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/playground/index.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /dev-app/routes/tokens/color/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class Color {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/tokens/fonts/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class Typography {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/tokens/global-properties/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 23 | -------------------------------------------------------------------------------- /dev-app/routes/tokens/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 26 | -------------------------------------------------------------------------------- /dev-app/routes/tokens/overview/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class TokenOverview {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/tokens/transitions/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class Transitions {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/boolean-yes-no/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class BooleanYesNoInfo { 7 | public booleanYesNoCols = [ 8 | { 9 | colClass: 't150', 10 | colHeadName: 'yesNo', 11 | colHeadValue: 'Yes / No', 12 | valueConverter: 'booleanYesNo', 13 | }, 14 | ]; 15 | 16 | public booleanYesNoRows = [ 17 | { 18 | yesNo: true, 19 | }, 20 | { 21 | yesNo: false, 22 | }, 23 | ]; 24 | } 25 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/capitalize/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class CapitalizeInfo { 7 | public capitalizeCols = [ 8 | { 9 | colClass: 't150', 10 | colHeadName: 'firstName', 11 | colHeadValue: 'First Name', 12 | valueConverter: 'capitalize', 13 | }, 14 | { 15 | colHeadName: 'lastName', 16 | colHeadValue: 'Last Name', 17 | valueConverter: 'capitalize', 18 | }, 19 | { 20 | colHeadName: 'eyeColor', 21 | colHeadValue: 'Eye Color', 22 | }, 23 | ]; 24 | 25 | public capitalizeRows = [ 26 | { 27 | eyeColor: 'green', 28 | firstName: 'luke', 29 | lastName: 'skywalker', 30 | }, 31 | ]; 32 | } 33 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/count/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class CountInfo { 7 | public countCols = [ 8 | { 9 | colClass: 't150', 10 | colHeadName: 'count', 11 | colHeadValue: 'Total Count', 12 | valueConverter: 'count', 13 | }, 14 | ]; 15 | 16 | public countRows = [ 17 | { 18 | count: ['something', 'something else', 'last thing'], 19 | }, 20 | ]; 21 | } 22 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/csv-to-array/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class CsvToArray {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/default-value/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class DefaultValueInfo {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/empty-number-null/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class EmptyNumberNullInfo {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/empty-string-null/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class EmptyNumberNullInfo {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 26 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/keys/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class KeysInfo { 7 | public myObject; 8 | 9 | public attached() { 10 | this.myObject = { 11 | key1: 'Some Value', 12 | key2: 'Another Value', 13 | key3: 'Last Value', 14 | }; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/millisec-to-date/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class MillisecToDateInfo {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/millisec-to-duration/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class MillisecToDurationInfo {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/not-applicable/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class NotApplicableInfo {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/object-keys/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class ObjectKeysInfo { 7 | public myObject; 8 | 9 | public attached() { 10 | this.myObject = { 11 | key1: 'Some Value', 12 | key2: 'Another Value', 13 | key3: 'Last Value', 14 | }; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/overview/index.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 23 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/overview/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class ElementsValueConverters {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/pluralize/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class PluralizeInfo { 7 | public counts; 8 | 9 | public attached() { 10 | this.counts = [0, 1/8, 1, 2] 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/regex-escape/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class RegexEscapeInfo {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/sanitize/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class SanitizeInfo {} 7 | -------------------------------------------------------------------------------- /dev-app/routes/value-converters/string-to-number/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright 2021, Edgecast 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class StringToNumberInfo {} 7 | -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/favicon.ico -------------------------------------------------------------------------------- /jest.global-setup.js: -------------------------------------------------------------------------------- 1 | module.exports = async () => { 2 | process.env.TZ = 'UTC'; 3 | }; 4 | -------------------------------------------------------------------------------- /redirect.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /resources/img/bindable-change-chart.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/resources/img/bindable-change-chart.png -------------------------------------------------------------------------------- /resources/img/bindable-home-header.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/resources/img/bindable-home-header.jpg -------------------------------------------------------------------------------- /resources/img/bindable-large.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /resources/img/css-modules-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/resources/img/css-modules-logo.png -------------------------------------------------------------------------------- /src/components/forms/c-disabled/c-disabled.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | */ 13 | 14 | 15 | 16 | 17 | 18 | /*------------------------------------*\ 19 | !BASE 20 | \*------------------------------------*/ 21 | 22 | .disabled{ 23 | display: inline-block; 24 | padding: var(--form-disabled-padding); 25 | border: var(--form-disabled-border); 26 | color: var(--form-disabled-color); 27 | font-family: var(--form-disabled-font-family); 28 | word-break: break-word; 29 | } 30 | -------------------------------------------------------------------------------- /src/components/forms/c-disabled/c-disabled.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 13 | -------------------------------------------------------------------------------- /src/components/forms/c-disabled/c-disabled.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import * as styles from './c-disabled.css.json'; 7 | 8 | export class CDisabled { 9 | public styles = styles; 10 | } 11 | -------------------------------------------------------------------------------- /src/components/forms/c-form-error/c-form-error.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | * - Setup 13 | */ 14 | 15 | 16 | 17 | 18 | 19 | /*------------------------------------*\ 20 | !BASE 21 | \*------------------------------------*/ 22 | 23 | .base{ 24 | display: block; 25 | position: relative; 26 | opacity: 0; 27 | transition: opacity var(--trans_main); 28 | } 29 | 30 | .error-block{ 31 | display: inline-block; 32 | position: absolute; 33 | margin-top: 2px; 34 | color: var(--form-error-color); 35 | font-size: var(--form-error-font-size); 36 | } 37 | 38 | .error{ 39 | opacity: 1; 40 | } 41 | -------------------------------------------------------------------------------- /src/components/forms/c-form-error/c-form-error.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 20 | -------------------------------------------------------------------------------- /src/components/forms/c-form-error/c-form-error.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-form-error.css.json'; 8 | 9 | export class CFormError { 10 | @bindable 11 | public state; 12 | 13 | public styles = styles; 14 | } 15 | -------------------------------------------------------------------------------- /src/components/forms/c-form-image/c-form-image.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, containerless} from 'aurelia-framework'; 7 | import * as styles from './c-form-image.css.json'; 8 | 9 | @containerless 10 | export class CFormImage { 11 | @bindable 12 | public description; 13 | @bindable 14 | public id; 15 | @bindable 16 | public imageUrl; 17 | @bindable 18 | public name; 19 | @bindable 20 | public state; 21 | 22 | public styles = styles; 23 | } 24 | -------------------------------------------------------------------------------- /src/components/forms/c-form-info/c-form-info.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | * - Setup 13 | */ 14 | 15 | 16 | 17 | 18 | 19 | /*------------------------------------*\ 20 | !BASE 21 | \*------------------------------------*/ 22 | 23 | .base{ 24 | display: block; 25 | position: relative; 26 | opacity: 0; 27 | transition: opacity var(--trans_main); 28 | } 29 | 30 | .info-block{ 31 | display: inline-block; 32 | position: absolute; 33 | margin-top: 2px; 34 | color: var(--form-info-color); 35 | font-size: var(--form-info-font-size); 36 | } 37 | 38 | .info{ 39 | opacity: 1; 40 | } 41 | -------------------------------------------------------------------------------- /src/components/forms/c-form-info/c-form-info.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 20 | -------------------------------------------------------------------------------- /src/components/forms/c-form-info/c-form-info.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-form-info.css.json'; 8 | 9 | export class CFormInfo { 10 | @bindable 11 | public state; 12 | 13 | public styles = styles; 14 | } 15 | -------------------------------------------------------------------------------- /src/components/forms/c-form-warning/c-form-warning.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | * - Setup 13 | */ 14 | 15 | 16 | 17 | 18 | 19 | /*------------------------------------*\ 20 | !BASE 21 | \*------------------------------------*/ 22 | 23 | .base{ 24 | display: block; 25 | position: relative; 26 | opacity: 0; 27 | transition: opacity var(--trans_main); 28 | } 29 | 30 | .warning-block{ 31 | display: inline-block; 32 | position: absolute; 33 | margin-top: 2px; 34 | color: var(--form-warning-color); 35 | font-size: var(--form-warning-font-size); 36 | } 37 | 38 | .warning{ 39 | opacity: 1; 40 | } 41 | -------------------------------------------------------------------------------- /src/components/forms/c-form-warning/c-form-warning.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 20 | -------------------------------------------------------------------------------- /src/components/forms/c-form-warning/c-form-warning.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-form-warning.css.json'; 8 | 9 | export class CFormWarning { 10 | @bindable 11 | public state; 12 | 13 | public styles = styles; 14 | } 15 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/checkbox/c-checkbox-input/c-checkbox-input.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 21 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/checkbox/c-checkbox-input/c-checkbox-input.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, bindingMode, containerless} from 'aurelia-framework'; 7 | import * as styles from './c-checkbox-input.css.json'; 8 | 9 | @containerless 10 | export class CCheckboxInput { 11 | @bindable({defaultBindingMode: bindingMode.twoWay}) 12 | public checkedValue; 13 | @bindable 14 | public id; 15 | @bindable 16 | public onChange; 17 | @bindable 18 | public state; 19 | 20 | public styles = styles; 21 | 22 | public valueChanged() { 23 | if (this.onChange) { 24 | this.onChange({val: this.checkedValue}); 25 | } 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/checkbox/c-checkbox-label/c-checkbox-label.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 19 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/checkbox/c-checkbox-label/c-checkbox-label.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, containerless} from 'aurelia-framework'; 7 | import * as styles from './c-checkbox-label.css.json'; 8 | 9 | @containerless 10 | export class CCheckboxLabel { 11 | @bindable 12 | public id; 13 | @bindable 14 | public state; 15 | 16 | public styles = styles; 17 | } 18 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/checkbox/c-form-checkbox/c-form-checkbox.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * DRAGGABLE 12 | */ 13 | 14 | 15 | 16 | 17 | 18 | /*------------------------------------*\ 19 | !DRAGGABLE 20 | \*------------------------------------*/ 21 | 22 | .draggable{ 23 | height: 15px; 24 | width: 11px; 25 | margin-bottom: 0 !important; 26 | vertical-align: top; 27 | } 28 | 29 | .draggable span{ 30 | vertical-align: top; 31 | line-height: 0; 32 | } 33 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/radio/c-form-radio/c-form-radio.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, bindingMode, containerless} from 'aurelia-framework'; 7 | import {authState} from '../../../../../decorators/auth-state'; 8 | @authState 9 | @containerless 10 | export class CFormRadio { 11 | @bindable 12 | public actions; 13 | @bindable 14 | public align = 'flex-start'; 15 | @bindable({defaultBindingMode: bindingMode.twoWay}) 16 | public checked; 17 | @bindable 18 | public id; 19 | @bindable 20 | public name; 21 | @bindable 22 | public state; 23 | 24 | public checkedChanged() { 25 | if (this.actions && this.actions.onChange) { 26 | this.actions.onChange(); 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/radio/c-radio-input/c-radio-input.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 24 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/radio/c-radio-input/c-radio-input.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, bindingMode, containerless} from 'aurelia-framework'; 7 | import * as styles from './c-radio-input.css.json'; 8 | 9 | @containerless 10 | export class CRadioInput { 11 | @bindable({defaultBindingMode: bindingMode.twoWay}) 12 | public checked; 13 | @bindable 14 | public id; 15 | @bindable 16 | public name; 17 | @bindable 18 | public state; 19 | 20 | public styles = styles; 21 | } 22 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/radio/c-radio-label/c-radio-label.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 19 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/radio/c-radio-label/c-radio-label.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, containerless} from 'aurelia-framework'; 7 | import * as styles from './c-radio-label.css.json'; 8 | 9 | @containerless 10 | export class CRadioLabel { 11 | @bindable 12 | public id; 13 | @bindable 14 | public name; 15 | @bindable 16 | public state; 17 | 18 | public styles = styles; 19 | } 20 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/toggle/c-form-toggle/c-form-toggle.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | */ 13 | 14 | 15 | 16 | 17 | 18 | /*------------------------------------*\ 19 | !BASE 20 | \*------------------------------------*/ 21 | 22 | .base{ 23 | display: flex; 24 | align-items: flex-start; 25 | } 26 | 27 | td .base{ 28 | align-items: flex-start; 29 | } 30 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/toggle/c-form-toggle/c-form-toggle.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 30 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/toggle/c-form-toggle/c-form-toggle.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, bindingMode, containerless} from 'aurelia-framework'; 7 | import {authState} from '../../../../../decorators/auth-state'; 8 | import * as styles from './c-form-toggle.css.json'; 9 | 10 | @authState 11 | @containerless 12 | export class CFormToggle { 13 | @bindable({defaultBindingMode: bindingMode.twoWay}) 14 | public checkedValue; 15 | @bindable 16 | public id; 17 | @bindable 18 | public onChange; 19 | @bindable 20 | public state; 21 | 22 | public styles = styles; 23 | 24 | public valueChanged(val) { 25 | if (this.onChange) { 26 | this.onChange({val}); 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/toggle/c-toggle-input/c-toggle-input.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 27 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/toggle/c-toggle-input/c-toggle-input.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, bindingMode, containerless} from 'aurelia-framework'; 7 | import * as styles from './c-toggle-input.css.json'; 8 | 9 | @containerless 10 | export class CToggleInput { 11 | @bindable({defaultBindingMode: bindingMode.twoWay}) 12 | public checkedValue; 13 | @bindable 14 | public id; 15 | @bindable 16 | public onChange; 17 | @bindable 18 | public state; 19 | 20 | public styles = styles; 21 | 22 | public valueChanged() { 23 | if (this.onChange) { 24 | this.onChange({val: this.checkedValue}); 25 | } 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/toggle/c-toggle-label/c-toggle-label.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | * - Setup 13 | * STATE 14 | * - Disabled 15 | */ 16 | 17 | 18 | 19 | 20 | 21 | /*------------------------------------*\ 22 | !BASE 23 | \*------------------------------------*/ 24 | 25 | /** 26 | * ^Setup 27 | */ 28 | 29 | .label{ 30 | color: var(--radio-checkbox-label-color); 31 | font-size: var(--radio-checkbox-label-size); 32 | cursor: pointer; 33 | } 34 | 35 | 36 | 37 | 38 | 39 | /*------------------------------------*\ 40 | !STATE 41 | \*------------------------------------*/ 42 | 43 | /** 44 | * ^Disabled 45 | */ 46 | 47 | .disabled:hover{ 48 | cursor: not-allowed; 49 | } 50 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/toggle/c-toggle-label/c-toggle-label.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 19 | -------------------------------------------------------------------------------- /src/components/forms/checkbox-radio/toggle/c-toggle-label/c-toggle-label.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, containerless} from 'aurelia-framework'; 7 | import * as styles from './c-toggle-label.css.json'; 8 | 9 | @containerless 10 | export class CToggleLabel { 11 | @bindable 12 | public id; 13 | @bindable 14 | public state; 15 | 16 | public styles = styles; 17 | } 18 | -------------------------------------------------------------------------------- /src/components/forms/file/c-file-input/c-file-input.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, bindingMode} from 'aurelia-framework'; 7 | import * as styles from './c-file-input.css.json'; 8 | 9 | export class CFileInput { 10 | @bindable 11 | public id; 12 | @bindable({defaultBindingMode: bindingMode.twoWay}) 13 | public files; 14 | @bindable 15 | public state: string; 16 | @bindable 17 | public imagePicker: boolean = false; 18 | 19 | public styles = styles; 20 | 21 | public attached() { 22 | if (typeof this.imagePicker !== 'boolean') { 23 | this.imagePicker = false; 24 | } 25 | } 26 | 27 | public filesUploaded(ev) { 28 | this.files = ev.target.files; 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/components/forms/select/c-form-add-remove/c-form-add-remove-interfaces.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export interface CFormAddRemoveActions { 7 | /** 8 | * This will fire off when the bottom of either left list is scrolled to. 9 | */ 10 | onScrollBottom?(): void; 11 | 12 | /** 13 | * This will fire off when either left search button is clicked. 14 | */ 15 | onSearch?(searchText): void; 16 | } 17 | -------------------------------------------------------------------------------- /src/components/forms/slider/c-slider/c-slider.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 24 | -------------------------------------------------------------------------------- /src/components/forms/slider/c-slider/c-slider.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, bindingMode} from 'aurelia-framework'; 7 | import {authState} from '../../../../decorators/auth-state'; 8 | import * as styles from './c-slider.css.json'; 9 | 10 | @authState 11 | export class CSlider { 12 | @bindable 13 | public id; 14 | @bindable 15 | public increments = 4; 16 | @bindable({defaultBindingMode: bindingMode.twoWay}) 17 | public sliderValue = 0; 18 | @bindable 19 | public state; 20 | @bindable 21 | public onChange; 22 | @bindable 23 | public debounceTime: number = 0; 24 | 25 | public styles = styles; 26 | 27 | public valueChanged() { 28 | if (this.onChange && _.isFunction(this.onChange)) { 29 | this.onChange({val: this.sliderValue}); 30 | } 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /src/components/forms/textarea/c-form-textarea/c-form-textarea.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | * LABEL WRAPPER 13 | */ 14 | 15 | 16 | 17 | 18 | 19 | /*------------------------------------*\ 20 | !BASE 21 | \*------------------------------------*/ 22 | 23 | .textarea{ 24 | display: flex; 25 | } 26 | 27 | 28 | 29 | 30 | 31 | /*------------------------------------*\ 32 | !LABEL WRAPPER 33 | \*------------------------------------*/ 34 | 35 | .label-wrapper{ 36 | display: flex; 37 | align-items: center; 38 | } 39 | 40 | .label-wrapper > c-label{ 41 | margin-right: 5px; 42 | } 43 | -------------------------------------------------------------------------------- /src/components/forms/textarea/c-form-textarea/c-form-textarea.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, bindingMode} from 'aurelia-framework'; 7 | import {authState} from '../../../../decorators/auth-state'; 8 | import {generateRandom} from '../../../../helpers/generate-random'; 9 | import * as styles from './c-form-textarea.css.json'; 10 | 11 | @authState 12 | export class CFormTextarea { 13 | @bindable 14 | public errorMsg; 15 | @bindable 16 | public id = generateRandom(); 17 | @bindable 18 | public label; 19 | @bindable 20 | public placeholder; 21 | @bindable 22 | public state; 23 | @bindable({defaultBindingMode: bindingMode.twoWay}) 24 | public textareaValue; 25 | 26 | public styles = styles; 27 | } 28 | -------------------------------------------------------------------------------- /src/components/forms/textarea/c-textarea-input/c-textarea-input.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 20 | -------------------------------------------------------------------------------- /src/components/forms/textarea/c-textarea-input/c-textarea-input.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, bindingMode} from 'aurelia-framework'; 7 | import * as styles from './c-textarea-input.css.json'; 8 | 9 | export class CTextareaInput { 10 | @bindable 11 | public id; 12 | @bindable 13 | public placeholder; 14 | @bindable({defaultBindingMode: bindingMode.twoWay}) 15 | public textareaValue; 16 | @bindable 17 | public state; 18 | 19 | public styles = styles; 20 | } 21 | -------------------------------------------------------------------------------- /src/components/navs/c-nav-horizontal/mobile-nav-open.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class MobileNavOpen { 7 | public open = false; 8 | } 9 | -------------------------------------------------------------------------------- /src/components/navs/c-nav-vertical/c-nav-vertical.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 30 | -------------------------------------------------------------------------------- /src/components/navs/c-nav-vertical/c-nav-vertical.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | 8 | import {lazyLoadCheck} from '../../../helpers/lazy-load-check'; 9 | import * as styles from './c-nav-vertical.css.json'; 10 | 11 | export class CNavVertical { 12 | @bindable 13 | public backgroundColor = 'var(--c_darkGray)'; 14 | @bindable 15 | public loadMore; 16 | @bindable 17 | public navBottom = false; 18 | 19 | public styles = styles; 20 | 21 | public attached() { 22 | if (typeof this.navBottom !== 'boolean') { 23 | this.navBottom = false; 24 | } 25 | } 26 | 27 | public onScroll(event) { 28 | if (lazyLoadCheck($(event.target), 100) && this.loadMore) { 29 | this.loadMore(); 30 | } 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /src/components/notifications/c-notification/c-notification.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import {authState} from '../../../decorators/auth-state'; 8 | import * as styles from './c-notification.css.json'; 9 | 10 | @authState 11 | export class CNotification { 12 | @bindable 13 | public calloutContent; 14 | @bindable 15 | public calloutTitle; 16 | @bindable 17 | public type = 'warning'; 18 | @bindable 19 | public state; 20 | 21 | public styles = styles; 22 | } 23 | -------------------------------------------------------------------------------- /src/components/popover/c-popover/c-popover.test.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {CPopover} from './c-popover'; 7 | import {CPopoverService} from './c-popover-service'; 8 | 9 | const popService = new CPopoverService(); 10 | 11 | describe('c-popover component', () => { 12 | let component; 13 | 14 | beforeEach(() => { 15 | component = new CPopover(popService); 16 | }); 17 | 18 | describe('Unit', () => { 19 | test('styles', () => { 20 | expect(component.styles).toBeDefined(); 21 | }); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /src/components/popover/c-popover/c-popover.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, inject} from 'aurelia-framework'; 7 | 8 | import {CPopoverService} from './c-popover-service'; 9 | 10 | import * as tipStyles from '../../tip/c-tip/c-tip.css.json'; 11 | import * as styles from './c-popover.css.json'; 12 | 13 | @inject(CPopoverService) 14 | export class CPopover { 15 | public styles = styles; 16 | public tipStyles = tipStyles; 17 | 18 | constructor(public vPopoverService: CPopoverService) {} 19 | } 20 | -------------------------------------------------------------------------------- /src/components/tables/c-table-fixed-header/c-table-fixed-header.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 28 | -------------------------------------------------------------------------------- /src/components/tables/c-td/c-td.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * TD INPUT 12 | * TD TIP 13 | */ 14 | 15 | 16 | 17 | 18 | 19 | /*------------------------------------*\ 20 | !TD INPUT 21 | \*------------------------------------*/ 22 | 23 | td input[type='text']{ 24 | height: var(--table-text-input-height); 25 | padding: var(--table-text-input-padding); 26 | } 27 | 28 | 29 | 30 | 31 | 32 | /*------------------------------------*\ 33 | !TD TIP 34 | \*------------------------------------*/ 35 | 36 | td c-tip span > svg{ 37 | /* vertical-align: inherit !important; */ 38 | } 39 | 40 | td c-tip ul li a{ 41 | padding-left: 0 !important; 42 | } 43 | -------------------------------------------------------------------------------- /src/components/tables/c-td/c-td.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 19 | -------------------------------------------------------------------------------- /src/components/tables/c-td/c-td.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, computedFrom} from 'aurelia-framework'; 7 | import * as styles from './c-td.css.json'; 8 | 9 | export class CTd { 10 | @bindable 11 | public col; 12 | @bindable 13 | public getColValue; 14 | @bindable 15 | public row; 16 | @bindable 17 | public state; 18 | 19 | public styles = styles; 20 | 21 | @computedFrom('col', 'row', 'row[col.colHeadName]') 22 | get modelData() { 23 | return { 24 | col: this.col, 25 | row: this.row, 26 | state: this.state, 27 | value: this.col.colHeadName ? this.row[this.col.colHeadName] : this.getColValue(this.row, this.col), 28 | }; 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-action/c-td-action.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import * as styles from './c-td-action.css.json'; 7 | 8 | export class CTdAction { 9 | public styles = styles; 10 | public value; 11 | 12 | public activate(model) { 13 | this.value = model.value; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-button/c-td-button.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {observable} from 'aurelia-framework'; 7 | 8 | export class CTdButton { 9 | @observable 10 | public value; 11 | public row; 12 | public col; 13 | 14 | public activate(model) { 15 | this.value = model.value; 16 | this.row = model.row; 17 | this.col = model.col; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-check/c-td-check.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 9 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-check/c-td-check.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {observable} from 'aurelia-framework'; 7 | 8 | export class CTdCheck { 9 | @observable 10 | public value; 11 | public row; 12 | public col; 13 | 14 | public activate(model) { 15 | this.value = model.value; 16 | this.row = model.row; 17 | this.col = model.col; 18 | } 19 | 20 | public valueChanged() { 21 | this.checkChanged(); 22 | } 23 | 24 | public checkChanged() { 25 | if (this.col && this.col.checkChanged) { 26 | this.col.checkChanged(this.row); 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-drag-check/c-td-drag-check.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 10 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-drag-check/c-td-drag-check.test.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {StageComponent} from 'aurelia-testing'; 7 | 8 | describe('c-td-drag-check component', () => { 9 | let component; 10 | 11 | describe('Integration', () => { 12 | // Base Test 13 | it('testing for drag and check components', async done => { 14 | component = StageComponent.withResources().inView(''); 15 | 16 | try { 17 | await bootStrapEnvironment(component); 18 | expect(document.querySelector('c-drag-handle')).toBeDefined(); 19 | expect(document.querySelector('c-checkbox-input')).toBeDefined(); 20 | done(); 21 | } catch (e) { 22 | done.fail(e); 23 | } 24 | }); 25 | }); 26 | }); 27 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-drag/c-td-drag.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 9 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-drag/c-td-drag.test.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {StageComponent} from 'aurelia-testing'; 7 | 8 | describe('c-td-drag component', () => { 9 | let component; 10 | 11 | describe('Integration', () => { 12 | // Base Test 13 | it('testing for drag components', async done => { 14 | component = StageComponent.withResources().inView(''); 15 | 16 | try { 17 | await bootStrapEnvironment(component); 18 | expect(document.querySelector('c-drag-handle')).toBeDefined(); 19 | done(); 20 | } catch (e) { 21 | done.fail(e); 22 | } 23 | }); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-image/c-td-image.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | */ 13 | 14 | 15 | 16 | 17 | 18 | /*------------------------------------*\ 19 | !BASE 20 | \*------------------------------------*/ 21 | 22 | .image{ 23 | width: 100%; 24 | height: auto; 25 | } 26 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-image/c-td-image.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 15 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-image/c-td-image.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import * as styles from './c-td-image.css.json'; 7 | 8 | export class CTdImage { 9 | public styles = styles; 10 | public value; 11 | 12 | public activate(model) { 13 | this.value = model.value; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-pill/c-td-pill.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | */ 13 | 14 | 15 | 16 | 17 | 18 | /*------------------------------------*\ 19 | !BASE 20 | \*------------------------------------*/ 21 | 22 | .first-pill{ 23 | margin-right: var(--s-2); 24 | } 25 | 26 | .last-pill{ 27 | margin-left: var(--s-2); 28 | } 29 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-pill/c-td-pill.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import * as styles from './c-td-pill.css.json'; 7 | 8 | export class CTdPill { 9 | public styles = styles; 10 | public value; 11 | 12 | public activate(model) { 13 | this.value = model.value; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-radio/c-td-radio.html: -------------------------------------------------------------------------------- 1 | 19 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-radio/c-td-radio.ts: -------------------------------------------------------------------------------- 1 | import {CTableCol} from 'components/tables/c-table/c-table-interfaces'; 2 | import * as styles from '../../../forms/checkbox-radio/radio/c-radio-input/c-radio-input.css.json'; 3 | 4 | export class CTdRadio { 5 | public col: CTableCol; 6 | public row; 7 | public styles = styles; 8 | 9 | public activate(model) { 10 | this.row = model.row; 11 | this.col = model.col; 12 | } 13 | 14 | public onChange() { 15 | if (this.col.radioChanged) this.col.radioChanged(this.row); 16 | } 17 | 18 | public get state() { 19 | return this.row[`${this.col.colHeadName}State`]; 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-text-input/c-td-text-input.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 13 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-text-input/c-td-text-input.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class CTdTextInput { 7 | public value; 8 | public activate(model) { 9 | this.value = model.value; 10 | } 11 | 12 | public changeDetection(row, col) { 13 | if (col.rowValChanged) { 14 | col.rowValChanged(row); 15 | } 16 | 17 | return true; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-tip/c-td-tip.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class CTdTip {} 7 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-toggle/c-td-toggle.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 21 | -------------------------------------------------------------------------------- /src/components/tables/td-contents/c-td-toggle/c-td-toggle.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {observable} from 'aurelia-framework'; 7 | import {generateRandom} from '../../../../helpers/generate-random'; 8 | 9 | export class CTdToggle { 10 | @observable 11 | public value; 12 | public row; 13 | public col; 14 | public id = generateRandom(); 15 | 16 | public activate(model) { 17 | this.value = model.value; 18 | this.row = model.row; 19 | this.col = model.col; 20 | } 21 | 22 | public valueChanged() { 23 | this.checkChanged(); 24 | } 25 | 26 | public checkChanged() { 27 | if (this.col && this.col.checkChanged) { 28 | this.col.checkChanged(this.row); 29 | } 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/components/timeline/c-time-entry/c-time-entry-popover.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import * as styles from './c-time-entry.css.json'; 7 | 8 | export class CTimeEntryPopover { 9 | public styles = styles; 10 | public item = null; 11 | 12 | public activate(model) { 13 | this.item = model.data; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/components/timeline/c-timeline-block/c-timeline-block.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | */ 13 | 14 | 15 | 16 | 17 | 18 | /*------------------------------------*\ 19 | !BASE 20 | \*------------------------------------*/ 21 | 22 | .time-block{ 23 | position: relative; 24 | height: 100%; 25 | padding-left: 6px; 26 | border-bottom: var(--time-block-border-bottom); 27 | } 28 | 29 | .time{ 30 | color: var(--time-color); 31 | font-size: var(--time-font-size); 32 | z-index: var(--z_base); 33 | } 34 | -------------------------------------------------------------------------------- /src/components/timeline/c-timeline-block/c-timeline-block.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 19 | -------------------------------------------------------------------------------- /src/components/timeline/c-timeline-block/c-timeline-block.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | 8 | import * as styles from './c-timeline-block.css.json'; 9 | 10 | export class CTimelineBlock { 11 | @bindable 12 | public time: string; 13 | 14 | public styles = styles; 15 | } 16 | -------------------------------------------------------------------------------- /src/components/timeline/c-timeline-container/c-timeline-container.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | 8 | import {generateRandom} from '../../../helpers/generate-random'; 9 | 10 | import * as styles from './c-timeline-container.css.json'; 11 | 12 | export class CTimelineContainer { 13 | @bindable 14 | public currentTimeTop = -1; 15 | 16 | @bindable 17 | public loading = false; 18 | 19 | @bindable 20 | public id = generateRandom(); 21 | 22 | public styles = styles; 23 | 24 | constructor() { 25 | this.styles = styles; 26 | } 27 | 28 | public attached() { 29 | if (typeof this.loading !== 'boolean') { 30 | this.loading = false; 31 | } 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /src/components/timeline/c-timeline-month-container/c-timeline-month-container.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-timeline-month-container.css.json'; 8 | 9 | export class CTimelineMonthContainer { 10 | public styles = styles; 11 | } 12 | -------------------------------------------------------------------------------- /src/components/timeline/c-timeline-month-item/c-timeline-month-item.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 22 | -------------------------------------------------------------------------------- /src/components/timeline/c-timeline-month-item/c-timeline-month-item.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-timeline-month-item.css.json'; 8 | 9 | export class CTimelineMonthItem { 10 | @bindable 11 | public dayDate; 12 | @bindable 13 | public activeMonth = true; 14 | @bindable 15 | public today = false; 16 | 17 | public styles = styles; 18 | 19 | public attached() { 20 | if (typeof this.activeMonth !== 'boolean') { 21 | this.activeMonth = true; 22 | } 23 | 24 | if (typeof this.today !== 'boolean') { 25 | this.today = false; 26 | } 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/components/timeline/c-timeline-week-container/c-timeline-week-container.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 28 | -------------------------------------------------------------------------------- /src/components/timeline/c-timeline-week-container/c-timeline-week-container.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-timeline-week-container.css.json'; 8 | 9 | export class CTimelineWeekContainer { 10 | @bindable 11 | public days; 12 | 13 | @bindable 14 | public dayClick; 15 | 16 | @bindable 17 | public timeView: string = 'week'; 18 | 19 | public styles = styles; 20 | 21 | public changeDate(date) { 22 | if (this.dayClick && _.isFunction(this.dayClick) && this.timeView !== 'day') { 23 | this.dayClick({date}); 24 | } 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /src/components/tip/c-tip/c-tip-interfaces.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export interface CTipActions { 7 | /** 8 | * This will be called when tip content is made invisible. 9 | */ 10 | onHide?(): void; 11 | 12 | /** 13 | * This will be called when tip content is made visible. 14 | */ 15 | onShow?(): void; 16 | } 17 | -------------------------------------------------------------------------------- /src/components/toasts/c-toasts/c-toasts.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {inject} from 'aurelia-framework'; 7 | import * as styles from './c-toasts.css.json'; 8 | 9 | import {CToastsService} from './c-toasts-service'; 10 | 11 | @inject(CToastsService) 12 | export class CToasts { 13 | public styles = styles; 14 | 15 | constructor(public vToastsService: CToastsService) {} 16 | } 17 | -------------------------------------------------------------------------------- /src/components/type/code-sample/c-code-sample.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 13 | -------------------------------------------------------------------------------- /src/components/type/code/c-code.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | */ 13 | 14 | 15 | 16 | 17 | 18 | /*------------------------------------*\ 19 | !BASE 20 | \*------------------------------------*/ 21 | 22 | .base{ 23 | display: block; 24 | padding: var(--code-padding); 25 | margin-bottom: var(--s0); 26 | border: var(--code-border); 27 | background: var(--code-background); 28 | color: var(--code-color); 29 | white-space: initial; 30 | overflow-y: auto; 31 | } 32 | 33 | .bose code, 34 | .base code pre{ 35 | font-family: var(--ff_mono); 36 | } 37 | -------------------------------------------------------------------------------- /src/components/type/code/c-code.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 13 | -------------------------------------------------------------------------------- /src/components/type/code/c-code.test.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {StageComponent} from 'aurelia-testing'; 7 | 8 | describe('c-code component', () => { 9 | let component; 10 | 11 | describe('Integration', () => { 12 | afterEach(() => { 13 | component.dispose(); 14 | }); 15 | 16 | it('css class: base', async done => { 17 | component = StageComponent.withResources().inView(''); 18 | 19 | try { 20 | await bootStrapEnvironment(component); 21 | expect(component.viewModel.styles.base).not.toBe(undefined); 22 | done(); 23 | } catch (e) { 24 | done.fail(e); 25 | } 26 | }); 27 | }); 28 | }); 29 | -------------------------------------------------------------------------------- /src/components/type/code/c-code.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import * as styles from './c-code.css.json'; 7 | 8 | export class CCode { 9 | public styles = styles; 10 | } 11 | -------------------------------------------------------------------------------- /src/components/type/h1/c-h1.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | -------------------------------------------------------------------------------- /src/components/type/h1/c-h1.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, containerless} from 'aurelia-framework'; 7 | import * as styles from './c-h1.css.json'; 8 | 9 | @containerless 10 | export class CH1 { 11 | @bindable 12 | public flushTop = true; 13 | @bindable 14 | public truncate = false; 15 | @bindable 16 | public lineHeight = 'inherit'; 17 | 18 | public styles = styles; 19 | 20 | public attached() { 21 | if (typeof this.truncate !== 'boolean') { 22 | this.truncate = false; 23 | } 24 | 25 | if (typeof this.flushTop !== 'boolean') { 26 | this.flushTop = true; 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/components/type/h2/c-h2.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | -------------------------------------------------------------------------------- /src/components/type/h2/c-h2.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, containerless} from 'aurelia-framework'; 7 | import * as styles from './c-h2.css.json'; 8 | 9 | @containerless 10 | export class CH2 { 11 | @bindable 12 | public flushTop = true; 13 | @bindable 14 | public truncate = false; 15 | @bindable 16 | public lineHeight = 'inherit'; 17 | 18 | public styles = styles; 19 | 20 | public attached() { 21 | if (typeof this.truncate !== 'boolean') { 22 | this.truncate = false; 23 | } 24 | 25 | if (typeof this.flushTop !== 'boolean') { 26 | this.flushTop = true; 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/components/type/h3/c-h3.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 26 | -------------------------------------------------------------------------------- /src/components/type/h3/c-h3.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-h3.css.json'; 8 | 9 | export class CH3 { 10 | @bindable 11 | public flushTop = true; 12 | @bindable 13 | public truncate = false; 14 | @bindable 15 | public darkBack = false; 16 | 17 | public styles = styles; 18 | 19 | public attached() { 20 | if (typeof this.truncate !== 'boolean') { 21 | this.truncate = false; 22 | } 23 | 24 | if (typeof this.darkBack !== 'boolean') { 25 | this.darkBack = false; 26 | } 27 | 28 | if (typeof this.flushTop !== 'boolean') { 29 | this.flushTop = true; 30 | } 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /src/components/type/h4/c-h4.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | * TRUNCATE 13 | */ 14 | 15 | 16 | 17 | 18 | 19 | /*------------------------------------*\ 20 | !BASE 21 | \*------------------------------------*/ 22 | 23 | .base{ 24 | margin-top: var(--h4-margin-top); 25 | font-family: var(--h4-font-family); 26 | font-size: var(--h4-font-size); 27 | font-weight: normal; 28 | color: var(--h4-color); 29 | } 30 | 31 | 32 | 33 | 34 | 35 | /*------------------------------------*\ 36 | !TRUNCATE 37 | \*------------------------------------*/ 38 | 39 | .truncate{ 40 | text-overflow: ellipsis; 41 | white-space: nowrap; 42 | overflow: hidden; 43 | } 44 | -------------------------------------------------------------------------------- /src/components/type/h4/c-h4.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 20 | -------------------------------------------------------------------------------- /src/components/type/h4/c-h4.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-h4.css.json'; 8 | 9 | export class CH4 { 10 | @bindable 11 | public color = 'inherit'; 12 | 13 | @bindable 14 | public truncate; 15 | 16 | public styles = styles; 17 | } 18 | -------------------------------------------------------------------------------- /src/components/type/h5/c-h5.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | */ 13 | 14 | 15 | 16 | 17 | 18 | /*------------------------------------*\ 19 | !BASE 20 | \*------------------------------------*/ 21 | 22 | .base{ 23 | margin-top: var(--h5-margin-top); 24 | font-family: var(--h5-font-family); 25 | font-weight: normal; 26 | font-size: var(--h5-font-size); 27 | color: var(--h5-color); 28 | } 29 | -------------------------------------------------------------------------------- /src/components/type/h5/c-h5.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 19 | -------------------------------------------------------------------------------- /src/components/type/h5/c-h5.test.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {StageComponent} from 'aurelia-testing'; 7 | 8 | describe('c-h5 component', () => { 9 | let component; 10 | 11 | describe('Integration', () => { 12 | afterEach(() => { 13 | component.dispose(); 14 | }); 15 | 16 | describe('CSS Classes', () => { 17 | it('css class: base', async done => { 18 | component = StageComponent.withResources().inView(''); 19 | 20 | try { 21 | await bootStrapEnvironment(component); 22 | expect(component.viewModel.styles.base).not.toBe(undefined); 23 | done(); 24 | } catch (e) { 25 | done.fail(e); 26 | } 27 | }); 28 | }); 29 | }); 30 | }); 31 | -------------------------------------------------------------------------------- /src/components/type/h5/c-h5.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-h5.css.json'; 8 | 9 | export class CH5 { 10 | @bindable 11 | public color = 'inherit'; 12 | 13 | public styles = styles; 14 | } 15 | -------------------------------------------------------------------------------- /src/components/type/list/c-list-container/c-list-container.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 20 | -------------------------------------------------------------------------------- /src/components/type/list/c-list-container/c-list-container.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-list-container.css.json'; 8 | 9 | export class CListContainer { 10 | @bindable 11 | public dividers = false; 12 | @bindable 13 | public size = 'medium'; 14 | @bindable 15 | public color = 'dark'; 16 | 17 | public styles = styles; 18 | 19 | public attached() { 20 | if (typeof this.dividers !== 'boolean') { 21 | this.dividers = false; 22 | } 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /src/components/type/list/c-list-item/c-list-item.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 19 | -------------------------------------------------------------------------------- /src/components/type/list/c-list-item/c-list-item.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable, containerless} from 'aurelia-framework'; 7 | import * as styles from './c-list-item.css.json'; 8 | 9 | @containerless 10 | export class CListItem { 11 | @bindable 12 | public state; 13 | @bindable 14 | public wrap = false; 15 | 16 | public styles = styles; 17 | 18 | public attached() { 19 | if (typeof this.wrap !== 'boolean') { 20 | this.wrap = false; 21 | } 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/components/type/list/c-list/c-list.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 28 | -------------------------------------------------------------------------------- /src/components/type/list/c-list/c-list.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-list.css.json'; 8 | 9 | export class CList { 10 | @bindable 11 | public label; 12 | @bindable 13 | public noBullets = false; 14 | @bindable 15 | public size; 16 | 17 | public styles = styles; 18 | 19 | public attached() { 20 | if (typeof this.noBullets !== 'boolean') { 21 | this.noBullets = false; 22 | } 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /src/components/type/p/c-p.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 24 | -------------------------------------------------------------------------------- /src/components/utilities/c-divider/c-divider.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | */ 13 | 14 | 15 | 16 | 17 | 18 | /*------------------------------------*\ 19 | !BASE 20 | \*------------------------------------*/ 21 | 22 | .base{ 23 | width: 100%; 24 | height: var(--divider-height); 25 | background-color: var(--divider-background); 26 | } 27 | -------------------------------------------------------------------------------- /src/components/utilities/c-divider/c-divider.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 11 | -------------------------------------------------------------------------------- /src/components/utilities/c-divider/c-divider.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-divider.css.json'; 8 | 9 | export class CDivider { 10 | public styles = styles; 11 | } 12 | -------------------------------------------------------------------------------- /src/components/utilities/c-drag-handle/c-drag-handle.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * BASE 12 | */ 13 | 14 | 15 | 16 | 17 | 18 | /*------------------------------------*\ 19 | !BASE 20 | \*------------------------------------*/ 21 | 22 | .base:hover{ 23 | cursor: move; 24 | /* stylelint-disable */ 25 | cursor: -webkit-grab; 26 | /* stylelint-enable */ 27 | } 28 | -------------------------------------------------------------------------------- /src/components/utilities/c-drag-handle/c-drag-handle.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 21 | -------------------------------------------------------------------------------- /src/components/utilities/c-drag-handle/c-drag-handle.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import {IDragOptions} from 'index.js'; 8 | import * as styles from './c-drag-handle.css.json'; 9 | 10 | export class CDragHandle { 11 | @bindable 12 | public size = '0.75em'; 13 | @bindable 14 | public dragOptions: IDragOptions; 15 | 16 | public styles = styles; 17 | } 18 | -------------------------------------------------------------------------------- /src/components/utilities/c-label-box/c-label-box.css: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /*------------------------------------*\ 7 | CONTENTS 8 | \*------------------------------------*/ 9 | 10 | /** 11 | * LABEL WRAPPER 12 | */ 13 | 14 | 15 | 16 | 17 | 18 | /*------------------------------------*\ 19 | !LABEL WRAPPER 20 | \*------------------------------------*/ 21 | 22 | .label-wrapper{ 23 | display: flex; 24 | align-items: center; 25 | margin-bottom: var(--s-3); 26 | } 27 | 28 | .label-wrapper > c-label{ 29 | margin-right: var(--s-5); 30 | } 31 | -------------------------------------------------------------------------------- /src/components/utilities/c-label-box/c-label-box.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 25 | -------------------------------------------------------------------------------- /src/components/utilities/c-spinner/c-spinner.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 18 | -------------------------------------------------------------------------------- /src/components/utilities/c-spinner/c-spinner.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-spinner.css.json'; 8 | 9 | export class CSpinner { 10 | @bindable 11 | public size = 'medium'; 12 | 13 | public styles = styles; 14 | } 15 | -------------------------------------------------------------------------------- /src/components/utilities/c-status/c-status.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './c-status.css.json'; 8 | 9 | export class CStatus { 10 | @bindable 11 | public color = 'var(--c_secondaryMain)'; 12 | @bindable 13 | public href; 14 | @bindable 15 | public pulseSpeed = 'slow'; 16 | @bindable 17 | public maxWidth = 'auto'; 18 | @bindable 19 | public targetNew = false; 20 | @bindable 21 | public text; 22 | 23 | public styles = styles; 24 | 25 | public attached() { 26 | if (typeof this.targetNew !== 'boolean') { 27 | this.targetNew = false; 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/decorators/dirty-check-prompt/modal/body.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 9 | -------------------------------------------------------------------------------- /src/decorators/dirty-check-prompt/modal/body.test.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {ModalBody} from './body'; 7 | 8 | describe('The body class', () => { 9 | let body: ModalBody; 10 | 11 | beforeEach(() => { 12 | body = new ModalBody(); 13 | }); 14 | 15 | it('exists', () => { 16 | expect(body.constructor).toBeDefined(); 17 | }); 18 | }); 19 | -------------------------------------------------------------------------------- /src/decorators/dirty-check-prompt/modal/body.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class ModalBody {} 7 | -------------------------------------------------------------------------------- /src/decorators/dirty-check-prompt/modal/footer.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class FooterBody { 7 | public controller: any; 8 | public model: any; 9 | 10 | public activate(model) { 11 | this.model = model.footer; 12 | this.controller = model.controller; 13 | } 14 | 15 | public async save() { 16 | if (this.model.canSave) { 17 | try { 18 | this.model.isLoading = true; 19 | await this.model.save(); 20 | this.controller.ok(true); 21 | } catch (e) { 22 | // Parent function should show toaster 23 | this.controller.cancel(); 24 | } finally { 25 | this.model.isLoading = false; 26 | } 27 | } else { 28 | this.controller.cancel(); 29 | } 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/global-styles/assets/images/td-building.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/src/global-styles/assets/images/td-building.gif -------------------------------------------------------------------------------- /src/global-styles/assets/images/td-processing.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bindable-ui/bindable/60740afe12f9d512c6667b5faf063115a0f0eeff/src/global-styles/assets/images/td-processing.gif -------------------------------------------------------------------------------- /src/helpers/generate-random.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | const chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMnumCharsOPQRSTUVWXYZ0123456789'; 7 | 8 | export const generateRandom = (numChars = 8) => 9 | Array(numChars) 10 | .join() 11 | .split(',') 12 | .map(() => chars.charAt(Math.floor(Math.random() * chars.length))) 13 | .join(''); 14 | -------------------------------------------------------------------------------- /src/helpers/highlight-phrases.ts: -------------------------------------------------------------------------------- 1 | export function highlightSearchPhrases(searchPhrases: string[], desc: string = ''): string { 2 | if (desc === '') { 3 | return ''; 4 | } 5 | 6 | const openTag = ''; 7 | const closeTag = ''; 8 | 9 | let highlightedDesc = _.escape(desc); 10 | 11 | searchPhrases.forEach(phrase => { 12 | const regex = new RegExp(`(${phrase})(?![^<]*>|[^<>]*<\/)`, 'gi'); 13 | highlightedDesc = highlightedDesc.replace(regex, `${openTag}$1${closeTag}`); 14 | }); 15 | 16 | return highlightedDesc; 17 | } 18 | -------------------------------------------------------------------------------- /src/helpers/lazy-load-check.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export const lazyLoadCheck = (elem, pxFromBottom = 10) => { 7 | if (!elem) { 8 | return false; 9 | } 10 | 11 | const jqElem = $(elem); 12 | 13 | try { 14 | return jqElem[0].scrollHeight - (jqElem.scrollTop() + jqElem.outerHeight()) < pxFromBottom; 15 | } catch (err) { 16 | return null; 17 | } 18 | }; 19 | -------------------------------------------------------------------------------- /src/helpers/local-storage.test.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {LocalStorageHelper} from './local-storage'; 7 | 8 | describe('LocalStorageHelper', () => { 9 | it('should save value into localstorage', () => { 10 | const savedValue = 'a value'; 11 | expect(LocalStorageHelper.loadOrDefault('myvalue')).toBe(undefined); 12 | LocalStorageHelper.save('myvalue', savedValue); 13 | expect(LocalStorageHelper.loadOrDefault('myvalue')).toBe(savedValue); 14 | }); 15 | 16 | it('should throw catch exceptions and assign default value if saved value is not parsable', () => { 17 | localStorage.anothervalue = '{one'; 18 | expect(LocalStorageHelper.loadOrDefault('anothervalue', 'default value')).toBe('default value'); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /src/helpers/local-storage.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | // Helper class for setting and retrieving data from browser local storage 7 | // See (https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) for more information. 8 | export class LocalStorageHelper { 9 | public static loadOrDefault(key, defaultValue?) { 10 | let v = localStorage.getItem(key); 11 | 12 | try { 13 | v = v !== null ? JSON.parse(v) : defaultValue; 14 | } catch (e) { 15 | v = defaultValue; 16 | } 17 | 18 | return v; 19 | } 20 | 21 | public static save(key, value) { 22 | localStorage[key] = JSON.stringify(value); 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /src/helpers/multi-index-splicer.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export default function multiIndexSplicer(arr, indexes, dir = 1) { 7 | const clonedArr = _.cloneDeep(arr); 8 | let sortedIndexes = _.orderBy(indexes); 9 | 10 | if (dir > 0) { 11 | sortedIndexes = _.reverse(sortedIndexes); 12 | } 13 | 14 | _.forEach(sortedIndexes, index => { 15 | if (index + dir < 0 || index + dir > clonedArr.length - 1) { 16 | return; 17 | } 18 | 19 | const stashedVal = clonedArr.splice(index, 1)[0]; 20 | clonedArr.splice(index + dir, 0, stashedVal); 21 | }); 22 | 23 | return clonedArr; 24 | } 25 | -------------------------------------------------------------------------------- /src/helpers/sleep.ts: -------------------------------------------------------------------------------- 1 | export const sleep = ms => new Promise(resolve => setTimeout(resolve, ms)); 2 | -------------------------------------------------------------------------------- /src/helpers/sorting.test.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import sorting from './sorting'; 7 | 8 | const array = [{val: 3}, {val: 1}, {val: 4}, {val: 2}]; 9 | 10 | describe('sorting of objects by key', () => { 11 | it('should sort array of objects by key', () => { 12 | const newArray = array.sort(sorting('val')); 13 | expect(newArray[0].val).toEqual(1); 14 | expect(newArray[3].val).toEqual(4); 15 | }); 16 | it('should sort array of objects by key in reverse', () => { 17 | const newArray = array.sort(sorting('val', true)); 18 | expect(newArray[0].val).toEqual(4); 19 | expect(newArray[3].val).toEqual(1); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /src/helpers/sorting.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export default function sorting(field, reverse?, primer?) { 7 | const key = function getPrimer(x) { 8 | return primer ? primer(x[field]) : x[field]; 9 | }; 10 | const sortOrder = reverse ? -1 : 1; 11 | 12 | return function compareValues(a, b) { 13 | const A = key(a); 14 | const B = key(b); 15 | 16 | let rval = 0; 17 | if (A < B) { 18 | rval = -1; 19 | } 20 | if (A > B) { 21 | rval = 1; 22 | } 23 | return rval * sortOrder; 24 | }; 25 | } 26 | -------------------------------------------------------------------------------- /src/layouts/l-center/l-center.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 24 | -------------------------------------------------------------------------------- /src/layouts/l-cluster/l-cluster.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 24 | -------------------------------------------------------------------------------- /src/layouts/l-grid/l-grid.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 32 | -------------------------------------------------------------------------------- /src/layouts/l-icon/l-icon.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 32 | -------------------------------------------------------------------------------- /src/layouts/l-icon/l-icon.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './l-icon.css.json'; 8 | 9 | export class LIcon { 10 | @bindable 11 | public action; 12 | @bindable 13 | public align = 'unset'; 14 | @bindable 15 | public color = 'unset'; 16 | @bindable 17 | public icon; 18 | @bindable 19 | public size = '0.75em'; 20 | @bindable 21 | public spacing = 'var(--s-7)'; 22 | 23 | public styles = styles; 24 | 25 | public actionFunction() { 26 | if (this.action && _.isFunction(this.action)) { 27 | this.action(); 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/layouts/l-sidebar/l-sidebar.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 33 | -------------------------------------------------------------------------------- /src/layouts/l-stack/l-stack.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 24 | -------------------------------------------------------------------------------- /src/layouts/l-stack/l-stack.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {bindable} from 'aurelia-framework'; 7 | import * as styles from './l-stack.css.json'; 8 | 9 | export class LStack { 10 | @bindable 11 | public list; 12 | @bindable 13 | public recursive = false; 14 | @bindable 15 | public spacing = 'var(--s3)'; 16 | @bindable 17 | public splitAfter; 18 | 19 | public styles = styles; 20 | 21 | public attached() { 22 | if (typeof this.recursive !== 'boolean') { 23 | this.recursive = false; 24 | } 25 | 26 | if (this.list !== 'ordered' && this.list !== 'unordered') { 27 | this.list = false; 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/layouts/l-switcher/l-switcher.html: -------------------------------------------------------------------------------- 1 | 5 | 6 | 25 | -------------------------------------------------------------------------------- /src/value-converters/async-binding.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * This will allow you to pipe an promise to a value converter 3 | * 4 | * ex. `value | value-converter & async` 5 | */ 6 | export class AsyncBindingBehavior { 7 | public bind(binding, _scope, callbackFn) { 8 | binding.originalupdateTarget = binding.updateTarget; 9 | 10 | binding.updateTarget = async a => { 11 | const d = await a; 12 | binding.originalupdateTarget(d); 13 | 14 | if (_.isFunction(callbackFn)) { 15 | _.defer(() => callbackFn()); 16 | } 17 | }; 18 | } 19 | 20 | public unbind(binding) { 21 | binding.updateTarget = binding.originalupdateTarget; 22 | binding.originalupdateTarget = null; 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /src/value-converters/boolean-yes-no.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class BooleanYesNoValueConverter { 7 | public static transform(value) { 8 | if (value) { 9 | return 'Yes'; 10 | } 11 | 12 | return 'No'; 13 | } 14 | public toView(value) { 15 | return BooleanYesNoValueConverter.transform(value); 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /src/value-converters/capitalize.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class CapitalizeValueConverter { 7 | public static transform(value, allWords?) { 8 | if (value && !allWords) { 9 | return _.capitalize(value); 10 | } 11 | 12 | if (value && allWords) { 13 | return _.startCase(value.toLowerCase()); 14 | } 15 | 16 | return ''; 17 | } 18 | public toView(value, allWords) { 19 | return CapitalizeValueConverter.transform(value, allWords); 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /src/value-converters/count.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class CountValueConverter { 7 | public static transform(value) { 8 | if (value) { 9 | return value.length; 10 | } 11 | 12 | return 0; 13 | } 14 | public toView(value) { 15 | return CountValueConverter.transform(value); 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /src/value-converters/default-value.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /** 7 | * Checks if there is a `value`, otherwise falls back to `defaultValue`. 8 | * 9 | * @param value {String} - Value to be checked. 10 | * @param defaultValue {String} - Fallback value. 11 | * @return appropriate value. 12 | */ 13 | export class DefaultValueValueConverter { 14 | public toView(value, defaultValue) { 15 | if (defaultValue) { 16 | if (value) { 17 | return value; 18 | } 19 | return defaultValue; 20 | } 21 | 22 | return value; 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /src/value-converters/empty-number-null.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class EmptyNumberNullValueConverter { 7 | public toView(value) { 8 | return value === '' ? null : value; 9 | } 10 | 11 | /** 12 | * Converts value to true default (HTML likes to change null to ''). 13 | * 14 | * @param value - Value coming from the view. 15 | * @return {Number|Null} - Maintain Numberness 16 | */ 17 | public fromView(value) { 18 | return value === '' ? null : Number(value); 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /src/value-converters/empty-string-null.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class EmptyStringNullValueConverter { 7 | public toView(value) { 8 | return value === '' ? null : value; 9 | } 10 | 11 | /** 12 | * Converts value to true default (HTML likes to change null to ''). 13 | * 14 | * @param value {String} - Value coming from the view. 15 | * @param type {String} - The type of input. Necessary to handle HTML input for different cases. 16 | * @return {String|Null} - Defaults to `value` if `type` not provided. Otherwise returns `null` 17 | * or `''` depending on response logic. 18 | */ 19 | public fromView(value) { 20 | return value === '' ? null : value; 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /src/value-converters/get-property.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class GetPropertyValueConverter { 7 | public toView(item, obj, key) { 8 | return item[obj[key]]; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /src/value-converters/keys.test.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {KeysValueConverter} from './keys'; 7 | 8 | describe('KeysValueConverter', () => { 9 | it('can convert', () => { 10 | const data = { 11 | first: { 12 | something: true, 13 | }, 14 | second: { 15 | something: false, 16 | }, 17 | }; 18 | expect(new KeysValueConverter().toView(data)).toEqual(['first', 'second']); 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /src/value-converters/keys.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class KeysValueConverter { 7 | public toView(obj) { 8 | return _.keys(obj); 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /src/value-converters/metric-name-chart.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /** 7 | * Humanize health metric IDs. 8 | */ 9 | import {METRIC_NAME_MAP, MetricNameValueConverter} from './metric-name'; 10 | 11 | METRIC_NAME_MAP.vol = 'Volume'; 12 | METRIC_NAME_MAP.luma = 'Luminosity'; 13 | 14 | export {METRIC_NAME_MAP, MetricNameValueConverter}; 15 | -------------------------------------------------------------------------------- /src/value-converters/metric-name.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /** 7 | * Humanize health metric IDs. 8 | */ 9 | 10 | export const METRIC_NAME_MAP = { 11 | ad: 'Extended Ad Break', 12 | cc_last_seen_delta: 'Closed Captions Last Seen', 13 | dropped_since_last: 'Dropped Frames', 14 | lastmod_delta: 'Time since last update', 15 | luma: 'Black Video', 16 | nielsen_last_seen_delta: 'Nielsen Tag Last Seen', 17 | signal: 'Signal', 18 | signal_status: 'Signal', 19 | source_queue_depth: 'Processing Backlog', 20 | static_audio_start: 'Static Audio', 21 | static_video_start: 'Static Video', 22 | vol: 'Loss of Audio', 23 | waiting: 'Upload Queue', 24 | }; 25 | 26 | export class MetricNameValueConverter { 27 | public toView(value) { 28 | return METRIC_NAME_MAP[value] || value; 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/value-converters/millisec-to-date.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class MillisecToDateValueConverter { 7 | public toView(msec) { 8 | const d = new Date(msec); 9 | return `${d.toLocaleDateString()} - ${d.toLocaleTimeString()}`; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/value-converters/money-format.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class MoneyFormatValueConverter { 7 | public static transform(value, decimalPlaces = 2) { 8 | // If decimal places is not specific, then default to 2 decimal places. 9 | if (value !== null && value !== undefined && value.toString.length > 0) { 10 | return `$${value.toFixed(decimalPlaces).replace(/(\d)(?=(\d{3})+\.)/g, '$1,')}`; 11 | } 12 | 13 | return ''; 14 | } 15 | public toView(value, decimalPlaces) { 16 | return MoneyFormatValueConverter.transform(value, decimalPlaces); 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /src/value-converters/not-applicable.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /** 7 | * Convert undefined and null to N/A, pass value as-is otherwise. 8 | */ 9 | 10 | export class NotApplicableValueConverter { 11 | public toView(value) { 12 | return value === null || value === undefined ? 'N/A' : value; 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /src/value-converters/object-keys.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | // A ValueConverter for iterating an Object's properties inside of a repeat.for in Aurelia 7 | export class ObjectKeysValueConverter { 8 | public toView(obj) { 9 | if (_.isEmpty(obj)) { 10 | return []; 11 | } 12 | return Object.keys(obj); 13 | } 14 | } 15 | 16 | /** 17 | * Usage 18 | * Shows how to use the custom ValueConverter to iterate an objects properties 19 | * aka its keys. 20 | * 21 | *
  • ${prop}
  • 22 | */ 23 | -------------------------------------------------------------------------------- /src/value-converters/pager.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class PagerValueConverter { 7 | public toView(array, relativePosition, itemsPerPage) { 8 | const numPages = Math.ceil(array.length / itemsPerPage); 9 | const page = Math.max(0, Math.floor(1e-3 + relativePosition * (numPages - 1))); 10 | const offset = page * itemsPerPage; 11 | return array.slice(offset, offset + itemsPerPage); 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /src/value-converters/pluralize.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /* 7 | Examples: 8 | source${sourceCount | pluralize} 9 | ${num} Octop${num | pluralize:'i':'us'} ha${num | pluralize:'ve':'s'} ${8 * num} leg${(8 * num) | pluralize} 10 | 1 Octopus has 8 legs 11 | 3 Octopi have 24 legs 12 | */ 13 | export class PluralizeValueConverter { 14 | public toView(value, plural = 's', singular = '') { 15 | if (value === 1) { 16 | return singular; 17 | } 18 | return plural; 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /src/value-converters/regex-escape.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class EscapeRegexValueConverter { 7 | public toView(value) { 8 | if (value !== null && value.toString().length > 0) { 9 | return value.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&'); 10 | } 11 | return value; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /src/value-converters/sanitize.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import * as DOMPurify from 'dompurify'; 7 | 8 | export class SanitizeValueConverter { 9 | public toView(value, config) { 10 | return DOMPurify.sanitize(value, config); 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /src/value-converters/slicer-health-classification.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /** 7 | * Converts slicer health strings to human-friendly strings. 8 | */ 9 | 10 | const CLASSIFICATION_MAP = { 11 | 'at-risk': 'warning', 12 | critical: 'critical', 13 | healthy: 'healthy', 14 | inactive: 'neutral', 15 | }; 16 | 17 | export class SlicerHealthClassificationValueConverter { 18 | public toView(value) { 19 | return CLASSIFICATION_MAP[value] || value; 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /src/value-converters/slicer-health.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | /** 7 | * Converts slicer health strings to human-friendly strings. 8 | */ 9 | export class SlicerHealthValueConverter { 10 | public toView(value) { 11 | const values = { 12 | 'at-risk': 'At risk', 13 | critical: 'Critical', 14 | healthy: 'Healthy', 15 | inactive: 'Inactive', 16 | neutral: 'Neutral', 17 | warning: 'Warning', 18 | }; 19 | return values[value]; 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /src/value-converters/string-to-number.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | const INT_REGEX = new RegExp('[0-9]', 'g'); 7 | 8 | export class StringToNumberValueConverter { 9 | public toView(value) { 10 | // b/c Number(null|'') = 0, and isNaN(null|'') is false. 11 | if (value === null || value === '') return null; 12 | const val = Number(`${value}`); 13 | return Number.isNaN(val) ? null : val; 14 | } 15 | 16 | public fromView(value) { 17 | if (value === null || value === '') return null; 18 | let valString = `${value}`; 19 | if (valString) { 20 | valString = (valString.match(INT_REGEX) || []).join('').toLowerCase(); 21 | } 22 | const val = Number(valString); 23 | return Number.isNaN(val) ? null : val; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /src/value-converters/th-class-for.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | export class ThClassForValueConverter { 7 | public toView(sortBy, key, sortDirection) { 8 | if (sortBy !== key) { 9 | return 'table--sort__none'; 10 | } 11 | if (sortDirection === 'asc') { 12 | return 'table--sort__asc'; 13 | } 14 | return 'table--sort__desc'; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/value-converters/vsort.ts: -------------------------------------------------------------------------------- 1 | /* 2 | © 2022 Edgecast Inc. 3 | Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms. 4 | */ 5 | 6 | import {SortValueConverter} from './sort'; 7 | 8 | export class CsortValueConverter { 9 | public toView(array, directions) { 10 | return SortValueConverter.vsort(array, directions); 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /test/empty-module.js: -------------------------------------------------------------------------------- 1 | module.exports = ''; 2 | -------------------------------------------------------------------------------- /test/jest-setup.ts: -------------------------------------------------------------------------------- 1 | jest.setTimeout(60000); 2 | -------------------------------------------------------------------------------- /types/global.d.ts: -------------------------------------------------------------------------------- 1 | import {LoDashStatic} from 'lodash'; 2 | 3 | // Global lodash 4 | declare global { 5 | const _: LoDashStatic; 6 | const lodash: LoDashStatic; 7 | const bootStrapEnvironment: any; 8 | } 9 | 10 | // Global jquery 11 | declare const $: JQueryStatic; 12 | declare const jQuery: JQueryStatic; -------------------------------------------------------------------------------- /update-version.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs'); 2 | const packageJsonPath = './package.json'; 3 | const appHtmlPath = './dev-app/app.html'; 4 | const file = require(packageJsonPath); 5 | const readline = require('readline'); 6 | 7 | const rl = readline.createInterface({ 8 | input: process.stdin, 9 | output: process.stdout, 10 | }); 11 | 12 | console.log(`Current: ${file.version}`); 13 | rl.question('New version: ', version => { 14 | file.version = version; 15 | rl.close(); 16 | }); 17 | 18 | rl.on('close', () => { 19 | // Update app.html 20 | html = fs.readFileSync(appHtmlPath, 'utf8'); 21 | newHtml = html.replace(/title="v[\d\.]+"/, `title="v${file.version}"`); 22 | fs.writeFileSync(appHtmlPath, newHtml); 23 | 24 | fs.writeFileSync(packageJsonPath, JSON.stringify(file, null, 2) + '\n'); 25 | process.exit(0); 26 | }); 27 | --------------------------------------------------------------------------------