@dynamic-framework/ui-react 1.36.2 → 2.0.0-dev.10

package/dist/types/components/DInputCurrencyBase/DInputCurrencyBase.d.ts

@@ -1,26 +0,0 @@
-/// <reference types="react" />
-import type { Options } from 'currency.js';
-type NonDInputProps = {
-    value?: number;
-    minValue?: number;
-    maxValue?: number;
-    currencyOptions: Options;
-    currencyCode?: string;
-    onChange?: (value?: number) => void;
-};
-declare const ForwardedDInputCurrencyBase: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "value" | "onChange">, "size" | "loading" | "label" | "value" | "invalid" | "onChange" | keyof import("../interface").BaseProps | keyof import("../interface").FamilyIconProps | keyof import("../interface").LabelIconProps | keyof import("../interface").StartIconProps | keyof import("../interface").EndIconProps | "hint" | "valid" | "floatingLabel" | "inputStart" | "inputEnd" | "onIconStartClick" | "onIconEndClick"> & import("../interface").BaseProps & import("../interface").FamilyIconProps & import("../interface").LabelIconProps & import("../interface").StartIconProps & import("../interface").EndIconProps & {
-    value?: string | undefined;
-    label?: string | undefined;
-    loading?: boolean | undefined;
-    hint?: string | undefined;
-    size?: import("../interface").ComponentSize | undefined;
-    invalid?: boolean | undefined;
-    valid?: boolean | undefined;
-    floatingLabel?: boolean | undefined;
-    inputStart?: import("react").ReactNode;
-    inputEnd?: import("react").ReactNode;
-    onChange?: ((value: string) => void) | undefined;
-    onIconStartClick?: ((value?: string | undefined) => void) | undefined;
-    onIconEndClick?: ((value?: string | undefined) => void) | undefined;
-} & import("react").RefAttributes<HTMLInputElement>, "ref">, "value" | "type" | "onChange">, keyof NonDInputProps> & NonDInputProps & import("react").RefAttributes<HTMLInputElement>>;
-export default ForwardedDInputCurrencyBase;

package/dist/types/components/DInputCurrencyBase/index.d.ts

@@ -1,2 +0,0 @@
-import DInputCurrencyBase from './DInputCurrencyBase';
-export default DInputCurrencyBase;

package/dist/types/components/DInputSearch/DInputSearch.d.ts

@@ -1,17 +0,0 @@
-/// <reference types="react" />
-declare const ForwardedDInputSearch: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "value" | "onChange">, "size" | "loading" | "label" | "value" | "invalid" | "onChange" | keyof import("../interface").BaseProps | keyof import("../interface").FamilyIconProps | keyof import("../interface").LabelIconProps | keyof import("../interface").StartIconProps | keyof import("../interface").EndIconProps | "hint" | "valid" | "floatingLabel" | "inputStart" | "inputEnd" | "onIconStartClick" | "onIconEndClick"> & import("../interface").BaseProps & import("../interface").FamilyIconProps & import("../interface").LabelIconProps & import("../interface").StartIconProps & import("../interface").EndIconProps & {
-    value?: string | undefined;
-    label?: string | undefined;
-    loading?: boolean | undefined;
-    hint?: string | undefined;
-    size?: import("../interface").ComponentSize | undefined;
-    invalid?: boolean | undefined;
-    valid?: boolean | undefined;
-    floatingLabel?: boolean | undefined;
-    inputStart?: import("react").ReactNode;
-    inputEnd?: import("react").ReactNode;
-    onChange?: ((value: string) => void) | undefined;
-    onIconStartClick?: ((value?: string | undefined) => void) | undefined;
-    onIconEndClick?: ((value?: string | undefined) => void) | undefined;
-} & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
-export default ForwardedDInputSearch;

package/dist/types/components/DInputSearch/index.d.ts

@@ -1,2 +0,0 @@
-import DInputSearch from './DInputSearch';
-export default DInputSearch;

package/dist/types/components/DList/DList.d.ts

@@ -1,17 +0,0 @@
-import type { PropsWithChildren } from 'react';
-import DListItem from './components/DListItem';
-import type { BaseProps, BreakpointSize } from '../interface';
-type Props = BaseProps & PropsWithChildren<{
-    flush?: boolean;
-    numbered?: boolean;
-    horizontal?: boolean;
-    horizontalBreakpoint?: BreakpointSize;
-}>;
-/**
- * @deprecated Please use DListGroup instead
- */
-declare function DList({ children, className, style, flush, numbered, horizontal, horizontalBreakpoint, dataAttributes, }: Props): import("react/jsx-runtime").JSX.Element;
-declare const _default: typeof DList & {
-    Item: typeof DListItem;
-};
-export default _default;

