@orangesix/react 2.3.1 → 2.4.0-beta.3

package/style/scss/_fileupload.scss

@@ -1,41 +0,0 @@
-.p-fileupload {
-    .p-fileupload-buttonbar {
-        background: $panelHeaderBg;
-        padding: $panelHeaderPadding;
-        border: $panelHeaderBorder;
-        color: $panelHeaderTextColor;
-        border-bottom: 0 none;
-        border-top-right-radius: $borderRadius;
-        border-top-left-radius: $borderRadius;
-        gap: $inlineSpacing;
-        
-        .p-button {
-            margin-right: $inlineSpacing;
-        }
-    }
-
-    .p-fileupload-content {
-        background: $panelContentBg;
-        padding: $fileUploadContentPadding;
-        border: $panelContentBorder;
-        color: $panelContentTextColor;
-        border-bottom-right-radius: $borderRadius;
-        border-bottom-left-radius: $borderRadius;
-    }
-
-    .p-progressbar {
-        height: $fileUploadProgressBarHeight;
-    }
-
-    .p-fileupload-row {
-        > div {
-            padding: $tableBodyCellPadding;
-        }
-    }
-
-    &.p-fileupload-advanced {
-        .p-message {
-            margin-top: 0;
-        }
-    }
-}

package/style/scss/_filter.scss

@@ -1,138 +0,0 @@
-.p-column-filter-row {
-    .p-column-filter-menu-button,
-    .p-column-filter-clear-button {
-        margin-left: $inlineSpacing;
-    }
-}
-
-.p-column-filter-menu-button {
-    width: $actionIconWidth;
-    height: $actionIconHeight;
-    color: $actionIconColor;
-    border: $actionIconBorder;
-    background: $actionIconBg;
-    border-radius: $actionIconBorderRadius;
-    transition: $actionIconTransition;
-
-    &:hover {
-        color: $actionIconHoverColor;
-        border-color: $actionIconHoverBorderColor;
-        background: $actionIconHoverBg;
-    }
-
-    &.p-column-filter-menu-button-open,
-    &.p-column-filter-menu-button-open:hover {
-        background: $actionIconHoverBg;
-        color: $actionIconHoverColor;
-    }
-
-    &.p-column-filter-menu-button-active,
-    &.p-column-filter-menu-button-active:hover {
-        background: $highlightBg;
-        color: $highlightTextColor;
-    }
-
-    &:focus-visible {
-        @include focused();
-    }
-
-}
-
-.p-column-filter-clear-button {
-    width: $actionIconWidth;
-    height: $actionIconHeight;
-    color: $actionIconColor;
-    border: $actionIconBorder;
-    background: $actionIconBg;
-    border-radius: $actionIconBorderRadius;
-    transition: $actionIconTransition;
-
-    &:hover {
-        color: $actionIconHoverColor;
-        border-color: $actionIconHoverBorderColor;
-        background: $actionIconHoverBg;
-    }
-
-    &:focus-visible {
-        @include focused();
-    }
-}
-
-.p-column-filter-overlay {
-    background: $inputOverlayBg;
-    color: $inputListTextColor;
-    border: $inputOverlayBorder;
-    border-radius: $borderRadius;
-    box-shadow: $inputOverlayShadow;
-    min-width: $menuWidth;
-
-    .p-column-filter-row-items {
-        padding: $inputListPadding;
-
-        .p-column-filter-row-item {
-            margin: $inputListItemMargin;
-            padding: $inputListItemPadding;
-            border: $inputListItemBorder;
-            color: $inputListItemTextColor;
-            background: $inputListItemBg;
-            transition: $listItemTransition;
-            border-radius: $inputListItemBorderRadius;
-
-            &.p-highlight {
-                color: $highlightTextColor;
-                background: $highlightBg;
-            }
-
-            &:not(.p-highlight):not(.p-disabled):hover {
-                color: $inputListItemTextHoverColor;
-                background: $inputListItemHoverBg;
-            }
-
-            &:focus-visible {
-                @include focused-listitem();
-            }
-        }
-
-        .p-column-filter-separator {
-            border-top: $divider;
-            margin: $menuSeparatorMargin;
-        }
-    }
-}
-
-.p-column-filter-overlay-menu {
-    .p-column-filter-operator {
-        padding: $inputListHeaderPadding;
-        border-bottom: $inputListHeaderBorder;
-        color: $inputListHeaderTextColor;
-        background: $inputOverlayHeaderBg;
-        margin: $inputListHeaderMargin;
-        border-top-right-radius: $borderRadius;
-        border-top-left-radius: $borderRadius;
-    }
-
-    .p-column-filter-constraint {
-        padding: $panelContentPadding;
-        border-bottom: $divider;
-
-        .p-column-filter-matchmode-dropdown {
-            margin-bottom: $inlineSpacing;
-        }
-
-        .p-column-filter-remove-button {
-            margin-top: $inlineSpacing;
-        }
-
-        &:last-child {
-            border-bottom: 0 none;
-        }
-    }
-
-    .p-column-filter-add-rule {
-        padding: $panelFooterPadding;
-    }
-
-    .p-column-filter-buttonbar {
-        padding: $panelContentPadding;
-    } 
-}

