@linzjs/lui 21.34.1-2 → 21.35.0

package/dist/scss/base.scss

@@ -51,7 +51,6 @@
 @forward './Components/MenuV2/menu-v2.scss';
 @forward './Components/Messaging/messaging.scss';
 @forward './Components/Modal/modal.scss';
-@forward './Components/Modal/modal-v2.scss';
 @forward './Components/LuiUpdateSplashModal/splashModal.scss';
 @forward './Components/NavDrawer/nav-drawer.scss';
 @forward './Components/Notifications/notifications.scss';

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "21.34.1-2",
+  "version": "21.35.0",
   "license": "MIT",
   "repository": {
     "type": "git",

package/dist/components/LuiModal/LuiAlertModalV2.d.ts

@@ -1,7 +0,0 @@
-import { FC, PropsWithChildren } from 'react';
-import { LuiModalV2Props } from './LuiModalV2';
-export declare type LuiAlertModalLevel = 'success' | 'info' | 'warning' | 'error';
-export declare type LuiAlertModalV2Props = Omit<LuiModalV2Props, 'headingIcon'> & {
-    level: LuiAlertModalLevel;
-};
-export declare const LuiAlertModalV2: FC<PropsWithChildren<LuiAlertModalV2Props>>;

package/dist/components/LuiModal/LuiModalV2.d.ts

@@ -1,30 +0,0 @@
-import { FC, PropsWithChildren, ReactNode } from 'react';
-import { LuiIconProps } from '../LuiIcon/LuiIcon';
-export declare type LuiModalV2Props = {
-    key?: string;
-    /** Default `true` */
-    shouldCloseOnOverlayClick?: boolean;
-    /** Default `true` */
-    shouldCloseOnEsc?: boolean | 'use-keyup';
-    onClose?: () => void | Promise<void>;
-    showCloseButton?: boolean;
-    className?: string;
-    /** If set to true, the modal will take the full screen width. Default `false` */
-    maxWidth?: boolean;
-    headingText?: ReactNode;
-    headingIcon?: LuiIconProps;
-    helpLink?: string | (() => void | Promise<void>);
-    isLoading?: boolean;
-    /** Sets the overlay to white. This is only to be used for situations when the user is working in a component and there is benefit to hiding the surrounding page. An example is editing types of instruments in the Dealings flow in LOL. */
-    lowContrast?: boolean;
-    /** By default, the modal autofocuses the first `input` or `button` inside it. Set this prop to `true` to disable that behaviour. Default `false`. */
-    preventAutoFocus?: boolean;
-    /** By default, the modal portal will be appended to the document's body, but we might need to append it to another element. This is passed the React Modal `parentSelector` prop. */
-    appendToElement?: () => HTMLElement;
-};
-export declare const LuiModalV2: FC<PropsWithChildren<LuiModalV2Props>>;
-export declare const LuiModalV2Buttons: FC<PropsWithChildren<unknown>>;
-/** Allows injecting the modal header text */
-export declare const LuiModalV2HeadingText: FC<{
-    children?: ReactNode;
-}>;

package/dist/scss/Components/Modal/modal-v2.scss

@@ -1,122 +0,0 @@
-@use '../../Foundation/Variables/ColorVars.scss' as colors;
-@use '../../Foundation/Variables/FontVars.scss' as fonts;
-@use '../../Foundation/Variables/SpacingVars.scss' as spacing;
-@use '../../Foundation/Utilities' as *;
-
-.lui-modal-v2 {
-  position: relative;
-  max-height: 90vh;
-  min-width: 288px;
-  overflow: auto;
-
-  border-left: 0px solid transparent;
-  @include border-radius();
-  padding: spacing.$unit-md;
-
-  background: colors.$white;
-
-  display: grid;
-  grid-template-columns: min-content 1fr min-content min-content;
-  grid-template-rows: min-content 1fr;
-
-  &:not(.lui-max-width) {
-    width: 480px;
-  }
-
-  &-success,
-  &-info,
-  &-warning,
-  &-error {
-    border-width: spacing.$unit-xs;
-    padding-left: spacing.$unit-rg;
-  }
-
-  &-success {
-    border-color: colors.$success;
-  }
-
-  &-info {
-    border-color: colors.$info;
-  }
-
-  &-warning {
-    border-color: colors.$warning;
-  }
-
-  &-error {
-    border-color: colors.$error;
-  }
-
-  .lui-modal-v2-btn-row {
-    margin-top: spacing.$unit-md;
-    display: flex;
-    > button {
-      flex-grow: 1;
-      flex-basis: 0;
-    }
-  }
-
-  &-header {
-    grid-column: 1 / -1;
-    grid-row: 1;
-    display: grid;
-    grid-template-columns: subgrid;
-    grid-auto-flow: column;
-    align-items: start;
-    padding-bottom: spacing.$unit-rg;
-
-    &:not(:has(:first-child)) {
-      display: none;
-    }
-
-    &-spinner,
-    &-icon {
-      grid-column: 1;
-      margin-right: spacing.$unit-xs;
-      margin-top: spacing.$unit-xxs;
-      display: inline-flex;
-      fill: colors.$gray;
-    }
-
-    &-title {
-      color: inherit;
-      grid-column: 2;
-      font-size: 1.25rem;
-      font-weight: 400;
-      margin: 0;
-      padding: 0;
-    }
-
-    &-buttons {
-      display: contents;
-      margin-left: spacing.$unit-xs;
-
-      > button {
-        fill: colors.$gray;
-        background-color: transparent;
-        padding: spacing.$unit-xs;
-        margin-top: -1 * spacing.$unit-xxs;
-        margin-bottom: -1 * spacing.$unit-xs;
-        display: inline-flex;
-        align-items: center;
-      }
-    }
-
-    &-help-btn {
-      grid-column: 3;
-    }
-
-    &-close-btn {
-      grid-column: 4;
-    }
-  }
-
-  &-contents {
-    grid-column: 1 / -1;
-
-    > p {
-      // this is a bit of a hacky "reset" due to 1) our <p>s having a very opinionated margin-top and 2) <p> being a very common first child of <LuiModalV2>... ideally we'd fix 1 or the consumers would do this reset themselves but I reckong having this reset in the modal css is the least painful option at the moment
-      margin-top: 0;
-    }
-  }
-}