├── .editorconfig
├── .gitattributes
├── .github
├── ISSUE_TEMPLATE.md
├── PULL_REQUEST_TEMPLATE.md
└── workflows
│ ├── deploy-docs.yml
│ └── pr-check.yml
├── .gitignore
├── .husky
├── .gitignore
└── pre-commit
├── .lintstagedrc-fix.json
├── .lintstagedrc.json
├── .nvmrc
├── .prettierignore
├── .prettierrc.json
├── .stylelintrc.json
├── .vscode
├── launch.json
└── settings.json
├── CHANGELOG.md
├── CODE_OF_CONDUCT.md
├── CONTRIBUTING.md
├── LICENSE.txt
├── README.md
├── angular.json
├── codecov.yml
├── docs
├── .eslintrc.json
├── 404.html
├── app
│ ├── @theme
│ │ ├── components
│ │ │ ├── color-swatch
│ │ │ │ └── color-swatch.directive.ts
│ │ │ ├── components-promo
│ │ │ │ ├── components-promo.component.scss
│ │ │ │ └── components-promo.component.ts
│ │ │ ├── description
│ │ │ │ └── description.directive.ts
│ │ │ ├── eva
│ │ │ │ ├── eva.component.html
│ │ │ │ ├── eva.component.ts
│ │ │ │ └── eva.components.scss
│ │ │ ├── footer
│ │ │ │ ├── footer.component.html
│ │ │ │ ├── footer.component.scss
│ │ │ │ └── footer.component.ts
│ │ │ ├── for-business
│ │ │ │ ├── for-business.component.scss
│ │ │ │ └── for-business.component.ts
│ │ │ ├── fragment-target
│ │ │ │ └── fragment-target.directive.ts
│ │ │ ├── header
│ │ │ │ ├── header.component.scss
│ │ │ │ └── header.component.ts
│ │ │ ├── hero
│ │ │ │ ├── hero.component.scss
│ │ │ │ └── hero.component.ts
│ │ │ ├── hubspot-cta
│ │ │ │ ├── akveo-services-banner.component.scss
│ │ │ │ └── akveo-services-banner.component.ts
│ │ │ ├── hubspot-form-dialog
│ │ │ │ ├── hubspot-form-dialog.component.scss
│ │ │ │ └── hubspot-form-dialog.component.ts
│ │ │ ├── icon-card
│ │ │ │ ├── icon-card.component.scss
│ │ │ │ └── icon-card.component.ts
│ │ │ ├── index.ts
│ │ │ ├── page-tabs
│ │ │ │ ├── page-tabs.component.scss
│ │ │ │ └── page-tabs.component.ts
│ │ │ ├── page-toc
│ │ │ │ ├── page-toc.component.scss
│ │ │ │ └── page-toc.component.ts
│ │ │ ├── search
│ │ │ │ ├── search.component.scss
│ │ │ │ └── search.component.ts
│ │ │ └── text-card
│ │ │ │ ├── text-card.component.scss
│ │ │ │ └── text-card.component.ts
│ │ ├── services
│ │ │ ├── analytics.service.ts
│ │ │ ├── article.service.ts
│ │ │ ├── code-loader.service.ts
│ │ │ ├── highlight.service.ts
│ │ │ ├── iframe-communicator.service.ts
│ │ │ ├── index.ts
│ │ │ ├── last-viewed-section.service.ts
│ │ │ ├── menu.service.ts
│ │ │ ├── metadata.service.ts
│ │ │ ├── pagination.service.ts
│ │ │ ├── structure.service.ts
│ │ │ ├── styles.service.ts
│ │ │ ├── tabbed.service.ts
│ │ │ ├── text.service.ts
│ │ │ ├── version.service.ts
│ │ │ └── visibility.service.ts
│ │ ├── styles
│ │ │ ├── _common.scss
│ │ │ ├── hs-form.scss
│ │ │ ├── pace.theme.scss
│ │ │ ├── styles.scss
│ │ │ └── themes.scss
│ │ └── theme.module.ts
│ ├── app.component.ts
│ ├── app.module.ts
│ ├── app.options.ts
│ ├── app.routes.ts
│ ├── blocks
│ │ ├── blocks.module.ts
│ │ ├── components
│ │ │ ├── api-block
│ │ │ │ └── api-block.component.ts
│ │ │ ├── code-block
│ │ │ │ ├── code-block.component.scss
│ │ │ │ └── code-block.component.ts
│ │ │ ├── component-block
│ │ │ │ └── component-block.component.ts
│ │ │ ├── components-overview-block
│ │ │ │ ├── components-overview-block.component.html
│ │ │ │ ├── components-overview-block.component.scss
│ │ │ │ └── components-overview-block.component.ts
│ │ │ ├── example-block
│ │ │ │ └── example-block.component.ts
│ │ │ ├── examples-block
│ │ │ │ └── examples-block.component.ts
│ │ │ ├── index.ts
│ │ │ ├── inline-example-block
│ │ │ │ └── inline-example-block.component.ts
│ │ │ ├── live-example-block
│ │ │ │ ├── live-example-block.component.html
│ │ │ │ ├── live-example-block.component.scss
│ │ │ │ └── live-example-block.component.ts
│ │ │ ├── md-block
│ │ │ │ └── md-block.component.ts
│ │ │ ├── methods-block
│ │ │ │ └── methods-block.component.ts
│ │ │ ├── overview-block
│ │ │ │ └── overview-block.component.ts
│ │ │ ├── pager-block
│ │ │ │ ├── pager-block.component.scss
│ │ │ │ └── pager-block.component.ts
│ │ │ ├── prop-block
│ │ │ │ └── prop-block.component.ts
│ │ │ ├── props-block
│ │ │ │ └── props-block.component.ts
│ │ │ ├── stacked-example-block
│ │ │ │ └── stacked-examples.component.ts
│ │ │ ├── styles-block
│ │ │ │ └── styles-block.component.ts
│ │ │ ├── styles-table-block
│ │ │ │ └── styles-table-block.component.ts
│ │ │ ├── tabbed-block
│ │ │ │ ├── tabbed-block.component.html
│ │ │ │ └── tabbed-block.component.ts
│ │ │ ├── tabbed-example-block
│ │ │ │ ├── tabbed-example-block.component.html
│ │ │ │ ├── tabbed-example-block.component.scss
│ │ │ │ └── tabbed-example-block.component.ts
│ │ │ └── theme-block
│ │ │ │ ├── theme-block.component.html
│ │ │ │ ├── theme-block.component.scss
│ │ │ │ └── theme-block.component.ts
│ │ └── enum.example-view.ts
│ ├── documentation
│ │ ├── documentation-routing.module.ts
│ │ ├── documentation.component.html
│ │ ├── documentation.component.scss
│ │ ├── documentation.component.ts
│ │ ├── documentation.module.ts
│ │ └── page
│ │ │ ├── page.component.html
│ │ │ ├── page.component.scss
│ │ │ └── page.component.ts
│ ├── example
│ │ ├── example-404.component.scss
│ │ ├── example-404.component.ts
│ │ ├── example-routing.module.ts
│ │ ├── example.component.scss
│ │ ├── example.component.ts
│ │ └── example.module.ts
│ └── home
│ │ ├── home-routing.module.ts
│ │ ├── home.component.html
│ │ ├── home.component.scss
│ │ ├── home.component.ts
│ │ └── home.module.ts
├── articles
│ ├── .gitkeep
│ ├── auth
│ │ ├── azure.md
│ │ ├── backend-api.md
│ │ ├── custom-ui.md
│ │ ├── firebase-authentication.md
│ │ ├── guard.md
│ │ ├── install.md
│ │ ├── intro.md
│ │ ├── oauth2.md
│ │ ├── redirect.md
│ │ ├── strategy.md
│ │ ├── token.md
│ │ └── ui.md
│ ├── design-system
│ │ ├── css-properties.md
│ │ ├── custom-theme.md
│ │ ├── enable-customizable-theme.md
│ │ ├── intro.md
│ │ ├── multiple-runtime-themes.md
│ │ ├── theme-change.md
│ │ ├── theme.md
│ │ ├── typography.md
│ │ └── use-theme-variables.md
│ ├── getting-started
│ │ ├── professional-services.md
│ │ ├── what-is-nebular.md
│ │ └── where-to-start.md
│ ├── guides
│ │ ├── backend-integration.md
│ │ ├── create-page.md
│ │ ├── custom-icons.md
│ │ ├── install-starter-kit.md
│ │ ├── install.md
│ │ └── server-deployment.md
│ ├── migration
│ │ ├── 200rc8-200rc9-auth.md
│ │ ├── 350-400.md
│ │ └── instructions.md
│ ├── security
│ │ ├── acl-configuration.md
│ │ ├── install.md
│ │ ├── intro.md
│ │ └── multiple-roles.md
│ └── usability
│ │ └── rtl.md
├── assets
│ ├── .gitkeep
│ ├── data
│ │ └── news.json
│ ├── ghspa.js
│ ├── images
│ │ ├── articles
│ │ │ ├── blue-theme.png
│ │ │ ├── custom-auth
│ │ │ │ ├── auth-container.png
│ │ │ │ └── form-with-labels.png
│ │ │ ├── dark-theme.png
│ │ │ ├── design-system
│ │ │ │ └── aquamarine-theme.png
│ │ │ └── sample-page.png
│ │ └── components
│ │ │ ├── accordion.svg
│ │ │ ├── actions.svg
│ │ │ ├── alert.svg
│ │ │ ├── autocomplete.svg
│ │ │ ├── badge.svg
│ │ │ ├── button-group.svg
│ │ │ ├── button.svg
│ │ │ ├── calendar.svg
│ │ │ ├── card.svg
│ │ │ ├── chat-ui.svg
│ │ │ ├── checkbox.svg
│ │ │ ├── chips.svg
│ │ │ ├── collapsable.svg
│ │ │ ├── context-menu.svg
│ │ │ ├── datepicker.svg
│ │ │ ├── dialog.svg
│ │ │ ├── flip.svg
│ │ │ ├── icon.svg
│ │ │ ├── infinite-scroll.svg
│ │ │ ├── input.svg
│ │ │ ├── layout.svg
│ │ │ ├── list.svg
│ │ │ ├── menu.svg
│ │ │ ├── popover.svg
│ │ │ ├── progress-bar.svg
│ │ │ ├── radio.svg
│ │ │ ├── reveal.svg
│ │ │ ├── search.svg
│ │ │ ├── select.svg
│ │ │ ├── sidebar.svg
│ │ │ ├── spinner.svg
│ │ │ ├── stepper.svg
│ │ │ ├── tab.svg
│ │ │ ├── tag.svg
│ │ │ ├── timepicker.svg
│ │ │ ├── toastr.svg
│ │ │ ├── toggle.svg
│ │ │ ├── tooltip.svg
│ │ │ ├── tree-grid.svg
│ │ │ └── user.svg
│ └── img
│ │ ├── akveo-logo.png
│ │ ├── auth.svg
│ │ ├── bg.svg
│ │ ├── components-preview-2x.png
│ │ ├── components-preview.png
│ │ ├── components.svg
│ │ ├── concave.svg
│ │ ├── extendable.svg
│ │ ├── guides.svg
│ │ ├── hero-components.svg
│ │ ├── intro.svg
│ │ ├── modular.svg
│ │ ├── native.svg
│ │ ├── open-sourced.svg
│ │ ├── security.svg
│ │ ├── shield.svg
│ │ ├── shield@2x.png
│ │ ├── theme-colors-2x.png
│ │ ├── theme-colors.png
│ │ └── themes.svg
├── environments
│ ├── environment.prod.ts
│ └── environment.ts
├── favicon.ico
├── favicon.png
├── google46533d2e7a851062.html
├── index.html
├── main.ts
├── polyfills.ts
├── robots.txt
├── structure.ts
├── test.ts
├── themes.scss
├── tsconfig.app.json
├── tsconfig.spec.json
├── tsconfig.wp.json
├── version.ts
└── versions.json
├── e2e
├── .eslintrc.json
├── accordion.e2e-spec.ts
├── actions.e2e-spec.ts
├── alert.e2e-spec.ts
├── badge.e2e-spec.ts
├── card.e2e-spec.ts
├── chat.e2e-spec.ts
├── checkbox.e2e-spec.ts
├── component-shared.ts
├── context-menu.e2e-spec.ts
├── e2e-helper.ts
├── flip-card.e2e-spec.ts
├── layout-footer.e2e-spec.ts
├── layout-header.e2e-spec.ts
├── layout-theme.e2e-spec.ts
├── layout.e2e-spec.ts
├── menu.e2e-spec.ts
├── popover.e2e-spec.ts
├── reveal-card.e2e-spec.ts
├── route-tabset.e2e-spec.ts
├── search.e2e-spec.ts
├── select.e2e-spec.ts
├── sidebar-one.e2e-spec.ts
├── sidebar-three.e2e-spec.ts
├── sidebar-two.e2e-spec.ts
├── sidebar.e2e-spec.ts
├── tabset.e2e-spec.ts
├── toggle.e2e-spec.ts
├── tsconfig.e2e.json
└── user.e2e-spec.ts
├── eslint.config.mjs
├── gulpfile.js
├── karma.conf.js
├── package-lock.json
├── package.json
├── packages-smoke
├── .eslintrc.json
├── README.md
├── angular.json
├── e2e
│ ├── .eslintrc.json
│ ├── protractor.conf.js
│ ├── src
│ │ └── app.e2e-spec.ts
│ └── tsconfig.e2e.json
├── karma.conf.js
├── package-lock.json
├── package.json
├── server.ts
├── src
│ ├── app
│ │ ├── app.component.ts
│ │ ├── app.module.ts
│ │ └── app.server.module.ts
│ ├── assets
│ │ └── .gitkeep
│ ├── environments
│ │ ├── environment.prod.ts
│ │ └── environment.ts
│ ├── favicon.ico
│ ├── index.html
│ ├── main.server.ts
│ ├── main.ts
│ ├── polyfills.ts
│ ├── styles.scss
│ └── test.ts
├── tsconfig.app.json
├── tsconfig.json
├── tsconfig.server.json
└── tsconfig.spec.json
├── protractor.conf.js
├── src
├── .eslintrc.json
├── app
│ ├── app.component.scss
│ ├── app.component.ts
│ ├── app.module.ts
│ ├── components-link.directive.ts
│ ├── components-list.service.ts
│ ├── components-list
│ │ ├── components-list.component.scss
│ │ └── components-list.component.ts
│ ├── layout-direction-toggle
│ │ ├── layout-direction-toggle.component.scss
│ │ └── layout-direction-toggle.component.ts
│ ├── layout-theme-toggle
│ │ ├── layout-theme-toggle.component.scss
│ │ └── layout-theme-toggle.component.ts
│ └── playground-components.ts
├── assets
│ ├── .gitkeep
│ └── data
│ │ └── news.json
├── backend
│ ├── app.js
│ ├── auth.js
│ ├── auth_helpers.js
│ ├── config.js
│ ├── package.json
│ ├── token_helpers.js
│ ├── users.js
│ └── wines.js
├── environments
│ ├── environment.prod.ts
│ └── environment.ts
├── favicon.ico
├── framework
│ ├── auth
│ │ ├── .eslintrc.json
│ │ ├── LICENSE.txt
│ │ ├── README.md
│ │ ├── UPGRADE.md
│ │ ├── auth.module.ts
│ │ ├── auth.options.ts
│ │ ├── auth.routes.ts
│ │ ├── components
│ │ │ ├── auth-block
│ │ │ │ ├── _auth-block.component.theme.scss
│ │ │ │ ├── auth-block.component.scss
│ │ │ │ └── auth-block.component.ts
│ │ │ ├── auth.component.scss
│ │ │ ├── auth.component.ts
│ │ │ ├── login
│ │ │ │ ├── login.component.html
│ │ │ │ └── login.component.ts
│ │ │ ├── logout
│ │ │ │ ├── logout.component.html
│ │ │ │ └── logout.component.ts
│ │ │ ├── register
│ │ │ │ ├── register.component.html
│ │ │ │ ├── register.component.scss
│ │ │ │ └── register.component.ts
│ │ │ ├── request-password
│ │ │ │ ├── request-password.component.html
│ │ │ │ ├── request-password.component.scss
│ │ │ │ └── request-password.component.ts
│ │ │ └── reset-password
│ │ │ │ ├── reset-password.component.html
│ │ │ │ ├── reset-password.component.scss
│ │ │ │ └── reset-password.component.ts
│ │ ├── helpers.ts
│ │ ├── models
│ │ │ └── user.ts
│ │ ├── ng-package.json
│ │ ├── package.json
│ │ ├── public_api.ts
│ │ ├── services
│ │ │ ├── auth-result.ts
│ │ │ ├── auth.service.ts
│ │ │ ├── auth.spec.ts
│ │ │ ├── interceptors
│ │ │ │ ├── jwt-interceptor.spec.ts
│ │ │ │ ├── jwt-interceptor.ts
│ │ │ │ └── simple-interceptor.ts
│ │ │ └── token
│ │ │ │ ├── token-parceler.spec.ts
│ │ │ │ ├── token-parceler.ts
│ │ │ │ ├── token-service.spec.ts
│ │ │ │ ├── token-storage.spec.ts
│ │ │ │ ├── token-storage.ts
│ │ │ │ ├── token.service.ts
│ │ │ │ ├── token.spec.ts
│ │ │ │ └── token.ts
│ │ ├── strategies
│ │ │ ├── auth-strategy-options.ts
│ │ │ ├── auth-strategy.ts
│ │ │ ├── dummy
│ │ │ │ ├── dummy-strategy-options.ts
│ │ │ │ └── dummy-strategy.ts
│ │ │ ├── oauth2
│ │ │ │ ├── oauth2-strategy.options.ts
│ │ │ │ ├── oauth2-strategy.spec.ts
│ │ │ │ └── oauth2-strategy.ts
│ │ │ └── password
│ │ │ │ ├── password-strategy-options.ts
│ │ │ │ ├── password-strategy.spec.ts
│ │ │ │ └── password-strategy.ts
│ │ ├── styles
│ │ │ ├── _globals.scss
│ │ │ ├── global
│ │ │ │ └── _components.scss
│ │ │ └── prebuilt
│ │ │ │ ├── components-custom-properties.scss
│ │ │ │ ├── corporate-custom-properties.scss
│ │ │ │ ├── corporate.scss
│ │ │ │ ├── cosmic-custom-properties.scss
│ │ │ │ ├── cosmic.scss
│ │ │ │ ├── dark-custom-properties.scss
│ │ │ │ ├── dark.scss
│ │ │ │ ├── default-custom-properties.scss
│ │ │ │ └── default.scss
│ │ ├── test.ts
│ │ ├── tsconfig.lib.json
│ │ ├── tsconfig.lib.prod.json
│ │ └── tsconfig.spec.json
│ ├── bootstrap
│ │ ├── README.md
│ │ ├── package.json
│ │ └── styles
│ │ │ ├── _button-group.scss
│ │ │ ├── _buttons.scss
│ │ │ ├── _default-form-control.scss
│ │ │ ├── _dropdowns.scss
│ │ │ ├── _forms.scss
│ │ │ ├── _globals.scss
│ │ │ ├── _hero-buttons.scss
│ │ │ ├── _icon-buttons.scss
│ │ │ ├── _layout.scss
│ │ │ ├── _modals.scss
│ │ │ ├── _outline-buttons.scss
│ │ │ ├── _shape-buttons.scss
│ │ │ ├── _size-buttons.scss
│ │ │ ├── _size-form-control.scss
│ │ │ ├── _status-buttons.scss
│ │ │ └── prebuilt
│ │ │ ├── components-custom-properties.scss
│ │ │ ├── corporate-custom-properties.scss
│ │ │ ├── corporate.scss
│ │ │ ├── cosmic-custom-properties.scss
│ │ │ ├── cosmic.scss
│ │ │ ├── dark-custom-properties.scss
│ │ │ ├── dark.scss
│ │ │ ├── default-custom-properties.scss
│ │ │ └── default.scss
│ ├── date-fns
│ │ ├── .eslintrc.json
│ │ ├── README.md
│ │ ├── date-fns.module.ts
│ │ ├── ng-package.json
│ │ ├── package.json
│ │ ├── public_api.ts
│ │ ├── services
│ │ │ ├── date-fns-date.service.spec.ts
│ │ │ └── date-fns-date.service.ts
│ │ ├── test.ts
│ │ ├── tsconfig.lib.json
│ │ ├── tsconfig.lib.prod.json
│ │ └── tsconfig.spec.json
│ ├── eva-icons
│ │ ├── .eslintrc.json
│ │ ├── README.md
│ │ ├── eva-icons.module.ts
│ │ ├── ng-package.json
│ │ ├── package.json
│ │ ├── public_api.ts
│ │ ├── test.ts
│ │ ├── tsconfig.lib.json
│ │ ├── tsconfig.lib.prod.json
│ │ └── tsconfig.spec.json
│ ├── firebase-auth
│ │ ├── .eslintrc.json
│ │ ├── LICENSE.txt
│ │ ├── README.md
│ │ ├── firebase-auth.module.ts
│ │ ├── ng-package.json
│ │ ├── package.json
│ │ ├── public_api.ts
│ │ ├── strategies
│ │ │ ├── base
│ │ │ │ ├── firebase-base.strategy.ts
│ │ │ │ └── firebase-identity-provider-strategy.options.ts
│ │ │ ├── facebook
│ │ │ │ └── firebase-facebook.strategy.ts
│ │ │ ├── google
│ │ │ │ └── firebase-google.strategy.ts
│ │ │ ├── password
│ │ │ │ ├── firebase-password-strategy.options.ts
│ │ │ │ └── firebase-password.strategy.ts
│ │ │ └── twitter
│ │ │ │ └── firebase-twitter.strategy.ts
│ │ ├── test.ts
│ │ ├── tsconfig.lib.json
│ │ ├── tsconfig.lib.prod.json
│ │ └── tsconfig.spec.json
│ ├── icons
│ │ └── README.md
│ ├── moment
│ │ ├── .eslintrc.json
│ │ ├── README.md
│ │ ├── moment.module.ts
│ │ ├── ng-package.json
│ │ ├── package.json
│ │ ├── public_api.ts
│ │ ├── services
│ │ │ ├── moment-date.service.spec.ts
│ │ │ └── moment-date.service.ts
│ │ ├── test.ts
│ │ ├── tsconfig.lib.json
│ │ ├── tsconfig.lib.prod.json
│ │ └── tsconfig.spec.json
│ ├── security
│ │ ├── .eslintrc.json
│ │ ├── LICENSE.txt
│ │ ├── README.md
│ │ ├── directives
│ │ │ └── is-granted.directive.ts
│ │ ├── ng-package.json
│ │ ├── package.json
│ │ ├── public_api.ts
│ │ ├── security.module.ts
│ │ ├── security.options.ts
│ │ ├── services
│ │ │ ├── access-checker.service.ts
│ │ │ ├── access-checker.spec.ts
│ │ │ ├── acl.service.ts
│ │ │ ├── acl.spec.ts
│ │ │ └── role.provider.ts
│ │ ├── test.ts
│ │ ├── tsconfig.lib.json
│ │ ├── tsconfig.lib.prod.json
│ │ └── tsconfig.spec.json
│ └── theme
│ │ ├── .eslintrc.json
│ │ ├── 350-400-component-variables-changes.md
│ │ ├── 350-400-properties-changes.md
│ │ ├── 350-400-theme-variables-changes.md
│ │ ├── LICENSE.txt
│ │ ├── README.md
│ │ ├── components
│ │ ├── accordion
│ │ │ ├── _accordion.component.theme.scss
│ │ │ ├── accordion-item-body.component.ts
│ │ │ ├── accordion-item-header.component.scss
│ │ │ ├── accordion-item-header.component.ts
│ │ │ ├── accordion-item.component.scss
│ │ │ ├── accordion-item.component.ts
│ │ │ ├── accordion.component.ts
│ │ │ └── accordion.module.ts
│ │ ├── actions
│ │ │ ├── _actions.component.theme.scss
│ │ │ ├── action.component.scss
│ │ │ ├── actions.component.scss
│ │ │ ├── actions.component.ts
│ │ │ ├── actions.module.ts
│ │ │ └── actions.spec.ts
│ │ ├── alert
│ │ │ ├── _alert.component.theme.scss
│ │ │ ├── alert.component.scss
│ │ │ ├── alert.component.ts
│ │ │ ├── alert.module.ts
│ │ │ └── alert.spec.ts
│ │ ├── autocomplete
│ │ │ ├── autocomplete.component.html
│ │ │ ├── autocomplete.component.scss
│ │ │ ├── autocomplete.component.spec.ts
│ │ │ ├── autocomplete.component.ts
│ │ │ ├── autocomplete.directive.ts
│ │ │ └── autocomplete.module.ts
│ │ ├── badge
│ │ │ ├── _badge.component.theme.scss
│ │ │ ├── badge.component.scss
│ │ │ ├── badge.component.spec.ts
│ │ │ ├── badge.component.ts
│ │ │ └── badge.module.ts
│ │ ├── button-group
│ │ │ ├── _button-group.component.theme.scss
│ │ │ ├── _button-toggle.component.theme.scss
│ │ │ ├── button-group-injection-tokens.ts
│ │ │ ├── button-group.component.ts
│ │ │ ├── button-group.module.ts
│ │ │ ├── button-group.spec.ts
│ │ │ └── button-toggle.directive.ts
│ │ ├── button
│ │ │ ├── _button-core.scss
│ │ │ ├── _button-filled.scss
│ │ │ ├── _button-ghost.scss
│ │ │ ├── _button-hero.scss
│ │ │ ├── _button-outline.scss
│ │ │ ├── _button.component.theme.scss
│ │ │ ├── base-button.ts
│ │ │ ├── button.component.ts
│ │ │ ├── button.module.ts
│ │ │ └── button.spec.ts
│ │ ├── calendar-kit
│ │ │ ├── _calendar-kit.theme.scss
│ │ │ ├── calendar-kit.module.ts
│ │ │ ├── components
│ │ │ │ ├── _calendar-cell.theme.scss
│ │ │ │ ├── calendar-actions
│ │ │ │ │ ├── calendar-actions.component.scss
│ │ │ │ │ └── calendar-actions.component.ts
│ │ │ │ ├── calendar-day-picker
│ │ │ │ │ ├── _calendar-day-picker.component.theme.scss
│ │ │ │ │ ├── calendar-day-cell.component.spec.ts
│ │ │ │ │ ├── calendar-day-cell.component.ts
│ │ │ │ │ ├── calendar-day-picker.component.scss
│ │ │ │ │ ├── calendar-day-picker.component.spec.ts
│ │ │ │ │ └── calendar-day-picker.component.ts
│ │ │ │ ├── calendar-days-names
│ │ │ │ │ ├── _calendar-days-names.component.theme.scss
│ │ │ │ │ ├── calendar-days-names.component.scss
│ │ │ │ │ ├── calendar-days-names.component.spec.ts
│ │ │ │ │ └── calendar-days-names.component.ts
│ │ │ │ ├── calendar-month-picker
│ │ │ │ │ ├── calendar-month-cell.component.spec.ts
│ │ │ │ │ ├── calendar-month-cell.component.ts
│ │ │ │ │ ├── calendar-month-picker.component.spec.ts
│ │ │ │ │ └── calendar-month-picker.component.ts
│ │ │ │ ├── calendar-navigation
│ │ │ │ │ ├── _calendar-navigation.theme.scss
│ │ │ │ │ ├── calendar-pageable-navigation.component.scss
│ │ │ │ │ ├── calendar-pageable-navigation.component.spec.ts
│ │ │ │ │ ├── calendar-pageable-navigation.component.ts
│ │ │ │ │ ├── calendar-view-mode.component.spec.ts
│ │ │ │ │ └── calendar-view-mode.component.ts
│ │ │ │ ├── calendar-picker
│ │ │ │ │ ├── _calendar-picker.component.theme.scss
│ │ │ │ │ ├── calendar-picker-row.component.spec.ts
│ │ │ │ │ ├── calendar-picker-row.component.ts
│ │ │ │ │ ├── calendar-picker.component.spec.ts
│ │ │ │ │ └── calendar-picker.component.ts
│ │ │ │ ├── calendar-week-number
│ │ │ │ │ ├── _calendar-week-number.component.theme.scss
│ │ │ │ │ ├── calendar-week-number.component.scss
│ │ │ │ │ └── calendar-week-number.component.ts
│ │ │ │ └── calendar-year-picker
│ │ │ │ │ ├── calendar-year-cell.component.spec.ts
│ │ │ │ │ ├── calendar-year-cell.component.ts
│ │ │ │ │ ├── calendar-year-picker.component.spec.ts
│ │ │ │ │ └── calendar-year-picker.component.ts
│ │ │ ├── helpers.ts
│ │ │ ├── model.ts
│ │ │ └── services
│ │ │ │ ├── calendar-month-model.service.ts
│ │ │ │ ├── calendar-month-model.spec.ts
│ │ │ │ ├── calendar-time-model.service.spec.ts
│ │ │ │ ├── calendar-time-model.service.ts
│ │ │ │ ├── calendar-year-model.service.spec.ts
│ │ │ │ ├── calendar-year-model.service.ts
│ │ │ │ ├── date.service.ts
│ │ │ │ ├── native-date.service.spec.ts
│ │ │ │ └── native-date.service.ts
│ │ ├── calendar
│ │ │ ├── _calendar.component.theme.scss
│ │ │ ├── base-calendar-range-cell.ts
│ │ │ ├── base-calendar.component.html
│ │ │ ├── base-calendar.component.spec.ts
│ │ │ ├── base-calendar.component.ts
│ │ │ ├── base-calendar.module.ts
│ │ │ ├── calendar-range-day-cell.component.ts
│ │ │ ├── calendar-range-month-cell.component.ts
│ │ │ ├── calendar-range-year-cell.component.ts
│ │ │ ├── calendar-range.component.ts
│ │ │ ├── calendar-range.module.ts
│ │ │ ├── calendar.component.ts
│ │ │ └── calendar.module.ts
│ │ ├── card
│ │ │ ├── _card.component.theme.scss
│ │ │ ├── card.component.scss
│ │ │ ├── card.component.ts
│ │ │ ├── card.module.ts
│ │ │ ├── flip-card
│ │ │ │ ├── _flip-card.component.theme.scss
│ │ │ │ ├── flip-card.component.scss
│ │ │ │ └── flip-card.component.ts
│ │ │ ├── reveal-card
│ │ │ │ ├── _reveal-card.component.theme.scss
│ │ │ │ ├── reveal-card.component.scss
│ │ │ │ └── reveal-card.component.ts
│ │ │ └── shared
│ │ │ │ └── shared.component.ts
│ │ ├── cdk
│ │ │ ├── a11y
│ │ │ │ ├── a11y.module.ts
│ │ │ │ ├── descendant-key-manager.ts
│ │ │ │ ├── focus-key-manager.ts
│ │ │ │ └── focus-trap.ts
│ │ │ ├── adapter
│ │ │ │ ├── adapter.module.ts
│ │ │ │ ├── block-scroll-strategy-adapter.ts
│ │ │ │ ├── overlay-container-adapter.ts
│ │ │ │ ├── scroll-dispatcher-adapter.ts
│ │ │ │ └── viewport-ruler-adapter.ts
│ │ │ ├── bidi
│ │ │ │ ├── bidi-service.ts
│ │ │ │ └── bidi.module.ts
│ │ │ ├── collections
│ │ │ │ └── collection-viewer.ts
│ │ │ ├── keycodes
│ │ │ │ └── keycodes.ts
│ │ │ ├── overlay
│ │ │ │ ├── _overlay.theme.scss
│ │ │ │ ├── dynamic
│ │ │ │ │ ├── dynamic-overlay-handler.spec.ts
│ │ │ │ │ ├── dynamic-overlay-handler.ts
│ │ │ │ │ ├── dynamic-overlay.spec.ts
│ │ │ │ │ └── dynamic-overlay.ts
│ │ │ │ ├── mapping.ts
│ │ │ │ ├── overlay-container.spec.ts
│ │ │ │ ├── overlay-container.ts
│ │ │ │ ├── overlay-position.spec.ts
│ │ │ │ ├── overlay-position.ts
│ │ │ │ ├── overlay-service.ts
│ │ │ │ ├── overlay-trigger.spec.ts
│ │ │ │ ├── overlay-trigger.ts
│ │ │ │ ├── overlay.module.ts
│ │ │ │ └── position-helper.ts
│ │ │ ├── platform
│ │ │ │ └── platform-service.ts
│ │ │ └── table
│ │ │ │ ├── cell.ts
│ │ │ │ ├── data-source.ts
│ │ │ │ ├── row.ts
│ │ │ │ ├── table.module.ts
│ │ │ │ └── type-mappings.ts
│ │ ├── chat
│ │ │ ├── _chat.component.theme.scss
│ │ │ ├── chat-avatar.component.ts
│ │ │ ├── chat-custom-message.directive.spec.ts
│ │ │ ├── chat-custom-message.directive.ts
│ │ │ ├── chat-custom-message.service.ts
│ │ │ ├── chat-form.component.spec.ts
│ │ │ ├── chat-form.component.ts
│ │ │ ├── chat-message-file.component.ts
│ │ │ ├── chat-message-map.component.ts
│ │ │ ├── chat-message-quote.component.spec.ts
│ │ │ ├── chat-message-quote.component.ts
│ │ │ ├── chat-message-text.component.spec.ts
│ │ │ ├── chat-message-text.component.ts
│ │ │ ├── chat-message.component.spec.ts
│ │ │ ├── chat-message.component.ts
│ │ │ ├── chat-title.directive.spec.ts
│ │ │ ├── chat-title.directive.ts
│ │ │ ├── chat.component.scss
│ │ │ ├── chat.component.ts
│ │ │ ├── chat.module.ts
│ │ │ └── chat.options.ts
│ │ ├── checkbox
│ │ │ ├── _checkbox.component.theme.scss
│ │ │ ├── checkbox.component.scss
│ │ │ ├── checkbox.component.ts
│ │ │ ├── checkbox.module.ts
│ │ │ └── checkbox.spec.ts
│ │ ├── component-shape.ts
│ │ ├── component-size.ts
│ │ ├── component-status.ts
│ │ ├── context-menu
│ │ │ ├── _context-menu.component.theme.scss
│ │ │ ├── context-menu.component.ts
│ │ │ ├── context-menu.directive.ts
│ │ │ ├── context-menu.module.ts
│ │ │ └── context-menu.spec.ts
│ │ ├── datepicker
│ │ │ ├── _datepicker-container.component.theme.scss
│ │ │ ├── calendar-with-time-container.component.scss
│ │ │ ├── calendar-with-time.component.ts
│ │ │ ├── date-timepicker.component.ts
│ │ │ ├── datepicker-adapter.spec.ts
│ │ │ ├── datepicker-adapter.ts
│ │ │ ├── datepicker-container.component.ts
│ │ │ ├── datepicker.component.ts
│ │ │ ├── datepicker.directive.ts
│ │ │ ├── datepicker.module.ts
│ │ │ └── datepicker.spec.ts
│ │ ├── dialog
│ │ │ ├── dialog-config.ts
│ │ │ ├── dialog-container.ts
│ │ │ ├── dialog-ref.ts
│ │ │ ├── dialog.module.ts
│ │ │ ├── dialog.service.spec.ts
│ │ │ └── dialog.service.ts
│ │ ├── form-field
│ │ │ ├── _form-field.component.theme.scss
│ │ │ ├── form-field-control.ts
│ │ │ ├── form-field.component.html
│ │ │ ├── form-field.component.scss
│ │ │ ├── form-field.component.ts
│ │ │ ├── form-field.module.ts
│ │ │ ├── prefix.directive.ts
│ │ │ └── suffix.directive.ts
│ │ ├── helpers.ts
│ │ ├── icon
│ │ │ ├── _icon.component.theme.scss
│ │ │ ├── icon-libraries.ts
│ │ │ ├── icon-pack.ts
│ │ │ ├── icon.component.scss
│ │ │ ├── icon.component.spec.ts
│ │ │ ├── icon.component.ts
│ │ │ ├── icon.module.ts
│ │ │ ├── icon.spec.ts
│ │ │ ├── icon.ts
│ │ │ └── icons-libraries.spec.ts
│ │ ├── input
│ │ │ ├── _input-shapes.scss
│ │ │ ├── _input-sizes.scss
│ │ │ ├── _input-statuses.scss
│ │ │ ├── _input.directive.theme.scss
│ │ │ ├── input.directive.ts
│ │ │ ├── input.module.ts
│ │ │ └── input.spec.ts
│ │ ├── layout
│ │ │ ├── _layout.component.theme.scss
│ │ │ ├── layout-direction.directive.ts
│ │ │ ├── layout.component.scss
│ │ │ ├── layout.component.spec.ts
│ │ │ ├── layout.component.ts
│ │ │ ├── layout.module.ts
│ │ │ ├── restore-scroll-top.service.spec.ts
│ │ │ └── restore-scroll-top.service.ts
│ │ ├── list
│ │ │ ├── _list.component.theme.scss
│ │ │ ├── infinite-list.directive.spec.ts
│ │ │ ├── infinite-list.directive.ts
│ │ │ ├── list-item.component.scss
│ │ │ ├── list-page-tracker.directive.ts
│ │ │ ├── list-pager.directive.spec.ts
│ │ │ ├── list.component.scss
│ │ │ ├── list.component.ts
│ │ │ └── list.module.ts
│ │ ├── menu
│ │ │ ├── _menu.component.theme.scss
│ │ │ ├── menu-item.component.html
│ │ │ ├── menu.component.scss
│ │ │ ├── menu.component.ts
│ │ │ ├── menu.module.ts
│ │ │ ├── menu.service.ts
│ │ │ ├── menu.spec.ts
│ │ │ └── url-matching-helpers.ts
│ │ ├── option
│ │ │ ├── _option-list.component.theme.scss
│ │ │ ├── option-group.component.scss
│ │ │ ├── option-group.component.spec.ts
│ │ │ ├── option-group.component.ts
│ │ │ ├── option-list.component.ts
│ │ │ ├── option-list.module.ts
│ │ │ ├── option.component.scss
│ │ │ └── option.component.ts
│ │ ├── popover
│ │ │ ├── _popover.component.theme.scss
│ │ │ ├── popover.component.scss
│ │ │ ├── popover.component.ts
│ │ │ ├── popover.directive.ts
│ │ │ ├── popover.module.ts
│ │ │ └── popover.spec.ts
│ │ ├── progress-bar
│ │ │ ├── _progress-bar.component.theme.scss
│ │ │ ├── progress-bar.component.scss
│ │ │ ├── progress-bar.component.ts
│ │ │ ├── progress-bar.module.ts
│ │ │ └── progress-bar.spec.ts
│ │ ├── radio
│ │ │ ├── _radio.component.theme.scss
│ │ │ ├── radio-group.component.ts
│ │ │ ├── radio.component.scss
│ │ │ ├── radio.component.ts
│ │ │ ├── radio.module.ts
│ │ │ └── radio.spec.ts
│ │ ├── route-tabset
│ │ │ ├── _route-tabset.component.theme.scss
│ │ │ ├── merge-configs.pipe.ts
│ │ │ ├── route-tabset.component.scss
│ │ │ ├── route-tabset.component.ts
│ │ │ └── route-tabset.module.ts
│ │ ├── search
│ │ │ ├── _search.component.theme.scss
│ │ │ ├── search.component.spec.ts
│ │ │ ├── search.component.ts
│ │ │ ├── search.module.ts
│ │ │ ├── search.service.spec.ts
│ │ │ ├── search.service.ts
│ │ │ └── styles
│ │ │ │ ├── search.component.column-curtain.scss
│ │ │ │ ├── search.component.curtain.scss
│ │ │ │ ├── search.component.layout-rotate.scss
│ │ │ │ ├── search.component.modal-drop.scss
│ │ │ │ ├── search.component.modal-half.scss
│ │ │ │ ├── search.component.modal-move.scss
│ │ │ │ ├── search.component.modal-zoomin.scss
│ │ │ │ └── search.component.scss
│ │ ├── select-with-autocomplete
│ │ │ ├── _select-with-autocomplete-filled.scss
│ │ │ ├── _select-with-autocomplete-hero.scss
│ │ │ ├── _select-with-autocomplete-outline.scss
│ │ │ ├── _select-with-autocomplete.component.theme.scss
│ │ │ ├── select-with-autocomplete.component.html
│ │ │ ├── select-with-autocomplete.component.scss
│ │ │ ├── select-with-autocomplete.component.ts
│ │ │ ├── select-with-autocomplete.module.ts
│ │ │ └── select-with-autocomplete.spec.ts
│ │ ├── select
│ │ │ ├── _select-filled.scss
│ │ │ ├── _select-hero.scss
│ │ │ ├── _select-outline.scss
│ │ │ ├── _select.component.theme.scss
│ │ │ ├── select-injection-tokens.ts
│ │ │ ├── select.component.html
│ │ │ ├── select.component.scss
│ │ │ ├── select.component.ts
│ │ │ ├── select.module.ts
│ │ │ └── select.spec.ts
│ │ ├── shared
│ │ │ └── shared.module.ts
│ │ ├── sidebar
│ │ │ ├── _sidebar.component.theme.scss
│ │ │ ├── sidebar.component.scss
│ │ │ ├── sidebar.component.ts
│ │ │ ├── sidebar.module.ts
│ │ │ ├── sidebar.service.ts
│ │ │ └── sidebar.spec.ts
│ │ ├── spinner
│ │ │ ├── _spinner.component.theme.scss
│ │ │ ├── spinner.component.scss
│ │ │ ├── spinner.component.ts
│ │ │ ├── spinner.directive.ts
│ │ │ ├── spinner.module.ts
│ │ │ └── spinner.spec.ts
│ │ ├── stepper
│ │ │ ├── _stepper.component.theme.scss
│ │ │ ├── step.component.ts
│ │ │ ├── stepper-button.directive.ts
│ │ │ ├── stepper-tokens.ts
│ │ │ ├── stepper.component.html
│ │ │ ├── stepper.component.scss
│ │ │ ├── stepper.component.ts
│ │ │ ├── stepper.module.ts
│ │ │ └── stepper.spec.ts
│ │ ├── tabset
│ │ │ ├── _tabset.component.theme.scss
│ │ │ ├── tab-content.directive.ts
│ │ │ ├── tab-title.directive.ts
│ │ │ ├── tabset.component.scss
│ │ │ ├── tabset.component.spec.ts
│ │ │ ├── tabset.component.ts
│ │ │ └── tabset.module.ts
│ │ ├── tag
│ │ │ ├── _tag-filled.scss
│ │ │ ├── _tag-input.scss
│ │ │ ├── _tag-list.scss
│ │ │ ├── _tag-outline.scss
│ │ │ ├── _tag.component.theme.scss
│ │ │ ├── _tag.scss
│ │ │ ├── tag-input.directive.ts
│ │ │ ├── tag-list.component.ts
│ │ │ ├── tag.component.html
│ │ │ ├── tag.component.ts
│ │ │ ├── tag.module.ts
│ │ │ └── tag.spec.ts
│ │ ├── timepicker
│ │ │ ├── _timepicker.component.theme.scss
│ │ │ ├── model.ts
│ │ │ ├── timepicker-cell.component.scss
│ │ │ ├── timepicker-cell.component.ts
│ │ │ ├── timepicker.component.html
│ │ │ ├── timepicker.component.scss
│ │ │ ├── timepicker.component.ts
│ │ │ ├── timepicker.directive.ts
│ │ │ ├── timepicker.module.ts
│ │ │ └── timepicker.spec.ts
│ │ ├── toastr
│ │ │ ├── _toast.component.theme.scss
│ │ │ ├── model.ts
│ │ │ ├── toast.component.html
│ │ │ ├── toast.component.scss
│ │ │ ├── toast.component.ts
│ │ │ ├── toastr-config.ts
│ │ │ ├── toastr-container.component.ts
│ │ │ ├── toastr.module.ts
│ │ │ ├── toastr.service.spec.ts
│ │ │ └── toastr.service.ts
│ │ ├── toggle
│ │ │ ├── _toggle.component.theme.scss
│ │ │ ├── toggle.component.scss
│ │ │ ├── toggle.component.ts
│ │ │ ├── toggle.module.ts
│ │ │ └── toggle.spec.ts
│ │ ├── tooltip
│ │ │ ├── _tooltip.component.theme.scss
│ │ │ ├── tooltip.component.scss
│ │ │ ├── tooltip.component.ts
│ │ │ ├── tooltip.directive.ts
│ │ │ ├── tooltip.module.ts
│ │ │ └── tooltip.spec.ts
│ │ ├── tree-grid
│ │ │ ├── _tree-grid-sort.component.theme.scss
│ │ │ ├── _tree-grid.component.theme.scss
│ │ │ ├── data-source
│ │ │ │ ├── tree-grid-data-source.ts
│ │ │ │ ├── tree-grid-data.service.ts
│ │ │ │ ├── tree-grid-filter.service.ts
│ │ │ │ ├── tree-grid-sort.service.ts
│ │ │ │ ├── tree-grid.model.ts
│ │ │ │ └── tree-grid.service.ts
│ │ │ ├── tree-grid-cell.component.ts
│ │ │ ├── tree-grid-column-def.directive.ts
│ │ │ ├── tree-grid-columns.service.ts
│ │ │ ├── tree-grid-def.component.ts
│ │ │ ├── tree-grid-filter.ts
│ │ │ ├── tree-grid-injection-tokens.ts
│ │ │ ├── tree-grid-row-toggle.component.ts
│ │ │ ├── tree-grid-row-toggle.directive.ts
│ │ │ ├── tree-grid-row.component.ts
│ │ │ ├── tree-grid-sort.component.ts
│ │ │ ├── tree-grid.component.scss
│ │ │ ├── tree-grid.component.spec.ts
│ │ │ ├── tree-grid.component.ts
│ │ │ └── tree-grid.module.ts
│ │ ├── user
│ │ │ ├── _user.component.theme.scss
│ │ │ ├── user.component.html
│ │ │ ├── user.component.scss
│ │ │ ├── user.component.ts
│ │ │ ├── user.module.ts
│ │ │ └── user.spec.ts
│ │ └── window
│ │ │ ├── window-ref.ts
│ │ │ ├── window.component.scss
│ │ │ ├── window.component.ts
│ │ │ ├── window.module.ts
│ │ │ ├── window.options.ts
│ │ │ ├── window.service.spec.ts
│ │ │ ├── window.service.ts
│ │ │ ├── windows-container.component.scss
│ │ │ └── windows-container.component.ts
│ │ ├── ng-package.json
│ │ ├── package.json
│ │ ├── public_api.ts
│ │ ├── schematics
│ │ ├── collection.json
│ │ ├── ng-add
│ │ │ ├── index.spec.ts
│ │ │ ├── index.ts
│ │ │ ├── post-install.ts
│ │ │ ├── register-modules
│ │ │ │ ├── app-routing-module-content.ts
│ │ │ │ └── index.ts
│ │ │ ├── register-theme
│ │ │ │ ├── index.ts
│ │ │ │ └── theme-content.ts
│ │ │ ├── schema.json
│ │ │ ├── schema.ts
│ │ │ ├── setup.ts
│ │ │ └── wrap-in-layout
│ │ │ │ ├── index.ts
│ │ │ │ └── layout-content.ts
│ │ └── util
│ │ │ ├── ast.ts
│ │ │ ├── component.ts
│ │ │ ├── file.ts
│ │ │ ├── index.ts
│ │ │ ├── package.ts
│ │ │ └── project.ts
│ │ ├── services
│ │ ├── breakpoints.service.ts
│ │ ├── breakpoints.spec.ts
│ │ ├── color.helper.ts
│ │ ├── direction.service.ts
│ │ ├── js-themes-registry.service.ts
│ │ ├── js-themes-registry.spec.ts
│ │ ├── js-themes
│ │ │ ├── corporate.theme.ts
│ │ │ ├── cosmic.theme.ts
│ │ │ ├── dark.theme.ts
│ │ │ ├── default.theme.ts
│ │ │ └── theme.options.ts
│ │ ├── ruler.service.spec.ts
│ │ ├── ruler.service.ts
│ │ ├── scroll.service.spec.ts
│ │ ├── scroll.service.ts
│ │ ├── spinner.service.ts
│ │ ├── status.service.ts
│ │ ├── theme.service.ts
│ │ └── theme.spec.ts
│ │ ├── styles
│ │ ├── _all.scss
│ │ ├── _globals.scss
│ │ ├── _themes.scss
│ │ ├── _theming-variables.scss
│ │ ├── _theming.scss
│ │ ├── core
│ │ │ ├── _functions.scss
│ │ │ ├── _mixins.scss
│ │ │ ├── _variants.scss
│ │ │ └── theming
│ │ │ │ ├── _get-value.scss
│ │ │ │ ├── _install.scss
│ │ │ │ └── _register.scss
│ │ ├── global
│ │ │ ├── _breakpoints.scss
│ │ │ ├── _components.scss
│ │ │ ├── _normalize.scss
│ │ │ ├── _overrides.scss
│ │ │ ├── _styles.scss
│ │ │ ├── tables
│ │ │ │ └── _smart-table.theme.scss
│ │ │ └── typography
│ │ │ │ └── _typography.scss
│ │ ├── prebuilt
│ │ │ ├── components-custom-properties.scss
│ │ │ ├── corporate-custom-properties.scss
│ │ │ ├── corporate.scss
│ │ │ ├── cosmic-custom-properties.scss
│ │ │ ├── cosmic.scss
│ │ │ ├── dark-custom-properties.scss
│ │ │ ├── dark.scss
│ │ │ ├── default-custom-properties.scss
│ │ │ └── default.scss
│ │ └── themes
│ │ │ ├── _corporate.scss
│ │ │ ├── _cosmic.scss
│ │ │ ├── _dark.scss
│ │ │ ├── _default.scss
│ │ │ └── _mapping.scss
│ │ ├── test.ts
│ │ ├── theme.module.ts
│ │ ├── theme.options.ts
│ │ ├── tsconfig.lib.json
│ │ ├── tsconfig.lib.prod.json
│ │ ├── tsconfig.schematics.json
│ │ ├── tsconfig.schematics.spec.json
│ │ └── tsconfig.spec.json
├── index.html
├── main.ts
├── playground
│ ├── playground-routing.module.ts
│ ├── playground.module.ts
│ ├── styles
│ │ ├── example-helpers.scss
│ │ ├── styles.scss
│ │ └── themes.scss
│ ├── with-layout
│ │ ├── accordion
│ │ │ ├── accordion-multi.component.html
│ │ │ ├── accordion-multi.component.ts
│ │ │ ├── accordion-routing.module.ts
│ │ │ ├── accordion-showcase.component.html
│ │ │ ├── accordion-showcase.component.ts
│ │ │ ├── accordion-test.component.ts
│ │ │ ├── accordion-toggle.component.html
│ │ │ ├── accordion-toggle.component.ts
│ │ │ └── accordion.module.ts
│ │ ├── action
│ │ │ ├── action-badge.component.html
│ │ │ ├── action-badge.component.ts
│ │ │ ├── action-dot-mode.component.html
│ │ │ ├── action-dot-mode.component.ts
│ │ │ ├── action-routing.module.ts
│ │ │ ├── action-showcase.component.html
│ │ │ ├── action-showcase.component.ts
│ │ │ ├── action-sizes.component.html
│ │ │ ├── action-sizes.component.ts
│ │ │ ├── action-test.component.ts
│ │ │ ├── action-width.component.html
│ │ │ ├── action-width.component.ts
│ │ │ └── action.module.ts
│ │ ├── alert
│ │ │ ├── alert-accents.component.html
│ │ │ ├── alert-accents.component.ts
│ │ │ ├── alert-colors.component.html
│ │ │ ├── alert-colors.component.ts
│ │ │ ├── alert-example.component.scss
│ │ │ ├── alert-outline.component.html
│ │ │ ├── alert-outline.component.ts
│ │ │ ├── alert-routing.module.ts
│ │ │ ├── alert-showcase.component.html
│ │ │ ├── alert-showcase.component.ts
│ │ │ ├── alert-sizes.component.html
│ │ │ ├── alert-sizes.component.ts
│ │ │ ├── alert-test.component.ts
│ │ │ └── alert.module.ts
│ │ ├── autocomplete
│ │ │ ├── autocomplete-active-first.component.html
│ │ │ ├── autocomplete-active-first.component.ts
│ │ │ ├── autocomplete-custom-display.component.html
│ │ │ ├── autocomplete-custom-display.component.ts
│ │ │ ├── autocomplete-disabled.component.html
│ │ │ ├── autocomplete-disabled.component.scss
│ │ │ ├── autocomplete-disabled.component.ts
│ │ │ ├── autocomplete-form.component.html
│ │ │ ├── autocomplete-form.component.ts
│ │ │ ├── autocomplete-group.component.html
│ │ │ ├── autocomplete-group.component.ts
│ │ │ ├── autocomplete-routing.module.ts
│ │ │ ├── autocomplete-showcase.component.html
│ │ │ ├── autocomplete-showcase.component.ts
│ │ │ └── autocomplete.module.ts
│ │ ├── badge
│ │ │ ├── badge-routing.module.ts
│ │ │ ├── badge-showcase.component.html
│ │ │ ├── badge-showcase.component.ts
│ │ │ └── badge.module.ts
│ │ ├── button-group
│ │ │ ├── button-and-button-toggle-groups.component.html
│ │ │ ├── button-and-button-toggle-groups.component.ts
│ │ │ ├── button-group-appearances.component.html
│ │ │ ├── button-group-appearances.component.ts
│ │ │ ├── button-group-disabled.component.ts
│ │ │ ├── button-group-interactive.component.html
│ │ │ ├── button-group-interactive.component.scss
│ │ │ ├── button-group-interactive.component.ts
│ │ │ ├── button-group-multiple.component.html
│ │ │ ├── button-group-multiple.component.ts
│ │ │ ├── button-group-routing.module.ts
│ │ │ ├── button-group-shapes.component.html
│ │ │ ├── button-group-shapes.component.ts
│ │ │ ├── button-group-showcase.component.html
│ │ │ ├── button-group-showcase.component.scss
│ │ │ ├── button-group-showcase.component.ts
│ │ │ ├── button-group-sizes.component.html
│ │ │ ├── button-group-sizes.component.ts
│ │ │ ├── button-group-spacing.scss
│ │ │ ├── button-group-statuses.component.html
│ │ │ ├── button-group-statuses.component.ts
│ │ │ ├── button-group-value-change.component.html
│ │ │ ├── button-group-value-change.component.ts
│ │ │ └── button-group.module.ts
│ │ ├── button
│ │ │ ├── button-colors.component.html
│ │ │ ├── button-colors.component.ts
│ │ │ ├── button-full-width.component.html
│ │ │ ├── button-full-width.component.ts
│ │ │ ├── button-hero.component.html
│ │ │ ├── button-hero.component.ts
│ │ │ ├── button-icon.component.html
│ │ │ ├── button-icon.component.ts
│ │ │ ├── button-interactive.component.html
│ │ │ ├── button-interactive.component.scss
│ │ │ ├── button-interactive.component.ts
│ │ │ ├── button-outline.component.html
│ │ │ ├── button-outline.component.ts
│ │ │ ├── button-routing.module.ts
│ │ │ ├── button-shapes.component.html
│ │ │ ├── button-shapes.component.ts
│ │ │ ├── button-showcase.component.html
│ │ │ ├── button-showcase.component.ts
│ │ │ ├── button-sizes.component.html
│ │ │ ├── button-sizes.component.ts
│ │ │ ├── button-types.component.html
│ │ │ ├── button-types.component.ts
│ │ │ └── button.module.ts
│ │ ├── calendar-kit
│ │ │ ├── calendar-kit-full-calendar.component.ts
│ │ │ ├── calendar-kit-routing.module.ts
│ │ │ ├── calendar-kit.module.ts
│ │ │ └── components
│ │ │ │ └── calendar-kit-month-cell.component.ts
│ │ ├── calendar
│ │ │ ├── calendar-bounding-month.component.ts
│ │ │ ├── calendar-custom-day-cell-showcase.component.ts
│ │ │ ├── calendar-filter.component.ts
│ │ │ ├── calendar-min-max.component.ts
│ │ │ ├── calendar-range-showcase.component.ts
│ │ │ ├── calendar-routing.module.ts
│ │ │ ├── calendar-showcase.component.ts
│ │ │ ├── calendar-size.component.ts
│ │ │ ├── calendar-start-view.component.ts
│ │ │ ├── calendar-week-number.component.ts
│ │ │ ├── calendar-without-navigation.component.ts
│ │ │ ├── calendar.module.ts
│ │ │ └── components
│ │ │ │ └── calendar-custom-day-cell.component.ts
│ │ ├── card
│ │ │ ├── card-accents.component.html
│ │ │ ├── card-accents.component.ts
│ │ │ ├── card-colors.component.html
│ │ │ ├── card-colors.component.ts
│ │ │ ├── card-full.component.html
│ │ │ ├── card-full.component.ts
│ │ │ ├── card-routing.module.ts
│ │ │ ├── card-showcase.component.html
│ │ │ ├── card-showcase.component.ts
│ │ │ ├── card-sizes-combinations.component.html
│ │ │ ├── card-sizes-combinations.component.scss
│ │ │ ├── card-sizes-combinations.component.ts
│ │ │ ├── card-sizes.component.html
│ │ │ ├── card-sizes.component.ts
│ │ │ ├── card-test.component.ts
│ │ │ ├── card-without-body.component.ts
│ │ │ └── card.module.ts
│ │ ├── chat
│ │ │ ├── bot-replies.ts
│ │ │ ├── chat-colors.component.html
│ │ │ ├── chat-colors.component.ts
│ │ │ ├── chat-conversation-showcase.component.html
│ │ │ ├── chat-conversation-showcase.component.ts
│ │ │ ├── chat-custom-message.component.html
│ │ │ ├── chat-custom-message.component.scss
│ │ │ ├── chat-custom-message.component.ts
│ │ │ ├── chat-drop.component.html
│ │ │ ├── chat-drop.component.ts
│ │ │ ├── chat-message-types-showcase.component.ts
│ │ │ ├── chat-routing.module.ts
│ │ │ ├── chat-showcase.component.html
│ │ │ ├── chat-showcase.component.ts
│ │ │ ├── chat-showcase.service.ts
│ │ │ ├── chat-size.component.html
│ │ │ ├── chat-sizes.component.ts
│ │ │ ├── chat-template-title.component.html
│ │ │ ├── chat-template-title.component.ts
│ │ │ ├── chat-test.component.ts
│ │ │ ├── chat.module.ts
│ │ │ ├── components
│ │ │ │ ├── chat-custom-message-table.component.scss
│ │ │ │ └── chat-custom-message-table.component.ts
│ │ │ └── messages.ts
│ │ ├── checkbox
│ │ │ ├── checkbox-disabled.component.html
│ │ │ ├── checkbox-disabled.component.ts
│ │ │ ├── checkbox-indeterminate.component.ts
│ │ │ ├── checkbox-routing.module.ts
│ │ │ ├── checkbox-showcase.component.html
│ │ │ ├── checkbox-showcase.component.ts
│ │ │ ├── checkbox-status.component.html
│ │ │ ├── checkbox-status.component.scss
│ │ │ ├── checkbox-status.component.ts
│ │ │ ├── checkbox-test.component.ts
│ │ │ └── checkbox.module.ts
│ │ ├── datepicker-with-format
│ │ │ ├── date-timepicker-dynamic-inputs-showcase.component.html
│ │ │ ├── date-timepicker-dynamic-inputs-showcase.component.ts
│ │ │ ├── datepicker-dynamic-inputs-showcase.component.html
│ │ │ ├── datepicker-dynamic-inputs-showcase.component.ts
│ │ │ ├── datepicker-example.scss
│ │ │ ├── datepicker-with-format-routing.module.ts
│ │ │ ├── datepicker-with-format.module.ts
│ │ │ ├── rangepicker-dynamic-inputs-showcase.component.html
│ │ │ └── rangepicker-dynamic-inputs-showcase.component.ts
│ │ ├── datepicker
│ │ │ ├── date-timepicker-showcase.component.ts
│ │ │ ├── date-timepicker-single-column.component.ts
│ │ │ ├── datepicker-example.scss
│ │ │ ├── datepicker-filter.component.ts
│ │ │ ├── datepicker-forms.component.ts
│ │ │ ├── datepicker-routing.module.ts
│ │ │ ├── datepicker-showcase.component.ts
│ │ │ ├── datepicker-validation.component.ts
│ │ │ ├── datepicker.module.ts
│ │ │ └── rangepicker-showcase.component.ts
│ │ ├── dialog
│ │ │ ├── components
│ │ │ │ ├── auto-focus-dialog.component.ts
│ │ │ │ ├── backdrop-click-dialog.component.ts
│ │ │ │ ├── esc-dialog.component.ts
│ │ │ │ ├── has-backdrop-dialog.component.ts
│ │ │ │ ├── name-prompt-dialog.component.ts
│ │ │ │ ├── scroll-dialog.component.ts
│ │ │ │ └── showcase-dialog.component.ts
│ │ │ ├── dialog-auto-focus.component.ts
│ │ │ ├── dialog-backdrop-click.component.ts
│ │ │ ├── dialog-common.scss
│ │ │ ├── dialog-esc.component.ts
│ │ │ ├── dialog-has-backdrop.component.ts
│ │ │ ├── dialog-result.component.ts
│ │ │ ├── dialog-routing.module.ts
│ │ │ ├── dialog-scroll.component.ts
│ │ │ ├── dialog-showcase.component.ts
│ │ │ ├── dialog-template.component.ts
│ │ │ └── dialog.module.ts
│ │ ├── flip-card
│ │ │ ├── flip-card-accents.component.html
│ │ │ ├── flip-card-accents.component.ts
│ │ │ ├── flip-card-colors.component.html
│ │ │ ├── flip-card-colors.component.ts
│ │ │ ├── flip-card-full.component.html
│ │ │ ├── flip-card-full.component.ts
│ │ │ ├── flip-card-routing.module.ts
│ │ │ ├── flip-card-showcase.component.html
│ │ │ ├── flip-card-showcase.component.ts
│ │ │ ├── flip-card-sizes.component.html
│ │ │ ├── flip-card-sizes.component.ts
│ │ │ └── flip-card.module.ts
│ │ ├── form-field
│ │ │ ├── form-field-input.component.ts
│ │ │ ├── form-field-password.component.ts
│ │ │ ├── form-field-routing.module.ts
│ │ │ ├── form-field-showcase.component.ts
│ │ │ └── form-field.module.ts
│ │ ├── icon
│ │ │ ├── icon-colors.component.html
│ │ │ ├── icon-colors.component.scss
│ │ │ ├── icon-colors.component.ts
│ │ │ ├── icon-routing.module.ts
│ │ │ ├── icon-showcase.component.html
│ │ │ ├── icon-showcase.component.ts
│ │ │ └── icon.module.ts
│ │ ├── infinite-list
│ │ │ ├── components
│ │ │ │ ├── news-post-placeholder.component.ts
│ │ │ │ └── news-post.component.ts
│ │ │ ├── infinite-list-placeholders.component.ts
│ │ │ ├── infinite-list-routing.module.ts
│ │ │ ├── infinite-list-scroll-modes.component.scss
│ │ │ ├── infinite-list-scroll-modes.component.ts
│ │ │ ├── infinite-list-showcase.component.ts
│ │ │ ├── infinite-list.module.ts
│ │ │ ├── infinite-news-list.component.scss
│ │ │ ├── infinite-news-list.component.ts
│ │ │ ├── news-post-placeholder.component.scss
│ │ │ └── news.service.ts
│ │ ├── input
│ │ │ ├── input-colors.component.scss
│ │ │ ├── input-colors.component.ts
│ │ │ ├── input-form.component.ts
│ │ │ ├── input-full-width.component.ts
│ │ │ ├── input-routing.module.ts
│ │ │ ├── input-shapes.component.ts
│ │ │ ├── input-showcase.component.ts
│ │ │ ├── input-sizes.component.ts
│ │ │ ├── input-types.component.ts
│ │ │ └── input.module.ts
│ │ ├── list
│ │ │ ├── fruits-list.ts
│ │ │ ├── list-routing.module.ts
│ │ │ ├── list.module.ts
│ │ │ ├── simple-list-showcase.component.scss
│ │ │ ├── simple-list-showcase.component.ts
│ │ │ └── users-list-showcase.component.ts
│ │ ├── menu
│ │ │ ├── menu-autocollapse.component.html
│ │ │ ├── menu-autocollapse.component.ts
│ │ │ ├── menu-badge.component.html
│ │ │ ├── menu-badge.component.scss
│ │ │ ├── menu-badge.component.ts
│ │ │ ├── menu-children.component.html
│ │ │ ├── menu-children.component.ts
│ │ │ ├── menu-link-params.component.html
│ │ │ ├── menu-link-params.component.ts
│ │ │ ├── menu-routing.module.ts
│ │ │ ├── menu-service-children.ts
│ │ │ ├── menu-service-items.ts
│ │ │ ├── menu-service.component.scss
│ │ │ ├── menu-service.component.ts
│ │ │ ├── menu-showcase.component.html
│ │ │ ├── menu-showcase.component.ts
│ │ │ └── menu.module.ts
│ │ ├── oauth2-password
│ │ │ ├── oauth2-password-login.component.html
│ │ │ ├── oauth2-password-login.component.scss
│ │ │ ├── oauth2-password-login.component.ts
│ │ │ ├── oauth2-password-routing.module.ts
│ │ │ └── oauth2-password.module.ts
│ │ ├── oauth2
│ │ │ ├── oauth2-callback.component.ts
│ │ │ ├── oauth2-login.component.ts
│ │ │ ├── oauth2-routing.module.ts
│ │ │ └── oauth2.module.ts
│ │ ├── overlay
│ │ │ ├── overlay-routing.module.ts
│ │ │ ├── overlay-showcase.component.ts
│ │ │ └── overlay.module.ts
│ │ ├── playground-layout.component.ts
│ │ ├── popover
│ │ │ ├── components
│ │ │ │ └── dynamic.components.ts
│ │ │ ├── popover-custom-component.component.html
│ │ │ ├── popover-custom-component.component.ts
│ │ │ ├── popover-dynamic-code.component.html
│ │ │ ├── popover-dynamic-code.component.ts
│ │ │ ├── popover-dynamic.component.html
│ │ │ ├── popover-dynamic.component.ts
│ │ │ ├── popover-dynamic.scss
│ │ │ ├── popover-modes.component.html
│ │ │ ├── popover-modes.component.ts
│ │ │ ├── popover-noop.component.html
│ │ │ ├── popover-noop.component.ts
│ │ │ ├── popover-placements.component.html
│ │ │ ├── popover-placements.component.ts
│ │ │ ├── popover-routing.module.ts
│ │ │ ├── popover-showcase.component.html
│ │ │ ├── popover-showcase.component.ts
│ │ │ ├── popover-template-ref.component.html
│ │ │ ├── popover-template-ref.component.ts
│ │ │ ├── popover-test.component.ts
│ │ │ └── popover.module.ts
│ │ ├── progress-bar
│ │ │ ├── progress-bar-interactive.component.html
│ │ │ ├── progress-bar-interactive.component.ts
│ │ │ ├── progress-bar-routing.module.ts
│ │ │ ├── progress-bar-showcase.component.html
│ │ │ ├── progress-bar-showcase.component.ts
│ │ │ ├── progress-bar-size.component.html
│ │ │ ├── progress-bar-size.component.ts
│ │ │ ├── progress-bar-status.component.html
│ │ │ ├── progress-bar-status.component.scss
│ │ │ ├── progress-bar-status.component.ts
│ │ │ ├── progress-bar-value.component.html
│ │ │ ├── progress-bar-value.component.ts
│ │ │ └── progress-bar.module.ts
│ │ ├── radio
│ │ │ ├── radio-disabled-group.component.ts
│ │ │ ├── radio-disabled.component.html
│ │ │ ├── radio-disabled.component.ts
│ │ │ ├── radio-form.component.html
│ │ │ ├── radio-form.component.scss
│ │ │ ├── radio-form.component.ts
│ │ │ ├── radio-routing.module.ts
│ │ │ ├── radio-showcase.component.html
│ │ │ ├── radio-showcase.component.ts
│ │ │ ├── radio-statuses-group.component.scss
│ │ │ ├── radio-statuses.component.ts
│ │ │ └── radio.module.ts
│ │ ├── reveal-card
│ │ │ ├── reveal-card-accents.component.html
│ │ │ ├── reveal-card-accents.component.ts
│ │ │ ├── reveal-card-colors.component.html
│ │ │ ├── reveal-card-colors.component.ts
│ │ │ ├── reveal-card-full.component.html
│ │ │ ├── reveal-card-full.component.ts
│ │ │ ├── reveal-card-routing.module.ts
│ │ │ ├── reveal-card-showcase.component.html
│ │ │ ├── reveal-card-showcase.component.ts
│ │ │ ├── reveal-card-sizes.component.html
│ │ │ ├── reveal-card-sizes.component.ts
│ │ │ └── reveal-card.module.ts
│ │ ├── select
│ │ │ ├── select-autocomplete-showcase.component.html
│ │ │ ├── select-autocomplete-showcase.component.ts
│ │ │ ├── select-clean.component.html
│ │ │ ├── select-clean.component.ts
│ │ │ ├── select-compare-with.component.ts
│ │ │ ├── select-disabled.component.html
│ │ │ ├── select-disabled.component.ts
│ │ │ ├── select-filled.component.html
│ │ │ ├── select-filled.component.ts
│ │ │ ├── select-form.component.html
│ │ │ ├── select-form.component.ts
│ │ │ ├── select-groups.component.html
│ │ │ ├── select-groups.component.ts
│ │ │ ├── select-hero.component.html
│ │ │ ├── select-hero.component.ts
│ │ │ ├── select-icon.component.ts
│ │ │ ├── select-interactive.component.html
│ │ │ ├── select-interactive.component.scss
│ │ │ ├── select-interactive.component.ts
│ │ │ ├── select-label.component.html
│ │ │ ├── select-label.component.ts
│ │ │ ├── select-multiple.component.html
│ │ │ ├── select-multiple.component.ts
│ │ │ ├── select-placeholder.component.html
│ │ │ ├── select-placeholder.component.ts
│ │ │ ├── select-routing.module.ts
│ │ │ ├── select-shapes.component.html
│ │ │ ├── select-shapes.component.ts
│ │ │ ├── select-showcase.component.html
│ │ │ ├── select-showcase.component.ts
│ │ │ ├── select-sizes.component.html
│ │ │ ├── select-sizes.component.ts
│ │ │ ├── select-status.component.html
│ │ │ ├── select-status.component.ts
│ │ │ ├── select-test.component.ts
│ │ │ └── select.module.ts
│ │ ├── spinner
│ │ │ ├── spinner-button.component.ts
│ │ │ ├── spinner-card.component.ts
│ │ │ ├── spinner-colors.component.html
│ │ │ ├── spinner-colors.component.scss
│ │ │ ├── spinner-colors.component.ts
│ │ │ ├── spinner-routing.module.ts
│ │ │ ├── spinner-sizes.component.html
│ │ │ ├── spinner-sizes.component.ts
│ │ │ ├── spinner-tabs.component.ts
│ │ │ └── spinner.module.ts
│ │ ├── stepper
│ │ │ ├── stepper-disabled-step-nav.component.scss
│ │ │ ├── stepper-disabled-step-nav.component.ts
│ │ │ ├── stepper-linear.component.html
│ │ │ ├── stepper-linear.component.ts
│ │ │ ├── stepper-playground.component.scss
│ │ │ ├── stepper-routing.module.ts
│ │ │ ├── stepper-showcase.component.html
│ │ │ ├── stepper-showcase.component.ts
│ │ │ ├── stepper-step-change-event.component.html
│ │ │ ├── stepper-step-change-event.component.scss
│ │ │ ├── stepper-step-change-event.component.ts
│ │ │ ├── stepper-test.component.ts
│ │ │ ├── stepper-validation.component.html
│ │ │ ├── stepper-validation.component.ts
│ │ │ ├── stepper-vertical.component.html
│ │ │ ├── stepper-vertical.component.ts
│ │ │ └── stepper.module.ts
│ │ ├── tabset
│ │ │ ├── components
│ │ │ │ └── route-tabset-children.component.ts
│ │ │ ├── route-tabset-showcase.component.ts
│ │ │ ├── tabset-badge.component.html
│ │ │ ├── tabset-badge.component.ts
│ │ │ ├── tabset-disabled.component.html
│ │ │ ├── tabset-disabled.component.ts
│ │ │ ├── tabset-icon.component.html
│ │ │ ├── tabset-icon.component.ts
│ │ │ ├── tabset-routing.module.ts
│ │ │ ├── tabset-showcase.component.html
│ │ │ ├── tabset-showcase.component.ts
│ │ │ ├── tabset-template-title.component.html
│ │ │ ├── tabset-template-title.component.ts
│ │ │ ├── tabset-test.component.ts
│ │ │ ├── tabset-width.component.html
│ │ │ ├── tabset-width.component.ts
│ │ │ └── tabset.module.ts
│ │ ├── tag
│ │ │ ├── tag-appearance.component.html
│ │ │ ├── tag-appearance.component.ts
│ │ │ ├── tag-input-with-autocomplete.component.html
│ │ │ ├── tag-input-with-autocomplete.component.ts
│ │ │ ├── tag-input.component.html
│ │ │ ├── tag-input.component.ts
│ │ │ ├── tag-removable.component.ts
│ │ │ ├── tag-routing.module.ts
│ │ │ ├── tag-showcase.component.ts
│ │ │ ├── tag-status.component.html
│ │ │ ├── tag-status.component.ts
│ │ │ ├── tag.module.ts
│ │ │ └── trees-list.ts
│ │ ├── timepicker
│ │ │ ├── timepicker-dynamic-inputs-showcase.component.html
│ │ │ ├── timepicker-dynamic-inputs-showcase.component.ts
│ │ │ ├── timepicker-example.scss
│ │ │ ├── timepicker-form-control.component.ts
│ │ │ ├── timepicker-ng-model.component.ts
│ │ │ ├── timepicker-routing.module.ts
│ │ │ ├── timepicker-showcase.component.ts
│ │ │ ├── timepicker-single-column.component.ts
│ │ │ ├── timepicker-twelve-hours-format.component.ts
│ │ │ ├── timepicker-with-seconds.component.ts
│ │ │ └── timepicker.module.ts
│ │ ├── toastr
│ │ │ ├── toastr-destroy-by-click.component.ts
│ │ │ ├── toastr-duration.component.ts
│ │ │ ├── toastr-icon.component.ts
│ │ │ ├── toastr-limit.component.ts
│ │ │ ├── toastr-positions.component.ts
│ │ │ ├── toastr-prevent-duplicates-behaviour.component.ts
│ │ │ ├── toastr-prevent-duplicates.component.ts
│ │ │ ├── toastr-routing.module.ts
│ │ │ ├── toastr-showcase.component.ts
│ │ │ ├── toastr-statuses.component.ts
│ │ │ └── toastr.module.ts
│ │ ├── toggle
│ │ │ ├── toggle-disabled.component.ts
│ │ │ ├── toggle-form.component.ts
│ │ │ ├── toggle-label-position.component.ts
│ │ │ ├── toggle-routing.module.ts
│ │ │ ├── toggle-showcase.component.ts
│ │ │ ├── toggle-status.component.ts
│ │ │ ├── toggle-test.component.ts
│ │ │ └── toggle.module.ts
│ │ ├── tooltip
│ │ │ ├── tooltip-colors.component.html
│ │ │ ├── tooltip-colors.component.ts
│ │ │ ├── tooltip-examples.scss
│ │ │ ├── tooltip-placements.component.html
│ │ │ ├── tooltip-placements.component.ts
│ │ │ ├── tooltip-routing.module.ts
│ │ │ ├── tooltip-showcase.component.html
│ │ │ ├── tooltip-showcase.component.ts
│ │ │ ├── tooltip-with-icon.component.html
│ │ │ ├── tooltip-with-icon.component.ts
│ │ │ └── tooltip.module.ts
│ │ ├── tree-grid
│ │ │ ├── tree-grid-basic.component.ts
│ │ │ ├── tree-grid-custom-icons.component.scss
│ │ │ ├── tree-grid-custom-icons.component.ts
│ │ │ ├── tree-grid-custom-node-structure.component.ts
│ │ │ ├── tree-grid-disable-click-toggle.component.ts
│ │ │ ├── tree-grid-filterable.component.ts
│ │ │ ├── tree-grid-responsive.component.ts
│ │ │ ├── tree-grid-routing.module.ts
│ │ │ ├── tree-grid-shared.scss
│ │ │ ├── tree-grid-showcase.component.html
│ │ │ ├── tree-grid-showcase.component.scss
│ │ │ ├── tree-grid-showcase.component.ts
│ │ │ ├── tree-grid-sortable.component.ts
│ │ │ └── tree-grid.module.ts
│ │ ├── user
│ │ │ ├── user-avatar-settings.component.html
│ │ │ ├── user-avatar-settings.component.ts
│ │ │ ├── user-hide-captions.component.html
│ │ │ ├── user-hide-captions.component.ts
│ │ │ ├── user-routing.module.ts
│ │ │ ├── user-shape.component.ts
│ │ │ ├── user-showcase.component.html
│ │ │ ├── user-showcase.component.ts
│ │ │ ├── user-sizes.component.html
│ │ │ ├── user-sizes.component.ts
│ │ │ └── user.module.ts
│ │ ├── window
│ │ │ ├── components
│ │ │ │ ├── form.component.ts
│ │ │ │ └── visitors-form.component.ts
│ │ │ ├── template-window.component.ts
│ │ │ ├── window-controls.component.html
│ │ │ ├── window-controls.component.scss
│ │ │ ├── window-controls.component.ts
│ │ │ ├── window-result.component.ts
│ │ │ ├── window-routing.module.ts
│ │ │ ├── window-showcase.component.ts
│ │ │ ├── window-template-title.component.ts
│ │ │ ├── window.module.ts
│ │ │ ├── window.scss
│ │ │ └── windows-backdrop.component.ts
│ │ ├── with-layout-routing.module.ts
│ │ └── with-layout.module.ts
│ └── without-layout
│ │ ├── auth
│ │ ├── acl
│ │ │ └── acl-test.component.ts
│ │ ├── api-calls
│ │ │ ├── api-calls.component.ts
│ │ │ └── wine.ts
│ │ ├── auth-guard.service.ts
│ │ ├── auth-routing.module.ts
│ │ ├── auth.component.ts
│ │ ├── auth.module.ts
│ │ └── role.provider.ts
│ │ ├── azure
│ │ ├── azure-adb2c-auth-strategy.ts
│ │ ├── azure-callback.component.ts
│ │ ├── azure-login.component.ts
│ │ ├── azure-routing.module.ts
│ │ └── azure.module.ts
│ │ ├── context-menu
│ │ ├── context-menu-click.component.html
│ │ ├── context-menu-click.component.ts
│ │ ├── context-menu-modes.component.html
│ │ ├── context-menu-modes.component.ts
│ │ ├── context-menu-noop.component.html
│ │ ├── context-menu-noop.component.ts
│ │ ├── context-menu-right-click.component.html
│ │ ├── context-menu-right-click.component.ts
│ │ ├── context-menu-routing.module.ts
│ │ ├── context-menu-showcase.component.html
│ │ ├── context-menu-showcase.component.ts
│ │ ├── context-menu-test.component.ts
│ │ └── context-menu.module.ts
│ │ ├── firebase
│ │ ├── firebase-api.service.ts
│ │ ├── firebase-playground.component.ts
│ │ ├── firebase-routing.module.ts
│ │ ├── firebase.module.ts
│ │ ├── identity-proders-auth-showcase
│ │ │ ├── identity-providers-auth-showcase.component.html
│ │ │ ├── identity-providers-auth-showcase.component.scss
│ │ │ └── identity-providers-auth-showcase.component.ts
│ │ └── password-auth-showcase
│ │ │ ├── password-auth-showcase.component.html
│ │ │ ├── password-auth-showcase.component.scss
│ │ │ └── password-auth-showcase.component.ts
│ │ ├── layout
│ │ ├── layout-column-left.component.html
│ │ ├── layout-column-left.component.ts
│ │ ├── layout-fixed-header.component.html
│ │ ├── layout-fixed-header.component.ts
│ │ ├── layout-footer-test.component.ts
│ │ ├── layout-header-test.component.ts
│ │ ├── layout-routing.module.ts
│ │ ├── layout-showcase.component.html
│ │ ├── layout-showcase.component.ts
│ │ ├── layout-sidebar-subheader.component.html
│ │ ├── layout-sidebar-subheader.component.ts
│ │ ├── layout-subheader.component.html
│ │ ├── layout-subheader.component.ts
│ │ ├── layout-test.component.ts
│ │ ├── layout-w-footer.component.html
│ │ ├── layout-w-footer.component.ts
│ │ ├── layout.module.ts
│ │ ├── theme-breakpoint-test.component.ts
│ │ └── theme-change-test.component.ts
│ │ ├── menu
│ │ ├── components
│ │ │ └── menu-children.component.ts
│ │ ├── menu-test-routing.module.ts
│ │ ├── menu-test.component.ts
│ │ └── menu-test.module.ts
│ │ ├── playground-base.component.ts
│ │ ├── scroll
│ │ ├── scroll-routing.module.ts
│ │ ├── scroll-window.component.html
│ │ ├── scroll-window.component.ts
│ │ └── scroll.module.ts
│ │ ├── search
│ │ ├── search-customized-test.component.ts
│ │ ├── search-event.component.html
│ │ ├── search-event.component.ts
│ │ ├── search-routing.module.ts
│ │ ├── search-showcase.component.html
│ │ ├── search-showcase.component.ts
│ │ ├── search-test.component.ts
│ │ ├── search-with-input-event.component.ts
│ │ └── search.module.ts
│ │ ├── sidebar
│ │ ├── sidebar-compacted.component.html
│ │ ├── sidebar-compacted.component.ts
│ │ ├── sidebar-fixed.component.html
│ │ ├── sidebar-fixed.component.ts
│ │ ├── sidebar-one-test.component.ts
│ │ ├── sidebar-right.component.html
│ │ ├── sidebar-right.component.ts
│ │ ├── sidebar-routing.module.ts
│ │ ├── sidebar-showcase.component.html
│ │ ├── sidebar-showcase.component.ts
│ │ ├── sidebar-test.component.ts
│ │ ├── sidebar-three-test.component.ts
│ │ ├── sidebar-toggle.component.html
│ │ ├── sidebar-toggle.component.ts
│ │ ├── sidebar-two-test.component.ts
│ │ └── sidebar.module.ts
│ │ ├── smart-home
│ │ ├── app-routing.module.ts
│ │ ├── app.component.ts
│ │ ├── app.module.ts
│ │ └── auth
│ │ │ ├── auth-routing.module.ts
│ │ │ ├── login
│ │ │ ├── login.component.html
│ │ │ └── login.component.ts
│ │ │ └── smart-home-auth.module.ts
│ │ ├── user
│ │ ├── user-test-routing.module.ts
│ │ ├── user-test.component.ts
│ │ └── user-test.module.ts
│ │ ├── without-layout-routing.module.ts
│ │ └── without-layout.module.ts
├── polyfills.ts
├── test.ts
├── tsconfig.app.json
├── tsconfig.spec-wp.json
├── tsconfig.spec.json
└── tsconfig.wp.json
├── tools
├── deploy-docs
│ ├── build-docs.ts
│ ├── config.ts
│ ├── get-stdout.ts
│ ├── ghspa-template.ts
│ ├── log.ts
│ ├── run-command.ts
│ └── tsconfig.json
├── dev-schematics
│ ├── collection.json
│ ├── new-component
│ │ ├── files
│ │ │ └── __path__
│ │ │ │ └── __name@dasherize__
│ │ │ │ ├── __name@dasherize__.component.__styleext__
│ │ │ │ ├── __name@dasherize__.component.html
│ │ │ │ ├── __name@dasherize__.component.spec.ts
│ │ │ │ ├── __name@dasherize__.component.theme.__styleext__
│ │ │ │ ├── __name@dasherize__.component.ts
│ │ │ │ └── __name@dasherize__.module.ts
│ │ ├── index.ts
│ │ ├── index_spec.ts
│ │ └── schema.json
│ ├── playground-components
│ │ ├── index.ts
│ │ └── schema.json
│ ├── playground-module
│ │ ├── add-to-modules.ts
│ │ ├── files
│ │ │ └── __path__
│ │ │ │ ├── __featureModuleFileName__
│ │ │ │ └── __routingModuleFileName__
│ │ ├── generate-missing-modules.ts
│ │ ├── index.ts
│ │ └── schema.json
│ ├── playground
│ │ ├── index.ts
│ │ └── schema.json
│ ├── tsconfig.json
│ └── utils
│ │ ├── ast.ts
│ │ ├── change.ts
│ │ ├── formatting.ts
│ │ ├── index.ts
│ │ ├── path.ts
│ │ ├── playground.ts
│ │ ├── routing.ts
│ │ └── strings.ts
├── gulp
│ ├── bump-versions.ts
│ ├── config.ts
│ ├── docs
│ │ ├── copy-index.ts
│ │ ├── docs-utils.ts
│ │ ├── example.ts
│ │ ├── output-json.ts
│ │ ├── prepare-docs.ts
│ │ ├── sass-export.ts
│ │ └── sitemap.ts
│ ├── gulpfile.ts
│ ├── schematics
│ │ ├── build-dev-schematics.ts
│ │ ├── schematics-utils.ts
│ │ └── test-packages-schematics.ts
│ └── tsconfig.json
└── publish.sh
└── tsconfig.json
/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see http://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 2
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.md]
12 | max_line_length = off
13 | trim_trailing_whitespace = false
14 |
--------------------------------------------------------------------------------
/.gitattributes:
--------------------------------------------------------------------------------
1 | *.ts text eol=lf
2 | *.scss text eol=lf
3 | *.md text eol=lf
4 | *.html text eol=lf
5 | *.json text eol=lf
6 |
--------------------------------------------------------------------------------
/.github/PULL_REQUEST_TEMPLATE.md:
--------------------------------------------------------------------------------
1 | ### Please read and mark the following check list before creating a pull request:
2 |
3 | - [] I read and followed the [CONTRIBUTING.md](https://github.com/akveo/nebular/blob/master/CONTRIBUTING.md) guide.
4 |
5 | #### Short description of what this resolves:
6 |
--------------------------------------------------------------------------------
/.github/workflows/deploy-docs.yml:
--------------------------------------------------------------------------------
1 | name: Deploy docs
2 | on:
3 | push:
4 | branches:
5 | - master
6 | release:
7 | types:
8 | - published
9 | jobs:
10 | deploy-docs:
11 | runs-on: ubuntu-latest
12 | steps:
13 | - uses: actions/checkout@v3
14 | - uses: actions/setup-node@v3
15 | with:
16 | node-version: 18.19.1
17 | cache: 'npm'
18 | - run: npm ci
19 | - run: npm run docs:gh-pages
20 |
--------------------------------------------------------------------------------
/.husky/.gitignore:
--------------------------------------------------------------------------------
1 | _
2 |
--------------------------------------------------------------------------------
/.husky/pre-commit:
--------------------------------------------------------------------------------
1 | #!/bin/sh
2 | . "$(dirname "$0")/_/husky.sh"
3 |
4 | npx lint-staged
5 |
--------------------------------------------------------------------------------
/.lintstagedrc-fix.json:
--------------------------------------------------------------------------------
1 | {
2 | "*.{ts,js}": "eslint --cache --fix",
3 | "*.{scss,css}": "stylelint --fix",
4 | "*.{ts,scss,html,md,js,css}": "prettier --write"
5 | }
6 |
--------------------------------------------------------------------------------
/.lintstagedrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "*.{ts,js}": "eslint --cache",
3 | "*.{scss,css}": "stylelint",
4 | "*.{ts,scss,html,md,js,css}": "prettier --check"
5 | }
6 |
--------------------------------------------------------------------------------
/.nvmrc:
--------------------------------------------------------------------------------
1 | 18.19.1
2 |
--------------------------------------------------------------------------------
/.prettierignore:
--------------------------------------------------------------------------------
1 | # Ignore artifacts:
2 | build
3 | coverage
4 | dist
5 | tools/dev-schematics/*/files
6 |
--------------------------------------------------------------------------------
/.prettierrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "printWidth": 120,
3 | "singleQuote": true,
4 | "trailingComma": "all"
5 | }
6 |
--------------------------------------------------------------------------------
/codecov.yml:
--------------------------------------------------------------------------------
1 | comment:
2 | layout: "diff, flags, files"
3 | behavior: default
4 | require_changes: true
5 | require_base: no
6 | require_head: yes
7 | branches: null
8 |
--------------------------------------------------------------------------------
/docs/app/@theme/components/components-promo/components-promo.component.scss:
--------------------------------------------------------------------------------
1 | @use '../../../@theme/styles/themes' as *;
2 |
3 | @include nb-install-component() {
4 | display: flex;
5 | flex-direction: column;
6 | align-items: center;
7 |
8 | max-width: 45rem;
9 |
10 | color: nb-theme(color-fg-heading);
11 | margin-bottom: 1rem;
12 |
13 | p {
14 | color: #6e82a9;
15 | font-size: 1rem;
16 | line-height: 1.75rem;
17 | text-align: center;
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/docs/app/@theme/components/description/description.directive.ts:
--------------------------------------------------------------------------------
1 | import { AfterViewInit, Directive, ElementRef } from '@angular/core';
2 | import * as marked from 'marked';
3 |
4 | @Directive({
5 | selector: '[ngdDescription]',
6 | standalone: false
7 | })
8 | export class NgdDescriptionDirective implements AfterViewInit {
9 |
10 | constructor(private el: ElementRef) {
11 | }
12 |
13 | ngAfterViewInit() {
14 | const md = marked.setOptions({});
15 | this.el.nativeElement.innerHTML = md.parse(this.el.nativeElement.innerHTML.trim());
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/docs/app/@theme/components/eva/eva.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'ngd-eva',
5 | styleUrls: ['./eva.components.scss'],
6 | templateUrl: './eva.component.html',
7 | standalone: false
8 | })
9 | export class NgdEvaComponent {}
10 |
--------------------------------------------------------------------------------
/docs/app/@theme/components/footer/footer.component.ts:
--------------------------------------------------------------------------------
1 | import { ChangeDetectionStrategy, Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'ngd-footer',
5 | styleUrls: ['./footer.component.scss'],
6 | templateUrl: './footer.component.html',
7 | changeDetection: ChangeDetectionStrategy.OnPush,
8 | standalone: false
9 | })
10 | export class NgdFooterComponent {
11 | }
12 |
--------------------------------------------------------------------------------
/docs/app/@theme/components/hubspot-cta/akveo-services-banner.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | padding-left: 1rem;
3 | margin-top: 2rem;
4 | display: block;
5 | }
6 |
--------------------------------------------------------------------------------
/docs/app/@theme/components/hubspot-form-dialog/hubspot-form-dialog.component.scss:
--------------------------------------------------------------------------------
1 | nb-card {
2 | width: 25rem;
3 | margin-bottom: 0;
4 | height: 100%;
5 | max-height: 100vh;
6 | max-height: -webkit-fill-available;
7 | }
8 |
9 | nb-card-header {
10 | display: flex;
11 | align-items: center;
12 | }
13 |
14 | nb-card-body {
15 | min-height: 5rem;
16 | }
17 |
18 | .close-button {
19 | margin-left: auto;
20 | padding: 0;
21 | }
22 |
23 | ::ng-deep .hs-custom-form .hs-submit-btn {
24 | margin-top: 2rem;
25 | }
26 |
--------------------------------------------------------------------------------
/docs/app/@theme/components/search/search.component.scss:
--------------------------------------------------------------------------------
1 | @use '../../../@theme/styles/themes' as *;
2 |
3 | @include nb-install-component() {
4 | position: relative;
5 |
6 | input {
7 | padding-left: 3rem;
8 | }
9 |
10 | nb-icon {
11 | color: nb-theme(input-basic-placeholder-text-color);
12 | position: absolute;
13 | top: 50%;
14 | transform: translateY(-50%);
15 | left: 1rem;
16 | z-index: 1;
17 | font-size: 1.25rem;
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/docs/app/@theme/services/highlight.service.ts:
--------------------------------------------------------------------------------
1 | import { Injectable } from '@angular/core';
2 | import * as hljs from 'highlight.js';
3 |
4 | @Injectable()
5 | export class NgdHighlightService {
6 |
7 | public highlight(code: string): string {
8 | return hljs.highlightAuto(code, ['ts', 'html', 'scss', 'nginx']).value;
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/docs/app/@theme/services/metadata.service.ts:
--------------------------------------------------------------------------------
1 | import { Injectable } from '@angular/core';
2 |
3 | @Injectable()
4 | export class NgdMetadataService {
5 | isPublic(prop): boolean {
6 | return !prop.isDocsPrivate && !prop.inherited;
7 | }
8 | }
9 |
--------------------------------------------------------------------------------
/docs/app/@theme/styles/pace.theme.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use 'themes' as *;
8 |
9 | @mixin ngd-pace-theme() {
10 | .pace .pace-progress {
11 | background: nb-theme(color-fg-highlight);
12 | }
13 |
14 | .pace .pace-progress-inner {
15 | box-shadow: 0 0 10px nb-theme(color-fg-highlight), 0 0 5px nb-theme(color-fg-highlight);
16 | }
17 |
18 | .pace .pace-activity {
19 | display: none;
20 | }
21 | }
22 |
--------------------------------------------------------------------------------
/docs/app/app.options.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 | import { InjectionToken } from '@angular/core';
7 |
8 | export const STRUCTURE = new InjectionToken<any>('Docs Structure');
9 | export const DOCS = new InjectionToken<any>('Docs Structure');
10 |
--------------------------------------------------------------------------------
/docs/app/blocks/components/tabbed-example-block/tabbed-example-block.component.html:
--------------------------------------------------------------------------------
1 | <button type="button"
2 | *ngIf="hasViewSwitch"
3 | class="btn action-item action-button"
4 | (click)="switchToLiveView()">
5 | <nb-icon icon="image-outline"></nb-icon>
6 | <span class="text">Live view</span>
7 | </button>
8 |
9 | <nb-tabset class="tabs-container">
10 | <nb-tab *ngFor="let example of examples" tabTitle="{{ example.extension }}" [active]="example.active">
11 | <ngd-code-block [path]="example.path" [code]="example.code"></ngd-code-block>
12 | </nb-tab>
13 | </nb-tabset>
14 |
--------------------------------------------------------------------------------
/docs/app/blocks/enum.example-view.ts:
--------------------------------------------------------------------------------
1 | export enum NgdExampleView {
2 | LIVE = 'live',
3 | INLINE = 'inline',
4 | }
5 |
--------------------------------------------------------------------------------
/docs/app/example/example-404.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | align-items: center;
3 | display: flex;
4 | color: gray;
5 | justify-content: center;
6 | height: 5rem;
7 | }
8 |
--------------------------------------------------------------------------------
/docs/app/example/example-404.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { NbThemeService } from '@nebular/theme';
3 |
4 | @Component({
5 | selector: 'ngd-example-404',
6 | template: `
7 | Example not found.
8 | `,
9 | styleUrls: ['./example-404.component.scss'],
10 | standalone: false
11 | })
12 | export class NgdExample404Component {
13 |
14 | constructor(private themeService: NbThemeService) {
15 | this.themeService.changeTheme('default');
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/docs/app/example/example.component.scss:
--------------------------------------------------------------------------------
1 | // colors
2 | $color-gray-background: #f1f2f3;
3 |
4 | :host {
5 | display: block;
6 | background-color: $color-gray-background;
7 | }
8 |
--------------------------------------------------------------------------------
/docs/articles/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/articles/.gitkeep
--------------------------------------------------------------------------------
/docs/assets/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/.gitkeep
--------------------------------------------------------------------------------
/docs/assets/images/articles/blue-theme.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/images/articles/blue-theme.png
--------------------------------------------------------------------------------
/docs/assets/images/articles/custom-auth/auth-container.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/images/articles/custom-auth/auth-container.png
--------------------------------------------------------------------------------
/docs/assets/images/articles/custom-auth/form-with-labels.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/images/articles/custom-auth/form-with-labels.png
--------------------------------------------------------------------------------
/docs/assets/images/articles/dark-theme.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/images/articles/dark-theme.png
--------------------------------------------------------------------------------
/docs/assets/images/articles/design-system/aquamarine-theme.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/images/articles/design-system/aquamarine-theme.png
--------------------------------------------------------------------------------
/docs/assets/images/articles/sample-page.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/images/articles/sample-page.png
--------------------------------------------------------------------------------
/docs/assets/img/akveo-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/img/akveo-logo.png
--------------------------------------------------------------------------------
/docs/assets/img/components-preview-2x.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/img/components-preview-2x.png
--------------------------------------------------------------------------------
/docs/assets/img/components-preview.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/img/components-preview.png
--------------------------------------------------------------------------------
/docs/assets/img/concave.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 222">
2 | <defs>
3 | <style>.cls-1{fill:#fff;}</style>
4 | </defs>
5 | <title>concave</title>
6 | <g id="Layer_2" data-name="Layer 2">
7 | <g id="Layer_4" data-name="Layer 4">
8 | <path class="cls-1" d="M1920,0c-248.44,93.45-587.33,151.09-960.52,151.09S248.44,93.45,0,0V222H1920Z"/>
9 | </g>
10 | </g>
11 | </svg>
12 |
--------------------------------------------------------------------------------
/docs/assets/img/shield@2x.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/img/shield@2x.png
--------------------------------------------------------------------------------
/docs/assets/img/theme-colors-2x.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/img/theme-colors-2x.png
--------------------------------------------------------------------------------
/docs/assets/img/theme-colors.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/assets/img/theme-colors.png
--------------------------------------------------------------------------------
/docs/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/favicon.ico
--------------------------------------------------------------------------------
/docs/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/docs/favicon.png
--------------------------------------------------------------------------------
/docs/google46533d2e7a851062.html:
--------------------------------------------------------------------------------
1 | google-site-verification: google46533d2e7a851062.html
--------------------------------------------------------------------------------
/docs/main.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { enableProdMode } from '@angular/core';
8 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
9 |
10 | import { AppModule } from './app/app.module';
11 | import { environment } from './environments/environment';
12 |
13 | if (environment.production) {
14 | enableProdMode();
15 | }
16 |
17 | platformBrowserDynamic().bootstrapModule(AppModule);
18 |
19 |
--------------------------------------------------------------------------------
/docs/robots.txt:
--------------------------------------------------------------------------------
1 | Sitemap: https://akveo.github.io/nebular/sitemap.xml
2 |
--------------------------------------------------------------------------------
/docs/themes.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../src/framework/theme/styles/theming-variables';
8 | theming-variables.$nb-theme-export-mode: true;
9 | @use '../src/framework/theme/styles/theming';
10 | @use '../src/framework/theme/styles/themes';
11 | @use '../src/framework/theme/styles/themes/mapping';
12 |
13 | $v: export('output.json', theming-variables.$nb-themes-export, mapping.$eva-mapping);
14 |
--------------------------------------------------------------------------------
/docs/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../out-tsc/app",
5 | "resolveJsonModule": true,
6 | "types": []
7 | },
8 | "files": [
9 | "main.ts",
10 | "polyfills.ts"
11 | ],
12 | "include": [
13 | "**/*.d.ts"
14 | ],
15 | "exclude": [
16 | "test.ts",
17 | "**/*.spec.ts",
18 | "assets/**/*"
19 | ]
20 | }
21 |
--------------------------------------------------------------------------------
/docs/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../out-tsc/spec",
5 | "types": [
6 | "jasmine"
7 | ]
8 | },
9 | "files": [
10 | "test.ts",
11 | "polyfills.ts"
12 | ],
13 | "include": [
14 | "**/*.spec.ts"
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/docs/tsconfig.wp.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "./tsconfig.app.json",
3 | "paths": {
4 | "@nebular/*": [
5 | "dist/*"
6 | ]
7 | }
8 | }
9 |
--------------------------------------------------------------------------------
/docs/version.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | export const VERSION_NAME = 'dev';
8 |
--------------------------------------------------------------------------------
/docs/versions.json:
--------------------------------------------------------------------------------
1 | [
2 | {
3 | "checkoutTarget": "v15.0.0",
4 | "name": "15.0.0",
5 | "path": "/nebular/",
6 | "isCurrent": true
7 | },
8 | {
9 | "checkoutTarget": "master",
10 | "name": "next",
11 | "path": "/nebular/next/"
12 | },
13 | {
14 | "checkoutTarget": "14.0.x",
15 | "name": "14.0.x",
16 | "path": "/nebular/14.0.x/"
17 | }
18 | ]
19 |
--------------------------------------------------------------------------------
/e2e/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../.eslintrc.json",
3 | "overrides": [
4 | {
5 | "files": [
6 | "*.ts"
7 | ],
8 | "parserOptions": {
9 | "project": [
10 | "e2e/tsconfig.e2e.json"
11 | ],
12 | "createDefaultProgram": true
13 | }
14 | },
15 | {
16 | "files": [
17 | "*.html"
18 | ],
19 | "rules": {}
20 | }
21 | ]
22 | }
23 |
--------------------------------------------------------------------------------
/e2e/popover.e2e-spec.ts:
--------------------------------------------------------------------------------
1 | import { browser, by, element } from 'protractor';
2 |
3 | const contentTemplate = by.css('nb-card:nth-child(1) button:nth-child(1)');
4 | const popover = by.css('nb-layout nb-popover');
5 |
6 | describe('nb-popover', () => {
7 |
8 | beforeEach((done) => {
9 | browser.get('#/popover/popover-test.component').then(done);
10 | });
11 |
12 | it('render template ref', () => {
13 | element(contentTemplate).click();
14 | const containerContent = element(popover).element(by.css('nb-card'));
15 | expect(containerContent.isPresent()).toBeTruthy();
16 | });
17 | });
18 |
--------------------------------------------------------------------------------
/e2e/tsconfig.e2e.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../out-tsc/e2e",
5 | "baseUrl": "./",
6 | "module": "commonjs",
7 | "target": "es5",
8 | "types": [
9 | "jasmine",
10 | "jasminewd2",
11 | "node"
12 | ]
13 | }
14 | }
15 |
--------------------------------------------------------------------------------
/gulpfile.js:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | 'use strict';
8 | /**
9 | * Load the TypeScript compiler and then load the tasks from 'scripts/gulp'.
10 | */
11 | const { join } = require('path');
12 | const gulpPath = join(__dirname, 'tools/gulp');
13 | const tsconfigPath = join(gulpPath, 'tsconfig.json');
14 |
15 | // Register TypeScript.
16 | require('ts-node').register({ project: tsconfigPath });
17 | require(join(gulpPath, 'gulpfile'));
18 |
--------------------------------------------------------------------------------
/packages-smoke/e2e/src/app.e2e-spec.ts:
--------------------------------------------------------------------------------
1 | import { browser, by, element } from 'protractor';
2 |
3 | describe('workspace-project App', () => {
4 | it('should render', (done: DoneFn) => {
5 | browser.get('/').then(() => {
6 | expect(element(by.css('bs-root')).getText()).toContain('Nebular Works!!!');
7 | done();
8 | });
9 | });
10 | });
11 |
--------------------------------------------------------------------------------
/packages-smoke/e2e/tsconfig.e2e.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../out-tsc/app",
5 | "module": "commonjs",
6 | "target": "es5",
7 | "types": [
8 | "jasmine",
9 | "jasminewd2",
10 | "node"
11 | ]
12 | }
13 | }
--------------------------------------------------------------------------------
/packages-smoke/src/app/app.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'bs-root',
5 | template: 'Nebular Works!!!',
6 | standalone: false
7 | })
8 | export class AppComponent {
9 | }
10 |
--------------------------------------------------------------------------------
/packages-smoke/src/app/app.server.module.ts:
--------------------------------------------------------------------------------
1 | import { NgModule } from '@angular/core';
2 | import { ServerModule } from '@angular/platform-server';
3 |
4 | import { AppModule } from './app.module';
5 | import { AppComponent } from './app.component';
6 |
7 | @NgModule({
8 | imports: [AppModule, ServerModule],
9 | bootstrap: [AppComponent],
10 | })
11 | export class AppServerModule {}
12 |
--------------------------------------------------------------------------------
/packages-smoke/src/assets/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/packages-smoke/src/assets/.gitkeep
--------------------------------------------------------------------------------
/packages-smoke/src/environments/environment.prod.ts:
--------------------------------------------------------------------------------
1 | export const environment = {
2 | production: true
3 | };
4 |
--------------------------------------------------------------------------------
/packages-smoke/src/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/packages-smoke/src/favicon.ico
--------------------------------------------------------------------------------
/packages-smoke/src/index.html:
--------------------------------------------------------------------------------
1 | <!DOCTYPE html>
2 | <html lang="en">
3 | <head>
4 | <meta charset="utf-8" />
5 | <title>PackagesSmoke</title>
6 | <base href="/" />
7 | <meta name="viewport" content="width=device-width, initial-scale=1" />
8 | <link rel="icon" type="image/x-icon" href="favicon.ico" />
9 | </head>
10 | <body>
11 | <bs-root></bs-root>
12 | </body>
13 | </html>
14 |
--------------------------------------------------------------------------------
/packages-smoke/src/styles.scss:
--------------------------------------------------------------------------------
1 | /* You can add global styles to this file, and also import other style files */
2 | // import Nebular Theme System and the default theme
3 | @use '@nebular/theme/styles/theming' as *;
4 | @use '@nebular/theme/styles/themes/default';
5 | @use '@nebular/theme/styles/globals' as *;
6 |
7 | // install the framework
8 | @include nb-install() {
9 | @include nb-theme-global();
10 | }
11 |
--------------------------------------------------------------------------------
/packages-smoke/src/test.ts:
--------------------------------------------------------------------------------
1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files
2 |
3 | import 'zone.js/testing';
4 | import { getTestBed } from '@angular/core/testing';
5 | import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
6 |
7 | // First, initialize the Angular testing environment.
8 | getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {
9 | teardown: { destroyAfterEach: true },
10 | });
11 |
--------------------------------------------------------------------------------
/packages-smoke/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/app",
6 | "types": []
7 | },
8 | "files": [
9 | "src/main.ts",
10 | "src/polyfills.ts"
11 | ],
12 | "include": [
13 | "src/**/*.d.ts"
14 | ]
15 | }
16 |
--------------------------------------------------------------------------------
/packages-smoke/tsconfig.server.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.app.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/server",
6 | "types": [
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/main.server.ts",
12 | "server.ts"
13 | ],
14 | "angularCompilerOptions": {
15 | "entryModule": "./src/app/app.server.module#AppServerModule"
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/packages-smoke/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/spec",
6 | "types": [
7 | "jasmine"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "src/**/*.spec.ts",
16 | "src/**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/src/app/components-list/components-list.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: flex;
3 | flex-wrap: wrap;
4 | }
5 |
6 | :host(.column) {
7 | flex-direction: column;
8 | margin-top: 1rem;
9 | margin-bottom: 2rem;
10 | }
11 |
12 | .component-block:not(:last-child) {
13 | margin-right: 1rem;
14 | }
15 |
16 | .component-link {
17 | display: block;
18 |
19 | &.selected {
20 | background: #ccc;
21 | }
22 |
23 | &:focus {
24 | transform: scale(1.02);
25 | }
26 |
27 | &.active {
28 | color: #00f;
29 | }
30 | }
31 |
--------------------------------------------------------------------------------
/src/app/layout-direction-toggle/layout-direction-toggle.component.scss:
--------------------------------------------------------------------------------
1 | input {
2 | margin-right: 0.125rem;
3 | }
4 |
5 | label {
6 | margin: 0;
7 | display: inline-flex;
8 | align-items: center;
9 | }
10 |
--------------------------------------------------------------------------------
/src/app/layout-theme-toggle/layout-theme-toggle.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: block;
3 | }
4 |
5 | .theme-radio-label {
6 | display: inline-flex;
7 | align-items: center;
8 | margin-right: 0.5rem;
9 |
10 | &:last-child {
11 | margin-right: 0;
12 | }
13 | }
14 |
15 | .theme-radio {
16 | margin-right: 0.125rem;
17 | }
18 |
--------------------------------------------------------------------------------
/src/assets/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/src/assets/.gitkeep
--------------------------------------------------------------------------------
/src/backend/config.js:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | module.exports = {
8 | jwtSecret: 'MyS3cr3tK3Y',
9 | jwtSession: {
10 | session: false
11 | },
12 | accessTokenExpiresIn : 60,
13 | refreshTokenExpiresIn: 120
14 | };
15 |
--------------------------------------------------------------------------------
/src/backend/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ngx-sample-backend",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "app.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1",
8 | "start": "node app.js"
9 | },
10 | "author": "akveo <contact@akveo.com>",
11 | "license": "MIT",
12 | "dependencies": {
13 | "body-parser": "^1.17.1",
14 | "express": "^4.15.2",
15 | "jwt-simple": "^0.5.1",
16 | "moment": "^2.22.2",
17 | "passport": "^0.3.2",
18 | "passport-jwt": "^4.0.0"
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/src/backend/users.js:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | const users = [
8 | {
9 | id: 1,
10 | name: 'John Doe',
11 | email: 'example@akveo.com',
12 | password: '123456'
13 | }
14 | ];
15 |
16 | module.exports = users;
17 |
--------------------------------------------------------------------------------
/src/backend/wines.js:
--------------------------------------------------------------------------------
1 | const wines = [
2 | {
3 | id: 1,
4 | name: 'Pommard 1er cru',
5 | region: 'Bourgogne',
6 | year: 2012,
7 | },
8 | {
9 | id: 2,
10 | name: 'Aloxe Corton Grand cru',
11 | region: 'Bourgogne',
12 | year: 2008,
13 | },
14 | {
15 | id: 3,
16 | name: 'Meursault 1er cru',
17 | region: 'Bourgogne',
18 | year: 1997,
19 | },
20 | ];
21 |
22 | module.exports = wines;
23 |
--------------------------------------------------------------------------------
/src/environments/environment.prod.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | export const environment = {
8 | production: true,
9 | };
10 |
--------------------------------------------------------------------------------
/src/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/src/favicon.ico
--------------------------------------------------------------------------------
/src/framework/auth/README.md:
--------------------------------------------------------------------------------
1 | ### @nebular/auth module, more details https://akveo.github.io/nebular/
2 |
--------------------------------------------------------------------------------
/src/framework/auth/components/auth-block/auth-block.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-auth-block',
11 | styleUrls: ['./auth-block.component.scss'],
12 | template: `
13 | <ng-content></ng-content>
14 | `,
15 | standalone: false
16 | })
17 | export class NbAuthBlockComponent {
18 | }
19 |
--------------------------------------------------------------------------------
/src/framework/auth/components/logout/logout.component.html:
--------------------------------------------------------------------------------
1 | <div>Logging out, please wait...</div>
2 |
--------------------------------------------------------------------------------
/src/framework/auth/components/register/register.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 | :host {
7 | .title {
8 | margin-bottom: 2rem;
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/auth/components/request-password/request-password.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 | :host {
7 | .form-group:last-of-type {
8 | margin-bottom: 3rem;
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/auth/components/reset-password/reset-password.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 | :host {
7 | .form-group:last-of-type {
8 | margin-bottom: 3rem;
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/auth/models/user.ts:
--------------------------------------------------------------------------------
1 | export class NbUser {
2 |
3 | constructor(public id?: number,
4 | public email?: string,
5 | public password?: string,
6 | public rememberMe?: boolean,
7 | public terms?: boolean,
8 | public confirmPassword?: string,
9 | public fullName?: string) {
10 | }
11 | }
12 |
--------------------------------------------------------------------------------
/src/framework/auth/ng-package.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
3 | "dest": "../../../dist/auth",
4 | "lib": {
5 | "entryFile": "./public_api.ts"
6 | },
7 | "assets": [
8 | "LICENSE.txt",
9 | "**/*.{html,scss}",
10 | "schematics/collection.json",
11 | "schematics/*/schema.json",
12 | "schematics/*/files/**"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/src/framework/auth/styles/_globals.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use 'global/components';
8 |
9 | @mixin nb-auth-global() {
10 | @include components.nb-auth-components();
11 | }
12 |
--------------------------------------------------------------------------------
/src/framework/auth/styles/global/_components.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../../components/auth-block/auth-block.component.theme' as auth-block-theme;
8 |
9 | // Create a theme
10 | @mixin nb-auth-components() {
11 | @include auth-block-theme.nb-auth-block-theme();
12 | }
13 |
--------------------------------------------------------------------------------
/src/framework/auth/styles/prebuilt/components-custom-properties.scss:
--------------------------------------------------------------------------------
1 | @use '../../../theme/styles/themes';
2 | @use '../../../theme/styles/theming-variables' as *;
3 | @use '../../../theme/styles/theming' as *;
4 | @use '../globals' as *;
5 |
6 | $nb-global-styles-on-install: false;
7 |
8 | @include nb-install() {
9 | @include nb-auth-global();
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/auth/styles/prebuilt/corporate-custom-properties.scss:
--------------------------------------------------------------------------------
1 | @use '../../../theme/styles/themes/corporate';
2 | @use '../../../theme/styles/theming' as *;
3 | @use '../globals' as *;
4 |
5 | $nb-enabled-themes: (corporate);
6 |
7 | @include nb-install();
8 |
--------------------------------------------------------------------------------
/src/framework/auth/styles/prebuilt/corporate.scss:
--------------------------------------------------------------------------------
1 | @use '../../../theme/styles/themes/corporate';
2 | @use '../../../theme/styles/theming' as *;
3 | @use '../globals' as *;
4 |
5 | $nb-enabled-themes: (corporate);
6 | $nb-enable-css-custom-properties: false;
7 |
8 | @include nb-install() {
9 | @include nb-auth-global();
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/auth/styles/prebuilt/cosmic-custom-properties.scss:
--------------------------------------------------------------------------------
1 | @use '../../../theme/styles/themes/cosmic';
2 | @use '../../../theme/styles/theming' as *;
3 | @use '../globals' as *;
4 |
5 | $nb-enabled-themes: (cosmic);
6 |
7 | @include nb-install();
8 |
--------------------------------------------------------------------------------
/src/framework/auth/styles/prebuilt/cosmic.scss:
--------------------------------------------------------------------------------
1 | @use '../../../theme/styles/themes/cosmic';
2 | @use '../../../theme/styles/theming' as *;
3 | @use '../globals' as *;
4 |
5 | $nb-enabled-themes: (cosmic);
6 | $nb-enable-css-custom-properties: false;
7 |
8 | @include nb-install() {
9 | @include nb-auth-global();
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/auth/styles/prebuilt/dark-custom-properties.scss:
--------------------------------------------------------------------------------
1 | @use '../../../theme/styles/themes/dark';
2 | @use '../../../theme/styles/theming' as *;
3 | @use '../globals' as *;
4 |
5 | $nb-enabled-themes: (dark);
6 |
7 | @include nb-install();
8 |
--------------------------------------------------------------------------------
/src/framework/auth/styles/prebuilt/dark.scss:
--------------------------------------------------------------------------------
1 | @use '../../../theme/styles/themes/dark';
2 | @use '../../../theme/styles/theming' as *;
3 | @use '../globals' as *;
4 |
5 | $nb-enabled-themes: (dark);
6 | $nb-enable-css-custom-properties: false;
7 |
8 | @include nb-install() {
9 | @include nb-auth-global();
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/auth/styles/prebuilt/default-custom-properties.scss:
--------------------------------------------------------------------------------
1 | @use '../../../theme/styles/themes/default';
2 | @use '../../../theme/styles/theming' as *;
3 | @use '../globals' as *;
4 |
5 | $nb-enabled-themes: (default);
6 |
7 | @include nb-install();
8 |
--------------------------------------------------------------------------------
/src/framework/auth/styles/prebuilt/default.scss:
--------------------------------------------------------------------------------
1 | @use '../../../theme/styles/themes/default';
2 | @use '../../../theme/styles/theming' as *;
3 | @use '../globals' as *;
4 |
5 | $nb-enabled-themes: (default);
6 | $nb-enable-css-custom-properties: false;
7 |
8 | @include nb-install() {
9 | @include nb-auth-global();
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/auth/tsconfig.lib.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/lib",
6 | "declaration": true,
7 | "declarationMap": true,
8 | "inlineSources": true,
9 | "types": [],
10 | "lib": [
11 | "dom",
12 | "es2018"
13 | ]
14 | },
15 | "exclude": [
16 | "test.ts",
17 | "**/*.spec.ts"
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/src/framework/auth/tsconfig.lib.prod.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.lib.json",
4 | "compilerOptions": {
5 | "declarationMap": false,
6 | "paths": {
7 | "@nebular/theme": [
8 | "dist/theme"
9 | ]
10 | }
11 | },
12 | "angularCompilerOptions": {
13 | "compilationMode": "partial"
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/src/framework/auth/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/spec",
6 | "types": [
7 | "jasmine"
8 | ]
9 | },
10 | "files": [
11 | "test.ts"
12 | ],
13 | "include": [
14 | "**/*.spec.ts",
15 | "**/*.d.ts"
16 | ]
17 | }
18 |
--------------------------------------------------------------------------------
/src/framework/bootstrap/README.md:
--------------------------------------------------------------------------------
1 | ### More details https://akveo.github.io/nebular/
2 |
3 | ### This package is deprecated. We suggest using native Nebular components instead.
4 |
--------------------------------------------------------------------------------
/src/framework/bootstrap/styles/_layout.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../../theme/styles/globals' as *;
8 |
9 | @mixin nb-b-layout-theme() {
10 | @include media-breakpoint-down(is) {
11 | .row {
12 | margin-left: -10px;
13 | margin-right: -10px;
14 | }
15 | }
16 | }
17 |
--------------------------------------------------------------------------------
/src/framework/bootstrap/styles/prebuilt/components-custom-properties.scss:
--------------------------------------------------------------------------------
1 | @use '../../../theme/styles/themes';
2 | @use '../../../theme/styles/theming-variables' as *;
3 | @use '../../../theme/styles/theming' as *;
4 | @use '../globals' as *;
5 |
6 | $nb-global-styles-on-install: false;
7 |
8 | @include nb-install() {
9 | @include nb-bootstrap-global();
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/bootstrap/styles/prebuilt/corporate-custom-properties.scss:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../../../theme/styles/themes/corporate';
8 | @use '../../../theme/styles/theming' as *;
9 | @use '../globals' as *;
10 |
11 | $nb-enabled-themes: (corporate);
12 |
13 | @include nb-install();
14 |
--------------------------------------------------------------------------------
/src/framework/bootstrap/styles/prebuilt/corporate.scss:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../../../theme/styles/themes/corporate';
8 | @use '../../../theme/styles/theming' as *;
9 | @use '../globals' as *;
10 |
11 | $nb-enabled-themes: (corporate);
12 | $nb-enable-css-custom-properties: false;
13 |
14 | @include nb-install() {
15 | @include nb-bootstrap-global();
16 | }
17 |
--------------------------------------------------------------------------------
/src/framework/bootstrap/styles/prebuilt/cosmic-custom-properties.scss:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../../../theme/styles/themes/cosmic';
8 | @use '../../../theme/styles/theming' as *;
9 | @use '../globals' as *;
10 |
11 | $nb-enabled-themes: (cosmic);
12 |
13 | @include nb-install();
14 |
--------------------------------------------------------------------------------
/src/framework/bootstrap/styles/prebuilt/cosmic.scss:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../../../theme/styles/themes/cosmic';
8 | @use '../../../theme/styles/theming' as *;
9 | @use '../globals' as *;
10 |
11 | $nb-enabled-themes: (cosmic);
12 | $nb-enable-css-custom-properties: false;
13 |
14 | @include nb-install() {
15 | @include nb-bootstrap-global();
16 | }
17 |
--------------------------------------------------------------------------------
/src/framework/bootstrap/styles/prebuilt/dark-custom-properties.scss:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../../../theme/styles/themes/dark';
8 | @use '../../../theme/styles/theming' as *;
9 | @use '../globals' as *;
10 |
11 | $nb-enabled-themes: (dark);
12 |
13 | @include nb-install();
14 |
--------------------------------------------------------------------------------
/src/framework/bootstrap/styles/prebuilt/dark.scss:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../../../theme/styles/themes/dark';
8 | @use '../../../theme/styles/theming' as *;
9 | @use '../globals' as *;
10 |
11 | $nb-enabled-themes: (dark);
12 | $nb-enable-css-custom-properties: false;
13 |
14 | @include nb-install() {
15 | @include nb-bootstrap-global();
16 | }
17 |
--------------------------------------------------------------------------------
/src/framework/bootstrap/styles/prebuilt/default-custom-properties.scss:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../../../theme/styles/themes/default';
8 | @use '../../../theme/styles/theming' as *;
9 | @use '../globals' as *;
10 |
11 | $nb-enabled-themes: (default);
12 |
13 | @include nb-install();
14 |
--------------------------------------------------------------------------------
/src/framework/bootstrap/styles/prebuilt/default.scss:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../../../theme/styles/themes/default';
8 | @use '../../../theme/styles/theming' as *;
9 | @use '../globals' as *;
10 |
11 | $nb-enabled-themes: (default);
12 | $nb-enable-css-custom-properties: false;
13 |
14 | @include nb-install() {
15 | @include nb-bootstrap-global();
16 | }
17 |
--------------------------------------------------------------------------------
/src/framework/date-fns/README.md:
--------------------------------------------------------------------------------
1 | ### @nebular/date-fns module, more details https://akveo.github.io/nebular/
2 |
--------------------------------------------------------------------------------
/src/framework/date-fns/ng-package.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
3 | "dest": "../../../dist/date-fns",
4 | "lib": {
5 | "entryFile": "./public_api.ts"
6 | },
7 | "assets": [
8 | "LICENSE.txt",
9 | "**/*.{html,scss}",
10 | "schematics/collection.json",
11 | "schematics/*/schema.json",
12 | "schematics/*/files/**"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/src/framework/date-fns/public_api.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | export * from './services/date-fns-date.service';
8 | export * from './date-fns.module';
9 |
--------------------------------------------------------------------------------
/src/framework/date-fns/tsconfig.lib.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/lib",
6 | "declaration": true,
7 | "declarationMap": true,
8 | "inlineSources": true,
9 | "types": [],
10 | "lib": [
11 | "dom",
12 | "es2018"
13 | ]
14 | },
15 | "exclude": [
16 | "test.ts",
17 | "**/*.spec.ts"
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/src/framework/date-fns/tsconfig.lib.prod.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.lib.json",
4 | "compilerOptions": {
5 | "declarationMap": false,
6 | "paths": {
7 | "@nebular/theme": [
8 | "dist/theme"
9 | ]
10 | }
11 | },
12 | "angularCompilerOptions": {
13 | "compilationMode": "partial"
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/src/framework/date-fns/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/spec",
6 | "types": [
7 | "jasmine"
8 | ]
9 | },
10 | "files": [
11 | "test.ts"
12 | ],
13 | "include": [
14 | "**/*.spec.ts",
15 | "**/*.d.ts"
16 | ]
17 | }
18 |
--------------------------------------------------------------------------------
/src/framework/eva-icons/README.md:
--------------------------------------------------------------------------------
1 | ### @nebular/eva-icons module, more details https://akveo.github.io/nebular/
2 |
--------------------------------------------------------------------------------
/src/framework/eva-icons/ng-package.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
3 | "dest": "../../../dist/eva-icons",
4 | "lib": {
5 | "entryFile": "./public_api.ts"
6 | },
7 | "assets": [
8 | "LICENSE.txt",
9 | "**/*.{html,scss}",
10 | "schematics/collection.json",
11 | "schematics/*/schema.json",
12 | "schematics/*/files/**"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/src/framework/eva-icons/public_api.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | export * from './eva-icons.module';
8 |
--------------------------------------------------------------------------------
/src/framework/eva-icons/tsconfig.lib.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/lib",
6 | "declaration": true,
7 | "declarationMap": true,
8 | "inlineSources": true,
9 | "types": [],
10 | "lib": [
11 | "dom",
12 | "es2018"
13 | ]
14 | },
15 | "exclude": [
16 | "test.ts",
17 | "**/*.spec.ts"
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/src/framework/eva-icons/tsconfig.lib.prod.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.lib.json",
4 | "compilerOptions": {
5 | "declarationMap": false,
6 | "paths": {
7 | "@nebular/theme": [
8 | "dist/theme"
9 | ]
10 | }
11 | },
12 | "angularCompilerOptions": {
13 | "compilationMode": "partial"
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/src/framework/eva-icons/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/spec",
6 | "types": [
7 | "jasmine"
8 | ]
9 | },
10 | "files": [
11 | "test.ts"
12 | ],
13 | "include": [
14 | "**/*.spec.ts",
15 | "**/*.d.ts"
16 | ]
17 | }
18 |
--------------------------------------------------------------------------------
/src/framework/firebase-auth/README.md:
--------------------------------------------------------------------------------
1 | ### @nebular/firebase-auth module, more details https://akveo.github.io/nebular/
2 |
--------------------------------------------------------------------------------
/src/framework/firebase-auth/ng-package.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
3 | "dest": "../../../dist/firebase-auth",
4 | "lib": {
5 | "entryFile": "./public_api.ts"
6 | },
7 | "assets": [
8 | "LICENSE.txt",
9 | "**/*.{html,scss}",
10 | "schematics/collection.json",
11 | "schematics/*/schema.json",
12 | "schematics/*/files/**"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/src/framework/firebase-auth/tsconfig.lib.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/lib",
6 | "declaration": true,
7 | "declarationMap": true,
8 | "inlineSources": true,
9 | "types": [],
10 | "lib": [
11 | "dom",
12 | "es2018"
13 | ]
14 | },
15 | "exclude": [
16 | "test.ts",
17 | "**/*.spec.ts"
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/src/framework/firebase-auth/tsconfig.lib.prod.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.lib.json",
4 | "compilerOptions": {
5 | "declarationMap": false,
6 | "paths": {
7 | "@nebular/theme": [
8 | "dist/theme"
9 | ],
10 | "@nebular/auth": [
11 | "dist/auth"
12 | ]
13 | }
14 | },
15 | "angularCompilerOptions": {
16 | "compilationMode": "partial"
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/src/framework/firebase-auth/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/spec",
6 | "types": [
7 | "jasmine"
8 | ]
9 | },
10 | "files": [
11 | "test.ts"
12 | ],
13 | "include": [
14 | "**/*.spec.ts",
15 | "**/*.d.ts"
16 | ]
17 | }
18 |
--------------------------------------------------------------------------------
/src/framework/icons/README.md:
--------------------------------------------------------------------------------
1 | # Nebular icons - amazing icons crafted with love by Akveo team
2 |
3 | ### This package is deprecated. Please check [Eva Icons](https://akveo.github.io/eva-icons/) and new [nb-icon](https://akveo.github.io/nebular/docs/components/icon) component.
4 |
--------------------------------------------------------------------------------
/src/framework/moment/README.md:
--------------------------------------------------------------------------------
1 | ### @nebular/moment module, more details https://akveo.github.io/nebular/
2 |
--------------------------------------------------------------------------------
/src/framework/moment/moment.module.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { NgModule } from '@angular/core';
8 |
9 | import { NbDateService } from '@nebular/theme';
10 | import { NbMomentDateService } from './services/moment-date.service';
11 |
12 |
13 | @NgModule({
14 | providers: [{ provide: NbDateService, useClass: NbMomentDateService }],
15 | })
16 | export class NbMomentDateModule {
17 | }
18 |
--------------------------------------------------------------------------------
/src/framework/moment/ng-package.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
3 | "dest": "../../../dist/moment",
4 | "lib": {
5 | "entryFile": "./public_api.ts"
6 | },
7 | "assets": [
8 | "LICENSE.txt",
9 | "**/*.{html,scss}",
10 | "schematics/collection.json",
11 | "schematics/*/schema.json",
12 | "schematics/*/files/**"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/src/framework/moment/public_api.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | export * from './services/moment-date.service';
8 | export * from './moment.module';
9 |
--------------------------------------------------------------------------------
/src/framework/moment/tsconfig.lib.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/lib",
6 | "declaration": true,
7 | "declarationMap": true,
8 | "inlineSources": true,
9 | "types": [],
10 | "lib": [
11 | "dom",
12 | "es2018"
13 | ]
14 | },
15 | "exclude": [
16 | "test.ts",
17 | "**/*.spec.ts"
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/src/framework/moment/tsconfig.lib.prod.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.lib.json",
4 | "compilerOptions": {
5 | "declarationMap": false,
6 | "paths": {
7 | "@nebular/theme": [
8 | "dist/theme"
9 | ]
10 | }
11 | },
12 | "angularCompilerOptions": {
13 | "compilationMode": "partial"
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/src/framework/moment/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/spec",
6 | "types": [
7 | "jasmine"
8 | ]
9 | },
10 | "files": [
11 | "test.ts"
12 | ],
13 | "include": [
14 | "**/*.spec.ts",
15 | "**/*.d.ts"
16 | ]
17 | }
18 |
--------------------------------------------------------------------------------
/src/framework/security/README.md:
--------------------------------------------------------------------------------
1 | ### @nebular/security module, more details https://akveo.github.io/nebular/
2 |
--------------------------------------------------------------------------------
/src/framework/security/ng-package.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
3 | "dest": "../../../dist/security",
4 | "lib": {
5 | "entryFile": "./public_api.ts"
6 | },
7 | "assets": [
8 | "LICENSE.txt",
9 | "**/*.{html,scss}",
10 | "schematics/collection.json",
11 | "schematics/*/schema.json",
12 | "schematics/*/files/**"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/src/framework/security/public_api.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 | export * from './security.options';
7 | export * from './security.module';
8 | export * from './services/acl.service';
9 | export * from './services/access-checker.service';
10 | export * from './services/role.provider';
11 | export * from './directives/is-granted.directive';
12 |
--------------------------------------------------------------------------------
/src/framework/security/security.options.ts:
--------------------------------------------------------------------------------
1 | import { InjectionToken } from '@angular/core';
2 |
3 | export interface NbAclRole {
4 | parent?: string,
5 | [permission: string]: string|string[]|undefined,
6 | }
7 |
8 | export interface NbAccessControl {
9 | [role: string]: NbAclRole,
10 | }
11 |
12 | export interface NbAclOptions {
13 | accessControl?: NbAccessControl,
14 | }
15 |
16 | export const NB_SECURITY_OPTIONS_TOKEN = new InjectionToken<NbAclOptions>('Nebular Security Options');
17 |
--------------------------------------------------------------------------------
/src/framework/security/services/role.provider.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 | import { Observable } from 'rxjs';
7 |
8 | export abstract class NbRoleProvider {
9 |
10 | /**
11 | * Returns current user role
12 | * @returns {Observable<string | string[]>}
13 | */
14 | abstract getRole(): Observable<string|string[]>;
15 | }
16 |
--------------------------------------------------------------------------------
/src/framework/security/tsconfig.lib.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/lib",
6 | "declaration": true,
7 | "declarationMap": true,
8 | "inlineSources": true,
9 | "types": [],
10 | "lib": [
11 | "dom",
12 | "es2018"
13 | ]
14 | },
15 | "exclude": [
16 | "test.ts",
17 | "**/*.spec.ts"
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/src/framework/security/tsconfig.lib.prod.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.lib.json",
4 | "compilerOptions": {
5 | "declarationMap": false
6 | },
7 | "angularCompilerOptions": {
8 | "compilationMode": "partial"
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/security/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/spec",
6 | "types": [
7 | "jasmine"
8 | ]
9 | },
10 | "files": [
11 | "test.ts"
12 | ],
13 | "include": [
14 | "**/*.spec.ts",
15 | "**/*.d.ts"
16 | ]
17 | }
18 |
--------------------------------------------------------------------------------
/src/framework/theme/README.md:
--------------------------------------------------------------------------------
1 | ### @nebular/theme module, more details https://akveo.github.io/nebular/
2 |
--------------------------------------------------------------------------------
/src/framework/theme/components/accordion/accordion-item-header.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | display: flex;
9 | align-items: center;
10 | cursor: pointer;
11 |
12 | &:focus {
13 | outline: 0;
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/src/framework/theme/components/accordion/accordion-item.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | display: flex;
9 | flex-direction: column;
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/theme/components/actions/actions.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | display: flex;
9 | align-items: center;
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/theme/components/autocomplete/autocomplete.component.html:
--------------------------------------------------------------------------------
1 | <nb-option-list *nbPortal
2 | [size]="size"
3 | [position]="overlayPosition"
4 | [style.width.px]="optionsWidth"
5 | role="listbox"
6 | [id]="id"
7 | [class.empty]="!options?.length"
8 | [ngClass]="optionsListClass">
9 | <ng-content select="nb-option, nb-option-group"></ng-content>
10 | </nb-option-list>
11 |
--------------------------------------------------------------------------------
/src/framework/theme/components/autocomplete/autocomplete.component.scss:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host(:hover) {
8 | cursor: pointer;
9 | }
10 |
11 | nb-option-list.empty {
12 | border: none;
13 | }
14 |
--------------------------------------------------------------------------------
/src/framework/theme/components/badge/badge.module.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { NgModule } from '@angular/core';
8 | import { NbBadgeComponent } from './badge.component';
9 |
10 | @NgModule({
11 | exports: [ NbBadgeComponent ],
12 | declarations: [ NbBadgeComponent ],
13 | })
14 | export class NbBadgeModule { }
15 |
--------------------------------------------------------------------------------
/src/framework/theme/components/button-group/_button-toggle.component.theme.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @mixin nb-buttons-toggle-theme() {
8 | [nbButtonToggle] {
9 | @extend [nbButton];
10 | }
11 | }
12 |
13 |
--------------------------------------------------------------------------------
/src/framework/theme/components/button-group/button-group-injection-tokens.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { InjectionToken } from '@angular/core';
8 | import { NbButtonGroupComponent } from './button-group.component';
9 |
10 | export const NB_BUTTON_GROUP = new InjectionToken<NbButtonGroupComponent>('NB_BUTTON_GROUP');
11 |
--------------------------------------------------------------------------------
/src/framework/theme/components/calendar-kit/components/calendar-actions/calendar-actions.component.scss:
--------------------------------------------------------------------------------
1 | @use '../../../../styles/theming' as *;
2 |
3 | :host {
4 | display: flex;
5 | justify-content: space-between;
6 |
7 | .apply-text-button {
8 | @include nb-ltr(margin-left, auto);
9 | @include nb-rtl(margin-right, auto);
10 | }
11 | }
12 |
--------------------------------------------------------------------------------
/src/framework/theme/components/calendar-kit/components/calendar-day-picker/calendar-day-picker.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: flex;
3 | }
4 |
5 | .days-container {
6 | width: 100%;
7 | }
8 |
--------------------------------------------------------------------------------
/src/framework/theme/components/calendar-kit/components/calendar-days-names/calendar-days-names.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | display: flex;
9 | justify-content: space-between;
10 |
11 | .day {
12 | display: flex;
13 | align-items: center;
14 | justify-content: center;
15 | }
16 | }
17 |
--------------------------------------------------------------------------------
/src/framework/theme/components/calendar-kit/components/calendar-navigation/calendar-pageable-navigation.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | display: flex;
9 | align-items: center;
10 | justify-content: flex-start;
11 | }
12 |
--------------------------------------------------------------------------------
/src/framework/theme/components/calendar-kit/components/calendar-week-number/calendar-week-number.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | display: flex; // prevents margin collapsing
9 | flex-direction: column;
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/theme/components/calendar/base-calendar-range-cell.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { NbCalendarRange } from './calendar-range.component';
8 |
9 | export abstract class NbBaseCalendarRangeCell<D> {
10 | abstract selectedValue: NbCalendarRange<D>;
11 |
12 | get hasRange(): boolean {
13 | return !!(this.selectedValue && this.selectedValue.start && this.selectedValue.end);
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/src/framework/theme/components/card/card.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | display: flex;
9 | flex-direction: column;
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/theme/components/card/flip-card/_flip-card.component.theme.scss:
--------------------------------------------------------------------------------
1 | @use '../../../styles/theming' as *;
2 |
3 | @mixin nd-flip-card-theme {
4 | .flip-button {
5 | line-height: nb-theme(card-text-line-height);
6 | margin-bottom: nb-theme(card-margin-bottom);
7 | padding: nb-theme(card-padding);
8 | }
9 |
10 | .flipcard-body .front-container {
11 | @include nb-ltr(margin-right, -100%);
12 | @include nb-rtl(margin-left, -100%);
13 | }
14 | }
15 |
--------------------------------------------------------------------------------
/src/framework/theme/components/card/reveal-card/_reveal-card.component.theme.scss:
--------------------------------------------------------------------------------
1 | @use '../../../styles/theming' as *;
2 |
3 | @mixin nd-reveal-card-theme {
4 | nb-reveal-card {
5 | box-shadow: nb-theme(card-shadow);
6 | margin-bottom: nb-theme(card-margin-bottom);
7 | }
8 |
9 | .second-card-container {
10 | height: 100%;
11 | border-radius: nb-theme(card-border-radius);
12 | }
13 |
14 | .reveal-button {
15 | line-height: nb-theme(card-text-line-height);
16 | padding: nb-theme(card-padding);
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/src/framework/theme/components/cdk/a11y/focus-key-manager.ts:
--------------------------------------------------------------------------------
1 | import { QueryList } from '@angular/core';
2 | import { FocusableOption, FocusKeyManager } from '@angular/cdk/a11y';
3 |
4 | export type NbFocusableOption = FocusableOption;
5 | export class NbFocusKeyManager<T> extends FocusKeyManager<T> {}
6 |
7 | export class NbFocusKeyManagerFactoryService<T extends NbFocusableOption> {
8 | create(items: QueryList<T> | T[]): NbFocusKeyManager<T> {
9 | return new NbFocusKeyManager<T>(items);
10 | }
11 | }
12 |
--------------------------------------------------------------------------------
/src/framework/theme/components/cdk/bidi/bidi-service.ts:
--------------------------------------------------------------------------------
1 | import { Injectable } from '@angular/core';
2 | import { Directionality } from '@angular/cdk/bidi';
3 |
4 | @Injectable()
5 | export class NbDirectionality extends Directionality {}
6 |
--------------------------------------------------------------------------------
/src/framework/theme/components/cdk/bidi/bidi.module.ts:
--------------------------------------------------------------------------------
1 | import { NgModule } from '@angular/core';
2 | import { BidiModule, Directionality } from '@angular/cdk/bidi';
3 | import { NbDirectionality } from './bidi-service';
4 |
5 | @NgModule({
6 | providers: [
7 | { provide: NbDirectionality, useExisting: Directionality },
8 | ],
9 | })
10 | export class NbBidiModule extends BidiModule {}
11 |
--------------------------------------------------------------------------------
/src/framework/theme/components/cdk/collections/collection-viewer.ts:
--------------------------------------------------------------------------------
1 | import { CollectionViewer, ListRange } from '@angular/cdk/collections';
2 | import { Observable } from 'rxjs';
3 |
4 | export interface NbCollectionViewer extends CollectionViewer {
5 | viewChange: Observable<ListRange>;
6 | }
7 |
--------------------------------------------------------------------------------
/src/framework/theme/components/cdk/keycodes/keycodes.ts:
--------------------------------------------------------------------------------
1 | export * from '@angular/cdk/keycodes';
2 |
--------------------------------------------------------------------------------
/src/framework/theme/components/cdk/platform/platform-service.ts:
--------------------------------------------------------------------------------
1 | import { Platform } from '@angular/cdk/platform';
2 | import { Injectable } from '@angular/core';
3 |
4 | @Injectable({
5 | providedIn: 'root',
6 | useClass: Platform,
7 | })
8 | export class NbPlatform extends Platform {}
9 |
--------------------------------------------------------------------------------
/src/framework/theme/components/cdk/table/data-source.ts:
--------------------------------------------------------------------------------
1 | import { DataSource } from '@angular/cdk/table';
2 |
3 | export abstract class NbDataSource<T> extends DataSource<T> {}
4 |
--------------------------------------------------------------------------------
/src/framework/theme/components/chat/chat-title.directive.ts:
--------------------------------------------------------------------------------
1 | import { Directive, Input, TemplateRef } from '@angular/core';
2 |
3 | @Directive({
4 | selector: `[nbChatTitle]`,
5 | standalone: false
6 | })
7 | export class NbChatTitleDirective {
8 | @Input() context: Object = {};
9 |
10 | constructor(public templateRef: TemplateRef<any>) {}
11 | }
12 |
--------------------------------------------------------------------------------
/src/framework/theme/components/chat/chat.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | display: flex;
9 | flex-direction: column;
10 | position: relative;
11 | height: 100%;
12 | }
13 |
--------------------------------------------------------------------------------
/src/framework/theme/components/chat/chat.options.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | export class NbChatOptions {
8 | messageGoogleMapKey?: string;
9 | }
10 |
--------------------------------------------------------------------------------
/src/framework/theme/components/checkbox/checkbox.component.scss:
--------------------------------------------------------------------------------
1 | @use '../../styles/theming' as *;
2 |
3 | :host {
4 | .label {
5 | position: relative;
6 | display: inline-flex;
7 | align-items: center;
8 | margin: 0;
9 | min-height: inherit;
10 | }
11 |
12 | .custom-checkbox {
13 | flex-shrink: 0;
14 | }
15 | }
16 |
17 | :host(.nb-transition) {
18 | .custom-checkbox {
19 | @include nb-component-animation(background-color, border, box-shadow);
20 | }
21 | .text {
22 | @include nb-component-animation(color);
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/src/framework/theme/components/component-shape.ts:
--------------------------------------------------------------------------------
1 | export type NbComponentShape = 'rectangle' | 'semi-round' | 'round';
2 |
--------------------------------------------------------------------------------
/src/framework/theme/components/component-size.ts:
--------------------------------------------------------------------------------
1 | export type NbComponentSize = 'tiny' | 'small' | 'medium' | 'large' | 'giant';
2 |
--------------------------------------------------------------------------------
/src/framework/theme/components/component-status.ts:
--------------------------------------------------------------------------------
1 | export type NbComponentStatus = 'basic' | 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'control';
2 | export type NbComponentOrCustomStatus = NbComponentStatus | string;
3 |
--------------------------------------------------------------------------------
/src/framework/theme/components/form-field/form-field.component.html:
--------------------------------------------------------------------------------
1 | <div *ngIf="shouldShowPrefix()" [ngClass]="prefixClasses$ | async">
2 | <ng-content select="[nbPrefix]"></ng-content>
3 | </div>
4 |
5 | <div class="nb-form-control-container"
6 | [class.nb-form-field-control-with-prefix]="shouldShowPrefix()"
7 | [class.nb-form-field-control-with-suffix]="shouldShowSuffix()">
8 | <ng-content></ng-content>
9 | </div>
10 |
11 | <div *ngIf="shouldShowSuffix()" [ngClass]="suffixClasses$ | async">
12 | <ng-content select="[nbSuffix]"></ng-content>
13 | </div>
14 |
--------------------------------------------------------------------------------
/src/framework/theme/components/form-field/form-field.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | display: flex;
9 | align-items: center;
10 | &[hidden] {
11 | display: none;
12 | }
13 | }
14 |
15 | .nb-form-control-container {
16 | width: 100%;
17 | }
18 |
--------------------------------------------------------------------------------
/src/framework/theme/components/form-field/prefix.directive.ts:
--------------------------------------------------------------------------------
1 | import { Directive } from '@angular/core';
2 |
3 | @Directive({
4 | selector: '[nbPrefix]',
5 | standalone: false
6 | })
7 | export class NbPrefixDirective {
8 | }
9 |
--------------------------------------------------------------------------------
/src/framework/theme/components/form-field/suffix.directive.ts:
--------------------------------------------------------------------------------
1 | import { Directive } from '@angular/core';
2 |
3 | @Directive({
4 | selector: '[nbSuffix]',
5 | standalone: false
6 | })
7 | export class NbSuffixDirective {
8 | }
9 |
--------------------------------------------------------------------------------
/src/framework/theme/components/icon/icon.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: inline-block;
3 | }
4 |
--------------------------------------------------------------------------------
/src/framework/theme/components/input/_input-shapes.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use '../../styles/theming' as *;
8 |
9 | @mixin input-shapes() {
10 | @each $shape in nb-get-shapes() {
11 | &.shape-#{$shape} {
12 | border-radius: nb-theme(input-#{$shape}-border-radius);
13 | }
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/src/framework/theme/components/list/list-item.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: flex;
3 | align-items: center;
4 | flex-shrink: 0;
5 | }
6 |
--------------------------------------------------------------------------------
/src/framework/theme/components/list/list.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: flex;
3 | flex-direction: column;
4 | flex: 1 1 auto;
5 | overflow: auto;
6 | }
7 |
--------------------------------------------------------------------------------
/src/framework/theme/components/list/list.module.ts:
--------------------------------------------------------------------------------
1 | import { NgModule } from '@angular/core';
2 | import { NbListComponent, NbListItemComponent } from './list.component';
3 | import { NbListPageTrackerDirective } from './list-page-tracker.directive';
4 | import { NbInfiniteListDirective } from './infinite-list.directive';
5 |
6 | const components = [
7 | NbListComponent,
8 | NbListItemComponent,
9 | NbListPageTrackerDirective,
10 | NbInfiniteListDirective,
11 | ];
12 |
13 | @NgModule({
14 | declarations: components,
15 | exports: components,
16 | })
17 | export class NbListModule {}
18 |
--------------------------------------------------------------------------------
/src/framework/theme/components/option/option-group.component.scss:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | display: block;
9 | }
10 |
11 | .option-group-title {
12 | display: block;
13 | }
14 |
--------------------------------------------------------------------------------
/src/framework/theme/components/popover/popover.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | .arrow {
9 | position: absolute;
10 | width: 0;
11 | height: 0;
12 | }
13 | }
14 |
--------------------------------------------------------------------------------
/src/framework/theme/components/progress-bar/progress-bar.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | display: block;
9 | }
10 |
11 | .progress-container {
12 | overflow: hidden;
13 | }
14 |
15 | .progress-value {
16 | height: 100%;
17 | text-align: center;
18 | overflow: hidden;
19 | }
20 |
--------------------------------------------------------------------------------
/src/framework/theme/components/route-tabset/merge-configs.pipe.ts:
--------------------------------------------------------------------------------
1 | import { Pipe, PipeTransform } from '@angular/core';
2 |
3 | @Pipe({
4 | name: 'nbMergeConfigs',
5 | standalone: false
6 | })
7 | export class NbMergeConfigsPipe implements PipeTransform {
8 | transform<Config>(...configs: Config[]): Config {
9 | return Object.assign({}, ...configs);
10 | }
11 | }
12 |
--------------------------------------------------------------------------------
/src/framework/theme/components/select/select-injection-tokens.ts:
--------------------------------------------------------------------------------
1 | import { InjectionToken } from '@angular/core';
2 |
3 | export const NB_SELECT_INJECTION_TOKEN = new InjectionToken('NB_SELECT_INJECTION_TOKEN');
4 |
--------------------------------------------------------------------------------
/src/framework/theme/components/stepper/stepper-tokens.ts:
--------------------------------------------------------------------------------
1 | import { InjectionToken } from '@angular/core';
2 |
3 | export const NB_STEPPER = new InjectionToken('Nebular Stepper Component');
4 |
--------------------------------------------------------------------------------
/src/framework/theme/components/tabset/tab-content.directive.ts:
--------------------------------------------------------------------------------
1 | import { Directive, TemplateRef } from '@angular/core';
2 |
3 | /**
4 | * Directive to wrap tab lazy content.
5 | * */
6 | @Directive({
7 | selector: '[nbTabContent]',
8 | standalone: false
9 | })
10 | export class NbTabContentDirective {
11 | constructor(public templateRef: TemplateRef<any>) {}
12 | }
13 |
--------------------------------------------------------------------------------
/src/framework/theme/components/tabset/tab-title.directive.ts:
--------------------------------------------------------------------------------
1 | import { Directive, TemplateRef } from '@angular/core';
2 |
3 | @Directive({
4 | selector: '[nbTabTitle]',
5 | standalone: false
6 | })
7 | export class NbTabTitleDirective {
8 | constructor(public templateRef: TemplateRef<any>) {}
9 | }
10 |
--------------------------------------------------------------------------------
/src/framework/theme/components/tag/_tag.component.theme.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use 'tag';
8 | @use 'tag-list';
9 | @use 'tag-input';
10 |
11 | @mixin nb-tags-theme() {
12 | @include tag.nb-tag-theme();
13 | @include tag-list.nb-tag-list-theme();
14 | @include tag-input.nb-tag-input-theme();
15 | }
16 |
--------------------------------------------------------------------------------
/src/framework/theme/components/tag/tag.component.html:
--------------------------------------------------------------------------------
1 | {{ text }}
2 | <nb-icon *ngIf="removable"
3 | (click)="_remove()"
4 | class="nb-tag-remove size-{{size}}"
5 | icon="close-outline"
6 | pack="nebular-essentials"
7 | aria-hidden="true">
8 | </nb-icon>
9 |
--------------------------------------------------------------------------------
/src/framework/theme/components/timepicker/timepicker-cell.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | width: 100%;
9 | height: 100%;
10 | display: flex;
11 | align-items: center;
12 | justify-content: center;
13 | user-select: none;
14 | }
15 |
--------------------------------------------------------------------------------
/src/framework/theme/components/toastr/model.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { NbToastrConfig } from './toastr-config';
8 |
9 | export class NbToast {
10 | title: string;
11 | message: string;
12 | config: NbToastrConfig;
13 | }
14 |
15 |
--------------------------------------------------------------------------------
/src/framework/theme/components/toastr/toast.component.html:
--------------------------------------------------------------------------------
1 | <div class="icon-container" *ngIf="hasIcon && icon">
2 | <nb-icon [config]="icon"></nb-icon>
3 | </div>
4 | <div class="content-container">
5 | <span class="title subtitle">{{ toast.title }}</span>
6 | <div class="message">{{ toast.message }}</div>
7 | </div>
8 |
--------------------------------------------------------------------------------
/src/framework/theme/components/tree-grid/tree-grid-injection-tokens.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { InjectionToken } from '@angular/core';
8 |
9 | export const NB_TREE_GRID = new InjectionToken('NB_TREE_GRID');
10 |
--------------------------------------------------------------------------------
/src/framework/theme/components/tree-grid/tree-grid.component.scss:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | :host {
8 | table-layout: fixed;
9 | border-spacing: 0;
10 | border-collapse: collapse;
11 | width: 100%;
12 | max-width: 100%;
13 | overflow: auto;
14 | }
15 |
16 |
17 | ::ng-deep .nb-tree-grid-cell,
18 | ::ng-deep .nb-tree-grid-header-cell,
19 | ::ng-deep .nb-tree-grid-footer-cell {
20 | overflow: hidden;
21 | }
22 |
--------------------------------------------------------------------------------
/src/framework/theme/components/window/windows-container.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: flex;
3 | align-items: flex-end;
4 | overflow-x: auto;
5 |
6 | ::ng-deep nb-window:not(.full-screen) {
7 | margin: 0 2rem;
8 | }
9 | }
10 |
--------------------------------------------------------------------------------
/src/framework/theme/components/window/windows-container.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, ViewContainerRef, ViewChild } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-windows-container',
5 | template: `<ng-container #viewContainerRef></ng-container>`,
6 | styleUrls: ['./windows-container.component.scss'],
7 | standalone: false
8 | })
9 | export class NbWindowsContainerComponent {
10 |
11 | // TODO static must be false as of Angular 9.0.0, issues/1514
12 | @ViewChild('viewContainerRef', { read: ViewContainerRef, static: true }) viewContainerRef: ViewContainerRef;
13 | }
14 |
--------------------------------------------------------------------------------
/src/framework/theme/ng-package.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
3 | "dest": "../../../dist/theme",
4 | "lib": {
5 | "entryFile": "./public_api.ts"
6 | },
7 | "assets": [
8 | "LICENSE.txt",
9 | "**/*.{html,scss}",
10 | "schematics/collection.json",
11 | "schematics/*/schema.json",
12 | "schematics/*/files/**"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/src/framework/theme/schematics/ng-add/register-modules/app-routing-module-content.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | export const appRoutingModuleContent = `import { NgModule } from '@angular/core';
8 |
9 | import { Routes, RouterModule } from '@angular/router';
10 |
11 | const routes: Routes = [];
12 |
13 | @NgModule({
14 | imports: [RouterModule.forRoot(routes)],
15 | exports: [RouterModule],
16 | })
17 | export class AppRoutingModule { }
18 | `;
19 |
--------------------------------------------------------------------------------
/src/framework/theme/schematics/ng-add/schema.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | export interface Schema {
8 | project: string;
9 | theme: 'default' | 'dark' | 'cosmic' | 'corporate';
10 | customization: boolean;
11 | layout: boolean;
12 | animations: boolean;
13 | }
14 |
--------------------------------------------------------------------------------
/src/framework/theme/schematics/util/index.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | export * from './package';
8 | export * from './file';
9 | export * from './project';
10 | export * from './component';
11 | export * from './ast';
12 |
--------------------------------------------------------------------------------
/src/framework/theme/services/js-themes/theme.options.ts:
--------------------------------------------------------------------------------
1 | export interface NbJSThemeOptions {
2 | name: string;
3 | base?: string;
4 | variables?: NbJSThemeVariable;
5 | }
6 |
7 | export interface NbJSThemeVariable {
8 | [key: string]: string | string[] | NbJSThemeVariable;
9 | }
10 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/_all.scss:
--------------------------------------------------------------------------------
1 | @forward 'theming';
2 | @forward 'themes';
3 | @forward 'globals';
4 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/_globals.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @forward 'global/breakpoints';
8 | @use 'global/styles';
9 | @use 'global/components';
10 | @use 'global/overrides';
11 |
12 | @mixin nb-theme-global() {
13 | @include components.nb-theme-components();
14 | @include overrides.nb-theme-overrides();
15 | }
16 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/_themes.scss:
--------------------------------------------------------------------------------
1 | @use 'themes/default';
2 | @use 'themes/dark';
3 | @use 'themes/cosmic';
4 | @use 'themes/corporate';
5 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/global/_overrides.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | @use 'normalize';
8 | @use 'tables/smart-table.theme' as smart-table;
9 | @use 'typography/typography';
10 |
11 | @mixin nb-theme-overrides() {
12 | @include typography.nb-typography();
13 | @include smart-table.nb-tables-smart-table-theme();
14 | }
15 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/global/_styles.scss:
--------------------------------------------------------------------------------
1 | .visually-hidden { /* https://snook.ca/archives/html_and_css/hiding-content-for-accessibility */
2 | position: absolute !important;
3 | height: 1px;
4 | width: 1px;
5 | overflow: hidden;
6 | clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
7 | clip: rect(1px, 1px, 1px, 1px);
8 | }
9 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/prebuilt/components-custom-properties.scss:
--------------------------------------------------------------------------------
1 | @use '../theming-variables' as *;
2 | @use '../all' as *;
3 |
4 | $nb-global-styles-on-install: false;
5 |
6 | @include nb-install() {
7 | @include nb-theme-global();
8 | }
9 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/prebuilt/corporate-custom-properties.scss:
--------------------------------------------------------------------------------
1 | @use '../all' as *;
2 |
3 | $nb-enabled-themes: (corporate);
4 |
5 | @include nb-install();
6 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/prebuilt/corporate.scss:
--------------------------------------------------------------------------------
1 | @use '../all' as *;
2 |
3 | $nb-enabled-themes: (corporate);
4 | $nb-enable-css-custom-properties: false;
5 |
6 | @include nb-install() {
7 | @include nb-theme-global();
8 | }
9 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/prebuilt/cosmic-custom-properties.scss:
--------------------------------------------------------------------------------
1 | @use '../all' as *;
2 |
3 | $nb-enabled-themes: (cosmic);
4 |
5 | @include nb-install();
6 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/prebuilt/cosmic.scss:
--------------------------------------------------------------------------------
1 | @use '../all' as *;
2 |
3 | $nb-enabled-themes: (cosmic);
4 | $nb-enable-css-custom-properties: false;
5 |
6 | @include nb-install() {
7 | @include nb-theme-global();
8 | }
9 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/prebuilt/dark-custom-properties.scss:
--------------------------------------------------------------------------------
1 | @use '../all' as *;
2 |
3 | $nb-enabled-themes: (dark);
4 |
5 | @include nb-install();
6 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/prebuilt/dark.scss:
--------------------------------------------------------------------------------
1 | @use '../all' as *;
2 |
3 | $nb-enabled-themes: (dark);
4 | $nb-enable-css-custom-properties: false;
5 |
6 | @include nb-install() {
7 | @include nb-theme-global();
8 | }
9 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/prebuilt/default-custom-properties.scss:
--------------------------------------------------------------------------------
1 | @use '../all' as *;
2 |
3 | $nb-enabled-themes: (default);
4 |
5 | @include nb-install();
6 |
--------------------------------------------------------------------------------
/src/framework/theme/styles/prebuilt/default.scss:
--------------------------------------------------------------------------------
1 | @use '../all' as *;
2 |
3 | $nb-enabled-themes: (default);
4 | $nb-enable-css-custom-properties: false;
5 |
6 | @include nb-install() {
7 | @include nb-theme-global();
8 | }
9 |
--------------------------------------------------------------------------------
/src/framework/theme/tsconfig.lib.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/lib",
6 | "declaration": true,
7 | "declarationMap": true,
8 | "inlineSources": true,
9 | "types": [],
10 | "lib": [
11 | "dom",
12 | "es2018"
13 | ]
14 | },
15 | "exclude": [
16 | "test.ts",
17 | "**/*.spec.ts",
18 | "schematics"
19 | ]
20 | }
21 |
--------------------------------------------------------------------------------
/src/framework/theme/tsconfig.lib.prod.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.lib.json",
4 | "compilerOptions": {
5 | "declarationMap": false
6 | },
7 | "angularCompilerOptions": {
8 | "compilationMode": "partial"
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/src/framework/theme/tsconfig.schematics.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "./tsconfig.schematics.json",
3 | "compilerOptions": {
4 | "types": [
5 | "jasmine"
6 | ]
7 | },
8 | "exclude": [
9 | "schematics/*/files/**/*"
10 | ]
11 | }
12 |
--------------------------------------------------------------------------------
/src/framework/theme/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "../../../tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "../../out-tsc/spec",
6 | "types": [
7 | "jasmine"
8 | ]
9 | },
10 | "files": [
11 | "test.ts"
12 | ],
13 | "include": [
14 | "**/*.spec.ts",
15 | "**/*.d.ts"
16 | ]
17 | }
18 |
--------------------------------------------------------------------------------
/src/index.html:
--------------------------------------------------------------------------------
1 | <!DOCTYPE html>
2 | <html>
3 | <head>
4 | <meta charset="utf-8" />
5 | <title>@nebular</title>
6 | <base href="/" />
7 |
8 | <meta name="viewport" content="width=device-width, initial-scale=1" />
9 | <link rel="icon" type="image/x-icon" href="favicon.ico" />
10 | </head>
11 | <body>
12 | <npg-app-root>Loading...</npg-app-root>
13 | </body>
14 | </html>
15 |
--------------------------------------------------------------------------------
/src/playground/playground.module.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { NgModule } from '@angular/core';
8 |
9 | import { PlaygroundRoutingModule } from './playground-routing.module';
10 |
11 | @NgModule({
12 | imports: [ PlaygroundRoutingModule ],
13 | })
14 | export class PlaygroundModule {}
15 |
--------------------------------------------------------------------------------
/src/playground/styles/themes.scss:
--------------------------------------------------------------------------------
1 | @forward '../../framework/theme/styles/theming';
2 | @use '../../framework/theme/styles/theming' as *;
3 | @use '../../framework/theme/styles/themes';
4 |
--------------------------------------------------------------------------------
/src/playground/with-layout/accordion/accordion-multi.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, ChangeDetectionStrategy } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-accordion-multi',
5 | templateUrl: './accordion-multi.component.html',
6 | changeDetection: ChangeDetectionStrategy.OnPush,
7 | standalone: false
8 | })
9 | export class AccordionMultiComponent {}
10 |
--------------------------------------------------------------------------------
/src/playground/with-layout/accordion/accordion-showcase.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, ChangeDetectionStrategy } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-accordion-showcase',
5 | templateUrl: './accordion-showcase.component.html',
6 | changeDetection: ChangeDetectionStrategy.OnPush,
7 | standalone: false
8 | })
9 | export class AccordionShowcaseComponent {}
10 |
--------------------------------------------------------------------------------
/src/playground/with-layout/accordion/accordion-toggle.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, ChangeDetectionStrategy, ViewChild } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-accordion-toggle',
5 | templateUrl: './accordion-toggle.component.html',
6 | changeDetection: ChangeDetectionStrategy.OnPush,
7 | host: { class: 'example-height-60' },
8 | standalone: false
9 | })
10 | export class AccordionToggleComponent {
11 |
12 | @ViewChild('item') accordion;
13 |
14 | toggle() {
15 | this.accordion.toggle();
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/src/playground/with-layout/action/action-badge.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-action-badge',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './action-badge.component.html',
13 | standalone: false
14 | })
15 | export class ActionBadgeComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/action/action-dot-mode.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-action-dot-mode',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './action-dot-mode.component.html',
13 | standalone: false
14 | })
15 | export class ActionDotModeComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/action/action-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 |
4 | <nb-actions size="medium">
5 | <nb-action icon="search-outline"></nb-action>
6 | <nb-action icon="power-outline"></nb-action>
7 | <nb-action icon="person-outline"></nb-action>
8 | <nb-action icon="home-outline"></nb-action>
9 | <nb-action [icon]="disabledIconConfig" disabled></nb-action>
10 | <nb-action>
11 | Custom Action
12 | </nb-action>
13 | </nb-actions>
14 |
15 | </nb-card-body>
16 | </nb-card>
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/action/action-sizes.component.html:
--------------------------------------------------------------------------------
1 | <nb-card *ngFor="let size of sizes">
2 | <nb-card-body>
3 |
4 | <nb-actions [size]="size">
5 | <nb-action icon="search-outline"></nb-action>
6 | <nb-action icon="power-outline"></nb-action>
7 | <nb-action icon="person-outline"></nb-action>
8 | <nb-action icon="home-outline"></nb-action>
9 | <nb-action>Some Action</nb-action>
10 | </nb-actions>
11 |
12 | </nb-card-body>
13 | </nb-card>
14 |
--------------------------------------------------------------------------------
/src/playground/with-layout/action/action-width.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 |
4 | <nb-actions size="small" fullWidth>
5 | <nb-action icon="search-outline"></nb-action>
6 | <nb-action icon="power-outline"></nb-action>
7 | </nb-actions>
8 |
9 | </nb-card-body>
10 | </nb-card>
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/action/action-width.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-action-width',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './action-width.component.html',
13 | standalone: false
14 | })
15 | export class ActionWidthComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/alert/alert-example.component.scss:
--------------------------------------------------------------------------------
1 | .control-status-example nb-alert {
2 | margin: 0;
3 | }
4 |
--------------------------------------------------------------------------------
/src/playground/with-layout/alert/alert-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body class="example-last-child-no-b-margin">
3 | <nb-alert status="success" closable>You have been successfully authenticated!</nb-alert>
4 | </nb-card-body>
5 | </nb-card>
6 |
--------------------------------------------------------------------------------
/src/playground/with-layout/alert/alert-showcase.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-card-showcase',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './alert-showcase.component.html',
13 | standalone: false
14 | })
15 | export class AlertShowcaseComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/alert/alert-sizes.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-card-sizes',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './alert-sizes.component.html',
13 | standalone: false
14 | })
15 | export class AlertSizesComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/autocomplete/autocomplete-active-first.component.html:
--------------------------------------------------------------------------------
1 | <nb-card size="small">
2 | <nb-card-body>
3 |
4 | <input
5 | [formControl]="inputFormControl"
6 | nbInput
7 | type="text"
8 | placeholder="Enter value"
9 | [nbAutocomplete]="auto" />
10 |
11 | <nb-autocomplete #auto [activeFirst]="true">
12 |
13 | <nb-option *ngFor="let option of filteredOptions$ | async" [value]="option">
14 | {{ option }}
15 | </nb-option>
16 |
17 | </nb-autocomplete>
18 |
19 | </nb-card-body>
20 | </nb-card>
21 |
--------------------------------------------------------------------------------
/src/playground/with-layout/autocomplete/autocomplete-custom-display.component.html:
--------------------------------------------------------------------------------
1 | <nb-card size="small">
2 | <nb-card-body>
3 |
4 | <input
5 | [formControl]="inputFormControl"
6 | nbInput
7 | type="text"
8 | placeholder="Enter value"
9 | [nbAutocomplete]="auto" />
10 |
11 | <nb-autocomplete #auto [handleDisplayFn]="viewHandle">
12 |
13 | <nb-option *ngFor="let option of filteredOptions$ | async" [value]="option">
14 | {{ option }}
15 | </nb-option>
16 |
17 | </nb-autocomplete>
18 |
19 | </nb-card-body>
20 | </nb-card>
21 |
--------------------------------------------------------------------------------
/src/playground/with-layout/autocomplete/autocomplete-disabled.component.scss:
--------------------------------------------------------------------------------
1 | .label {
2 | display: block;
3 | margin-bottom: 0.5rem;
4 | }
5 |
--------------------------------------------------------------------------------
/src/playground/with-layout/autocomplete/autocomplete-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card size="small">
2 | <nb-card-body>
3 |
4 | <input #autoInput
5 | nbInput
6 | type="text"
7 | (input)="onChange()"
8 | placeholder="Enter value"
9 | [nbAutocomplete]="auto" />
10 |
11 | <nb-autocomplete #auto (selectedChange)="onSelectionChange($event)">
12 |
13 | <nb-option *ngFor="let option of filteredOptions$ | async" [value]="option">
14 | {{ option }}
15 | </nb-option>
16 |
17 | </nb-autocomplete>
18 |
19 | </nb-card-body>
20 | </nb-card>
21 |
--------------------------------------------------------------------------------
/src/playground/with-layout/badge/badge-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header style="position: relative;">
3 | <nb-badge text="new" status="success" position="top right"></nb-badge>
4 | <nb-badge text="99+" status="danger" position="top left"></nb-badge>
5 | </nb-card-header>
6 | <nb-card-body>
7 | Card body.
8 | </nb-card-body>
9 | </nb-card>
10 |
--------------------------------------------------------------------------------
/src/playground/with-layout/badge/badge-showcase.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-badge-showcase',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './badge-showcase.component.html',
13 | standalone: false
14 | })
15 | export class BadgeShowcaseComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button-group/button-group-multiple.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 | <nb-button-group multiple>
4 | <button nbButtonToggle pressed>A</button>
5 | <button nbButtonToggle pressed>B</button>
6 | <button nbButtonToggle>C</button>
7 | </nb-button-group>
8 | </nb-card-body>
9 | </nb-card>
10 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button-group/button-group-multiple.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-button-group-multiple',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './button-group-multiple.component.html',
13 | standalone: false
14 | })
15 | export class ButtonGroupMultipleComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button-group/button-group-showcase.component.scss:
--------------------------------------------------------------------------------
1 | @use '../../styles/themes' as *;
2 |
3 | .text {
4 | margin: 1rem 0 0;
5 | // Set constant line height to prevent text shifting.
6 | line-height: nb-theme(text-subtitle-line-height);
7 | }
8 |
9 | .text-italic {
10 | font-style: italic;
11 | }
12 |
13 | .text-underline {
14 | text-decoration: underline;
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button-group/button-group-spacing.scss:
--------------------------------------------------------------------------------
1 | nb-button-group {
2 | margin: 0.5rem 0 1rem;
3 |
4 | &:last-child {
5 | margin-bottom: 0;
6 | }
7 | }
8 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button-group/button-group-statuses.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | templateUrl: './button-group-statuses.component.html',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | standalone: false
13 | })
14 | export class ButtonGroupStatusesComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-full-width.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header>Button Full Width</nb-card-header>
3 | <nb-card-body class="example-items-rows">
4 | <button nbButton fullWidth status="primary">Primary</button>
5 | <button nbButton fullWidth status="success">Success</button>
6 | <button nbButton fullWidth status="info">Info</button>
7 | <button nbButton fullWidth status="warning">Warning</button>
8 | <button nbButton fullWidth status="danger">Danger</button>
9 | </nb-card-body>
10 | </nb-card>
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-full-width.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-button-full-width',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './button-full-width.component.html',
13 | standalone: false
14 | })
15 | export class ButtonFullWidthComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-hero.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header>Button Hero</nb-card-header>
3 | <nb-card-body class="example-items-rows">
4 | <button nbButton hero status="primary">Primary</button>
5 | <button nbButton hero status="success">Success</button>
6 | <button nbButton hero status="info">Info</button>
7 | <button nbButton hero status="warning">Warning</button>
8 | <button nbButton hero status="danger">Danger</button>
9 | </nb-card-body>
10 | </nb-card>
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-hero.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-button-hero',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './button-hero.component.html',
13 | standalone: false
14 | })
15 | export class ButtonHeroComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-icon.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header>Button with Icon</nb-card-header>
3 | <nb-card-body class="example-items-rows">
4 | <button nbButton status="primary"><nb-icon icon="star"></nb-icon>Primary</button>
5 | <button nbButton status="success">Success<nb-icon icon="star"></nb-icon></button>
6 | <button nbButton status="danger"><nb-icon icon="star"></nb-icon></button>
7 | <button nbButton ghost status="danger"><nb-icon icon="star"></nb-icon></button>
8 | </nb-card-body>
9 | </nb-card>
10 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-icon.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-button-icon',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './button-icon.component.html',
13 | standalone: false
14 | })
15 | export class ButtonIconComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-outline.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header>Button Outline</nb-card-header>
3 | <nb-card-body class="example-items-rows">
4 | <button nbButton outline status="primary">Primary</button>
5 | <button nbButton outline status="success">Success</button>
6 | <button nbButton outline status="info">Info</button>
7 | <button nbButton outline status="warning">Warning</button>
8 | <button nbButton outline status="danger">Danger</button>
9 | </nb-card-body>
10 | </nb-card>
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-outline.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-button-outline',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './button-outline.component.html',
13 | standalone: false
14 | })
15 | export class ButtonOutlineComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-shapes.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header>Button Shapes</nb-card-header>
3 | <nb-card-body class="example-items-rows">
4 | <button nbButton shape="rectangle" status="primary">Rectangle Hero</button>
5 | <button nbButton shape="semi-round" status="info">Semi-round Outline</button>
6 | <button nbButton shape="round" size="small" status="success">Round Small</button>
7 | </nb-card-body>
8 | </nb-card>
9 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-shapes.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-button-shapes',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './button-shapes.component.html',
13 | standalone: false
14 | })
15 | export class ButtonShapesComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header>Button</nb-card-header>
3 | <nb-card-body class="example-items-rows">
4 | <button nbButton>Active</button>
5 | <button nbButton disabled>Disabled</button>
6 | </nb-card-body>
7 | </nb-card>
8 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-showcase.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-button-showcase',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './button-showcase.component.html',
13 | standalone: false
14 | })
15 | export class ButtonShowcaseComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-sizes.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header>Button Sizes</nb-card-header>
3 | <nb-card-body class="example-items-rows">
4 | <button nbButton size="tiny">tiny</button>
5 | <button nbButton size="small">small</button>
6 | <button nbButton size="medium">medium</button>
7 | <button nbButton size="large">large</button>
8 | <button nbButton size="giant">giant</button>
9 | </nb-card-body>
10 | </nb-card>
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-sizes.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-button-sizes',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './button-sizes.component.html',
13 | standalone: false
14 | })
15 | export class ButtonSizesComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/button/button-types.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header>Button Elements</nb-card-header>
3 | <nb-card-body class="example-items-rows">
4 | <button (click)="onClick()" nbButton>Button</button>
5 | <input (click)="onClick()" nbButton type="submit" value="Input Submit"/>
6 | <input (click)="onClick()" nbButton type="button" value="Input Button"/>
7 | <a (click)="onClick()" href="#" nbButton>Link</a>
8 | </nb-card-body>
9 | </nb-card>
10 |
--------------------------------------------------------------------------------
/src/playground/with-layout/card/card-accents.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-card-accents',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './card-accents.component.html',
13 | standalone: false
14 | })
15 | export class CardAccentsComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/card/card-colors.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-card-colors',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './card-colors.component.html',
13 | standalone: false
14 | })
15 | export class CardColorsComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/card/card-full.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header>Nebula</nb-card-header>
3 | <nb-card-body>
4 | A nebula is an interstellar cloud of dust, hydrogen, helium and other ionized gases.
5 | Originally, nebula was a name for any diffuse astronomical object,
6 | including galaxies beyond the Milky Way.
7 | </nb-card-body>
8 | <nb-card-footer>By Wikipedia</nb-card-footer>
9 | </nb-card>
10 |
--------------------------------------------------------------------------------
/src/playground/with-layout/card/card-full.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-card-full',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './card-full.component.html',
13 | standalone: false
14 | })
15 | export class CardFullComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/card/card-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 | A nebula is an interstellar cloud of dust, hydrogen, helium and other ionized gases.
4 | Originally, nebula was a name for any diffuse astronomical object,
5 | including galaxies beyond the Milky Way.
6 | </nb-card-body>
7 | </nb-card>
8 |
--------------------------------------------------------------------------------
/src/playground/with-layout/card/card-showcase.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-card-showcase',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './card-showcase.component.html',
13 | standalone: false
14 | })
15 | export class CardShowcaseComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/card/card-sizes-combinations.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: block;
3 | max-height: 25rem;
4 | overflow-x: hidden;
5 | overflow-y: auto;
6 | }
7 |
8 | .card-row {
9 | display: flex;
10 | margin: 0 -0.5rem;
11 | }
12 |
13 | .card-col {
14 | flex: 1 0 calc(50% - 1rem);
15 | margin: 0 0.5rem;
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/card/card-sizes-combinations.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | templateUrl: './card-sizes-combinations.component.html',
5 | styleUrls: ['./card-sizes-combinations.component.scss'],
6 | standalone: false
7 | })
8 | export class CardSizesCombinationsComponent {}
9 |
--------------------------------------------------------------------------------
/src/playground/with-layout/card/card-sizes.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-card-sizes',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './card-sizes.component.html',
13 | standalone: false
14 | })
15 | export class CardSizesComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/chat/chat-custom-message.component.scss:
--------------------------------------------------------------------------------
1 | nb-chat {
2 | width: 500px;
3 | margin: 0 auto;
4 | }
5 |
6 | img {
7 | width: 100%;
8 | height: auto;
9 | }
10 |
11 | .button-custom-message-text {
12 | margin-top: 0;
13 | }
14 |
--------------------------------------------------------------------------------
/src/playground/with-layout/chat/chat-drop.component.html:
--------------------------------------------------------------------------------
1 | <nb-chat title="Drag & Drop chat" size="medium">
2 | <nb-chat-message *ngFor="let msg of messages"
3 | [type]="msg.type"
4 | [message]="msg.text"
5 | [reply]="msg.reply"
6 | [sender]="msg.user.name"
7 | [date]="msg.date"
8 | [files]="msg.files"
9 | [avatar]="msg.user.avatar">
10 | </nb-chat-message>
11 | <nb-chat-form (send)="sendMessage($event)" [dropFiles]="true"></nb-chat-form>
12 | </nb-chat>
13 |
--------------------------------------------------------------------------------
/src/playground/with-layout/checkbox/checkbox-disabled.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body class="example-items-rows">
3 | <nb-checkbox disabled>Disabled</nb-checkbox>
4 | <nb-checkbox [checked]="true" indeterminate disabled>Indeterminate disabled</nb-checkbox>
5 | <nb-checkbox [checked]="true" disabled>Checked disabled</nb-checkbox>
6 | </nb-card-body>
7 | </nb-card>
8 |
--------------------------------------------------------------------------------
/src/playground/with-layout/checkbox/checkbox-disabled.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-checkbox-disabled',
5 | templateUrl: './checkbox-disabled.component.html',
6 | standalone: false
7 | })
8 |
9 | export class CheckboxDisabledComponent {
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/checkbox/checkbox-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 | <nb-checkbox (checkedChange)="toggle($event)">Toggle me</nb-checkbox>
4 | </nb-card-body>
5 | <nb-card-body>
6 | <label>Checked:</label> {{ checked }}
7 | </nb-card-body>
8 | </nb-card>
9 |
--------------------------------------------------------------------------------
/src/playground/with-layout/checkbox/checkbox-showcase.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-checkbox-showcase',
5 | templateUrl: './checkbox-showcase.component.html',
6 | standalone: false
7 | })
8 |
9 | export class CheckboxShowcaseComponent {
10 |
11 | checked = false;
12 |
13 | toggle(checked: boolean) {
14 | this.checked = checked;
15 | }
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/checkbox/checkbox-status.component.scss:
--------------------------------------------------------------------------------
1 | nb-card-body.example-items-rows {
2 | align-items: center;
3 | }
4 |
5 | nb-checkbox:not(:only-child) {
6 | margin-right: 1.5rem;
7 | }
8 |
--------------------------------------------------------------------------------
/src/playground/with-layout/checkbox/checkbox-status.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-checkbox-status',
5 | templateUrl: './checkbox-status.component.html',
6 | styleUrls: ['./checkbox-status.component.scss'],
7 | standalone: false
8 | })
9 | export class CheckboxStatusComponent {
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/dialog/dialog-common.scss:
--------------------------------------------------------------------------------
1 | ::ng-deep {
2 | nb-layout-column {
3 | height: 80vw;
4 | }
5 |
6 | button + button {
7 | margin-left: 1rem;
8 | }
9 |
10 | .dialog-card {
11 | margin-left: auto;
12 | margin-right: auto;
13 | width: 90%;
14 | }
15 |
16 | @media (min-width: 40rem) {
17 | .dialog-card {
18 | width: 38rem;
19 | }
20 | }
21 | }
22 |
--------------------------------------------------------------------------------
/src/playground/with-layout/flip-card/flip-card-accents.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-flip-card-accents',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './flip-card-accents.component.html',
13 | standalone: false
14 | })
15 | export class FlipCardAccentsComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/flip-card/flip-card-colors.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-flip-card-colors',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './flip-card-colors.component.html',
13 | standalone: false
14 | })
15 | export class FlipCardColorsComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/flip-card/flip-card-full.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-flip-card-full',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './flip-card-full.component.html',
13 | standalone: false
14 | })
15 | export class FlipCardFullComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/flip-card/flip-card-showcase.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-flip-card-showcase',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './flip-card-showcase.component.html',
13 | standalone: false
14 | })
15 | export class FlipCardShowcaseComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/flip-card/flip-card-sizes.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-flip-card-sizes',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './flip-card-sizes.component.html',
13 | standalone: false
14 | })
15 | export class FlipCardSizesComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/form-field/form-field-input.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | template: `
5 | <nb-card size="small">
6 | <nb-card-body>
7 |
8 | <nb-form-field>
9 | <nb-icon nbPrefix icon="at-outline" pack="eva"></nb-icon>
10 | <input type="text" nbInput>
11 | </nb-form-field>
12 |
13 | </nb-card-body>
14 | </nb-card>
15 | `,
16 | standalone: false
17 | })
18 | export class FormFieldInputComponent {
19 | }
20 |
--------------------------------------------------------------------------------
/src/playground/with-layout/icon/icon-colors.component.scss:
--------------------------------------------------------------------------------
1 | .control-status-example {
2 | padding: 0.25rem;
3 | margin: 0.25rem;
4 | }
5 |
--------------------------------------------------------------------------------
/src/playground/with-layout/icon/icon-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body class="example-items-rows">
3 | <nb-icon icon="heart-outline"></nb-icon>
4 | <nb-icon icon="star"></nb-icon>
5 | </nb-card-body>
6 | </nb-card>
7 |
--------------------------------------------------------------------------------
/src/playground/with-layout/icon/icon-showcase.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-icon-showcase',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './icon-showcase.component.html',
13 | standalone: false
14 | })
15 | export class IconShowcaseComponent {
16 |
17 | constructor() { }
18 | }
19 |
--------------------------------------------------------------------------------
/src/playground/with-layout/infinite-list/components/news-post-placeholder.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, HostBinding } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-news-post-placeholder',
5 | template: `
6 | <div class="title-placeholder"></div>
7 | <div class="text-placeholder"></div>
8 | <div class="link-placeholder"></div>
9 | `,
10 | styleUrls: ['../news-post-placeholder.component.scss'],
11 | standalone: false
12 | })
13 | export class NewsPostPlaceholderComponent {
14 | @HostBinding('attr.aria-label')
15 | label = 'Loading';
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/infinite-list/components/news-post.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, Input } from '@angular/core';
2 | import { NewsPost } from '../news.service';
3 |
4 | @Component({
5 | selector: 'nb-news-post',
6 | template: `
7 | <article>
8 | <h2 class="h5">{{post.title}}</h2>
9 | <p>{{post.text}}</p>
10 | <a [attr.href]="post.link">Read full article</a>
11 | </article>
12 | `,
13 | standalone: false
14 | })
15 | export class NewsPostComponent {
16 | @Input()
17 | post: NewsPost;
18 | }
19 |
--------------------------------------------------------------------------------
/src/playground/with-layout/infinite-list/infinite-list-scroll-modes.component.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: flex;
3 | }
4 |
5 | nb-card {
6 | flex: 1 1 45%;
7 | margin: 0 2.5%;
8 |
9 | &.own-scroll {
10 | height: 30rem;
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/src/playground/with-layout/infinite-list/infinite-news-list.component.scss:
--------------------------------------------------------------------------------
1 | ::ng-deep body {
2 | height: 30rem;
3 | }
4 |
5 | :host {
6 | display: block;
7 | margin: 0 auto;
8 | max-width: 50rem;
9 | }
10 |
11 | .nb-spinner-container {
12 | flex: 1 0 4rem;
13 | }
14 |
--------------------------------------------------------------------------------
/src/playground/with-layout/infinite-list/news-post-placeholder.component.scss:
--------------------------------------------------------------------------------
1 | @use '../../styles/themes' as *;
2 |
3 | :host {
4 | display: block;
5 | width: 100%;
6 | }
7 |
8 | .title-placeholder {
9 | height: 1.8rem;
10 | margin-bottom: 0.5rem;
11 | width: 80%;
12 | }
13 | .text-placeholder {
14 | height: 4rem;
15 | margin-bottom: 1rem;
16 | }
17 | .link-placeholder {
18 | height: 1.25rem;
19 | width: 5rem;
20 | }
21 |
22 | @include nb-install-component() {
23 | [class$='placeholder'] {
24 | background: nb-theme(background-basic-color-4);
25 | }
26 | }
27 |
--------------------------------------------------------------------------------
/src/playground/with-layout/input/input-colors.component.scss:
--------------------------------------------------------------------------------
1 | nb-card-body.example-items-col {
2 | align-items: stretch;
3 | }
4 |
--------------------------------------------------------------------------------
/src/playground/with-layout/list/fruits-list.ts:
--------------------------------------------------------------------------------
1 | export const fruits: string[] = [
2 | 'Lemons',
3 | 'Raspberries',
4 | 'Strawberries',
5 | 'Blackberries',
6 | 'Kiwis',
7 | 'Grapefruit',
8 | 'Avocado',
9 | 'Watermelon',
10 | 'Cantaloupe',
11 | 'Oranges',
12 | 'Peaches',
13 | ];
14 |
--------------------------------------------------------------------------------
/src/playground/with-layout/list/simple-list-showcase.component.scss:
--------------------------------------------------------------------------------
1 | nb-card {
2 | min-width: 10rem;
3 | max-width: 20rem;
4 | margin: 0 auto 2rem;
5 | }
6 |
--------------------------------------------------------------------------------
/src/playground/with-layout/menu/menu-autocollapse.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-menu [items]="items" autoCollapse="true">
3 | </nb-menu>
4 | </nb-card>
5 |
--------------------------------------------------------------------------------
/src/playground/with-layout/menu/menu-badge.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-menu [items]="items">
3 | </nb-menu>
4 | </nb-card>
5 |
--------------------------------------------------------------------------------
/src/playground/with-layout/menu/menu-badge.component.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | nb-card {
8 | width: 20rem;
9 | }
10 |
--------------------------------------------------------------------------------
/src/playground/with-layout/menu/menu-children.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-menu [items]="items">
3 | </nb-menu>
4 | </nb-card>
5 |
--------------------------------------------------------------------------------
/src/playground/with-layout/menu/menu-link-params.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-menu [items]="items">
3 | </nb-menu>
4 | </nb-card>
5 |
--------------------------------------------------------------------------------
/src/playground/with-layout/menu/menu-service.component.scss:
--------------------------------------------------------------------------------
1 | [nbButton] {
2 | margin-right: 1rem;
3 | margin-bottom: 1rem;
4 | }
5 | h3 {
6 | margin-top: 1rem;
7 | margin-bottom: 1rem;
8 | }
9 |
10 | .control-panel {
11 | padding: 2rem;
12 | }
13 |
--------------------------------------------------------------------------------
/src/playground/with-layout/menu/menu-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-menu [items]="items">
3 | </nb-menu>
4 | </nb-card>
5 |
--------------------------------------------------------------------------------
/src/playground/with-layout/oauth2-password/oauth2-password-login.component.scss:
--------------------------------------------------------------------------------
1 | :host nb-auth-block {
2 | margin: 0 auto;
3 | }
4 |
--------------------------------------------------------------------------------
/src/playground/with-layout/popover/popover-custom-component.component.html:
--------------------------------------------------------------------------------
1 | <button nbButton
2 | [nbPopover]="customComponent"
3 | [nbPopoverContext]="{text: 'Example context'}">
4 | Custom component
5 | </button>
6 |
--------------------------------------------------------------------------------
/src/playground/with-layout/popover/popover-dynamic.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: flex;
3 | flex-direction: column;
4 | }
5 | .margin-bottom-0 {
6 | margin-bottom: 0;
7 | }
8 | .section {
9 | margin-bottom: 2rem;
10 | }
11 | .popover-container {
12 | display: flex;
13 | justify-content: center;
14 | padding: 12rem;
15 | }
16 | button {
17 | margin-right: 1rem;
18 | margin-top: 1rem;
19 | }
20 |
21 | ::ng-deep nb-popover nb-card {
22 | box-shadow: none !important;
23 | }
24 |
--------------------------------------------------------------------------------
/src/playground/with-layout/popover/popover-modes.component.html:
--------------------------------------------------------------------------------
1 | <div class="btn-group btn-divided-group btn-outline-divided-group">
2 | <button nbButton nbPopover="Click Mode" nbPopoverTrigger="click" nbPopoverPlacement="bottom">
3 | Click Mode
4 | </button>
5 |
6 | <button nbButton nbPopover="Hint Mode" nbPopoverTrigger="hint" nbPopoverPlacement="bottom">
7 | Hint Mode
8 | </button>
9 |
10 | <button nbButton nbPopover="Hover Mode" nbPopoverTrigger="hover" nbPopoverPlacement="bottom">
11 | Hover Mode
12 | </button>
13 | </div>
14 |
--------------------------------------------------------------------------------
/src/playground/with-layout/popover/popover-noop.component.html:
--------------------------------------------------------------------------------
1 | <input placeholder="Enter your username" nbInput nbPopover="Username is already taken" nbPopoverTrigger="noop">
2 |
3 | <div>
4 | <button nbButton size="small" status="success" (click)="open()">Open Popover</button>
5 | <button nbButton size="small" status="danger" (click)="close()">Close Popover</button>
6 | </div>
7 |
--------------------------------------------------------------------------------
/src/playground/with-layout/popover/popover-showcase.component.html:
--------------------------------------------------------------------------------
1 | <button nbButton nbPopover="Hi, I'm popover!" nbPopoverPlacement="bottom">Open Popover</button>
2 |
--------------------------------------------------------------------------------
/src/playground/with-layout/popover/popover-template-ref.component.html:
--------------------------------------------------------------------------------
1 | <button nbButton
2 | [nbPopover]="template"
3 | [nbPopoverContext]="{ text: 'Example context' }"
4 | nbPopoverPlacement="right">
5 | Template Ref
6 | </button>
7 |
8 | <ng-template #template let-data>
9 | <nb-card class="popover-card">
10 | <nb-card-body>
11 | <span>Template Ref with context: {{ data.text }}</span>
12 | </nb-card-body>
13 | </nb-card>
14 | </ng-template>
15 |
--------------------------------------------------------------------------------
/src/playground/with-layout/progress-bar/progress-bar-interactive.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 | <div class="container">
4 | <nb-actions size="medium">
5 | <nb-action icon="minus-outline" (click)="setValue(value - 25)"></nb-action>
6 | </nb-actions>
7 | <nb-progress-bar [value]="value" [status]="status" [displayValue]="true"></nb-progress-bar>
8 | <nb-actions size="medium">
9 | <nb-action icon="plus-outline" (click)="setValue(value + 25)"></nb-action>
10 | </nb-actions>
11 | </div>
12 | </nb-card-body>
13 | </nb-card>
14 |
--------------------------------------------------------------------------------
/src/playground/with-layout/progress-bar/progress-bar-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 | <nb-progress-bar [value]="40"></nb-progress-bar>
4 | </nb-card-body>
5 | </nb-card>
6 |
--------------------------------------------------------------------------------
/src/playground/with-layout/progress-bar/progress-bar-showcase.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-progress-bar-showcase',
5 | templateUrl: './progress-bar-showcase.component.html',
6 | standalone: false
7 | })
8 |
9 | export class ProgressBarShowcaseComponent {
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/progress-bar/progress-bar-size.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 | <nb-progress-bar [value]="20" size="tiny">tiny</nb-progress-bar>
4 | <nb-progress-bar [value]="40" size="small">small</nb-progress-bar>
5 | <nb-progress-bar [value]="60">medium</nb-progress-bar>
6 | <nb-progress-bar [value]="80" size="large">large</nb-progress-bar>
7 | <nb-progress-bar [value]="100" size="giant">giant</nb-progress-bar>
8 | </nb-card-body>
9 | </nb-card>
10 |
--------------------------------------------------------------------------------
/src/playground/with-layout/progress-bar/progress-bar-size.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-progress-bar-size',
5 | templateUrl: './progress-bar-size.component.html',
6 | styles: [`
7 | nb-progress-bar ~ nb-progress-bar {
8 | margin-top: 1rem;
9 | }
10 | `],
11 | standalone: false
12 | })
13 |
14 | export class ProgressBarSizeComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/progress-bar/progress-bar-status.component.scss:
--------------------------------------------------------------------------------
1 | nb-progress-bar ~ nb-progress-bar {
2 | margin-top: 1rem;
3 | }
4 |
5 | .control-status-example {
6 | margin-top: 1rem;
7 | }
8 |
--------------------------------------------------------------------------------
/src/playground/with-layout/progress-bar/progress-bar-status.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-progress-bar-status',
5 | templateUrl: './progress-bar-status.component.html',
6 | styleUrls: ['./progress-bar-status.component.scss'],
7 | standalone: false
8 | })
9 |
10 | export class ProgressBarStatusComponent {
11 | }
12 |
--------------------------------------------------------------------------------
/src/playground/with-layout/progress-bar/progress-bar-value.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 | <nb-progress-bar [value]="40" status="primary" [displayValue]="true"></nb-progress-bar>
4 | <nb-progress-bar [value]="60" status="primary">Custom value</nb-progress-bar>
5 | </nb-card-body>
6 | </nb-card>
7 |
--------------------------------------------------------------------------------
/src/playground/with-layout/progress-bar/progress-bar-value.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-progress-bar-value',
5 | templateUrl: './progress-bar-value.component.html',
6 | styles: [`
7 | nb-progress-bar ~ nb-progress-bar {
8 | margin-top: 1rem;
9 | }
10 | `],
11 | standalone: false
12 | })
13 |
14 | export class ProgressBarValueComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/radio/radio-disabled.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header>Selected Option: {{ option }}</nb-card-header>
3 | <nb-card-body>
4 |
5 | <nb-radio-group [(ngModel)]="option">
6 | <nb-radio
7 | *ngFor="let option of options"
8 | [disabled]="option.disabled"
9 | [value]="option.value">
10 | {{ option.label }}
11 | </nb-radio>
12 | </nb-radio-group>
13 |
14 | </nb-card-body>
15 | </nb-card>
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/radio/radio-form.component.scss:
--------------------------------------------------------------------------------
1 | p {
2 | margin-top: 0;
3 | }
4 |
--------------------------------------------------------------------------------
/src/playground/with-layout/radio/radio-form.component.ts:
--------------------------------------------------------------------------------
1 | import { ChangeDetectionStrategy, Component } from '@angular/core';
2 | import { FormControl } from '@angular/forms';
3 |
4 | @Component({
5 | templateUrl: './radio-form.component.html',
6 | styleUrls: ['./radio-form.component.scss'],
7 | changeDetection: ChangeDetectionStrategy.OnPush,
8 | standalone: false
9 | })
10 | export class RadioFormComponent {
11 |
12 | ngModelValue = '1';
13 | formControl = new FormControl('1');
14 | }
15 |
--------------------------------------------------------------------------------
/src/playground/with-layout/radio/radio-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-header>Selected Option: {{ option }}</nb-card-header>
3 | <nb-card-body>
4 |
5 | <nb-radio-group [(ngModel)]="option">
6 | <nb-radio
7 | *ngFor="let option of options"
8 | [value]="option.value">
9 | {{ option.label }}
10 | </nb-radio>
11 | </nb-radio-group>
12 |
13 | </nb-card-body>
14 | </nb-card>
15 |
--------------------------------------------------------------------------------
/src/playground/with-layout/radio/radio-statuses-group.component.scss:
--------------------------------------------------------------------------------
1 | nb-radio-group {
2 | padding: 1rem;
3 | }
4 |
--------------------------------------------------------------------------------
/src/playground/with-layout/reveal-card/reveal-card-accents.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-reveal-card-accents',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './reveal-card-accents.component.html',
13 | standalone: false
14 | })
15 | export class RevealCardAccentsComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/reveal-card/reveal-card-colors.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-reveal-card-colors',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './reveal-card-colors.component.html',
13 | standalone: false
14 | })
15 | export class RevealCardColorsComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/reveal-card/reveal-card-full.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-reveal-card-full',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './reveal-card-full.component.html',
13 | standalone: false
14 | })
15 | export class RevealCardFullComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/reveal-card/reveal-card-showcase.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-reveal-card-showcase',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './reveal-card-showcase.component.html',
13 | standalone: false
14 | })
15 | export class RevealCardShowcaseComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/reveal-card/reveal-card-sizes.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-reveal-card-sizes',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './reveal-card-sizes.component.html',
13 | standalone: false
14 | })
15 | export class RevealCardSizesComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-clean.component.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-select-clean',
11 | templateUrl: './select-clean.component.html',
12 | standalone: false
13 | })
14 | export class SelectCleanComponent {}
15 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-disabled.component.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-select-disabled',
11 | templateUrl: './select-disabled.component.html',
12 | standalone: false
13 | })
14 | export class SelectDisabledComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-filled.component.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-select-filled',
11 | templateUrl: './select-filled.component.html',
12 | standalone: false
13 | })
14 | export class SelectFilledComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-groups.component.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-select-groups',
11 | templateUrl: './select-groups.component.html',
12 | standalone: false
13 | })
14 | export class SelectGroupsComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-hero.component.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-select-hero',
11 | templateUrl: './select-hero.component.html',
12 | standalone: false
13 | })
14 | export class SelectHeroComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-label.component.html:
--------------------------------------------------------------------------------
1 | <nb-card size="small">
2 | <nb-card-body>
3 | <nb-select placeholder="Custom label" [(selected)]="selectedItem">
4 | <nb-select-label>
5 | Selected: {{ selectedItem }}
6 | </nb-select-label>
7 |
8 | <nb-option value="1">Option 1</nb-option>
9 | <nb-option value="2">Option 2</nb-option>
10 | <nb-option value="3">Option 3</nb-option>
11 | <nb-option value="4">Option 4</nb-option>
12 | </nb-select>
13 | </nb-card-body>
14 | </nb-card>
15 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-label.component.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-select-label-showcase',
11 | templateUrl: './select-label.component.html',
12 | standalone: false
13 | })
14 | export class SelectLabelShowcaseComponent {
15 | selectedItem;
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-multiple.component.html:
--------------------------------------------------------------------------------
1 | <nb-card size="small">
2 | <nb-card-body>
3 | <nb-select multiple placeholder="Multiple Select">
4 | <nb-option value="1">Option 1</nb-option>
5 | <nb-option value="2">Option 2</nb-option>
6 | <nb-option value="3">Option 3</nb-option>
7 | <nb-option value="4">Option 4</nb-option>
8 | </nb-select>
9 | </nb-card-body>
10 | </nb-card>
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-multiple.component.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-select-multiple',
11 | templateUrl: './select-multiple.component.html',
12 | standalone: false
13 | })
14 | export class SelectMultipleComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-placeholder.component.html:
--------------------------------------------------------------------------------
1 | <nb-card size="small">
2 | <nb-card-body>
3 | <nb-select placeholder="Placeholder">
4 | <nb-option value="1">Option 1</nb-option>
5 | <nb-option value="2">Option 2</nb-option>
6 | <nb-option value="3">Option 3</nb-option>
7 | <nb-option value="4">Option 4</nb-option>
8 | </nb-select>
9 | </nb-card-body>
10 | </nb-card>
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-placeholder.component.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-select-placeholder',
11 | templateUrl: './select-placeholder.component.html',
12 | standalone: false
13 | })
14 | export class SelectPlaceholderComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-shapes.component.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-select-shapes',
11 | templateUrl: './select-shapes.component.html',
12 | standalone: false
13 | })
14 | export class SelectShapeComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card size="small">
2 | <nb-card-body>
3 | <nb-select placeholder="Select Showcase" [(selected)]="selectedItem">
4 | <nb-option value="">Option empty</nb-option>
5 | <nb-option value="0">Option 0</nb-option>
6 | <nb-option value="1">Option 1</nb-option>
7 | <nb-option value="2">Option 2</nb-option>
8 | <nb-option value="3">Option 3</nb-option>
9 | <nb-option value="4">Option 4</nb-option>
10 | </nb-select>
11 | </nb-card-body>
12 | </nb-card>
13 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-showcase.component.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-select-showcase',
11 | templateUrl: './select-showcase.component.html',
12 | standalone: false
13 | })
14 | export class SelectShowcaseComponent {
15 | selectedItem = '2';
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-sizes.component.html:
--------------------------------------------------------------------------------
1 | <nb-card size="medium">
2 | <nb-card-body class="example-items-col">
3 | <nb-select [placeholder]="size" [size]="size" *ngFor="let size of sizes">
4 | <nb-option value="1">Option 1</nb-option>
5 | <nb-option value="2">Option 2</nb-option>
6 | <nb-option value="3">Option 3</nb-option>
7 | <nb-option value="4">Option 4</nb-option>
8 | </nb-select>
9 | </nb-card-body>
10 | </nb-card>
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-status.component.ts:
--------------------------------------------------------------------------------
1 | /*
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-select-status',
11 | templateUrl: './select-status.component.html',
12 | standalone: false
13 | })
14 | export class SelectStatusComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/select/select-test.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { NbComponentSize } from '@nebular/theme';
3 |
4 | @Component({
5 | template: `
6 | <h1>Empty select height test</h1>
7 | <nb-select *ngFor="let size of sizes" [size]="size"></nb-select>
8 | `,
9 | styles: [`
10 | nb-select {
11 | display: block;
12 | }
13 | `],
14 | standalone: false
15 | })
16 | export class SelectTestComponent {
17 | sizes: NbComponentSize[] = [ 'tiny', 'small', 'medium', 'large', 'giant' ];
18 | }
19 |
--------------------------------------------------------------------------------
/src/playground/with-layout/spinner/spinner-colors.component.scss:
--------------------------------------------------------------------------------
1 | @use '../../styles/themes' as *;
2 |
3 | .control-status-example {
4 | color: nb-theme(color-basic-100);
5 | }
6 |
--------------------------------------------------------------------------------
/src/playground/with-layout/spinner/spinner-sizes.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-spinner-sizes',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './spinner-sizes.component.html',
13 | standalone: false
14 | })
15 | export class SpinnerSizesComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/stepper/stepper-disabled-step-nav.component.scss:
--------------------------------------------------------------------------------
1 | .prev-button {
2 | margin-right: 1rem;
3 | }
4 |
--------------------------------------------------------------------------------
/src/playground/with-layout/stepper/stepper-linear.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-stepper-linear',
5 | styleUrls: ['stepper-playground.component.scss'],
6 | templateUrl: './stepper-linear.component.html',
7 | standalone: false
8 | })
9 | export class StepperLinearComponent {
10 | linearMode = true;
11 |
12 | toggleLinearMode() {
13 | this.linearMode = !this.linearMode;
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/stepper/stepper-playground.component.scss:
--------------------------------------------------------------------------------
1 | :host ::ng-deep nb-stepper .step-content {
2 | text-align: center;
3 | button {
4 | cursor: pointer;
5 | margin: 0.5rem;
6 | }
7 | }
8 |
9 | .lorem {
10 | text-align: justify;
11 | margin-bottom: 2rem;
12 | }
13 |
14 | .input-group {
15 | padding-bottom: 1rem;
16 | }
17 |
18 | .linear-mode-button {
19 | margin-bottom: 1rem;
20 | }
21 |
--------------------------------------------------------------------------------
/src/playground/with-layout/stepper/stepper-showcase.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-stepper-showcase',
5 | styleUrls: ['stepper-playground.component.scss'],
6 | templateUrl: './stepper-showcase.component.html',
7 | standalone: false
8 | })
9 |
10 | export class StepperShowcaseComponent {
11 | }
12 |
--------------------------------------------------------------------------------
/src/playground/with-layout/stepper/stepper-step-change-event.component.scss:
--------------------------------------------------------------------------------
1 | button {
2 | margin: 0.5rem;
3 | }
4 |
--------------------------------------------------------------------------------
/src/playground/with-layout/stepper/stepper-step-change-event.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { NbStepChangeEvent } from '@nebular/theme';
3 |
4 | @Component({
5 | templateUrl: './stepper-step-change-event.component.html',
6 | styleUrls: ['./stepper-step-change-event.component.scss'],
7 | standalone: false
8 | })
9 | export class StepperStepChangeEventComponent {
10 | changeEvent: NbStepChangeEvent;
11 |
12 | handleStepChange(e: NbStepChangeEvent): void {
13 | this.changeEvent = e;
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/stepper/stepper-vertical.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-stepper-vertical',
5 | styleUrls: ['stepper-playground.component.scss'],
6 | templateUrl: './stepper-vertical.component.html',
7 | standalone: false
8 | })
9 |
10 | export class StepperVerticalComponent {
11 | }
12 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tabset/tabset-disabled.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 |
4 | <nb-tabset>
5 | <nb-tab tabTitle="Users">
6 | <p>List of <strong>users</strong>.</p>
7 | </nb-tab>
8 | <nb-tab tabTitle="Orders">
9 | <p>List of <strong>orders</strong>.</p>
10 | </nb-tab>
11 | <nb-tab tabTitle="Disabled Tab" disabled>
12 | </nb-tab>
13 | </nb-tabset>
14 |
15 | </nb-card-body>
16 | </nb-card>
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tabset/tabset-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 |
4 | <nb-tabset>
5 | <nb-tab tabTitle="Users">
6 | <p>List of <strong>users</strong>.</p>
7 | </nb-tab>
8 | <nb-tab tabTitle="Orders">
9 | <p>List of <strong>orders</strong>.</p>
10 | </nb-tab>
11 | <nb-tab tabTitle="Transactions" disabled>
12 | <p>List of <strong>transactions</strong>.</p>
13 | </nb-tab>
14 | </nb-tabset>
15 |
16 | </nb-card-body>
17 | </nb-card>
18 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tabset/tabset-template-title.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 | <nb-tabset>
4 | <nb-tab>
5 | <ng-template nbTabTitle>
6 | <span>Orders</span>
7 | </ng-template>
8 | <p>List of <strong>orders</strong>.</p>
9 | </nb-tab>
10 | <nb-tab>
11 | <span *nbTabTitle>Transactions</span>
12 | <p>List of <strong>transactions</strong>.</p>
13 | </nb-tab>
14 | </nb-tabset>
15 | </nb-card-body>
16 | </nb-card>
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tabset/tabset-width.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 |
4 | <nb-tabset fullWidth>
5 | <nb-tab tabTitle="Users">
6 | <p>List of <strong>users</strong>.</p>
7 | </nb-tab>
8 | <nb-tab tabTitle="Orders">
9 | <p>List of <strong>orders</strong>.</p>
10 | </nb-tab>
11 | </nb-tabset>
12 |
13 | </nb-card-body>
14 | </nb-card>
15 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tag/tag-appearance.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body class="example-items-col">
3 |
4 | <nb-tag-list>
5 | <nb-tag appearance="filled" *ngFor="let tree of trees" [text]="tree" status="primary"></nb-tag>
6 | </nb-tag-list>
7 |
8 | <nb-tag-list>
9 | <nb-tag appearance="outline" *ngFor="let tree of trees" [text]="tree" status="primary"></nb-tag>
10 | </nb-tag-list>
11 |
12 | </nb-card-body>
13 | </nb-card>
14 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tag/tag-appearance.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | import { trees } from './trees-list';
10 |
11 | @Component({
12 | templateUrl: './tag-appearance.component.html',
13 | changeDetection: ChangeDetectionStrategy.OnPush,
14 | standalone: false
15 | })
16 | export class TagAppearanceComponent {
17 | trees = trees;
18 | }
19 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tag/tag-input.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 |
4 | <nb-tag-list (tagRemove)="onTagRemove($event)">
5 | <nb-tag *ngFor="let tree of trees" [text]="tree" removable></nb-tag>
6 | <input type="text" nbTagInput (tagAdd)="onTagAdd($event)" fullWidth>
7 | </nb-tag-list>
8 |
9 | </nb-card-body>
10 | </nb-card>
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tag/tag-status.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | templateUrl: './tag-status.component.html',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | standalone: false
13 | })
14 | export class TagStatusComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tag/trees-list.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | export const trees = [ 'Prometheus', 'Methuselah', 'Gran Abuelo', 'Scofield Juniper', 'Panke Baobab', 'Jaya Sri Maha Bodhi' ];
8 |
--------------------------------------------------------------------------------
/src/playground/with-layout/toggle/toggle-showcase.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-toggle-showcase',
11 | template: `
12 | <nb-card>
13 | <nb-card-body>
14 | <nb-toggle></nb-toggle>
15 | </nb-card-body>
16 | </nb-card>
17 | `,
18 | standalone: false
19 | })
20 | export class ToggleShowcaseComponent {
21 | }
22 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tooltip/tooltip-colors.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 |
10 | @Component({
11 | selector: 'nb-tooltip-colors',
12 | templateUrl: './tooltip-colors.component.html',
13 | styleUrls: ['./tooltip-examples.scss'],
14 | standalone: false
15 | })
16 | export class TooltipColorsComponent {
17 | }
18 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tooltip/tooltip-examples.scss:
--------------------------------------------------------------------------------
1 | :host {
2 | display: flex;
3 | justify-content: center;
4 | align-items: center;
5 | height: 100%;
6 | }
7 |
8 | nb-card {
9 | margin: 0;
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tooltip/tooltip-placements.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 |
10 | @Component({
11 | selector: 'nb-tooltip-placements',
12 | templateUrl: './tooltip-placements.component.html',
13 | styleUrls: ['./tooltip-examples.scss'],
14 | standalone: false
15 | })
16 | export class TooltipPlacementsComponent {
17 | }
18 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tooltip/tooltip-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 | <button nbTooltip="This is a tooltip" nbTooltipStatus="primary" nbButton status="primary">Show Tooltip</button>
4 | </nb-card-body>
5 | </nb-card>
6 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tooltip/tooltip-showcase.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 |
10 | @Component({
11 | selector: 'nb-tooltip-showcase',
12 | templateUrl: './tooltip-showcase.component.html',
13 | styleUrls: ['./tooltip-examples.scss'],
14 | standalone: false
15 | })
16 | export class TooltipShowcaseComponent {
17 | }
18 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tooltip/tooltip-with-icon.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body class="example-items-rows">
3 | <button nbTooltip="This is a tooltip" nbTooltipIcon="home-outline" nbButton>Show Tooltip</button>
4 |
5 | <button nbTooltip nbTooltipIcon="alert-triangle-outline" nbTooltipStatus="danger" nbButton>Show Tooltip</button>
6 |
7 | <button nbTooltip [nbTooltipIcon]="{icon: 'alert-triangle-outline', pack: 'eva'}" nbTooltipStatus="danger" nbButton>
8 | Show Tooltip
9 | </button>
10 | </nb-card-body>
11 | </nb-card>
12 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tooltip/tooltip-with-icon.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 |
10 | @Component({
11 | selector: 'nb-tooltip-with-icon',
12 | templateUrl: './tooltip-with-icon.component.html',
13 | styleUrls: ['./tooltip-examples.scss'],
14 | standalone: false
15 | })
16 | export class TooltipWithIconComponent {
17 | }
18 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tree-grid/tree-grid-custom-icons.component.scss:
--------------------------------------------------------------------------------
1 | button {
2 | background: transparent;
3 | border: none;
4 | padding: 0;
5 | }
6 |
7 | .nb-column-name nb-icon {
8 | vertical-align: bottom;
9 | }
10 |
--------------------------------------------------------------------------------
/src/playground/with-layout/tree-grid/tree-grid-shared.scss:
--------------------------------------------------------------------------------
1 | ::ng-deep {
2 | body {
3 | min-height: 20rem;
4 | }
5 |
6 | .nb-tree-grid-header-cell,
7 | .nb-tree-grid-header-cell button {
8 | text-transform: capitalize;
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/with-layout/user/user-hide-captions.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-user-hide-captions',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './user-hide-captions.component.html',
13 | standalone: false
14 | })
15 | export class UserHideCaptionsComponent {
16 |
17 | }
18 |
--------------------------------------------------------------------------------
/src/playground/with-layout/user/user-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 |
4 | <nb-user size="large"
5 | name="John Doe"
6 | title="Engineer"
7 | badgeText="99+"
8 | badgeStatus="success"
9 | badgePosition="bottom right">
10 | </nb-user>
11 |
12 | </nb-card-body>
13 | </nb-card>
14 |
--------------------------------------------------------------------------------
/src/playground/with-layout/user/user-showcase.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-user-showcase',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './user-showcase.component.html',
13 | standalone: false
14 | })
15 | export class UserShowcaseComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/user/user-sizes.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { ChangeDetectionStrategy, Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-user-sizes',
11 | changeDetection: ChangeDetectionStrategy.OnPush,
12 | templateUrl: './user-sizes.component.html',
13 | standalone: false
14 | })
15 | export class UserSizesComponent {
16 | }
17 |
--------------------------------------------------------------------------------
/src/playground/with-layout/window/window-controls.component.html:
--------------------------------------------------------------------------------
1 | <nb-card>
2 | <nb-card-body>
3 | <p class="subtitle config-title">Buttons config:</p>
4 | <nb-checkbox [(checked)]="minimize">Minimize</nb-checkbox>
5 | <nb-checkbox [(checked)]="maximize">Maximize</nb-checkbox>
6 | <nb-checkbox [(checked)]="fullScreen">Full Screen</nb-checkbox>
7 | <nb-checkbox [(checked)]="close">Close</nb-checkbox>
8 |
9 | <button (click)="openWindow()" nbButton class="open-window">Open window</button>
10 | </nb-card-body>
11 | </nb-card>
12 |
--------------------------------------------------------------------------------
/src/playground/with-layout/window/window-controls.component.scss:
--------------------------------------------------------------------------------
1 | .config-title {
2 | margin-top: 0;
3 | margin-bottom: 0.25rem;
4 | }
5 |
6 | nb-checkbox {
7 | display: block;
8 | }
9 |
10 | .open-window {
11 | margin-top: 1rem;
12 | }
13 |
--------------------------------------------------------------------------------
/src/playground/with-layout/window/window.scss:
--------------------------------------------------------------------------------
1 | ::ng-deep nb-layout-column {
2 | height: 400px;
3 | }
4 |
5 | ::ng-deep .form {
6 | display: flex;
7 | flex-direction: column;
8 |
9 | .text-label {
10 | margin-top: 1.5rem;
11 | }
12 |
13 | button {
14 | margin-top: 1.5rem;
15 | }
16 | }
17 |
18 | button + button {
19 | margin-left: 2rem;
20 | }
21 |
--------------------------------------------------------------------------------
/src/playground/without-layout/auth/api-calls/wine.ts:
--------------------------------------------------------------------------------
1 | export interface Wine {
2 | id: number;
3 | name: string;
4 | region: string;
5 | year: number
6 | }
7 |
--------------------------------------------------------------------------------
/src/playground/without-layout/auth/auth.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-playground-auth',
11 | template: `
12 | <router-outlet></router-outlet>
13 | `,
14 | standalone: false
15 | })
16 | export class AuthPlaygroundComponent {
17 | }
18 |
--------------------------------------------------------------------------------
/src/playground/without-layout/context-menu/context-menu-click.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-header>
3 | <nb-user name="Nikita Poltoratsky"
4 | title="full-stack developer"
5 | [nbContextMenu]="items"
6 | nbContextMenuTag="my-context-menu">
7 | </nb-user>
8 | </nb-layout-header>
9 | <nb-layout-column class="colored-column-basic">Hello World!</nb-layout-column>
10 | </nb-layout>
11 |
12 |
--------------------------------------------------------------------------------
/src/playground/without-layout/context-menu/context-menu-modes.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-column>
3 | <button nbButton [nbContextMenu]="items" nbContextMenuTrigger="click">
4 | Click Mode
5 | </button>
6 |
7 | <button nbButton [nbContextMenu]="items" nbContextMenuTrigger="focus">
8 | Focus (Tab) Mode
9 | </button>
10 |
11 | <button nbButton [nbContextMenu]="items" nbContextMenuTrigger="hover">
12 | Hover Mode
13 | </button>
14 | </nb-layout-column>
15 | </nb-layout>
16 |
--------------------------------------------------------------------------------
/src/playground/without-layout/context-menu/context-menu-noop.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-column>
3 | <button class="menu-target" nbButton [nbContextMenu]="items" nbContextMenuTrigger="noop">Menu Target</button>
4 |
5 | <div>
6 | <button nbButton size="small" status="success" (click)="open()">Open Context Menu</button>
7 | <button nbButton size="small" status="danger" (click)="close()">Close Context Menu</button>
8 | </div>
9 | </nb-layout-column>
10 | </nb-layout>
11 |
--------------------------------------------------------------------------------
/src/playground/without-layout/context-menu/context-menu-right-click.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-column class="colored-column-basic">
3 | <button class="menu-target"
4 | nbButton
5 | [nbContextMenu]="items"
6 | nbContextMenuTrigger="noop"
7 | (contextmenu)="open()">
8 | Right Click
9 | </button>
10 | </nb-layout-column>
11 | </nb-layout>
12 |
--------------------------------------------------------------------------------
/src/playground/without-layout/context-menu/context-menu-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-header>
3 | <button outline nbButton [nbContextMenu]="items">
4 | Show Menu
5 | </button>
6 | </nb-layout-header>
7 | <nb-layout-column class="colored-column-basic">Hello World!</nb-layout-column>
8 | </nb-layout>
9 |
10 |
--------------------------------------------------------------------------------
/src/playground/without-layout/context-menu/context-menu-showcase.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-context-menu-showcase',
5 | templateUrl: './context-menu-showcase.component.html',
6 | styles: [`
7 | :host nb-layout-header ::ng-deep nav {
8 | justify-content: flex-end;
9 | }
10 | `],
11 | standalone: false
12 | })
13 |
14 | export class ContextMenuShowcaseComponent {
15 | items = [
16 | { title: 'Profile' },
17 | { title: 'Logout' },
18 | ];
19 | }
20 |
--------------------------------------------------------------------------------
/src/playground/without-layout/firebase/firebase-api.service.ts:
--------------------------------------------------------------------------------
1 | import { Injectable } from '@angular/core';
2 | import { AngularFireDatabase } from '@angular/fire/compat/database';
3 |
4 | @Injectable()
5 | export class FirebaseAPIService {
6 | constructor(private db: AngularFireDatabase) {}
7 |
8 | getGreeting() {
9 | return this.db.object('/greeting/').valueChanges();
10 | }
11 | }
12 |
--------------------------------------------------------------------------------
/src/playground/without-layout/firebase/firebase-playground.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { Component } from '@angular/core';
8 |
9 | @Component({
10 | selector: 'nb-firebase-playground',
11 | template: `
12 | <router-outlet></router-outlet>
13 | `,
14 | standalone: false
15 | })
16 | export class FirebasePlaygroundComponent {
17 | }
18 |
--------------------------------------------------------------------------------
/src/playground/without-layout/firebase/identity-proders-auth-showcase/identity-providers-auth-showcase.component.scss:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/src/playground/without-layout/firebase/identity-proders-auth-showcase/identity-providers-auth-showcase.component.scss
--------------------------------------------------------------------------------
/src/playground/without-layout/firebase/password-auth-showcase/password-auth-showcase.component.scss:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akveo/nebular/192a0de5b100a3f37880464ac7872ebbb749d008/src/playground/without-layout/firebase/password-auth-showcase/password-auth-showcase.component.scss
--------------------------------------------------------------------------------
/src/playground/without-layout/layout/layout-column-left.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-column class="colored-column-warning">Second</nb-layout-column>
3 | <nb-layout-column class="colored-column-info">Third</nb-layout-column>
4 | <nb-layout-column left class="colored-column-success">First (but third in template)</nb-layout-column>
5 | </nb-layout>
6 |
--------------------------------------------------------------------------------
/src/playground/without-layout/layout/layout-column-left.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-layout-column-left',
5 | templateUrl: './layout-column-left.component.html',
6 | standalone: false
7 | })
8 |
9 | export class LayoutColumnLeftComponent {
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/without-layout/layout/layout-fixed-header.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-header fixed>Awesome Company</nb-layout-header>
3 | <nb-layout-column class="colored-column-basic">Hello World!</nb-layout-column>
4 | </nb-layout>
5 |
--------------------------------------------------------------------------------
/src/playground/without-layout/layout/layout-fixed-header.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-layout-fixed-header',
5 | templateUrl: './layout-fixed-header.component.html',
6 | standalone: false
7 | })
8 |
9 | export class LayoutFixedHeaderComponent {
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/without-layout/layout/layout-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-header>Awesome Company</nb-layout-header>
3 | <nb-layout-column class="colored-column-warning">Left column</nb-layout-column>
4 | <nb-layout-column class="colored-column-danger">Right column</nb-layout-column>
5 | </nb-layout>
6 |
--------------------------------------------------------------------------------
/src/playground/without-layout/layout/layout-showcase.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-layout-showcase',
5 | templateUrl: './layout-showcase.component.html',
6 | standalone: false
7 | })
8 |
9 | export class LayoutShowcaseComponent {
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/without-layout/layout/layout-sidebar-subheader.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 |
3 | <nb-layout-header subheader>
4 | <a href="#" (click)="toggle()"><i class="nb-menu"></i></a>
5 | </nb-layout-header>
6 |
7 | <nb-sidebar></nb-sidebar>
8 |
9 | <nb-layout-column class="colored-column-basic">Layout Content</nb-layout-column>
10 | </nb-layout>
11 |
--------------------------------------------------------------------------------
/src/playground/without-layout/layout/layout-sidebar-subheader.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { NbSidebarService } from '@nebular/theme';
3 |
4 | @Component({
5 | selector: 'nb-layout-sidebar-subheader',
6 | templateUrl: './layout-sidebar-subheader.component.html',
7 | standalone: false
8 | })
9 |
10 | export class LayoutSidebarSubheaderComponent {
11 |
12 | constructor(private sidebarService: NbSidebarService) {
13 | }
14 |
15 | toggle() {
16 | this.sidebarService.toggle(true);
17 | return false;
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/src/playground/without-layout/layout/layout-subheader.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { NbSidebarService } from '@nebular/theme';
3 |
4 | @Component({
5 | selector: 'nb-layout-subheader',
6 | templateUrl: './layout-subheader.component.html',
7 | standalone: false
8 | })
9 |
10 | export class LayoutSubheaderComponent {
11 |
12 | constructor(private sidebarService: NbSidebarService) {
13 | }
14 |
15 | toggle() {
16 | this.sidebarService.toggle(true);
17 | return false;
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/src/playground/without-layout/layout/layout-w-footer.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-header>Awesome Company</nb-layout-header>
3 | <nb-layout-column class="colored-column-basic">Hello World!</nb-layout-column>
4 | <nb-layout-footer>Contact us</nb-layout-footer>
5 | </nb-layout>
6 |
--------------------------------------------------------------------------------
/src/playground/without-layout/layout/layout-w-footer.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-w-footer-showcase',
5 | templateUrl: './layout-w-footer.component.html',
6 | standalone: false
7 | })
8 |
9 | export class LayoutWFooterComponent {
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/without-layout/search/search-event.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-header fixed>
3 | <nb-search type="rotate-layout"></nb-search>
4 | </nb-layout-header>
5 | <nb-sidebar>
6 | </nb-sidebar>
7 |
8 | <nb-layout-column class="colored-column-basic">
9 | <nb-card accent="info">
10 | <nb-card-header>You searched for:</nb-card-header>
11 | <nb-card-body>
12 | <h3>{{ value || '-' }}</h3>
13 | </nb-card-body>
14 | </nb-card>
15 | </nb-layout-column>
16 | </nb-layout>
17 |
--------------------------------------------------------------------------------
/src/playground/without-layout/search/search-event.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { NbSearchService } from '@nebular/theme';
3 |
4 | @Component({
5 | selector: 'nb-search-event',
6 | templateUrl: './search-event.component.html',
7 | standalone: false
8 | })
9 | export class SearchEventComponent {
10 |
11 | value = '';
12 |
13 | constructor(private searchService: NbSearchService) {
14 |
15 | this.searchService.onSearchSubmit()
16 | .subscribe((data: any) => {
17 | this.value = data.term;
18 | })
19 |
20 | }
21 | }
22 |
--------------------------------------------------------------------------------
/src/playground/without-layout/search/search-showcase.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-search-showcase',
5 | templateUrl: './search-showcase.component.html',
6 | standalone: false
7 | })
8 | export class SearchShowcaseComponent {
9 | }
10 |
--------------------------------------------------------------------------------
/src/playground/without-layout/sidebar/sidebar-compacted.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-sidebar state="compacted"></nb-sidebar>
3 |
4 | <nb-layout-column class="colored-column-primary">Layout Content</nb-layout-column>
5 | </nb-layout>
6 |
--------------------------------------------------------------------------------
/src/playground/without-layout/sidebar/sidebar-compacted.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-sidebar-compacted',
5 | templateUrl: './sidebar-compacted.component.html',
6 | standalone: false
7 | })
8 |
9 | export class SidebarCompactedComponent {
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/without-layout/sidebar/sidebar-fixed.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-header fixed>
3 | <button nbButton status="success" size="tiny" (click)="toggle()">Toggle</button>
4 | </nb-layout-header>
5 | <nb-sidebar fixed></nb-sidebar>
6 |
7 | <nb-layout-column class="colored-column-info">Long layout content so that it is clear that fixed sidebar is shown on top of the content.</nb-layout-column>
8 | </nb-layout>
9 |
--------------------------------------------------------------------------------
/src/playground/without-layout/sidebar/sidebar-fixed.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { NbSidebarService } from '@nebular/theme';
3 |
4 | @Component({
5 | selector: 'nb-sidebar-fixed',
6 | templateUrl: './sidebar-fixed.component.html',
7 | standalone: false
8 | })
9 |
10 | export class SidebarFixedComponent {
11 |
12 | constructor(private sidebarService: NbSidebarService) {
13 | }
14 |
15 | toggle() {
16 | this.sidebarService.toggle();
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/src/playground/without-layout/sidebar/sidebar-right.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-sidebar right>Right Sidebar</nb-sidebar>
3 |
4 | <nb-layout-column class="colored-column-warning">Layout Content</nb-layout-column>
5 | </nb-layout>
6 |
--------------------------------------------------------------------------------
/src/playground/without-layout/sidebar/sidebar-right.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-sidebar-right',
5 | templateUrl: './sidebar-right.component.html',
6 | standalone: false
7 | })
8 |
9 | export class SidebarRightComponent {
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/without-layout/sidebar/sidebar-showcase.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-sidebar>Sidebar Content</nb-sidebar>
3 |
4 | <nb-layout-column class="colored-column-success">Layout Content</nb-layout-column>
5 | </nb-layout>
6 |
--------------------------------------------------------------------------------
/src/playground/without-layout/sidebar/sidebar-showcase.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'nb-sidebar-showcase',
5 | templateUrl: './sidebar-showcase.component.html',
6 | standalone: false
7 | })
8 |
9 | export class SidebarShowcaseComponent {
10 | }
11 |
--------------------------------------------------------------------------------
/src/playground/without-layout/sidebar/sidebar-toggle.component.html:
--------------------------------------------------------------------------------
1 | <nb-layout>
2 | <nb-layout-header fixed>
3 | <button nbButton status="success" size="tiny" (click)="toggle()">Toggle</button>
4 | <button nbButton status="info" size="tiny" (click)="toggleCompact()">Toggle Compact</button>
5 | </nb-layout-header>
6 |
7 | <nb-sidebar tag="left"></nb-sidebar>
8 | <nb-sidebar right tag="right"></nb-sidebar>
9 |
10 | <nb-layout-column class="colored-column-warning">Layout Content</nb-layout-column>
11 | </nb-layout>
12 |
--------------------------------------------------------------------------------
/src/playground/without-layout/smart-home/auth/login/login.component.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 | import { Component } from '@angular/core';
7 | import { NbLoginComponent } from '@nebular/auth';
8 |
9 | @Component({
10 | selector: 'ngx-login',
11 | templateUrl: './login.component.html',
12 | standalone: false
13 | })
14 | export class LoginComponent extends NbLoginComponent {
15 | }
16 |
--------------------------------------------------------------------------------
/src/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../out-tsc/app",
5 | "types": []
6 | },
7 | "files": [
8 | "main.ts",
9 | "polyfills.ts"
10 | ],
11 | "include": [
12 | "**/*.d.ts"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/src/tsconfig.spec-wp.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "./tsconfig.spec.json",
3 | "compilerOptions": {
4 | "paths": {
5 | "@nebular/*": [
6 | "dist/*"
7 | ]
8 | }
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/src/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../out-tsc/spec",
5 | "types": [
6 | "jasmine"
7 | ]
8 | },
9 | "files": [
10 | "test.ts",
11 | "polyfills.ts"
12 | ],
13 | "include": [
14 | "**/*.spec.ts",
15 | "**/*.d.ts"
16 | ],
17 | "exclude": [
18 | "**/schematics/**/*.spec.ts"
19 | ]
20 | }
21 |
--------------------------------------------------------------------------------
/src/tsconfig.wp.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "./tsconfig.app.json",
3 | "compilerOptions": {
4 | "paths": {
5 | "@nebular/*": [
6 | "dist/*"
7 | ]
8 | }
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/tools/deploy-docs/config.ts:
--------------------------------------------------------------------------------
1 | export const REPO_URL = 'https://github.com/akveo/nebular.git';
2 | export const REPO_OWNER = 'akveo';
3 | export const REPO_NAME = 'nebular';
4 | export const OUT_DIR = 'dist/docs'; // Relative to the directory you run command
5 |
--------------------------------------------------------------------------------
/tools/deploy-docs/log.ts:
--------------------------------------------------------------------------------
1 | export function log(message: string) {
2 | console.log(message);
3 | }
4 |
--------------------------------------------------------------------------------
/tools/deploy-docs/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "rootDir": ".",
4 | "module": "commonjs",
5 | "lib": ["es2018"],
6 | "target": "es2018",
7 | "resolveJsonModule": true
8 | },
9 | "include": [
10 | "build-docs.ts"
11 | ]
12 | }
13 |
--------------------------------------------------------------------------------
/tools/dev-schematics/new-component/files/__path__/__name@dasherize__/__name@dasherize__.component.__styleext__:
--------------------------------------------------------------------------------
1 | :host {
2 | color: red;
3 | }
4 |
--------------------------------------------------------------------------------
/tools/dev-schematics/new-component/files/__path__/__name@dasherize__/__name@dasherize__.component.html:
--------------------------------------------------------------------------------
1 | <strong>Hello <%= classify(className) %>Component</strong>
2 |
--------------------------------------------------------------------------------
/tools/dev-schematics/new-component/files/__path__/__name@dasherize__/__name@dasherize__.component.theme.__styleext__:
--------------------------------------------------------------------------------
1 | @mixin <%= selector %>-theme() {
2 | <%= selector %> {
3 | font-family: nb-theme(<%= dasherize(name) %>-font-family);
4 | font-size: nb-theme(<%= dasherize(name) %>-font-size);
5 | font-weight: nb-theme(<%= dasherize(name) %>-font-weight);
6 | background: nb-theme(<%= dasherize(name) %>-bg);
7 | color: nb-theme(<%= dasherize(name) %>-fg);
8 | }
9 | }
10 |
--------------------------------------------------------------------------------
/tools/dev-schematics/playground-components/schema.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "http://json-schema.org/schema",
3 | "$id": "playground-components",
4 | "type": "object",
5 | "properties": {
6 | }
7 | }
8 |
--------------------------------------------------------------------------------
/tools/dev-schematics/playground-module/files/__path__/__featureModuleFileName__:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { NgModule } from '@angular/core';
8 | import { <%= routingModuleClassName %> } from '<%= routingModuleImportPath %>';
9 |
10 | @NgModule({
11 | declarations: [],
12 | imports: [ <%= routingModuleClassName %> ],
13 | })
14 | export class <%= featureModuleClassName %> {}
15 |
--------------------------------------------------------------------------------
/tools/dev-schematics/playground-module/files/__path__/__routingModuleFileName__:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { NgModule } from '@angular/core';
8 | import { RouterModule, Route} from '@angular/router';
9 |
10 | const routes: Route[] = [];
11 |
12 | @NgModule({
13 | imports: [ RouterModule.forChild(routes) ],
14 | exports: [ RouterModule ],
15 | })
16 | export class <%= routingModuleClassName %> {}
17 |
--------------------------------------------------------------------------------
/tools/dev-schematics/playground-module/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import { chain, Rule } from '@angular-devkit/schematics';
8 | import { generateMissingModules } from './generate-missing-modules';
9 | import { addToModules } from './add-to-modules';
10 |
11 | export function playgroundModule(): Rule {
12 | return () => chain([generateMissingModules, addToModules]);
13 | }
14 |
--------------------------------------------------------------------------------
/tools/dev-schematics/playground-module/schema.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "http://json-schema.org/schema",
3 | "$id": "playground-module",
4 | "title": "All playground components to a given module",
5 | "type": "object",
6 | "properties": {
7 | }
8 | }
9 |
--------------------------------------------------------------------------------
/tools/dev-schematics/playground/index.ts:
--------------------------------------------------------------------------------
1 | import { Rule, chain, schematic } from '@angular-devkit/schematics';
2 |
3 | export function generatePlayground(): Rule {
4 | return chain([schematic('playground-module', {}), schematic('playground-components', {})]);
5 | }
6 |
--------------------------------------------------------------------------------
/tools/dev-schematics/playground/schema.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "http://json-schema.org/schema",
3 | "$id": "playground",
4 | "type": "object"
5 | }
6 |
--------------------------------------------------------------------------------
/tools/dev-schematics/utils/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | export * from './ast';
8 | export * from './formatting';
9 | export * from './playground';
10 | export * from './path';
11 | export * from './routing';
12 | export * from './change';
13 | export * from './strings';
14 |
--------------------------------------------------------------------------------
/tools/gulp/config.ts:
--------------------------------------------------------------------------------
1 | export const SOURCE_DIR = './src/framework';
2 | export const DIST_DIR = './dist';
3 | export const DOCS_OUTPUT = './docs/output.json';
4 | export const EXTENSIONS = ['ts', 'html', 'scss'];
5 | export const DOCS_DIST = './dist/docs';
6 | export const DEV_SCHEMATICS_PATH = 'tools/dev-schematics';
7 | export const DOCS_SITE_URL = 'https://akveo.github.io/nebular/';
8 | export const SCHEMATICS_SPEC_TSCONFIG = 'tsconfig.schematics.spec.json';
9 |
--------------------------------------------------------------------------------
/tools/gulp/docs/prepare-docs.ts:
--------------------------------------------------------------------------------
1 | import { task, series } from 'gulp';
2 |
3 | import { generateOuputJson } from './output-json';
4 | import { prepareExamples } from './example';
5 |
6 | task('docs', series(generateOuputJson, prepareExamples));
7 |
--------------------------------------------------------------------------------
/tools/gulp/gulpfile.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @license
3 | * Copyright Akveo. All Rights Reserved.
4 | * Licensed under the MIT License. See License.txt in the project root for license information.
5 | */
6 |
7 | import './schematics/build-dev-schematics';
8 | import './schematics/test-packages-schematics';
9 | import './docs/prepare-docs';
10 | import './docs/copy-index';
11 | import './docs/sitemap';
12 | import './bump-versions';
13 |
--------------------------------------------------------------------------------
/tools/gulp/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "experimentalDecorators": true,
4 | "noUnusedParameters": true,
5 | "lib": [
6 | "es2017"
7 | ],
8 | "module": "commonjs",
9 | "moduleResolution": "node",
10 | "strictNullChecks": true,
11 | "target": "es2018",
12 | "typeRoots": [
13 | "node_modules/@types"
14 | ],
15 | "types": [
16 | "node"
17 | ],
18 | "baseUrl": "."
19 | },
20 | "files": [
21 | "gulpfile.ts"
22 | ]
23 | }
24 |
--------------------------------------------------------------------------------
/tools/publish.sh:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env bash
2 |
3 | # Iterates over all modules bundled in the dist/ and publish them
4 | for dir in ./dist/*/
5 | do
6 | dir=${dir%*/}
7 | npm publish --access=public dist/${dir##*/}/
8 | done
9 |
--------------------------------------------------------------------------------