package/style/scss/_galleria.scss

@@ -1,153 +0,0 @@
-.p-galleria {
-    .p-galleria-close {
-        margin: $galleriaCloseIconMargin;
-        background: $galleriaCloseIconBg;
-        color: $galleriaCloseIconColor;
-        width: $galleriaCloseIconWidth;
-        height: $galleriaCloseIconHeight;
-        transition: $actionIconTransition;
-        border-radius: $galleriaCloseIconBorderRadius;
-
-        .p-galleria-close-icon {
-            font-size: $galleriaCloseIconFontSize;
-
-            &.p-icon {
-                width: $galleriaCloseIconFontSize;
-                height: $galleriaCloseIconFontSize;
-            }
-        }
-
-        &:hover {
-            background: $galleriaCloseIconHoverBg;
-            color: $galleriaCloseIconHoverColor;
-        }
-    }
-
-    .p-galleria-item-nav {
-        background: $galleriaItemNavigatorBg;
-        color: $galleriaItemNavigatorColor;
-        width: $galleriaItemNavigatorWidth;
-        height: $galleriaItemNavigatorHeight;
-        transition: $actionIconTransition;
-        border-radius: $galleriaItemNavigatorBorderRadius;
-        margin: $galleriaItemNavigatorMargin;
-
-        .p-galleria-item-prev-icon,
-        .p-galleria-item-next-icon {
-            font-size: $galleriaItemNavigatorFontSize;
-
-            &.p-icon {
-                width: $galleriaCloseIconFontSize;
-                height: $galleriaCloseIconFontSize;
-            }
-        }
-
-        &:not(.p-disabled) {
-            &:hover {
-                background: $galleriaItemNavigatorHoverBg;
-                color: $galleriaItemNavigatorHoverColor;
-            }
-        }
-    }
-
-    .p-galleria-caption {
-        background: $galleriaCaptionBg;
-        color: $galleriaCaptionTextColor;
-        padding: $galleriaCaptionPadding;
-    }
-
-    .p-galleria-indicators {
-        padding: $galleriaIndicatorsPadding;
-
-        .p-galleria-indicator {
-            button {
-                background-color: $galleriaIndicatorBg;
-                width: $galleriaIndicatorWidth;
-                height: $galleriaIndicatorHeight;
-                transition: $actionIconTransition;
-                border-radius: $galleriaIndicatorBorderRadius;
-
-                &:hover {
-                    background: $galleriaIndicatorHoverBg;
-                }
-            }
-
-            &.p-highlight {
-                button {
-                    background: $highlightBg;
-                    color: $highlightTextColor;
-                }
-            }
-        }
-    }
-
-    &.p-galleria-indicators-bottom,
-    &.p-galleria-indicators-top {
-        .p-galleria-indicator {
-            margin-right: $inlineSpacing;
-        }
-    }
-
-    &.p-galleria-indicators-left,
-    &.p-galleria-indicators-right {
-        .p-galleria-indicator {
-            margin-bottom: $inlineSpacing;
-        }
-    }
-
-    &.p-galleria-indicator-onitem {
-        .p-galleria-indicators {
-            background: $galleriaIndicatorsBgOnItem;
-
-            .p-galleria-indicator {
-                button {
-                    background: $galleriaIndicatorBgOnItem;
-
-                    &:hover {
-                        background: $galleriaIndicatorHoverBgOnItem;
-                    }
-                }
-
-                &.p-highlight {
-                    button {
-                        background: $highlightBg;
-                        color: $highlightTextColor;
-                    }
-                }
-            }
-        }
-    }
-
-    .p-galleria-thumbnail-container {
-        background: $galleriaThumbnailContainerBg;
-        padding: $galleriaThumbnailContainerPadding;
-
-        .p-galleria-thumbnail-prev,
-        .p-galleria-thumbnail-next {
-            margin: $inlineSpacing;
-            background-color: $galleriaThumbnailNavigatorBg;
-            color: $galleriaThumbnailNavigatorColor;
-            width: $galleriaThumbnailNavigatorWidth;
-            height: $galleriaThumbnailNavigatorHeight;
-            transition: $actionIconTransition;
-            border-radius: $galleriaThumbnailNavigatorBorderRadius;
-
-            &:hover {
-                background: $galleriaThumbnailNavigatorHoverBg;
-                color: $galleriaThumbnailNavigatorHoverColor;
-            }
-        }
-
-        .p-galleria-thumbnail-item-content {
-            transition: $listItemTransition;
-            
-            &:focus-visible {
-                @include focused();
-            }
-        }
-    }
-}
-
-.p-galleria-mask {
-    --maskbg: #{$galleriaMaskBg};
-}

