@tylertech/forge 3.0.0-next.21 → 3.0.0-next.22

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

@@ -1,30 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { ICustomElementFoundation } from '@tylertech/forge-core';
-import { IRippleAdapter } from './ripple-adapter';
-export interface IRippleFoundation extends ICustomElementFoundation {
-    target: string;
-    unbounded: boolean;
-    layout(): void;
-    activate(): void;
-    deactivate(): void;
-}
-export declare class RippleFoundation implements IRippleFoundation {
-    private _adapter;
-    private _target;
-    private _unbounded;
-    constructor(_adapter: IRippleAdapter);
-    initialize(): void;
-    disconnect(): void;
-    layout(): void;
-    activate(): void;
-    deactivate(): void;
-    private _applyTarget;
-    get target(): string;
-    set target(value: string);
-    get unbounded(): boolean;
-    set unbounded(value: boolean);
-}

package/esm/ripple/ripple-foundation.js

@@ -1,48 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-export class RippleFoundation {
-    constructor(_adapter) {
-        this._adapter = _adapter;
-        this._unbounded = false;
-    }
-    initialize() {
-        this._adapter.initialize(this._target, this._unbounded);
-    }
-    disconnect() {
-        this._adapter.destroy();
-    }
-    layout() {
-        this._applyTarget();
-    }
-    activate() {
-        this._adapter.activate();
-    }
-    deactivate() {
-        this._adapter.deactivate();
-    }
-    _applyTarget() {
-        this._adapter.destroy();
-        this._adapter.initialize(this._target, this._unbounded);
-    }
-    get target() {
-        return this._target;
-    }
-    set target(value) {
-        if (this._target !== value) {
-            this._target = value;
-            this._applyTarget();
-        }
-    }
-    get unbounded() {
-        return this._unbounded;
-    }
-    set unbounded(value) {
-        if (this._unbounded !== value) {
-            this._unbounded = value;
-            this._applyTarget();
-        }
-    }
-}

package/esm/ripple/ripple.d.ts

@@ -1,36 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { BaseComponent, IBaseComponent } from '../core/base/base-component';
-export interface IRippleComponent extends IBaseComponent {
-    target: string;
-    unbounded: boolean;
-    layout(): void;
-    activate(): void;
-    deactivate(): void;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'forge-ripple': IRippleComponent;
-    }
-}
-/**
- * The web component class behind the `<forge-ripple>` custom element.
- *
- * @tag forge-ripple
- */
-export declare class RippleComponent extends BaseComponent implements IRippleComponent {
-    static get observedAttributes(): string[];
-    private _foundation;
-    constructor();
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
-    layout(): void;
-    activate(): void;
-    deactivate(): void;
-    target: string;
-    unbounded: boolean;
-}

package/esm/ripple/ripple.js

@@ -1,65 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-import { __decorate } from "tslib";
-import { coerceBoolean, CustomElement, FoundationProperty } from '@tylertech/forge-core';
-import { BaseComponent } from '../core/base/base-component';
-import { RippleAdapter } from './ripple-adapter';
-import { RIPPLE_CONSTANTS } from './ripple-constants';
-import { RippleFoundation } from './ripple-foundation';
-/**
- * The web component class behind the `<forge-ripple>` custom element.
- *
- * @tag forge-ripple
- */
-let RippleComponent = class RippleComponent extends BaseComponent {
-    static get observedAttributes() {
-        return [
-            RIPPLE_CONSTANTS.attributes.TARGET,
-            RIPPLE_CONSTANTS.attributes.UNBOUNDED
-        ];
-    }
-    constructor() {
-        super();
-        this._foundation = new RippleFoundation(new RippleAdapter(this));
-    }
-    connectedCallback() {
-        this._foundation.initialize();
-    }
-    disconnectedCallback() {
-        this._foundation.disconnect();
-    }
-    attributeChangedCallback(name, oldValue, newValue) {
-        switch (name) {
-            case RIPPLE_CONSTANTS.attributes.TARGET:
-                this.target = newValue;
-                break;
-            case RIPPLE_CONSTANTS.attributes.UNBOUNDED:
-                this.unbounded = coerceBoolean(newValue);
-                break;
-        }
-    }
-    layout() {
-        this._foundation.layout();
-    }
-    activate() {
-        return this._foundation.activate();
-    }
-    deactivate() {
-        return this._foundation.deactivate();
-    }
-};
-__decorate([
-    FoundationProperty()
-], RippleComponent.prototype, "target", void 0);
-__decorate([
-    FoundationProperty()
-], RippleComponent.prototype, "unbounded", void 0);
-RippleComponent = __decorate([
-    CustomElement({
-        name: RIPPLE_CONSTANTS.elementName
-    })
-], RippleComponent);
-export { RippleComponent };