package/dist/types/components/DList/components/DListItem.d.ts

@@ -1,13 +0,0 @@
-import type { PropsWithChildren } from 'react';
-import type { BaseProps } from '../../interface';
-type Props = BaseProps & PropsWithChildren<{
-    active?: boolean;
-    disabled?: boolean;
-    theme?: string;
-    onClick?: () => void;
-}>;
-/**
- * @deprecated Please use DListGroup.Item or DListGroupItem instead
- */
-export default function DListItem({ children, className, style, active, disabled, theme, onClick, }: Props): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/components/DList/index.d.ts

@@ -1,3 +0,0 @@
-import DList from './DList';
-export { default as DListItem } from './components/DListItem';
-export default DList;

package/dist/types/components/DQuickActionButton/DQuickActionButton.d.ts

@@ -1,20 +0,0 @@
-import type { BaseProps } from '../interface';
-type Props = BaseProps & {
-    line1: string;
-    line2: string;
-    actionIcon?: string;
-    actionIconTheme?: string;
-    actionIconFamilyClass?: string;
-    actionIconFamilyPrefix?: string;
-    representativeImage?: string;
-    representativeIcon?: string;
-    representativeIconTheme?: string;
-    representativeIconHasCircle?: boolean;
-    representativeIconFamilyClass?: string;
-    representativeIconFamilyPrefix?: string;
-    href?: string;
-    hrefTarget?: string;
-    onClick?: () => void;
-};
-export default function DQuickActionButton({ line1, line2, className, actionIcon, actionIconFamilyClass, actionIconFamilyPrefix, actionIconTheme, representativeImage, representativeIcon, representativeIconTheme, representativeIconHasCircle, representativeIconFamilyClass, representativeIconFamilyPrefix, onClick, href, hrefTarget, style, dataAttributes, }: Props): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/components/DQuickActionButton/index.d.ts

@@ -1,2 +0,0 @@
-import DQuickActionButton from './DQuickActionButton';
-export default DQuickActionButton;

package/dist/types/components/DQuickActionCheck/DQuickActionCheck.d.ts

@@ -1,17 +0,0 @@
-import type { ChangeEvent } from 'react';
-import type { BaseProps } from '../interface';
-type Props = BaseProps & {
-    id?: string;
-    name: string;
-    value: string;
-    line1: string;
-    line2: string;
-    line3: string;
-    checked?: boolean;
-    onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
-};
-/**
- * @deprecated
- */
-export default function DQuickActionCheck({ id: idProp, name, value, line1, line2, line3, className, style, checked, dataAttributes, onChange, }: Props): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/components/DQuickActionCheck/index.d.ts

@@ -1,2 +0,0 @@
-import DQuickActionCheck from './DQuickActionCheck';
-export default DQuickActionCheck;

package/dist/types/components/DQuickActionSelect/DQuickActionSelect.d.ts

@@ -1,13 +0,0 @@
-import type { ChangeEvent } from 'react';
-import type { BaseProps } from '../interface';
-type Props = BaseProps & {
-    id?: string;
-    name: string;
-    value: string;
-    line1: string;
-    line2: string;
-    selected?: boolean;
-    onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
-};
-export default function DQuickActionSelect({ id: idProp, name, value, line1, line2, className, style, selected, dataAttributes, onChange, }: Props): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/components/DQuickActionSelect/index.d.ts

@@ -1,2 +0,0 @@
-import DQuickActionSelect from './DQuickActionSelect';
-export default DQuickActionSelect;

package/dist/types/components/DQuickActionSwitch/DQuickActionSwitch.d.ts

@@ -1,15 +0,0 @@
-import type { BaseProps } from '../interface';
-type Props = BaseProps & {
-    id?: string;
-    name?: string;
-    label: string;
-    hint: string;
-    checked?: boolean;
-    disabled?: boolean;
-    onClick?: (isChecked: boolean | undefined) => void;
-};
-/**
- * @deprecated
- */
-export default function DQuickActionSwitch({ id: idProp, name, label, hint, checked, disabled, className, style, dataAttributes, onClick, }: Props): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/components/DQuickActionSwitch/index.d.ts