package/style/scss/_iconfield.scss

@@ -1,11 +0,0 @@
-// core
-.p-icon-field {
-  position: relative;
-  width: 100%;
-}
-
-.p-icon-field > .p-input-icon {
-  position: absolute;
-  top: 50%;
-  margin-top: -.7rem;
-}

package/style/scss/_image.scss

@@ -1,54 +0,0 @@
-.p-image-mask {
-    --maskbg: #{$imageMaskBg};
-}
-
-.p-image-preview-indicator {
-    background-color: transparent;
-    color: $imagePreviewIndicatorColor;
-    transition: $actionIconTransition;
-
-    .p-icon {
-        width: $imagePreviewActionIconFontSize;
-        height: $imagePreviewActionIconFontSize;
-    }
-}
-
-.p-image-preview-container {
-    &:hover {
-        > .p-image-preview-indicator {
-            background-color: $imagePreviewIndicatorBg;
-        }
-    }
-}
-
-.p-image-toolbar {
-    padding: $imagePreviewToolbarPadding;
-}
-
-.p-image-action.p-link {
-    color: $imagePreviewActionIconColor;
-    background-color: $imagePreviewActionIconBg;
-    width: $imagePreviewActionIconWidth;
-    height: $imagePreviewActionIconHeight;
-    border-radius: $imagePreviewActionIconBorderRadius;
-    transition: $actionIconTransition;
-    margin-right: $inlineSpacing;
-
-    &:last-child {
-        margin-right: 0;
-    }
-
-    &:hover {
-        color: $imagePreviewActionIconHoverColor;
-        background-color: $imagePreviewActionIconHoverBg;
-    }
-
-    span {
-        font-size: $imagePreviewActionIconFontSize;
-    }
-
-    .p-icon {
-        width: $imagePreviewActionIconFontSize;
-        height: $imagePreviewActionIconFontSize;
-    }
-}

package/style/scss/_inlinemessage.scss