package/styles/backdrop/_mixins.scss

@@ -1,31 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-@use '@material/animation/functions' as mdc-animation;
-@use '../utils/mixins' as utils-mixins;
-@use '../theme';
-@use './variables';
-
-@mixin provide-theme($theme) {
-  @include theme.theme-properties(backdrop, $theme, variables.$theme-values);
-}
-
-@mixin core-styles() {
-  .forge-backdrop {
-    @include base;
-  }
-}
-
-@mixin base() {
-  @include theme.z-index(backdrop);
-  @include theme.css-custom-property(background-color, --forge-backdrop-theme-background, variables.$background);
-  @include utils-mixins.position-abs-zero;
-
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transition: mdc-animation.enter(opacity, 150ms);
-  opacity: 0;
-}

package/styles/backdrop/_variables.scss

@@ -1,12 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-$background: rgba(0, 0, 0, 0.54);
-$theme-values: (
-  background: $background
-) !default;
-$theme-values-dark: (
-  background: rgba(255, 255, 255, 0.54)
-) !default;

package/styles/card/_mixins.scss

@@ -1,47 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-@use '@material/elevation/elevation-theme' as mdc-elevation-theme;
-@use '@material/card/mixins' as mdc-card-mixins;
-@use '@material/card/variables' as mdc-card-variables;
-@use '../utils/variables-grid';
-@use '../theme';
-@use '../utils/functions-grid';
-@use '../utils/mixins-flex';
-@use './variables';
-
-@mixin core-styles() {
-  .forge-card {
-    @include base;
-  
-    &--raised {
-      @include raised;
-    }
-  }
-}
-
-@mixin host() {
-  display: block;
-}
-
-@mixin base() {
-  @include mdc-card-mixins.fill-color(surface);
-  @include mdc-card-mixins.shape-radius(medium);
-  @include mdc-card-mixins.outline(mdc-card-variables.$outline-color);
-  @include theme.css-custom-property(height, --forge-card-height, 100%);
-  @include theme.css-custom-property(width, --forge-card-width, 100%);
-  @include theme.css-custom-property(padding, --forge-card-padding, variables.$padding);
-  @include theme.css-custom-property(overflow, --forge-card-overflow, hidden);
-  @include theme.property(border-color, border-color);
-
-  box-sizing: border-box;
-  -webkit-tap-highlight-color: transparent;
-}
-
-@mixin raised() {
-  @include mdc-elevation-theme.elevation(1);
-  
-  border: none;
-}

package/styles/card/_variables.scss

@@ -1,9 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-$padding: 16px !default;
-$header-height: 56px !default;
-$grid-column-size: 256px !default;
-$grid-gutter-size: 16px !default;

package/styles/chip-field/_base.scss

