@salesforcedevs/dx-components 0.26.0 → 0.26.1-alpha0.4

package/src/modules/dx/select/select.css

@@ -1,44 +0,0 @@
-@import "helpers/slds";
-
-:host {
-    display: block;
-}
-
-:host(:focus-visible) {
-    outline: none;
-}
-
-.slds-select_container::before {
-    --icon-size: 0.5em;
-
-    border-style: solid;
-    border-width: 2px 2px 0 0;
-    color: var(--sds-g-gray-9);
-    content: "";
-    display: block;
-    height: var(--icon-size);
-    position: absolute;
-    right: 0.7rem;
-    top: calc((1.75rem / 2) - 5px);
-    transform: rotate(135deg);
-    width: var(--icon-size);
-}
-
-.placeholder {
-    color: var(--sds-g-gray-9);
-}
-
-select.slds-select:focus:not([disabled]),
-select.slds-select:active:not([disabled]) {
-    border-width: 2px;
-    border-color: var(--dx-g-blue-vibrant-50);
-    box-shadow: none;
-    -webkit-box-shadow: none;
-}
-
-:host(.slds-has-error) select.slds-select:focus,
-:host(.slds-has-error) select.slds-select:active {
-    border-color: #ea001e;
-    box-shadow: 0 0 3px var(--dx-g-blue-vibrant-50);
-    -webkit-box-shadow: 0 0 3px var(--dx-g-blue-vibrant-50);
-}

package/src/modules/dx/select/select.html

@@ -1,60 +0,0 @@
-<template>
-    <label class={computedLabelClass} for="select">
-        {label}
-        <template if:true={required}>
-            <abbr>*</abbr>
-        </template>
-    </label>
-
-    <div class="slds-form-element__control">
-        <div class="slds-select_container">
-            <select
-                autocomplete={autocomplete}
-                class={selectClass}
-                disabled={disabled}
-                id="select"
-                multiple={multiple}
-                name={name}
-                onblur={handleBlur}
-                onchange={handleChange}
-                onfocus={handleFocus}
-                required={required}
-                accesskey={accessKey}
-                size={size}
-            >
-                <template if:true={placeholder}>
-                    <option if:false={value} value="" disabled>
-                        {placeholder}
-                    </option>
-                </template>
-                <template for:each={options} for:item="option">
-                    <template if:true={option.disabled}>
-                        <option
-                            disabled
-                            key={option.value}
-                            value={option.value}
-                        >
-                            {option.label}
-                        </option>
-                    </template>
-                    <template if:false={option.disabled}>
-                        <option key={option.value} value={option.value}>
-                            {option.label}
-                        </option>
-                    </template>
-                </template>
-            </select>
-        </div>
-    </div>
-
-    <template if:true={_helpMessage}>
-        <div
-            aria-live="assertive"
-            class="slds-form-element__help"
-            data-help-message
-            id="help-message"
-        >
-            {_helpMessage}
-        </div>
-    </template>
-</template>

package/src/modules/dx/select/select.stories.ts

@@ -1,59 +0,0 @@
-import { html } from "lit-html";
-
-export default {
-    title: "dx/dx-select",
-    component: "dx-select",
-    argTypes: {
-        value: {
-            defaultValue: "b",
-            control: {
-                type: "text"
-            }
-        }
-    }
-};
-
-const OPTIONS = [
-    { value: "a", label: "First option" },
-    { value: "b", label: "Second option" },
-    { value: "c", label: "Third option" }
-];
-
-const styles = () => html`
-    <style>
-        dx-select {
-            width: clamp(200px, 50%, 600px);
-        }
-    </style>
-`;
-
-export const Base = ({ value }: any) => html`
-    ${styles()}
-    <dx-select
-        json-options="${JSON.stringify(OPTIONS)}"
-        label="Hello"
-        value="${value}"
-    ></dx-select>
-`;
-
-export const Required = () => html`
-    ${styles()}
-    <dx-select
-        json-options="${JSON.stringify(OPTIONS)}"
-        label="Hello Required"
-        message-when-value-missing="This field is empty"
-        required="true"
-        placeholder="Select a Value"
-        value=""
-    ></dx-select>
-`;
-
-export const Disabled = ({ value }: any) => html`
-    ${styles()}
-    <dx-select
-        disabled="true"
-        label="Hello Disabled"
-        json-options="${JSON.stringify(OPTIONS)}"
-        value="${value}"
-    ></dx-select>
-`;

package/src/modules/dx/select/select.ts