@@ -1,69 +0,0 @@
-.p-inline-message {
-    padding: $inlineMessagePadding;
-    margin: $inlineMessageMargin;
-    border-radius: $borderRadius;
-
-    &.p-inline-message-info {
-        background: $infoMessageBg;
-        border: $infoMessageBorder;
-        border-width: $inlineMessageBorderWidth;
-        color: $infoMessageTextColor;
-
-        .p-inline-message-icon {
-            color: $infoMessageIconColor;
-        }
-    }
-
-    &.p-inline-message-success {
-        background: $successMessageBg;
-        border: $successMessageBorder;
-        border-width: $inlineMessageBorderWidth;
-        color: $successMessageTextColor;
-
-        .p-inline-message-icon {
-            color: $successMessageIconColor;
-        }
-    }
-
-    &.p-inline-message-warn {
-        background: $warningMessageBg;
-        border: $warningMessageBorder;
-        border-width: $inlineMessageBorderWidth;
-        color: $warningMessageTextColor;
-
-        .p-inline-message-icon {
-            color: $warningMessageIconColor;
-        }
-    }
-
-    &.p-inline-message-error {
-        background: $errorMessageBg;
-        border: $errorMessageBorder;
-        border-width: $inlineMessageBorderWidth;
-        color: $errorMessageTextColor;
-
-        .p-inline-message-icon {
-            color: $errorMessageIconColor;
-        }
-    }
-
-    .p-inline-message-icon {
-        font-size: $inlineMessageIconFontSize;
-        margin-right: $inlineSpacing;
-
-        &.p-icon {
-            width: $inlineMessageIconFontSize;
-            height: $inlineMessageIconFontSize;
-        }
-    }
-
-    .p-inline-message-text {
-        font-size: $inlineMessageTextFontSize;
-    }
-
-    &.p-inline-message-icon-only {
-        .p-inline-message-icon {
-            margin-right: 0;
-        }
-    }
-}

package/style/scss/_inplace.scss

@@ -1,17 +0,0 @@
-.p-inplace {
-    .p-inplace-display {
-        padding: $inplacePadding;
-        border-radius: $borderRadius;
-        transition: $formElementTransition;
-
-        &:not(.p-disabled):hover {
-            background: $inplaceHoverBg;
-            color: $inplaceTextHoverColor;
-        }
-
-        &:focus {
-            @include focused();
-        }
-    }
-}
-

package/style/scss/_inputgroup.scss

@@ -1,74 +0,0 @@
-.p-inputgroup-addon {
-    background: $inputGroupBg;
-    color: $inputGroupTextColor;
-    border-top: $inputBorder;
-    border-left: $inputBorder;
-    border-bottom: $inputBorder;
-    padding: $inputPadding;
-    min-width: $inputGroupAddOnMinWidth;
-
-    &:last-child {
-        border-right: $inputBorder;
-    }
-}
-
-.p-inputgroup {
-    > .p-component,
-    > .p-inputwrapper > .p-inputtext,
-    > .p-float-label > .p-component {
-        border-radius: 0;
-        margin: 0;
-
-        + .p-inputgroup-addon {
-            border-left: 0 none;
-        }
-
-        &:focus {
-            z-index: 1;
-
-            ~ label {
-                z-index: 1;
-            }
-        }
-    }
-}
-
-.p-inputgroup-addon:first-child,
-.p-inputgroup button:first-child,
-.p-inputgroup input:first-child,
-.p-inputgroup > .p-inputwrapper:first-child,
-.p-inputgroup > .p-inputwrapper:first-child > .p-inputtext {
-    border-top-left-radius: $borderRadius;
-    border-bottom-left-radius: $borderRadius;
-}
-
-.p-inputgroup .p-float-label:first-child input {
-    border-top-left-radius: $borderRadius;
-    border-bottom-left-radius: $borderRadius;
-}
-
-.p-inputgroup-addon:last-child,
-.p-inputgroup button:last-child,
-.p-inputgroup input:last-child,
-.p-inputgroup > .p-inputwrapper:last-child, 
-.p-inputgroup > .p-inputwrapper:last-child > .p-inputtext {
-    border-top-right-radius: $borderRadius;
-    border-bottom-right-radius: $borderRadius;
-}
-
-.p-inputgroup .p-float-label:last-child input {
-    border-top-right-radius: $borderRadius;
-    border-bottom-right-radius: $borderRadius;
-}
-
-.p-fluid {
-    .p-inputgroup {
-        .p-button {
-            width: auto;
-
-            &.p-button-icon-only {
-                width: $buttonIconOnlyWidth;
-            }
-        }
-    }
-}

