svierk

import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { ToastEvent } from 'src/app/models/toast-event';
import { ToastService } from 'src/app/services/toast.service';

@Component({
  selector: 'app-toaster',
  templateUrl: './toaster.component.html',
  styleUrls: ['./toaster.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})

svierk

<div class="toaster position-fixed top-0 end-0 px-3 py-2 m-16">
  <div *ngFor="let toast of currentToasts; index as i">
    <app-toast
      [type]="toast.type"
      [title]="toast.title"
      [message]="toast.message"
      (disposeEvent)="dispose(i)"
    ></app-toast>
  </div>
</div>

svierk

import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
import { Toast } from 'bootstrap';
import { fromEvent, take } from 'rxjs';
import { EventTypes } from 'src/app/models/event-types';

@Component({
  selector: 'app-toast',
  templateUrl: './toast.component.html',
  styleUrls: ['./toast.component.scss'],
})

svierk

import { api, LightningElement, track } from 'lwc';

export default class MultiSelectCombobox extends LightningElement {
  @api disabled = false;
  @api label = '';
  @api name;
  @api options = [];
  @api placeholder = 'Select an Option';
  @api readOnly = false;
  @api required = false;

svierk

<template>
  <div class="slds-form-element">
    <label if:true={label} class="slds-form-element__label">
      <abbr if:true={required} title="required" class="slds-required">*</abbr>
      {label}</label
    >
    <div class="slds-form-element__control">
      <div class="slds-combobox_container">
        <div
          class="slds-combobox slds-dropdown-trigger slds-dropdown-trigger_click slds-picklist multi-select-combobox__dropdown"

svierk

import { api, LightningElement } from 'lwc';

export default class MultiSelectComboboxItem extends LightningElement {
  @api item;

  get itemClass() {
    return `slds-listbox__item ${this.item.selected ? 'slds-is-selected' : ''}`;
  }

  handleClick() {

svierk

<template>
  <li
    role="presentation"
    key={item.key}
    class={itemClass}
    data-id={item.key}
    data-name={item.value}
    onclick={handleClick}
  >
    <div class="slds-media slds-listbox__option slds-listbox__option_plain slds-media_small" role="option">

svierk

.multi-select-combobox__dropdown {
  max-height: 500px;
  overflow-y: auto;
}

.multi-select-combobox__input {
  background-color: #ffffff;
  border: 1px solid #dddbda;
  border-radius: 0.25rem;
  width: 100%;

svierk

<template>
  <lightning-record-edit-form object-api-name={objectApiName} record-id={recordId}>
    <lightning-input-field field-name={nameField}> </lightning-input-field>
    <lightning-input-field field-name={numberField}> </lightning-input-field>
    <lightning-input-field field-name={billingAddressField}> </lightning-input-field>
    <div class="slds-var-m-top_medium">
      <lightning-button variant="brand" type="submit" label="Save"> </lightning-button>
    </div>
  </lightning-record-edit-form>
</template>

svierk

import NUMBER_FIELD from '@salesforce/schema/Account.AccountNumber';
import BILLING_ADDRESS_FIELD from '@salesforce/schema/Account.BillingAddress';
import NAME_FIELD from '@salesforce/schema/Account.Name';
import { api, LightningElement } from 'lwc';

export default class AccountForm extends LightningElement {
  nameField = NAME_FIELD;
  numberField = NUMBER_FIELD;
  billingAddressField = BILLING_ADDRESS_FIELD;