@@ -1,23 +0,0 @@
-import cx from "classnames";
-import { api } from "lwc";
-import LightningSelect from "lightning/select";
-import { toJson } from "utils/normalizers";
-
-export default class Select extends LightningSelect {
-    @api placeholder?: string;
-
-    @api
-    get jsonOptions() {
-        return this.options;
-    }
-
-    set jsonOptions(value) {
-        this.options = toJson(value);
-    }
-
-    get selectClass() {
-        return cx("slds-select", {
-            placeholder: !this.value
-        });
-    }
-}

package/src/modules/dx/sidebar/__tests__/mockProps.ts

@@ -1,181 +0,0 @@
-import { TreeNode } from "typings/custom";
-
-export const SAMPLE_TREES: TreeNode[] = [
-    {
-        label: "Getting started",
-        name: "started",
-        isExpanded: true,
-        children: [
-            {
-                label: "Introduction",
-                name: "introduction"
-            },
-            {
-                label: "Getting started",
-                name: "started-child"
-            },
-            {
-                label: "Authentication",
-                name: "authentication"
-            },
-            {
-                label: "Token",
-                name: "token"
-            },
-            {
-                label: "Error",
-                name: "error"
-            },
-            {
-                label: "Limits",
-                name: "limit"
-            },
-            {
-                label: "Release note",
-                name: "release-note"
-            }
-        ]
-    },
-    {
-        label: "Einstein Vision",
-        name: "einstein-vision",
-        children: [
-            {
-                label: "Introduction",
-                name: "einstein-introduction"
-            },
-            {
-                label: "Terminology",
-                name: "terminology"
-            },
-            {
-                label: "Object detection quickstart for beginner",
-                name: "object-quickstart",
-                isExpanded: true,
-                children: [
-                    {
-                        label:
-                            "Scenario: this block is intended to show how a large text looks like in the sidebar",
-                        name: "scenario",
-                        isExpanded: true,
-                        children: [
-                            {
-                                label:
-                                    "Scenario A: this block is intended to show how a large text looks like in the sidebar",
-                                name: "scenario-a"
-                            },
-                            {
-                                label: "Scenario B",
-                                name: "scenario-b"
-                            }
-                        ]
-                    },
-                    {
-                        label: "Prerequisites",
-                        name: "prerequisites"
-                    }
-                ]
-            },
-            {
-                label: "Best Practices",
-                name: "best-practices"
-            }
-        ]
-    }
-];
-
-export const SAMPLE_TREES_WITH_METHODS: TreeNode[] = [
-    {
-        label: "Getting started",
-        name: "started",
-        isExpanded: true,
-        children: [
-            {
-                label: "Introduction",
-                name: "introduction",
-                method: "post"
-            },
-            {
-                label: "Getting started",
-                name: "started-child",
-                method: "get"
-            },
-            {
-                label: "Authentication",
-                name: "authentication",
-                method: "delete"
-            },
-            {
-                label: "Token",
-                name: "token",
-                method: "patch"
-            },
-            {
-                label: "Error",
-                name: "error",
-                method: "put"
-            },
-            {
-                label: "Limits",
-                name: "limit",
-                method: "get"
-            },
-            {
-                label: "Release note",
-                name: "release-note",
-                method: "post"
-            }
-        ]
-    },
-    {
-        label: "Einstein Vision",
-        name: "einstein-vision",
-        children: [
-            {
-                label: "Introduction",
-                name: "einstein-introduction",
-                method: "get"
-            },
-            {
-                label: "Terminology",
-                name: "terminology",
-                method: "get"
-            },
-            {
-                label: "Object detection quickstart for beginner",
-                name: "object-quickstart",
-                isExpanded: true,
-                children: [
-                    {
-                        label: "Scenario",
-                        name: "scenario",
-                        isExpanded: true,
-                        children: [
-                            {
-                                label:
-                                    "Scenario A: this block is intended to show how a large text looks like in the sidebar",
-                                name: "scenario-a",
-                                method: "post"
-                            },
-                            {
-                                label: "Scenario B",
-                                name: "scenario-b",
-                                method: "put"
-                            }
-                        ]
-                    },
-                    {
-                        label: "Prerequisites",
-                        name: "prerequisites",
-                        method: "delete"
-                    }
-                ]
-            },
-            {
-                label: "Best Practices",
-                name: "best-practices",
-                method: "patch"
-            }
-        ]
-    }
-];

package/src/modules/dx/sidebar/__tests__/mockSearchChangeEmptyEvent.ts

@@ -1,6 +0,0 @@
-export default {
-    detail: {
-        value: "pwa",
-        results: []
-    }
-};