package/style/scss/_inputicon.scss

@@ -1,15 +0,0 @@
-// core
-.p-fluid .p-icon-field-left,
-.p-fluid .p-icon-field-right {
-    width: 100%;
-}
-
-.p-icon-field-left > .p-input-icon:first-of-type {
-    left: nth($inputPadding, 2);
-    color: $inputIconColor;
-}
-
-.p-icon-field-right > .p-input-icon:last-of-type  {
-    right: nth($inputPadding, 2);
-    color: $inputIconColor;
-}

package/style/scss/_inputnumber.scss

@@ -1,5 +0,0 @@
-.p-inputnumber {
-    &.p-invalid.p-component > .p-inputtext {
-        @include invalid-input();
-    }
-}

package/style/scss/_inputotp.scss

@@ -1,10 +0,0 @@
-.p-inputotp {
-    display: flex;
-    align-items: center;
-    gap: $inlineSpacing;
-}
-
-.p-inputotp-input {
-    text-align: center;
-    width: 2 * nth($inputPadding, 2) + 1rem;
-}

package/style/scss/_inputswitch.scss

@@ -1,110 +0,0 @@
-@use 'sass:math';
-
-//core
-.p-inputswitch {
-  position: relative;
-  display: inline-block;
-}
-
-.p-inputswitch-input {
-  appearance: none;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  margin: 0;
-  opacity: 0;
-  z-index: 1;
-  outline: 0 none;
-  cursor: pointer;
-}
-
-.p-inputswitch-slider {
-  position: absolute;
-  cursor: pointer;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  border: 1px solid transparent;
-}
-
-.p-inputswitch-legend {
-  font-size: 1em;
-  color: $shade600;
-}
-
-.p-inputswitch-slider:before {
-  position: absolute;
-  content: '';
-  top: 50%;
-}
-
-//theme
-.p-inputswitch {
-  width: $inputSwitchWidth;
-  height: $inputSwitchHeight;
-
-  .p-inputswitch-input {
-    border-radius: $inputSwitchBorderRadius;
-  }
-
-  .p-inputswitch-slider {
-    background: $inputSwitchSliderOffBg;
-    transition: $formElementTransition;
-    border-radius: $inputSwitchBorderRadius;
-    outline-color: transparent;
-
-    &:before {
-      background: $inputSwitchHandleOffBg;
-      width: $inputSwitchHandleWidth;
-      height: $inputSwitchHandleHeight;
-      left: $inputSwitchSliderPadding;
-      margin-top: math.div(-1 * $inputSwitchHandleHeight, 2);
-      border-radius: $inputSwitchHandleBorderRadius;
-      transition-duration: $transitionDuration;
-    }
-  }
-
-  .p-inputswitch-legend {
-    font-size: $inputSwitchLegendFontSize;
-    color: $inputSwitchLegendColor;
-  }
-
-  &.p-highlight {
-    .p-inputswitch-slider {
-      background: $inputSwitchSliderOnBg;
-
-      &:before {
-        background: $inputSwitchHandleOnBg;
-        transform: translateX($inputSwitchHandleWidth);
-      }
-    }
-  }
-
-  &:not(.p-disabled) {
-    &:has(.p-inputswitch-input:hover) {
-      .p-inputswitch-slider {
-        background: $inputSwitchSliderOffHoverBg;
-      }
-
-      &.p-highlight {
-        .p-inputswitch-slider {
-          background: $inputSwitchSliderOnHoverBg;
-        }
-      }
-    }
-
-    &:has(.p-inputswitch-input:focus-visible) {
-      .p-inputswitch-slider {
-        @include focused();
-      }
-    }
-  }
-
-  &.p-invalid > .p-inputswitch-slider {
-    @include invalid-input();
-  }
-}