lightning-base-components 1.18.1-alpha → 1.18.3-alpha

package/src/lightning/sldsUtilsGrid/sldsUtilsGrid.css

@@ -0,0 +1,259 @@
+/* Copyright (c) 2015-present, salesforce.com, inc. All rights reserved
+Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
+
+/**
+ * Notes:
+ * - Some of the selectors available in SLDS were not included here, because they are unused in LBC
+ * - :host() is needed for `layout` and `layout-item` because classes are applied to the host element.
+ */
+
+/* Base */
+.slds-grid,
+:host(.slds-grid) {
+    display: flex;
+}
+
+.slds-grid_frame,
+:host(.slds-grid_frame) {
+    min-width: 100vw;
+    min-height: 100vh;
+    overflow: hidden;
+}
+
+.slds-grid_vertical,
+:host(.slds-grid_vertical) {
+    flex-direction: column;
+}
+
+.slds-grid_vertical-reverse,
+:host(.slds-grid_vertical-reverse) {
+    flex-direction: column-reverse;
+}
+
+.slds-grid_reverse,
+:host(.slds-grid_reverse) {
+    flex-direction: row-reverse;
+}
+
+/* Flex */
+.slds-wrap,
+:host(.slds-wrap) {
+    flex-wrap: wrap;
+    align-items: flex-start;
+}
+
+/* No Wrap */
+.slds-nowrap,
+:host(.slds-nowrap) {
+    flex: 1 1 auto;
+    flex-wrap: nowrap;
+    align-items: stretch;
+}
+
+@media (min-width: 30em) {
+
+    /* This is deprecated, included for backward compatibility. use `slds-nowrap` instead */
+    .slds-nowrap_small,
+    :host(.slds-nowrap_small) {
+        flex: 1 1 auto;
+        flex-wrap: nowrap;
+        align-items: stretch;
+    }
+
+}
+
+@media (min-width: 48em) {
+
+    /* This is deprecated, included for backward compatibility. use `slds-nowrap` instead */
+    .slds-nowrap_medium,
+    :host(.slds-nowrap_medium) {
+        flex: 1 1 auto;
+        flex-wrap: nowrap;
+        align-items: stretch;
+    }
+
+}
+
+@media (min-width: 64em) {
+
+    /* This is deprecated, included for backward compatibility. use `slds-nowrap` instead */
+    .slds-nowrap_large,
+    :host(.slds-nowrap_large) {
+        flex: 1 1 auto;
+        flex-wrap: nowrap;
+        align-items: stretch;
+    }
+
+}
+
+/* Gutters */
+.slds-gutters,
+:host(.slds-gutters) {
+    margin-inline-end: (var(--slds-g-spacing-3, 0.75rem) * -1);
+    margin-inline-start: (var(--slds-g-spacing-3, 0.75rem) * -1);
+}
+
+.slds-gutters .slds-col,
+:host(.slds-gutters) .slds-col {
+    padding-right: var(--slds-g-spacing-3, 0.75rem);
+    padding-left: var(--slds-g-spacing-3, 0.75rem);
+}
+
+/* Col */
+.slds-col,
+:host(.slds-col),
+[class*="slds-col_padded"],
+:host([class*="slds-col_padded"]) {
+    flex: 1 1 auto;
+}
+
+.slds-has-flexi-truncate,
+:host(.slds-has-flexi-truncate) {
+    flex: 1 1 0%;
+    min-width: 0;
+}
+
+.slds-no-flex,
+:host(.slds-no-flex) {
+    flex: none;
+}
+
+.slds-no-space,
+:host(.slds-no-space) {
+    min-width: 0;
+}
+
+.slds-grow,
+:host(.slds-grow) {
+    flex-grow: 1;
+}
+
+.slds-grow-none,
+:host(.slds-grow-none) {
+    flex-grow: 0;
+}
+
+.slds-shrink,
+:host(.slds-shrink) {
+    flex-shrink: 1;
+}
+
+.slds-shrink-none,
+:host(.slds-shrink-none) {
+    flex-shrink: 0;
+}
+
+.slds-grid_align-center .slds-col,
+.slds-grid_align-space .slds-col,
+.slds-grid_align-spread .slds-col,
+.slds-grid_align-end .slds-col,
+:host(.slds-grid_align-center) .slds-col,
+:host(.slds-grid_align-space) .slds-col,
+:host(.slds-grid_align-spread) .slds-col,
+:host(.slds-grid_align-end) .slds-col {
+    flex-grow: 0;
+}
+
+/* Horizontal Alignment */
+.slds-grid_align-center,
+:host(.slds-grid_align-center) {
+    justify-content: center;
+}
+
+.slds-grid_align-space,
+:host(.slds-grid_align-space) {
+    justify-content: space-around;
+}
+
+.slds-grid_align-spread,
+:host(.slds-grid_align-spread) {
+    justify-content: space-between;
+}
+
+.slds-grid_align-end,
+:host(.slds-grid_align-end) {
+    justify-content: flex-end;
+}
+
+/* Vertical Alignment */
+.slds-grid_vertical-align-start,
+:host(.slds-grid_vertical-align-start) {
+    align-items: flex-start;
+    align-content: flex-start;
+}
+
+.slds-grid_vertical-align-center,
+:host(.slds-grid_vertical-align-center) {
+    align-items: center;
+    align-content: center;
+}
+
+.slds-grid_vertical-align-end,
+:host(.slds-grid_vertical-align-end) {
+    align-items: flex-end;
+    align-content: flex-end;
+}
+
+.slds-grid_vertical-stretch,
+:host(.slds-grid_vertical-stretch) {
+    align-items: stretch;
+    align-content: stretch;
+}
+
+/* Boundary */
+.slds-grid_pull-padded,
+:host(.slds-grid_pull-padded) {
+    margin-inline-end: (var(--slds-g-spacing-3, 0.75rem) * -1);
+    margin-inline-start: (var(--slds-g-spacing-3, 0.75rem) * -1);
+}
+
+.slds-grid_pull-padded-medium,
+:host(.slds-grid_pull-padded-medium) {
+    margin-inline-end: (var(--slds-g-spacing-4, 1rem) * -1);
+    margin-inline-start: (var(--slds-g-spacing-4, 1rem) * -1);
+}
+
+.slds-grid_pull-padded-large,
+:host(.slds-grid_pull-padded-large) {
+    margin-inline-end: (var(--slds-g-spacing-5, 1.5rem) * -1);
+    margin-inline-start: (var(--slds-g-spacing-5, 1.5rem) * -1);
+}
+
+.slds-align-top,
+:host(.slds-align-top) {
+    vertical-align: top;
+    align-self: flex-start;
+}
+
+.slds-align-middle,
+:host(.slds-align-middle) {
+    vertical-align: middle;
+    align-self: center;
+}
+
+.slds-align-bottom,
+:host(.slds-align-bottom) {
+    vertical-align: bottom;
+    align-self: flex-end;
+}
+
+/* Bump */
+.slds-col_bump-top,
+:host(.slds-col_bump-top) {
+    margin-top: auto;
+}
+
+.slds-col_bump-right,
+:host(.slds-col_bump-right) {
+    margin-inline-end: auto;
+}
+
+.slds-col_bump-bottom,
+:host(.slds-col_bump-bottom) {
+    margin-bottom: auto;
+}
+
+.slds-col_bump-left,
+:host(.slds-col_bump-left) {
+    margin-inline-start: auto;
+}

