@ntbjs/react-components 2.0.0-rc.13 → 2.0.0-rc.27

package/esm/components/widgets/AssetGallery/AssetGalleryBase/AssetGalleryCompactCard/AssetGalleryCompactCard.styled.js

@@ -1,358 +0,0 @@
-import { rgba } from 'polished';
-import styled, { css } from 'styled-components';
-import { applyDefaultTheme } from '../../../../../utils/defaultTheme.js';
-import { FloatingArrow } from '@floating-ui/react';
-
-let _ = t => t,
-  _t,
-  _t2,
-  _t3,
-  _t4,
-  _t5,
-  _t6,
-  _t7,
-  _t8,
-  _t9,
-  _t0,
-  _t1,
-  _t10,
-  _t11,
-  _t12,
-  _t13,
-  _t14,
-  _t15,
-  _t16,
-  _t17,
-  _t18,
-  _t19,
-  _t20,
-  _t21,
-  _t22,
-  _t23,
-  _t24,
-  _t25,
-  _t26,
-  _t27;
-const shouldForwardProp = prop => {
-  return prop !== 'theme' && !prop.startsWith('$');
-};
-const AssetGalleryWrapper = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t || (_t = _`
-  ${0};
-`), props => props.disabled && css(_t2 || (_t2 = _`
-      cursor: not-allowed;
-    `)));
-const Reference = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t3 || (_t3 = _`
-  width: 100%;
-  height: 100%;
-`));
-const AssetGalleryCompactCard = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t4 || (_t4 = _`
-  display: block;
-  height: 100%;
-  padding-left: ${0}px;
-  padding-right: ${0}px;
-  padding-top: ${0}px;
-  box-sizing: border-box;
-  cursor: pointer;
-
-  ${0};
-
-  ${0};
-
-  ${0};
-
-  ${0}
-  video {
-    width: 100%;
-    height: 100%;
-  }
-
-  .audio {
-    display: flex;
-    justify-content: center;
-    svg {
-      width: 25%;
-    }
-  }
-`), props => props.selected ? 1 : 0, props => props.selected ? 1 : 0, props => props.selected ? 1 : 0, props => props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-300')), props => props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-700')), props => props.disabled && css(_t5 || (_t5 = _`
-      pointer-events: none;
-      opacity: 0.4;
-    `)), props => props.extendedSelectMode && css(_t6 || (_t6 = _`
-      cursor: pointer;
-    `)));
-const Figure = styled.figure(_t7 || (_t7 = _`
-  display: flex;
-  flex-direction: row;
-  flex-wrap: nowrap;
-  justify-content: center;
-  align-items: center;
-  position: relative;
-  margin: 0;
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-
-  .lazy-load-image-background {
-    display: block !important;
-  }
-
-  img {
-    display: block;
-    height: 100%;
-    width: 100%;
-    ${0}
-  }
-`), props => props.$hasHeightAndWidth ? css(_t8 || (_t8 = _`
-            object-fit: cover;
-          `)) : css(_t9 || (_t9 = _`
-            object-fit: contain;
-          `)));
-const FigureOverlayBackdrop = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t0 || (_t0 = _`
-  position: absolute;
-  inset: 0;
-  opacity: ${0};
-  background-color: ${0};
-`), props => props.selected ? 0.6 : 0, props => props.selected ? '#ACCEF7' : 'transparent');
-const Overlay = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t1 || (_t1 = _`
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-`));
-const OverlayBackdrop = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t10 || (_t10 = _`
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  opacity: 0;
-  transition: opacity 220ms;
-
-  ${0}
-  ${0}
-    ${0}:hover & {
-    opacity: 1;
-  }
-`), props => !props.selected ? css(_t11 || (_t11 = _`
-          background: radial-gradient(
-            ellipse at center,
-            rgba(0, 0, 0, 0.3) 27%,
-            rgba(0, 0, 0, 0.5) 60%,
-            rgba(0, 0, 0, 0.7) 90%
-          );
-        `)) : null, props => (props.selected || props.$softSelected) && css(_t12 || (_t12 = _`
-      opacity: 1;
-    `)), Overlay);
-const OverlayInfo = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t13 || (_t13 = _`
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  padding: 15px 50px 10px 12px;
-  color: ${0};
-  & span {
-    overflow: hidden;
-    word-wrap: break-word;
-  }
-`), props => props.theme.getColor('gray-100'));
-const OverlayCompleted = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t14 || (_t14 = _`
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  pointer-events: none;
-  transition: border-color 120ms;
-  border: 3px solid;
-  ${0};
-`), props => {
-  if (props.$softSelected) return null;
-  return props.theme.themeProp('border-color', props.theme.getColor('emerald-500'), rgba(props.theme.getColor('emerald-500'), 0.7));
-});
-const OverlayHasError = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t15 || (_t15 = _`
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  pointer-events: none;
-  transition: border-color 120ms;
-  border: 3px solid;
-  ${0}
-`), props => {
-  if (props.$softSelected) return null;
-  return props.theme.themeProp('border-color', props.theme.getColor('red-600'), rgba(props.theme.getColor('red-500'), 0.7));
-});
-const OverlaySelected = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t16 || (_t16 = _`
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  pointer-events: none;
-  transition: border-color 120ms;
-  border-style: solid;
-  border-width: 3px;
-
-  ${0};
-`), props => {
-  if (props.$softSelected) {
-    return props.theme.themeProp('border-color', rgba(props.theme.getColor('gray-100'), 0.5), rgba(props.theme.getColor('gray-700'), 0.5));
-  }
-  if (props.selected) {
-    if (props.customSelectedBorder) {
-      return props.theme.themeProp('border-color', props.customSelectedBorder[0], props.customSelectedBorder[1]);
-    } else {
-      return props.theme.themeProp('border-color', props.theme.getColor('gray-100'), props.theme.getColor('gray-700'));
-    }
-  }
-  return props.theme.themeProp('border-color', 'transparent', 'transparent');
-});
-const OverlayInfoTop = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t17 || (_t17 = _`
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 0;
-  padding: 8px;
-  display: flex;
-`));
-const OverlayInfoTopActions = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t18 || (_t18 = _`
-  position: absolute;
-  top: 0;
-  right: 0;
-  padding: 4px;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  transition: opacity 220ms;
-  z-index: 99999;
-  ${0}
-
-  opacity: ${0};
-`), props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-700')), props => props.$isOverlayHovered ? 1 : 0);
-const OverlayInfoTopLeft = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t19 || (_t19 = _`
-  opacity: 1;
-  display: ${0};
-
-  ${0}:hover & {
-    opacity: 0;
-  }
-`), props => props !== null && props !== void 0 && props.$collapseExtraInfo ? 'none' : 'block', Overlay);
-const OverlayInfoTopWarning = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t20 || (_t20 = _`
-  margin-left: auto;
-  height: 24px;
-  width: 24px;
-  border-radius: 50%;
-  box-sizing: border-box;
-  padding: ${0};
-  background-color: ${0};
-  opacity: 1;
-
-  svg {
-    width: 100%;
-    color: ${0};
-  }
-
-  ${0}:hover & {
-    opacity: 0;
-  }
-`), props => props.type === 'error' ? 0 : '3px 4px', props => props.type === 'error' ? props.theme.getColor('red-500') : props.theme.getColor('gray-100'), props => props.type === 'error' ? props.theme.getColor('gray-100') : props.theme.getColor('gray-700'), Overlay);
-const OverlayInfoBottom = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t21 || (_t21 = _`
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  padding: 8px;
-  display: flex;
-`));
-const OverlayInfoBottomSelectButton = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t22 || (_t22 = _`
-  opacity: ${0};
-  flex-shrink: 0;
-  cursor: pointer;
-  transition: opacity 220ms;
-  height: 24px;
-
-  > svg {
-    width: 24px;
-    height: 24px;
-    transition: opacity 120ms;
-    opacity: ${0};
-  }
-
-  ${0}:hover & {
-    opacity: 1;
-  }
-`), props => props.selected ? 1 : 0, props => props.selected ? 1 : 0.5, Overlay);
-const OverlayInfoBottomMediaIcon = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t23 || (_t23 = _`
-  margin-left: auto;
-  opacity: 1;
-
-  ${0}:hover & {
-    opacity: 0;
-  }
-`), Overlay);
-const ConsumerDefinedOverlay = styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t24 || (_t24 = _`
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  pointer-events: none;
-`));
-styled.div(_t25 || (_t25 = _`
-  margin: 4px;
-`));
-styled.div.withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t26 || (_t26 = _`
-  ${0}
-  padding: 4px 8px;
-  border-radius: 4px;
-`), props => props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white')));
-const StyledFloatingArrow = styled(FloatingArrow).withConfig({
-  shouldForwardProp
-}).attrs(applyDefaultTheme)(_t27 || (_t27 = _`
-  ${0}
-`), props => props.theme.themeProp('fill', props.theme.getColor('gray-700'), props.theme.getColor('white')));
-
-export { AssetGalleryCompactCard, AssetGalleryWrapper, ConsumerDefinedOverlay, Figure, FigureOverlayBackdrop, Overlay, OverlayBackdrop, OverlayCompleted, OverlayHasError, OverlayInfo, OverlayInfoBottom, OverlayInfoBottomMediaIcon, OverlayInfoBottomSelectButton, OverlayInfoTop, OverlayInfoTopActions, OverlayInfoTopLeft, OverlayInfoTopWarning, OverlaySelected, Reference, StyledFloatingArrow };