@tylertech/forge 3.0.0-next.16 → 3.0.0-next.18

package/esm/badge/badge-component-delegate.js

@@ -1,15 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { BaseComponentDelegate } from '../core/delegates/base-component-delegate';
-import { BADGE_CONSTANTS } from './badge-constants';
-export class BadgeComponentDelegate extends BaseComponentDelegate {
-    constructor(config) {
-        super(config);
-    }
-    _build() {
-        return document.createElement(BADGE_CONSTANTS.elementName);
-    }
-}

package/esm/badge/badge-foundation.d.ts

@@ -1,24 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { ICustomElementFoundation } from '@tylertech/forge-core';
-import { IBadgeAdapter } from './badge-adapter';
-export interface IBadgeFoundation extends ICustomElementFoundation {
-    dot: boolean;
-    open: boolean;
-}
-export declare class BadgeFoundation implements IBadgeFoundation {
-    private _adapter;
-    private _dot;
-    private _open;
-    constructor(_adapter: IBadgeAdapter);
-    initialize(): void;
-    private _applyDot;
-    private _setOpen;
-    get dot(): boolean;
-    set dot(value: boolean);
-    get open(): boolean;
-    set open(value: boolean);
-}

package/esm/badge/badge-foundation.js

@@ -1,55 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { BADGE_CONSTANTS } from './badge-constants';
-export class BadgeFoundation {
-    constructor(_adapter) {
-        this._adapter = _adapter;
-        this._dot = false;
-        this._open = true;
-    }
-    initialize() {
-        this._applyDot();
-        this._setOpen();
-    }
-    _applyDot() {
-        if (this._dot) {
-            this._adapter.setRootClass(BADGE_CONSTANTS.classes.DOT);
-            this._adapter.setHostAttribute(BADGE_CONSTANTS.attributes.DOT);
-        }
-        else {
-            this._adapter.removeRootClass(BADGE_CONSTANTS.classes.DOT);
-            this._adapter.removeHostAttribute(BADGE_CONSTANTS.attributes.DOT);
-        }
-    }
-    _setOpen() {
-        if (this._open) {
-            this._adapter.setRootClass(BADGE_CONSTANTS.classes.OPEN);
-            this._adapter.setHostAttribute(BADGE_CONSTANTS.attributes.OPEN);
-        }
-        else {
-            this._adapter.removeRootClass(BADGE_CONSTANTS.classes.OPEN);
-            this._adapter.removeHostAttribute(BADGE_CONSTANTS.attributes.OPEN);
-        }
-    }
-    get dot() {
-        return this._dot;
-    }
-    set dot(value) {
-        if (this._dot !== value) {
-            this._dot = value;
-            this._applyDot();
-        }
-    }
-    get open() {
-        return this._open;
-    }
-    set open(value) {
-        if (this._open !== value) {
-            this._open = value;
-            this._setOpen();
-        }
-    }
-}

package/styles/avatar/_mixins.scss

@@ -1,46 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-@use '@material/animation/variables' as animation-variables;
-@use '../theme';
-@use '../typography/mixins' as typography-mixins;
-@use './variables';
-
-@mixin provide-theme($theme) {
-  @include theme.theme-properties(avatar, $theme, variables.$theme-values);
-}
-
-@mixin core-styles() {
-  .forge-avatar {
-    @include base;
-  }
-}
-
-@mixin host() {
-  display: inline-block;
-  contain: content;
-}
-
-@mixin base() {
-  @include typography-mixins.typography(title);
-  @include theme.css-custom-property(font-size, --forge-avatar-font-size, variables.$font-size);
-  @include theme.css-custom-property(font-weight, --forge-avatar-font-weight, variables.$font-weight);
-  @include theme.css-custom-property(background-color, --forge-avatar-theme-background, variables.$background);
-  @include theme.css-custom-property(height, --forge-avatar-size, variables.$size);
-  @include theme.css-custom-property(width, --forge-avatar-size, variables.$size);
-  @include theme.css-custom-property(color, --forge-avatar-theme-on-background, variables.$on-background);
-  @include theme.css-custom-property(border-radius, --forge-avatar-radius, variables.$border-radius);
-  
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  box-sizing: border-box;
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: cover;
-  overflow: hidden;
-  transition: height variables.$transition-duration animation-variables.$standard-curve-timing-function, 
-              width variables.$transition-duration animation-variables.$standard-curve-timing-function;
-}

package/styles/avatar/_variables.scss

@@ -1,16 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-$size: 40px !default;
-$font-size: 1rem !default;
-$font-weight: 400 !default;
-$background: none;
-$on-background: #ffffff !default;
-$transition-duration: 200ms !default;
-$border-radius: 50% !default;
-$theme-values: (
-  background: $background,
-  on-background: $on-background
-);