package/src/lightning/sldsUtilsGrid/sldsUtilsGrid.js-meta.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<LightningComponentBundle xmlns="xmlns=http://soap.sforce.com/2006/04/metadata">
+    <isExposed>true</isExposed>
+</LightningComponentBundle>

package/src/lightning/sldsUtilsHyphenation/sldsUtilsHyphenation.css

@@ -0,0 +1,8 @@
+/* Copyright (c) 2015-present, salesforce.com, inc. All rights reserved
+Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
+
+.slds-hyphenate {
+    overflow-wrap: break-word;
+    word-wrap: break-word;
+    hyphens: auto;
+}

package/src/lightning/sldsUtilsHyphenation/sldsUtilsHyphenation.js-meta.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<LightningComponentBundle xmlns="xmlns=http://soap.sforce.com/2006/04/metadata">
+    <isExposed>true</isExposed>
+</LightningComponentBundle>

package/src/lightning/sldsUtilsLineClamp/sldsUtilsLineClamp.css

@@ -0,0 +1,57 @@
+/* Copyright (c) 2015-present, salesforce.com, inc. All rights reserved
+Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
+
+/**
+ *
+ * In SLDS `slds-line-clamp` is set to 3 as per default,
+ * and it uses mixins to generate each selector.
+ * $line-clamp: 3 !default;
+ *
+ */
+
+.slds-line-clamp {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: pre-line;
+}
+
+/* The below are commented because currently unused in LBC */
+
+/* .slds-line-clamp_x-small {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: pre-line;
+}
+
+.slds-line-clamp_small {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: pre-line;
+}
+
+.slds-line-clamp_medium {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 5;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: pre-line;
+}
+
+.slds-line-clamp_large {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 7;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: pre-line;
+} */