@@ -1,299 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-@use 'sass:map';
-@use '@material/theme/theme' as mdc-theme;
-@use '../field/variables' as field-variables;
-@use '../field/utils' as field-utils;
-@use '../theme';
-@use './variables';
-
-// Field
-@mixin field-core {
-  display: grid;
-  grid-template-columns: [leading] min-content [input] 1fr [trailing] min-content [addon-end] min-content [end];
-}
-
-@mixin field-height($layout-state, $custom-prop-height) {
-  // Default
-  @if $layout-state == default or $layout-state == shape-rounded {
-    height: auto;
-    @include theme.css-custom-property(
-      min-height,
-      $custom-prop-height,
-      46px
-    );
-  }
-  // Roomy
-  @else if $layout-state == roomy or $layout-state == shape-rounded-roomy {
-    height: auto;
-    @include theme.css-custom-property(
-      min-height,
-      $custom-prop-height,
-      map.get(field-variables.$field, height, roomy)
-    );
-  }
-  // Dense
-  @else if $layout-state == dense or $layout-state == shape-rounded-dense {
-    height: auto;
-    @include theme.css-custom-property(
-      min-height,
-      $custom-prop-height,
-      map.get(field-variables.$field, height, dense)
-    );
-  }
-  @include field-utils.error-layout-state(field-height, $layout-state);
-}
-
-// Label Input Container {
-@mixin label-input-container-core {
-  @include _grid-input;
-}
-
-// Input Container
-@mixin input-container-core {
-  flex: 1 1 0.0001px;
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  align-items: flex-start;
-  box-sizing: border-box;
-}
-
-@mixin input-container-padding {
-  padding: map.get(variables.$input-container, padding, default);
-}
-
-@mixin input-container-padding-top($layout-state, $slot-state) {
-  // With Label
-  @if $slot-state == label or $slot-state == label-helper-text {
-    // Default
-    @if $layout-state == default or $layout-state == shape-rounded {
-      padding-top: map.get(variables.$input-container, padding, top, default);
-    }
-    // Roomy
-    @else if $layout-state == roomy or $layout-state == shape-rounded-roomy {
-      padding-top: map.get(variables.$input-container, padding, top, roomy);
-    }
-  }
-  @include field-utils.error-layout-state(input-container-padding-top, $layout-state);
-  @include field-utils.error-y-axis-slot-state(input-container-padding-top, $slot-state);
-}
-
-@mixin input-container-padding-left($layout-state, $slot-state) {
-  // Check slot state first because leading slot state always overrides the layout state for input-container.
-  @if $slot-state == leading or $slot-state == leading-trailing or $slot-state == leading-addon-end {
-    // Leading
-    padding-left: map.get(variables.$input-container, padding, left, leading);
-  }
-  @else if $slot-state == default or $slot-state == trailing or $slot-state == addon-end {
-    // Shape Rounded
-    @if $layout-state == shape-rounded or $layout-state == shape-rounded-roomy or $layout-state == shape-rounded-dense {
-      padding-left: map.get(variables.$input-container, padding, left, shape-rounded);
-    }
-  }
-  @include field-utils.error-x-axis-slot-state(input-container-padding-left, $slot-state);
-  @include field-utils.error-layout-state(input-container-padding-left, $layout-state);
-}
-
-@mixin input-container-padding-bottom($layout-state, $slot-state) {
-  // With Label
-  @if $slot-state == label or $slot-state == label-helper-text {
-    // Default
-    @if $layout-state == default or $layout-state == shape-rounded {
-      padding-bottom: map.get(variables.$input-container, padding, bottom, default);
-    }
-    // Roomy
-    @else if $layout-state == roomy or $layout-state == shape-rounded-roomy {
-      padding-bottom: map.get(variables.$input-container, padding, bottom, roomy);
-    }
-  }
-  @include field-utils.error-layout-state(input-container-padding-bottom, $layout-state);
-  @include field-utils.error-y-axis-slot-state(input-container-padding-bottom, $slot-state);
-}
-
-@mixin input-container-padding-right($layout-state, $slot-state) {
-  // Check slot state first because leading slot state always overrides the layout state for input-container.
-  @if $slot-state == trailing or $slot-state == addon-end or $slot-state == leading-trailing or $slot-state == leading-addon-end {
-    // Trailing
-    padding-right: map.get(variables.$input-container, padding, right, trailing);
-  }
-  @else if $slot-state == default or $slot-state == leading {
-    // Shape Rounded
-    @if $layout-state == shape-rounded or $layout-state == shape-rounded-roomy or $layout-state == shape-rounded-dense {
-      padding-right: map.get(variables.$input-container, padding, right, shape-rounded);
-    }
-  }
-  @include field-utils.error-x-axis-slot-state(input-container-padding-right, $slot-state);
-  @include field-utils.error-layout-state(input-container-padding-right, $layout-state);
-}
-
-// Member
-@mixin member-core {
-  display: block;
-}
-
-@mixin member-theme($theme-state) {
-  @if $theme-state == disabled {
-    // (DerekMoss): TODO: This assumes members are chips. Make more generic?
-    @include mdc-theme.property(--mdc-theme-primary, text-disabled-on-light);
-    cursor: not-allowed;
-    pointer-events: none;
-  }
-  @include field-utils.error-theme-state(member-theme, $theme-state);
-}
-
-@mixin member-padding($layout-state) {
-  // Default
-  @if $layout-state == default or $layout-state == shape-rounded {
-    margin: map.get(variables.$member, padding, default);
-  }
-  // Roomy
-  @else if $layout-state == roomy or $layout-state == shape-rounded-roomy {
-    margin: map.get(variables.$member, padding, roomy);
-  }
-  // Dense
-  @else if $layout-state == dense or $layout-state == shape-rounded-dense {
-    margin: map.get(variables.$member, padding, dense);
-  }
-  @include field-utils.error-layout-state(member-padding, $layout-state);
-}
-
-@mixin member-height($layout-state) {
-  // (DerekMoss): TODO: This assumes members are chips. Make more generic?
-  // Members are generated dynamically, so setting dense on the members is not ideal.
-
-  // Default
-  @if $layout-state == default or $layout-state == shape-rounded {
-    --forge-chip-min-height: #{map.get(variables.$member, min-height, default)};
-  }
-  // Dense
-  @else if $layout-state == dense or $layout-state == shape-rounded-dense {
-    --forge-chip-min-height: #{map.get(variables.$member, min-height, dense)};
-  }
-  // Roomy uses the default chip height
-  @include field-utils.error-layout-state(member-height, $layout-state);
-}
-
-// Input
-@mixin input-core {
-  flex: 1 1 0.0001px;
-  min-width: map.get(variables.$input, min-width, default);
-  display: block;
-  align-self: flex-start;
-  padding: 0;
-}
-
-@mixin input-margin($layout-state) {
-  // Default
-  @if $layout-state == default or $layout-state == shape-rounded {
-    margin: map.get(variables.$input, margin, default);
-  }
-  // Roomy
-  @else if $layout-state == roomy or $layout-state == shape-rounded-roomy {
-    margin: map.get(variables.$input, margin, roomy);
-  }
-  // Dense
-  @else if $layout-state == dense or $layout-state == shape-rounded-dense {
-    margin: map.get(variables.$input, margin, dense);
-  }
-  @include field-utils.error-layout-state(input-margin, $layout-state);
-}
-
-@mixin input-height($layout-state) {
-  // Default
-  @if $layout-state == default or $layout-state == shape-rounded {
-    height: map.get(variables.$input, height, default);
-    line-height: map.get(variables.$input, line-height, default);
-  }
-  // Roomy
-  @else if $layout-state == roomy or $layout-state == shape-rounded-roomy {
-    height: map.get(variables.$input, height, roomy);
-    line-height: map.get(variables.$input, line-height, roomy);
-  }
-  // Dense
-  @else if $layout-state == dense or $layout-state == shape-rounded-dense {
-    height: map.get(variables.$input, height, dense);
-    line-height: map.get(variables.$input, line-height, dense);
-  }
-  @include field-utils.error-layout-state(input-height, $layout-state);
-}
-
-// Leading
-@mixin leading-core {
-  @include _grid-leading;
-  align-self: flex-start;
-  display: flex;
-}
-
-// Trailing
-@mixin trailing-core {
-  @include _grid-trailing;
-  align-self: flex-start;
-}
-
-// Addon End
-@mixin addon-end-core {
-  @include _grid-addon-end;
-  align-self: flex-start;
-}
-
-// Icon
-@mixin icon-margin-y($layout-state) {
-  // Default
-  @if $layout-state == default or $layout-state == shape-rounded {
-    margin-top: map.get(variables.$icon, margin, y, default);
-    margin-bottom: map.get(variables.$icon, margin, y, default);
-  }
-  // Roomy
-  @else if $layout-state == roomy or $layout-state == shape-rounded-roomy {
-    margin-top: map.get(variables.$icon, margin, y, roomy);
-    margin-bottom: map.get(variables.$icon, margin, y, roomy);
-  }
-  // Dense
-  @else if $layout-state == dense or $layout-state == shape-rounded-dense {
-    margin-top: map.get(variables.$icon, margin, y, dense);
-    margin-bottom: map.get(variables.$icon, margin, y, dense);
-  }
-  @include field-utils.error-layout-state(icon-margin-y, $layout-state);
-}
-
-@mixin icon-padding-y($layout-state) {
-  // Dense
-  @if $layout-state == dense or $layout-state == shape-rounded-dense {
-    padding-top: map.get(variables.$icon, padding, y, dense);
-    padding-bottom: map.get(variables.$icon, padding, y, dense);
-  }
-  @include field-utils.error-layout-state(icon-padding-y, $layout-state);
-}
-
-@mixin icon-button-display {
-  display: inline-flex !important;
-}
-
-// Grid
-@mixin _grid-leading {
-  grid-column-start: leading;
-  grid-column-end: input;
-}
-
-@mixin _grid-input {
-  grid-column-start: input;
-  grid-column-end: trailing;
-}
-
-@mixin _grid-trailing {
-  grid-column-start: trailing;
-  grid-column-end: addon-end;
-  display: flex;
-  align-items: flex-start;
-}
-
-@mixin _grid-addon-end {
-  grid-column-start: addon-end;
-  grid-column-end: end;
-  display: flex;
-  align-items: flex-start;
-}

package/styles/chip-field/_mixins.scss

@@ -1,26 +0,0 @@
-/**
- * @license
- * Copyright 2023 Tyler Technologies, Inc. 
- * License: Apache-2.0
- */
-@use  '@material/typography/typography' as mdc-typography;
-@use '@material/animation/animation' as mdc-animation;
-@use '@material/theme/theme' as mdc-theme;
-@use '../theme';
-@use '../field/core' as field-core;
-@use './core';
-
-@mixin provide-theme($theme) {
-  @include theme.theme-properties(forge-chip-field, $theme, field-variables.$theme-values);
-}
-
-@mixin host {
-  display: block;
-  contain: layout;
-}
-
-@mixin core-styles {
-  // we include the field-selector.input in the chip-field-selector.input mixin
-  @include field-core.core-styles(forge-chip-field, $exclude: (field, input));
-  @include core.core-styles;
-}