package/styles/badge/_mixins.scss

@@ -1,125 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-@use 'sass:map';
-@use '@material/elevation/elevation-theme' as mdc-elevation-theme;
-@use '@material/typography/typography' as mdc-typography;
-@use './variables';
-@use '../theme';
-
-@mixin provide-theme($theme) {
-  @include theme.theme-properties(badge, $theme, variables.$theme-values);
-}
-
-@mixin core-styles() {
-  .forge-badge {
-    @include base;
-
-    &--elevated {
-      @include elevated;
-    }
-
-    &--open {
-      @include open;
-    }
-
-    &--dot {
-      @include dot;
-    }
-  }
-}
-
-@mixin host() {
-  --forge-icon-font-size: 14px;
-
-  display: flex;
-  box-sizing: border-box;
-}
-
-@mixin host-positioned() {
-  position: absolute;
-  top: 0;
-  left: 100%;
-  transform: translateX(-1.25rem);
-}
-
-@mixin base() {
-  @include mdc-typography.typography(caption);
-  @include theme.css-custom-property(height, --forge-badge-height, variables.$height);
-  @include theme.css-custom-property(line-height, --forge-badge-line-height, variables.$line-height);
-  @include theme.css-custom-property(min-width, --forge-badge-min-width, variables.$min-width);
-  @include theme.css-custom-property(max-width, --forge-badge-max-width, variables.$max-width);
-  @include theme.css-custom-property(border, --forge-badge-border, none);
-
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-  transition: transform 200ms ease-in-out;
-  transform: scale(0);
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  pointer-events: none;
-  border-radius: 16px;
-  padding: 0 8px;
-  font-weight: 700;
-}
-
-@mixin theme-property($property, $theme, $theme-mod) {
-  $combined-theme: $theme + '-' + $theme-mod + '-' + $property;
-  $light-theme-value: map.get(variables.$theme-values, $combined-theme);
-  $dark-theme-css-custom-property: --forge-badge-theme-#{$theme}-#{$theme-mod}-#{$property};
-  @include theme.css-custom-property($property, $dark-theme-css-custom-property, $light-theme-value);
-}
-
-@mixin theme-base($theme, $theme-mod) {
-  .forge-badge {
-    @include theme-property('background', $theme, $theme-mod);
-    @include theme-property('color', $theme, $theme-mod);
-  }
-}
-
-@mixin default-theme() {
-  :host(:not([theme])),
-  :host([theme='']) {
-    @include theme-base('default', 'muted');
-  }
-  
-  :host(:not([theme])[strong]),
-  :host([theme=''][strong]) {
-    @include theme-base('default', 'strong');
-  }
-  
-  @include theme('default');
-}
-
-@mixin theme($theme: 'danger') {
-  :host([theme=#{$theme}]) {
-    @include theme-base($theme, 'muted');
-  }
-  
-  :host([theme=#{$theme}][strong]) {
-    @include theme-base($theme, 'strong');
-  }
-}
-
-@mixin static() {
-  position: static;
-}
-
-@mixin elevated() {
-  @include mdc-elevation-theme.elevation(1);
-}
-
-@mixin open() {
-  transform: scale(1);
-}
-
-@mixin dot() {
-  height: 0.5rem;
-  width: 0.5rem;
-  min-width: auto;
-  padding: 0;
-}

package/styles/badge/_variables.scss

@@ -1,87 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-@use '../theme/theme-values';
-
-$height: 1.25rem !default;
-$line-height: 1.25rem !default;
-$min-width: 0 !default;
-$max-width: auto !default;
-
-$theme-values: (
-  // default theme
-  default-muted-background: theme-values.$secondary,
-  default-muted-color: rgba(0, 0, 0, 0.87),
-  default-strong-background: theme-values.$tertiary,
-  default-strong-color: theme-values.$on-tertiary,
-  
-  // success theme
-  success-muted-background: #a5d6a7,
-  success-muted-color: #1b5e20,
-  success-strong-background: #2e7d32,
-  success-strong-color: #ffffff,
-
-  // warning theme
-  warning-muted-background: #ffdba6,
-  warning-muted-color: #a03a03,
-  warning-strong-background: #d14900,
-  warning-strong-color: #ffffff,
-
-  // danger theme
-  danger-muted-background: #ffcdd2,
-  danger-muted-color: #a22d0e,
-  danger-strong-background: #b00020,
-  danger-strong-color: #ffffff,
-
-  // info-primary theme
-  info-primary-muted-background: #bbdefb,
-  info-primary-strong-background: #1a237e,
-  info-primary-muted-color: #1a237e,
-  info-primary-strong-color: #ffffff,
-
-  // info-secondary theme
-  info-secondary-muted-background: #e0e0e0,
-  info-secondary-muted-color: #000000,
-  info-secondary-strong-background: #000000,
-  info-secondary-strong-color: #ffffff
-) !default;
-
-$theme-values-dark: (
-  // default theme
-  default-muted-background: theme-values.$secondary,
-  default-strong-background: theme-values.$primary,
-  default-muted-color: #000000,
-  default-strong-color: rgba(255, 255, 255, 0.87),
-
-  // success theme
-  success-muted-background: #175a2a,
-  success-strong-background: #007425,
-  success-muted-color: #ffffff,
-  success-strong-color: #ffffff,
-
-  // warning theme
-  warning-muted-background: #933600,
-  warning-strong-background: #cc3900,
-  warning-muted-color: #ffffff,
-  warning-strong-color: #ffffff,
-
-  // danger theme
-  danger-muted-background: #810022,
-  danger-strong-background: #ae0019,
-  danger-muted-color: #ffffff,
-  danger-strong-color: #ffffff,
-
-  // info-primary theme
-  info-primary-muted-background: #bbdefb,
-  info-primary-muted-color: #1a237e,
-  info-primary-strong-background: #1a237e,
-  info-primary-strong-color: #ffffff,
-
-  // info-secondary theme
-  info-secondary-muted-background: #424242,
-  info-secondary-strong-background: #5a5a5a,
-  info-secondary-muted-color: #ffffff,
-  info-secondary-strong-color: #ffffff
-) !default;

package/styles/banner/_mixins.scss

@@ -1,219 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-@use 'sass:map';
-@use '../theme';
-@use './variables';
-
-@mixin provide-theme($theme) {
-  @include theme.theme-properties(banner, $theme, variables.$theme-values);
-}
-
-@mixin width-above-breakpoint {
-  @media (min-width: variables.$width-breakpoint) {
-    @content;
-  }
-}
-
-@mixin width-below-breakpoint {
-  @media (max-width: variables.$width-breakpoint - 1) {
-    @content;
-  }
-}
-
-@mixin height-transition($new-height) {
-  transition: variables.$transition;
-  overflow: hidden;
-  max-height: $new-height;
-}
-
-@mixin theme-property($property, $theme, $overriding-css-custom-property) {
-  $light-theme-value: map.get(variables.$theme-values, $theme + '-' + $property);
-  $dark-theme-css-custom-property: --forge-banner-theme-#{$theme}-#{$property};
-
-  // map the properties for 'color' back to 'color'. The differentiation between icon and font is required for the theme handling above.
-  $styleName: $property;
-  @if $styleName == 'font-color' or $styleName == 'icon-color' {
-    $styleName: color;
-  }
-
-  $primary-override: $overriding-css-custom-property;
-  $secondary-override: $dark-theme-css-custom-property;
-  $default: $light-theme-value;
-
-  #{$styleName}: $default;
-  #{$styleName}: var($primary-override, var($secondary-override, $default));
-}
-
-@mixin theme-base($theme) {
-  .forge-banner {
-    @include theme-property('background', $theme, --forge-banner-theme-background);
-    @include theme-property('font-color', $theme, --forge-banner-theme-on-background);
-
-    .forge-banner__container-wrapper-icon {
-      @include theme-property('icon-color', $theme, --forge-banner-theme-icon);
-    }
-
-    .forge-banner__container-dismiss {
-      @include theme-property('icon-color', $theme, --forge-banner-theme-icon);
-    }
-  }
-}
-
-@mixin default-theme() {
-  :host(:not([theme])),
-  :host([theme='']),
-  :host([theme=default]) {
-    @include theme-base('default');
-  }
-}
-
-@mixin theme($theme) {
-  :host([theme=#{$theme}]) {
-    @include theme-base($theme);
-  }
-}
-
-@mixin base {
-  @include height-transition(variables.$max-height);
-
-  max-height: variables.$max-height;
-}
-
-@mixin container-base {
-  @include theme.property(border-bottom-color, border-color);
-
-  display: flex;
-  flex-direction: row;
-  border-bottom-width: 1px;
-  border-bottom-style: solid;
-  min-height: 48px;
-}
-
-@mixin container-wrapper-base {
-  flex: 1 1 auto;
-  display: flex;
-  flex-direction: row;
-}
-
-@mixin container-wrapper-icon-base {
-  margin-right: 16px;
-}
-
-@mixin container-wrapper-subsection-base {
-  display: flex;
-  justify-content: center;
-}
-
-@mixin container-dismiss-base {
-  &[hidden] {
-    display: none;
-  }
-}
-
-@mixin wide-styles {
-  @include width-above-breakpoint {
-    .forge-banner {
-      @include base;
-
-      &.forge-banner--dismissed {
-        @include height-transition(0);
-      }
-
-      &__container {
-        @include container-base;
-
-        align-items: center;
-        padding: 0 variables.$padding-right 0 variables.$padding-left;
-
-        &-wrapper {
-          @include container-wrapper-base;
-
-          justify-content: center;
-          align-items: center;
-
-          &-icon {
-            @include container-wrapper-icon-base;
-          }
-
-          &-subsection {
-            @include container-wrapper-subsection-base;
-
-            flex-direction: row;
-            align-items: center;
-
-            &-text {
-              padding: variables.$padding-top 0 variables.$padding-bottom 0;
-              margin-right: 24px;
-            }
-
-            &-action {
-              ::slotted(forge-button) {
-                margin-right: 16px;
-              }
-            }
-          }
-        }
-
-        &-dismiss {
-          @include container-dismiss-base;
-        }
-      }
-    }
-  }
-}
-
-@mixin narrow-styles {
-  @include width-below-breakpoint {
-    .forge-banner {
-      @include base;
-
-      &.forge-banner--dismissed {
-        @include height-transition(0);
-      }
-
-      &__container {
-        @include container-base;
-
-        padding: variables.$padding-top-narrow
-                 variables.$padding-right-narrow
-                 variables.$padding-bottom-narrow
-                 variables.$padding-left-narrow;
-
-        &-wrapper {
-          @include container-wrapper-base;
-
-          &-icon {
-            @include container-wrapper-icon-base;
-          }
-
-          &-subsection {
-            @include container-wrapper-subsection-base;
-
-            flex-direction: column;
-
-            &-action {
-              ::slotted(forge-button) {
-                margin-top: 12px;
-              }
-            }
-          }
-        }
-
-        &-dismiss {
-          @include container-dismiss-base;
-
-          margin-top: -12px;
-          margin-right: -12px;
-        }
-      }
-    }
-  }
-}
-
-@mixin core-styles() {
-  @include wide-styles;
-  @include narrow-styles;
-}

package/styles/banner/_variables.scss

@@ -1,88 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-@use '@material/theme/color-palette' as mdc-color-palette;
-@use '../theme/theme-values';
-
-// There must be an explicit max height in order for the animation to function.
-//   600px _should_ be more than plenty.
-$max-height: 600px !default;
-
-$padding-top: 14px !default;
-$padding-bottom: $padding-top !default;
-$padding-right: 24px !default;
-$padding-left: $padding-right !default;
-
-$padding-top-narrow: 16px !default;
-$padding-bottom-narrow: $padding-top-narrow !default;
-$padding-right-narrow: 12px !default;
-$padding-left-narrow: $padding-right-narrow !default;
-
-$width-breakpoint: 600px !default;
-$transition: max-height 300ms ease-in-out !default;
-
-$theme-values: (
-  // default theme
-  default-background: mdc-color-palette.$indigo-50,
-  default-font-color: theme-values.$text-primary-color,
-  default-icon-color: theme-values.$text-secondary-color,
-
-  // success theme
-  success-background: #a5d6a7,
-  success-font-color: theme-values.$text-primary-color,
-  success-icon-color: theme-values.$text-secondary-color,
-
-  // warning theme
-  warning-background: #ffdba6,
-  warning-font-color: theme-values.$text-primary-color,
-  warning-icon-color: theme-values.$text-secondary-color,
-
-  // danger theme
-  danger-background: #ffcdd2,
-  danger-font-color: theme-values.$text-primary-color,
-  danger-icon-color: theme-values.$text-secondary-color,
-
-  // info-primary theme
-  info-primary-background: #bbdefb,
-  info-primary-font-color: theme-values.$text-primary-color,
-  info-primary-icon-color: theme-values.$text-secondary-color,
-
-  // info-secondary theme
-  info-secondary-background: #e0e0e0,
-  info-secondary-font-color: theme-values.$text-primary-color,
-  info-secondary-icon-color: theme-values.$text-secondary-color
-) !default;
-
-$theme-values-dark: (
-  // default theme
-  default-background: #3f51b5,
-  default-font-color: #ffffff,
-  default-icon-color: #ffffff,
-
-  // success theme
-  success-background: #175a2a,
-  success-font-color: #ffffff,
-  success-icon-color: #ffffff,
-
-  // warning theme
-  warning-background: #933600,
-  warning-font-color: #ffffff,
-  warning-icon-color: #ffffff,
-
-  // danger theme
-  danger-background: #810022,
-  danger-font-color: #ffffff,
-  danger-icon-color: #ffffff,
-
-  // info-primary theme
-  info-primary-background: #0a3b71,
-  info-primary-font-color: #ffffff,
-  info-primary-icon-color: #ffffff,
-
-  // info-secondary theme
-  info-secondary-background: #424242,
-  info-secondary-font-color: #ffffff,
-  info-secondary-icon-color: #ffffff
-) !default;