package/src/lightning/sldsUtilsLineClamp/sldsUtilsLineClamp.js-meta.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<LightningComponentBundle xmlns="xmlns=http://soap.sforce.com/2006/04/metadata">
+    <isExposed>true</isExposed>
+</LightningComponentBundle>

package/src/lightning/sldsUtilsMargin/sldsUtilsMargin.css

@@ -0,0 +1,313 @@
+/* Copyright (c) 2015-present, salesforce.com, inc. All rights reserved
+Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
+
+/**
+ * Notes:
+ * - Some of the selectors available in SLDS were not included here, because they are unused in LBC
+ * - :host() is needed for those components where classes are applied to the host element.
+ */
+
+/* Top */
+
+/* Constant */
+.slds-m-top_none,
+:host(.slds-m-top_none) {
+    margin-top: 0 !important;
+}
+
+.slds-m-top_xxx-small {
+    /* 0.125rem */
+    margin-block-start: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
+}
+
+.slds-m-top_xx-small {
+    margin-block-start: var(--slds-g-spacing-1, 0.25rem);
+}
+
+.slds-m-top_x-small {
+    margin-block-start: var(--slds-g-spacing-2, 0.5rem);
+}
+
+.slds-m-top_small {
+    margin-block-start: var(--slds-g-spacing-3, 0.75rem);
+}
+
+.slds-m-top_medium {
+    margin-block-start: var(--slds-g-spacing-4, 1rem);
+}
+
+.slds-m-top_large {
+    margin-block-start: var(--slds-g-spacing-5, 1.5rem);
+}
+
+.slds-m-top_x-large {
+    margin-block-start: var(--slds-g-spacing-6, 2rem);
+}
+
+.slds-m-top_xx-large {
+    margin-block-start: var(--slds-g-spacing-8, 3rem);
+}
+
+/* Right */
+
+.slds-m-right_none {
+    margin-inline-end: 0 !important;
+}
+
+.slds-m-right_xxx-small {
+    /* 0.125rem */
+    margin-inline-end: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
+}
+
+.slds-m-right_xx-small,
+:host(.slds-m-right_xx-small) {
+    margin-inline-end: var(--slds-g-spacing-1, 0.25rem);
+}
+
+.slds-m-right_x-small,
+:host(.slds-m-right_x-small) {
+    margin-inline-end: var(--slds-g-spacing-2, 0.5rem);
+}
+
+.slds-m-right_small,
+:host(.slds-m-right_small) {
+    margin-inline-end: var(--slds-g-spacing-3, 0.75rem);
+}
+
+.slds-m-right_medium {
+    margin-inline-end: var(--slds-g-spacing-4, 1rem);
+}
+
+.slds-m-right_large {
+    margin-inline-end: var(--slds-g-spacing-5, 1.5rem);
+}
+
+.slds-m-right_x-large {
+    margin-inline-end: var(--slds-g-spacing-6, 2rem);
+}
+
+.slds-m-right_xx-large {
+    margin-inline-end: var(--slds-g-spacing-8, 3rem);
+}
+
+/* Bottom */
+
+.slds-m-bottom_none,
+:host(.slds-m-bottom_none) {
+    margin-block-end: 0 !important;
+}
+
+.slds-m-bottom_xxx-small {
+    /* 0.125rem */
+    margin-block-end: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
+}
+
+.slds-m-bottom_xx-small {
+    margin-block-end: var(--slds-g-spacing-1, 0.25rem);
+}
+
+.slds-m-bottom_x-small {
+    margin-block-end: var(--slds-g-spacing-2, 0.5rem);
+}
+
+.slds-m-bottom_small {
+    margin-block-end: var(--slds-g-spacing-3, 0.75rem);
+}
+
+.slds-m-bottom_medium {
+    margin-block-end: var(--slds-g-spacing-4, 1rem);
+}
+
+.slds-m-bottom_large {
+    margin-block-end: var(--slds-g-spacing-5, 1.5rem);
+}
+
+.slds-m-bottom_x-large {
+    margin-block-end: var(--slds-g-spacing-6, 2rem);
+}
+
+.slds-m-bottom_xx-large {
+    margin-block-end: var(--slds-g-spacing-8, 3rem);
+}
+
+/* Left */
+
+.slds-m-left_none {
+    margin-inline-start: 0 !important;
+}
+
+.slds-m-left_xxx-small {
+    /* 0.125rem */
+    margin-inline-start: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
+}
+
+.slds-m-left_xx-small,
+:host(.slds-m-left_xx-small) {
+    margin-inline-start: var(--slds-g-spacing-1, 0.25rem);
+}
+
+.slds-m-left_x-small,
+:host(.slds-m-left_x-small) {
+    margin-inline-start: var(--slds-g-spacing-2, 0.5rem);
+}
+
+.slds-m-left_small {
+    margin-inline-start: var(--slds-g-spacing-3, 0.75rem);
+}
+
+.slds-m-left_medium {
+    margin-inline-start: var(--slds-g-spacing-4, 1rem);
+}
+
+.slds-m-left_large {
+    margin-inline-start: var(--slds-g-spacing-5, 1.5rem);
+}
+
+.slds-m-left_x-large {
+    margin-inline-start: var(--slds-g-spacing-6, 2rem);
+}
+
+.slds-m-left_xx-large,
+:host(.slds-m-left_xx-large) {
+    margin-inline-start: var(--slds-g-spacing-8, 3rem);
+}
+
+/* Horizontal */
+
+.slds-m-horizontal_none,
+:host(.slds-m-horizontal_none) {
+    margin-inline-start: 0 !important;
+    margin-inline-end: 0 !important;
+}
+
+.slds-m-horizontal_xxx-small {
+    /* 0.125rem */
+    margin-inline-start: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
+    margin-inline-end: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
+}
+
+.slds-m-horizontal_xx-small {
+    margin-inline-start: var(--slds-g-spacing-1, 0.25rem);
+    margin-inline-end: var(--slds-g-spacing-1, 0.25rem);
+}
+
+.slds-m-horizontal_x-small {
+    margin-inline-start: var(--slds-g-spacing-2, 0.5rem);
+    margin-inline-end: var(--slds-g-spacing-2, 0.5rem);
+}
+
+.slds-m-horizontal_small {
+    margin-inline-start: var(--slds-g-spacing-3, 0.75rem);
+    margin-inline-end: var(--slds-g-spacing-3, 0.75rem);
+}
+
+.slds-m-horizontal_medium {
+    margin-inline-start: var(--slds-g-spacing-4, 1rem);
+    margin-inline-end: var(--slds-g-spacing-4, 1rem);
+}
+
+.slds-m-horizontal_large {
+    margin-inline-start: var(--slds-g-spacing-5, 1.5rem);
+    margin-inline-end: var(--slds-g-spacing-5, 1.5rem);
+}
+
+.slds-m-horizontal_x-large {
+    margin-inline-start: var(--slds-g-spacing-6, 2rem);
+    margin-inline-end: var(--slds-g-spacing-6, 2rem);
+}
+
+.slds-m-horizontal_xx-large {
+    margin-inline-start: var(--slds-g-spacing-8, 3rem);
+    margin-inline-end: var(--slds-g-spacing-8, 3rem);
+}
+
+/* Vertical */
+
+.slds-m-vertical_none {
+    margin-block-start: 0 !important;
+    margin-block-end: 0 !important;
+}
+
+.slds-m-vertical_xxx-small {
+    /* 0.125rem */
+    margin-block-start: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
+    margin-block-end: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
+}
+
+.slds-m-vertical_xx-small {
+    margin-block-start: var(--slds-g-spacing-1, 0.25rem);
+    margin-block-end: var(--slds-g-spacing-1, 0.25rem);
+}
+
+.slds-m-vertical_x-small {
+    margin-block-start: var(--slds-g-spacing-2, 0.5rem);
+    margin-block-end: var(--slds-g-spacing-2, 0.5rem);
+}
+
+.slds-m-vertical_small {
+    margin-block-start: var(--slds-g-spacing-3, 0.75rem);
+    margin-block-end: var(--slds-g-spacing-3, 0.75rem);
+}
+
+.slds-m-vertical_medium {
+    margin-block-start: var(--slds-g-spacing-4, 1rem);
+    margin-block-end: var(--slds-g-spacing-4, 1rem);
+}
+
+.slds-m-vertical_large {
+    margin-block-start: var(--slds-g-spacing-5, 1.5rem);
+    margin-block-end: var(--slds-g-spacing-5, 1.5rem);
+}
+
+.slds-m-vertical_x-large {
+    margin-block-start: var(--slds-g-spacing-6, 2rem);
+    margin-block-end: var(--slds-g-spacing-6, 2rem);
+}
+
+.slds-m-vertical_xx-large {
+    margin-block-start: var(--slds-g-spacing-8, 3rem);
+    margin-block-end: var(--slds-g-spacing-8, 3rem);
+}
+
+/* Around */
+
+/* Constant */
+.slds-m-around_none {
+    margin: 0 !important;
+}
+
+.slds-m-around_xxx-small {
+    /* 0.125rem */
+    margin: calc(var(--slds-g-spacing-1, 0.25rem) / 2);
+}
+
+.slds-m-around_xx-small,
+:host(.slds-m-around_xx-small) {
+    margin: var(--slds-g-spacing-1, 0.25rem);
+}
+
+.slds-m-around_x-small {
+    margin: var(--slds-g-spacing-2, 0.5rem);
+}
+
+.slds-m-around_small {
+    margin: var(--slds-g-spacing-3, 0.75rem);
+}
+
+.slds-m-around_medium,
+:host(.slds-m-around_medium) {
+    margin: var(--slds-g-spacing-4, 1rem);
+}
+
+.slds-m-around_large,
+:host(.slds-m-around_large) {
+    margin: var(--slds-g-spacing-5, 1.5rem);
+}
+
+.slds-m-around_x-large {
+    margin: var(--slds-g-spacing-6, 2rem);
+}
+
+.slds-m-around_xx-large {
+    margin: var(--slds-g-spacing-8, 3rem);
+}

package/src/lightning/sldsUtilsMargin/sldsUtilsMargin.js-meta.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<LightningComponentBundle xmlns="xmlns=http://soap.sforce.com/2006/04/metadata">
+    <isExposed>true</isExposed>
+</LightningComponentBundle>