@@ -1,2 +0,0 @@
-import DQuickActionSwitch from './DQuickActionSwitch';
-export default DQuickActionSwitch;

package/dist/types/components/DSkeleton/DSkeleton.d.ts

@@ -1,11 +0,0 @@
-import type { PropsWithChildren } from 'react';
-export type Props = PropsWithChildren<{
-    speed?: number;
-    viewBox?: string;
-    backgroundColor?: string;
-    foregroundColor?: string;
-}>;
-/**
- * @deprecated Please use https://getbootstrap.com/docs/5.3/components/placeholders/ instead
- */
-export default function DSkeleton({ speed, viewBox, backgroundColor, foregroundColor, children, }: Props): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/DSkeleton/index.d.ts

@@ -1,2 +0,0 @@
-import DSkeleton from './DSkeleton';
-export default DSkeleton;

package/dist/types/components/DTableHead/DTableHead.d.ts

@@ -1,9 +0,0 @@
-import { BaseProps } from '../interface';
-type Props = BaseProps & {
-    field: string;
-    label: string;
-    value?: string;
-    onChange: (value: string) => void;
-};
-export default function DTableHead({ className, style, field, label, value, onChange, }: Props): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/components/DTableHead/index.d.ts

@@ -1,2 +0,0 @@
-import DTableHead from './DTableHead';
-export default DTableHead;

package/src/style/components/_d-quick-action-button.scss

