diff --git a/src-lookup-sample/main/default/flexipages/CustomLookup.flexipage-meta.xml b/src-lookup-sample/main/default/flexipages/CustomLookup.flexipage-meta.xml index 271d7c1..8f5b7b8 100644 --- a/src-lookup-sample/main/default/flexipages/CustomLookup.flexipage-meta.xml +++ b/src-lookup-sample/main/default/flexipages/CustomLookup.flexipage-meta.xml @@ -1,15 +1,5 @@ <?xml version="1.0" encoding="UTF-8" ?> <FlexiPage xmlns="http://soap.sforce.com/2006/04/metadata"> - <flexiPageRegions> - <itemInstances> - <componentInstance> - <componentName>baseLookupSample</componentName> - <identifier>c_baseLookupSample</identifier> - </componentInstance> - </itemInstances> - <name>column1</name> - <type>Region</type> - </flexiPageRegions> <flexiPageRegions> <itemInstances> <componentInstance> diff --git a/src-lookup-sample/main/default/lwc/baseLookupSample/baseLookupSample.html b/src-lookup-sample/main/default/lwc/baseLookupSample/baseLookupSample.html deleted file mode 100644 index da434f2..0000000 --- a/src-lookup-sample/main/default/lwc/baseLookupSample/baseLookupSample.html +++ /dev/null @@ -1,60 +0,0 @@ -<template> - <lightning-card title="c-base-lookup (Base Lookup Lightning Web Component)"> - <div class="slds-form slds-form_stacked slds-var-m-around_xx-large"> - <div class="slds-grid slds-gutters"> - <div class="slds-col"> - <lightning-input - type="toggle" - label="isMultiEntry" - checked={isMultiEntry} - onchange={handleMultyEntryChange} - ></lightning-input> - </div> - <div class="slds-col" lwc:if={isMultiEntry}> - <lightning-input - type="number" - label="Max selected items" - min="1" - value={maxSelectionSize} - onchange={handleMaxSelectionSizeChange} - required - ></lightning-input> - </div> - </div> - - <p class="slds-var-m-vertical_large"> - <strong>Note:</strong> start by typing "New data" in the search box - </p> - - <c-base-lookup - actions={actions} - default-search-results={defaultSearchResults} - field-level-text="some help text" - is-multi-entry={isMultiEntry} - label="Search" - min-search-term-length="2" - onaction={handleAction} - onchange={handleChange} - onsearch={handleSearch} - placeholder="Search Lookup" - required - scroll-after-n-items="5" - message-when-value-missing="Complete the field or else!" - search-results={searchResults} - value={initialSelection} - ></c-base-lookup> - - <div class="slds-var-m-top_large"> - <lightning-button label="Focus" onclick={handleFocus}></lightning-button - > - <lightning-button label="Clear" onclick={handleClear}></lightning-button - > - <lightning-button - variant="brand" - label="Submit" - onclick={handleSubmit} - ></lightning-button> - </div> - </div> - </lightning-card> -</template> diff --git a/src-lookup-sample/main/default/lwc/baseLookupSample/baseLookupSample.js b/src-lookup-sample/main/default/lwc/baseLookupSample/baseLookupSample.js deleted file mode 100644 index 583414c..0000000 --- a/src-lookup-sample/main/default/lwc/baseLookupSample/baseLookupSample.js +++ /dev/null @@ -1,166 +0,0 @@ -import { LightningElement } from "lwc"; -import { ShowToastEvent } from "lightning/platformShowToastEvent"; -import { NavigationMixin } from "lightning/navigation"; -const ACCOUNT_ICON = { iconName: "standard:account" }; -const OPPORTUNITY_ICON = { iconName: "standard:opportunity" }; - -export default class BaseLookupSample extends NavigationMixin( - LightningElement -) { - isMultiEntry = false; - maxSelectionSize = 2; - initialSelection = [{ id: "1", icon: ACCOUNT_ICON, title: "Account 1" }]; - - searchResults = []; - - defaultSearchResults = [...Array(1).keys()].map((e) => ({ - id: "" + e, - icon: e < 2 ? ACCOUNT_ICON : OPPORTUNITY_ICON, - title: "Account " + e, - subtitles: [ - { - type: "lightning-formatted-rich-text", - label: "Sub 1", - value: "account number" + e, - props: {} - }, - { - type: "lightning-formatted-rich-text", - label: "Account Number", - value: "account number" + e, - props: {}, - highlightSearchTerm: true // hightlight the searchTerm for the subtitle (so that your users know that this field is being used in the search) - } - ] - })); - - actions = [ - { name: "actionA", label: "Custom Action" , icon: { iconName: 'utility:add' } }, - { name: "actionB", label: "Custom Action B" , icon: { iconName: 'utility:add' } } - ]; - - handleSearch(event) { - // eslint-disable-next-line no-unused-vars - const { selectedIds, searchTerm, rawSearchTerm } = event.detail; - // get the new data you can use selectedIds, searchTerm, rawSearchTerm to filter the new data example: - // ID NOT IN :selectedIds, (LIKE title Like '%searchTerm%') OR (Sub 2 LIKE '%searchTerm%') - this.searchResults = [ - { - id: 1, - icon: ACCOUNT_ICON, - title: "New data " + 1, - subtitles: [ - { - type: "lightning-formatted-number", - label: "Subtitle 1", - value: 12.34, - props: { - formatStyle: "currency" - } - }, - { - label: "Sub 2", - type: "lightning-icon", - value: true, - props: { - iconName: "utility:activity" - } - }, - ] - }, - { - id: 2, - icon: ACCOUNT_ICON, - title: "New data " + 2, - subtitles: [ - { - type: "lightning-formatted-date-time", - label: "Subtitle 2", - value: 1547250828000, - props: { - year: "2-digit", - month: "short", - day: "2-digit", - weekday: "narrow" - } - }, - { - label: "Sub 2", - value: "Sub2 " + 1, - highlightSearchTerm: true - } - ] - } - ]; - } - - // eslint-disable-next-line no-unused-vars - handleChange(event) { - const input = this.template.querySelector("c-base-lookup"); - const { value } = input; - // Custom validation rule - if (this.isMultiEntry && value.length > this.maxSelectionSize) { - input.setCustomValidity( - `You may only select up to ${this.maxSelectionSize} items.` - ); - } else { - input.setCustomValidity(""); // if there was a custom error before, reset it - } - - input.reportValidity(); // Tells lightning-input to show the error right away without needing interaction - } - - handleAction(event) { - if (event.detail === "actionA") { - // navigate to account page - } else if (event.detail === "actionB") { - // navigate to new opportunity page - } - } - - // All functions below are part of the sample app form (not required by the lookup). - - handleMultyEntryChange(event) { - this.isMultiEntry = event.target.checked; - } - - handleMaxSelectionSizeChange(event) { - this.maxSelectionSize = event.target.value; - } - - handleSubmit() { - const allValid = [ - ...this.template.querySelectorAll("lightning-input"), - this.template.querySelector("c-base-lookup") - ].reduce((validSoFar, inputCmp) => { - inputCmp.reportValidity(); - return validSoFar && inputCmp.checkValidity(); - }, true); - - if (allValid) { - this.dispatchEvent( - new ShowToastEvent({ - title: "Success", - message: "The form was submitted.", - variant: "success" - }) - ); - } else { - this.dispatchEvent( - new ShowToastEvent({ - title: "Error", - message: "Please update the invalid form entries and try again.", - variant: "error" - }) - ); - } - } - - handleClear() { - this.initialSelection = []; - } - - handleFocus() { - this.template.querySelector("c-base-lookup").focus(); - } -} diff --git a/src-lookup-sample/main/default/lwc/baseLookupSample/baseLookupSample.js-meta.xml b/src-lookup-sample/main/default/lwc/baseLookupSample/baseLookupSample.js-meta.xml deleted file mode 100644 index a563bf1..0000000 --- a/src-lookup-sample/main/default/lwc/baseLookupSample/baseLookupSample.js-meta.xml +++ /dev/null @@ -1,13 +0,0 @@ -<?xml version="1.0" encoding="UTF-8" ?> -<LightningComponentBundle - xmlns="http://soap.sforce.com/2006/04/metadata" - fqn="sampleLookupContainer" -> - <apiVersion>57.0</apiVersion> - <isExposed>true</isExposed> - <targets> - <target>lightning__AppPage</target> - <target>lightning__RecordPage</target> - <target>lightning__HomePage</target> - </targets> -</LightningComponentBundle>