@@ -1,121 +0,0 @@
-.d-quick-action-button {
-  --#{$prefix}quick-action-button-gap: #{$quick-action-button-gap};
-  --#{$prefix}quick-action-button-padding: #{$quick-action-button-padding};
-  --#{$prefix}quick-action-button-bg: #{$quick-action-button-bg};
-  --#{$prefix}quick-action-button-border-radius: var(--#{$prefix}quick-action-button-component-border-radius, #{$quick-action-button-border-radius});
-  --#{$prefix}quick-action-button-border: #{$quick-action-button-border};
-  --#{$prefix}quick-action-button-box-shadow: #{$quick-action-button-box-shadow};
-
-  --#{$prefix}quick-action-button-border-top: var(--#{$prefix}quick-action-button-component-border-top, var(--#{$prefix}quick-action-button-border));
-  --#{$prefix}quick-action-button-border-right: var(--#{$prefix}quick-action-button-component-border-right, var(--#{$prefix}quick-action-button-border));
-  --#{$prefix}quick-action-button-border-bottom: var(--#{$prefix}quick-action-button-component-border-bottom, var(--#{$prefix}quick-action-button-border));
-  --#{$prefix}quick-action-button-border-left: var(--#{$prefix}quick-action-button-component-border-left, var(--#{$prefix}quick-action-button-border));
-
-  --#{$prefix}quick-action-button-line1-font-size: #{$quick-action-button-line1-font-size};
-  --#{$prefix}quick-action-button-line1-font-weight: #{$quick-action-button-line1-font-weight};
-  --#{$prefix}quick-action-button-line1-color: #{$quick-action-button-line1-color};
-
-  --#{$prefix}quick-action-button-line2-font-size: #{$quick-action-button-line2-font-size};
-  --#{$prefix}quick-action-button-line2-font-weight: #{$quick-action-button-line2-font-weight};
-  --#{$prefix}quick-action-button-line2-color: #{$quick-action-button-line2-color};
-
-  --#{$prefix}quick-action-button-representative-image-size: #{$quick-action-button-representative-image-size};
-  --#{$prefix}quick-action-button-representative-image-border-radius: #{$quick-action-button-representative-image-border-radius};
-  --#{$prefix}quick-action-button-representative-icon-size: #{$quick-action-button-representative-icon-size};
-
-  --#{$prefix}quick-action-button-action-icon-color: #{$quick-action-button-action-icon-color};
-  --#{$prefix}quick-action-button-action-icon-size: #{$quick-action-button-action-icon-size};
-  --#{$prefix}quick-action-button-action-link-padding-x: var(--#{$prefix}ref-spacer-3);
-  --#{$prefix}quick-action-button-action-link-padding-y: var(--#{$prefix}ref-spacer-2);
-
-  --#{$prefix}quick-action-button-hover-bg: #{$quick-action-button-hover-bg};
-  --#{$prefix}quick-action-button-hover-border-color: #{$quick-action-button-hover-border-color};
-  --#{$prefix}quick-action-button-hover-action-icon-color: #{$quick-action-button-hover-action-icon-color};
-  --#{$prefix}quick-action-button-hover-box-shadow: #{$quick-action-button-hover-box-shadow};
-
-  --#{$prefix}quick-action-button-active-bg: #{$quick-action-button-active-bg};
-  --#{$prefix}quick-action-button-active-border-color: #{$quick-action-button-active-border-color};
-  --#{$prefix}quick-action-button-active-action-icon-color: #{$quick-action-button-active-action-icon-color};
-  --#{$prefix}quick-action-button-active-box-shadow: #{$quick-action-button-active-box-shadow};
-
-  display: flex;
-  gap: var(--#{$prefix}quick-action-button-gap);
-  align-items: center;
-  width: 100%;
-  padding: var(--#{$prefix}quick-action-button-padding);
-  text-align: left;
-  background-color: var(--#{$prefix}quick-action-button-bg);
-  background-position: center;
-  border-top: var(--#{$prefix}quick-action-button-border-top);
-  border-right: var(--#{$prefix}quick-action-button-border-right);
-  border-bottom: var(--#{$prefix}quick-action-button-border-bottom);
-  border-left: var(--#{$prefix}quick-action-button-border-left);
-  border-radius: var(--#{$prefix}quick-action-button-border-radius);
-  box-shadow: var(--#{$prefix}quick-action-button-box-shadow);
-
-  &.d-quick-action-button-feedback:hover {
-    text-decoration: none;
-    background: var(--#{$prefix}quick-action-button-hover-bg);
-    border-color: var(--#{$prefix}quick-action-button-hover-border-color);
-    box-shadow: var(--#{$prefix}quick-action-button-hover-box-shadow);
-  }
-
-  &.d-quick-action-button-feedback:active {
-    text-decoration: none;
-    background: var(--#{$prefix}quick-action-button-active-bg);
-    border-color: var(--#{$prefix}quick-action-button-active-border-color);
-    box-shadow: var(--#{$prefix}quick-action-button-active-box-shadow);
-  }
-
-  .d-quick-action-button-representative-image {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: var(--#{$prefix}quick-action-button-representative-image-size);
-    height: var(--#{$prefix}quick-action-button-representative-image-size);
-    background-color: var(--#{$prefix}quick-action-button-action-icon-color);
-    border-radius: var(--#{$prefix}quick-action-button-representative-image-border-radius);
-  }
-
-  .d-quick-action-button-content {
-    display: flex;
-    flex: 1;
-    justify-content: center;
-  }
-
-  .d-quick-action-button-text {
-    display: flex;
-    flex-grow: 1;
-    flex-direction: column;
-  }
-
-  .d-quick-action-button-action-link,
-  .d-quick-action-button-secondary-action-link {
-    --#{$prefix}btn-padding-x: var(--#{$prefix}quick-action-button-action-link-padding-x);
-    --#{$prefix}btn-padding-y: var(--#{$prefix}quick-action-button-action-link-padding-y);
-  }
-
-  .d-quick-action-button-line1 {
-    font-size: var(--#{$prefix}quick-action-button-line1-font-size);
-    font-weight: var(--#{$prefix}quick-action-button-line1-font-weight);
-    color: var(--#{$prefix}quick-action-button-line1-color);
-  }
-
-  .d-quick-action-button-line2 {
-    font-size: var(--#{$prefix}quick-action-button-line2-font-size);
-    font-weight: var(--#{$prefix}quick-action-button-line2-font-weight);
-    color: var(--#{$prefix}quick-action-button-line2-color);
-  }
-
-  .d-quick-action-button-action-icon {
-    color: var(--#{$prefix}quick-action-button-action-icon-color);
-  }
-
-  &:hover .d-quick-action-button-action-icon {
-    color: var(--#{$prefix}quick-action-button-active-action-icon-color);
-  }
-
-  &:active .d-quick-action-button-action-icon {
-    color: var(--#{$prefix}quick-action-button-active-action-icon-color);
-  }
-}

package/src/style/components/_d-quick-action-check.scss

@@ -1,74 +0,0 @@
-.d-quick-action-check {
-  --#{$prefix}quick-action-check-gap: #{$quick-action-check-gap};
-  --#{$prefix}quick-action-check-padding: #{$quick-action-check-padding};
-  --#{$prefix}quick-action-check-bg: #{$quick-action-check-bg};
-  --#{$prefix}quick-action-check-border-radius: #{$quick-action-check-border-radius};
-
-  --#{$prefix}quick-action-check-line1-font-size: #{$quick-action-check-line1-font-size};
-  --#{$prefix}quick-action-check-line1-font-weight: #{$quick-action-check-line1-font-weight};
-  --#{$prefix}quick-action-check-line1-color: #{$quick-action-check-line1-color};
-
-  --#{$prefix}quick-action-check-line2-font-size: #{$quick-action-check-line2-font-size};
-  --#{$prefix}quick-action-check-line2-font-weight: #{$quick-action-check-line2-font-weight};
-  --#{$prefix}quick-action-check-line2-color: #{$quick-action-check-line2-color};
-
-  --#{$prefix}quick-action-check-line3-font-size: #{$quick-action-check-line3-font-size};
-  --#{$prefix}quick-action-check-line3-font-weight: #{$quick-action-check-line3-font-weight};
-  --#{$prefix}quick-action-check-line3-color: #{$quick-action-check-line3-color};
-
-  --#{$prefix}quick-action-check-hover-bg: #{$quick-action-check-hover-bg};
-
-  --#{$prefix}quick-action-check-checked-bg: #{$quick-action-check-checked-bg};
-  --#{$prefix}quick-action-check-checked-color: #{$quick-action-check-checked-color};
-
-  display: flex;
-  flex-direction: row;
-  gap: var(--#{$prefix}quick-action-check-gap);
-  align-items: center;
-  width: 100%;
-  padding: var(--#{$prefix}quick-action-check-padding);
-  text-align: left;
-  cursor: pointer;
-  background-color: var(--#{$prefix}quick-action-check-bg);
-  border-radius: var(--#{$prefix}quick-action-check-border-radius);
-
-  &:hover {
-    background: var(--#{$prefix}quick-action-check-hover-bg);
-  }
-
-  &:has(input:checked) {
-    background: var(--#{$prefix}quick-action-check-checked-bg);
-
-    .d-quick-action-check-line3 {
-      color: var(--#{$prefix}quick-action-check-checked-color);
-    }
-  }
-
-  .d-quick-action-check-detail {
-    display: flex;
-    flex-grow: 1;
-    flex-direction: column;
-  }
-
-  .d-quick-action-check-line1 {
-    font-size: var(--#{$prefix}quick-action-check-line1-font-size);
-    font-weight: var(--#{$prefix}quick-action-check-line1-font-weight);
-    color: var(--#{$prefix}quick-action-check-line1-color);
-  }
-
-  .d-quick-action-check-line2 {
-    font-size: var(--#{$prefix}quick-action-check-line2-font-size);
-    font-weight: var(--#{$prefix}quick-action-check-line2-font-weight);
-    color: var(--#{$prefix}quick-action-check-line2-color);
-  }
-
-  .d-quick-action-check-line3 {
-    font-size: var(--#{$prefix}quick-action-check-line3-font-size);
-    font-weight: var(--#{$prefix}quick-action-check-line3-font-weight);
-    color: var(--#{$prefix}quick-action-check-line3-color);
-  }
-
-  .form-check-input:focus {
-    outline: 0;
-  }
-}

package/src/style/components/_d-quick-action-select.scss

@@ -1,58 +0,0 @@
-.d-quick-action-select {
-  --#{$prefix}quick-action-select-padding: #{$quick-action-select-padding};
-  --#{$prefix}quick-action-select-bg: #{$quick-action-select-bg};
-  --#{$prefix}quick-action-select-border-radius: #{$quick-action-select-border-radius};
-
-  --#{$prefix}quick-action-select-line1-font-size: #{$quick-action-select-line1-font-size};
-  --#{$prefix}quick-action-select-line1-font-weight: #{$quick-action-select-line1-font-weight};
-  --#{$prefix}quick-action-select-line1-color: #{$quick-action-select-line1-color};
-
-  --#{$prefix}quick-action-select-line2-font-size: #{$quick-action-select-line2-font-size};
-  --#{$prefix}quick-action-select-line2-font-weight: #{$quick-action-select-line2-font-weight};
-  --#{$prefix}quick-action-select-line2-color: #{$quick-action-select-line2-color};
-
-  --#{$prefix}quick-action-select-hover-bg: #{$quick-action-select-hover-bg};
-
-  --#{$prefix}quick-action-select-checked-bg: #{$quick-action-select-checked-bg};
-  --#{$prefix}quick-action-select-checked-color: #{$quick-action-select-checked-color};
-
-  display: flex;
-  flex-direction: column;
-  gap: 0;
-  align-items: flex-start;
-  width: 100%;
-  padding: var(--#{$prefix}quick-action-select-padding);
-  text-align: left;
-  cursor: pointer;
-  background-color: var(--#{$prefix}quick-action-select-bg);
-  border-radius: var(--#{$prefix}quick-action-select-border-radius);
-
-  input {
-    display: none;
-  }
-
-  &:hover {
-    background: var(--#{$prefix}quick-action-select-hover-bg);
-  }
-
-  &:has(input:checked) {
-    background: var(--#{$prefix}quick-action-select-checked-bg);
-
-    .d-quick-action-select-line1,
-    .d-quick-action-select-line2 {
-      color: var(--#{$prefix}quick-action-select-checked-color);
-    }
-  }
-
-  .d-quick-action-select-line1 {
-    font-size: var(--#{$prefix}quick-action-select-line1-font-size);
-    font-weight: var(--#{$prefix}quick-action-select-line1-font-weight);
-    color: var(--#{$prefix}quick-action-select-line1-color);
-  }
-
-  .d-quick-action-select-line2 {
-    font-size: var(--#{$prefix}quick-action-select-line2-font-size);
-    font-weight: var(--#{$prefix}quick-action-select-line2-font-weight);
-    color: var(--#{$prefix}quick-action-select-line2-color);
-  }
-}

package/src/style/components/_d-quick-action-switch.scss

@@ -1,64 +0,0 @@
-.d-quick-action-switch {
-  --#{$prefix}quick-action-switch-gap: #{$quick-action-switch-gap};
-  --#{$prefix}quick-action-switch-padding: #{$quick-action-switch-padding};
-  --#{$prefix}quick-action-switch-bg: #{$quick-action-switch-bg};
-  --#{$prefix}quick-action-switch-border-radius: #{$quick-action-switch-border-radius};
-
-  --#{$prefix}quick-action-switch-content-gap: #{$quick-action-switch-content-gap};
-
-  --#{$prefix}quick-action-switch-label-font-size: #{$quick-action-switch-label-font-size};
-  --#{$prefix}quick-action-switch-label-font-weight: #{$quick-action-switch-label-font-weight};
-
-  --#{$prefix}quick-action-switch-hint-font-size: #{$quick-action-switch-hint-font-size};
-  --#{$prefix}quick-action-switch-hint-font-weight: #{$quick-action-switch-hint-font-weight};
-  --#{$prefix}quick-action-switch-hint-color: #{$quick-action-switch-hint-color};
-
-  --#{$prefix}quick-action-switch-hover-bg: #{$quick-action-switch-hover-bg};
-
-  --#{$prefix}quick-action-switch-checked-bg: #{$quick-action-switch-checked-bg};
-  --#{$prefix}quick-action-switch-checked-hint-color: #{$quick-action-switch-checked-hint-color};
-
-  display: flex;
-  flex-direction: column;
-  gap: var(--#{$prefix}quick-action-switch-gap);
-  width: 100%;
-  padding: var(--#{$prefix}quick-action-switch-padding);
-  text-align: left;
-  cursor: pointer;
-  background-color: var(--#{$prefix}quick-action-switch-bg);
-  border: 0;
-  border-radius: var(--#{$prefix}quick-action-switch-border-radius);
-
-  &:hover {
-    background: var(--#{$prefix}quick-action-switch-hover-bg);
-  }
-
-  &:has(input:checked) {
-    background: var(--#{$prefix}quick-action-switch-checked-bg);
-
-    .d-quick-action-switch-hint {
-      color: var(--#{$prefix}quick-action-switch-checked-hint-color);
-    }
-  }
-
-  .d-quick-action-switch-content {
-    display: flex;
-    flex-direction: row;
-    gap: var(--#{$prefix}quick-action-switch-content-gap);
-  }
-
-  label {
-    --#{$prefix}label-font-size: var(--#{$prefix}quick-action-switch-label-font-size);
-    --#{$prefix}label-font-weight: var(--#{$prefix}quick-action-switch-label-font-weight);
-  }
-
-  .d-quick-action-switch-hint {
-    font-size: var(--#{$prefix}quick-action-switch-hint-font-size);
-    font-weight: var(--#{$prefix}quick-action-switch-hint-font-weight);
-    color: var(--#{$prefix}quick-action-switch-hint-color);
-  }
-
-  .d-input-switch:focus-within.form-switch .form-check-input {
-    outline: 0;
-  }
-}