"use strict";

exports.__esModule = true;
exports.argTypesNG = exports.argTypes = exports.CONTENT_OPTIONS = void 0;
var imageKit = _interopRequireWildcard(require("@wix/image-kit"));
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
const CONTENT_OPTIONS = exports.CONTENT_OPTIONS = {
  'Paints and Brush - 5000 * 2763': {
    uri: '11062b_9c53b59db1dc4bd4ad7a47340f0594b4~mv2.jpg',
    width: 5000,
    height: 2763
  },
  'Yellow Flower - 3333 * 5000': {
    uri: '11062b_a1495416958849dd8682868426dd876b~mv2.jpg',
    width: 3333,
    height: 5000
  },
  'Popsicles - 4912 * 7360': {
    uri: '11062b_bdbc8112d5bd4e3988b694612ca6cfd3~mv2.jpg',
    width: 4912,
    height: 7360
  }
};
const argTypes = exports.argTypes = {
  name: {
    description: 'Name of the image, used for generating a pretty URL (choose a preset here)',
    control: 'select',
    defaultValue: 'Paints and Brush - 5000 * 2753',
    table: {
      type: {
        summary: 'string'
      }
    },
    options: ['Paints and Brush - 5000 * 2753', 'Yellow Flower - 3333 * 5000', 'Popsicles - 4912 * 7360', 'Pattern - 300 * 300']
  },
  uri: {
    description: 'URI of the original image',
    control: 'false',
    table: {
      type: {
        summary: 'string'
      }
    }
  },
  height: {
    description: 'Height of the original source image',
    table: {
      type: {
        summary: 'number'
      }
    },
    control: false
  },
  width: {
    description: 'Width of the original source image',
    table: {
      type: {
        summary: 'number'
      }
    },
    control: false
  },
  isInFirstFold: {
    control: 'boolean',
    defaultValue: false,
    description: 'If true, render high quality image in SSR (currently only supported for images with known fixed size)',
    table: {
      type: {
        summary: 'boolean'
      }
    }
  },
  displayMode: {
    control: 'select',
    options: ['fill', 'fit', 'stretch', 'original_size'],
    description: "Method to use for fitting the image into its container (like CSS's object-fit property)",
    defaultValue: 'fill',
    table: {
      type: {
        summary: 'FittingType'
      }
    }
  },
  devicePixelRatio: {
    control: 'number',
    description: 'Force a pixel-ratio to use for loading the image. Defaults to DPR of the device and using 2 as max',
    table: {
      type: {
        summary: 'number'
      }
    }
  },
  alignType: {
    control: 'select',
    options: Object.values(imageKit.alignTypes),
    description: "Alignment of the image. To note: if the image is larger than the container and the display mode is not set to fit or stretch, the alignment will refer to the container's position on the image. Otherwise, it will refer to the position of the image within the container.",
    table: {
      type: {
        summary: 'AlignType'
      }
    }
  },
  targetWidth: {
    control: 'number',
    description: "Override for the rendered image element's width",
    table: {
      type: {
        summary: 'number'
      }
    }
  },
  targetHeight: {
    control: 'number',
    description: "Override for the rendered image element's height",
    table: {
      type: {
        summary: 'number'
      }
    }
  },
  targetScale: {
    control: 'number',
    description: 'Override for the image src dimensions',
    table: {
      type: {
        summary: 'number'
      }
    }
  },
  containerWidth: {
    control: 'number',
    defaultValue: 900,
    description: 'Width in pixels of the container element',
    table: {
      type: {
        summary: 'number'
      }
    }
  },
  containerHeight: {
    control: 'number',
    defaultValue: 600,
    description: 'Height in pixels of the container element',
    table: {
      type: {
        summary: 'number'
      }
    }
  },
  shouldUseLQIP: {
    control: 'boolean',
    defaultValue: true,
    description: 'Indicates whether component should use a low quality placeholder before loading the final high-quality image',
    table: {
      type: {
        summary: 'boolean'
      }
    }
  },
  placeHolderTransition: {
    control: 'select',
    options: ['blur', 'null'],
    defaultValue: 'blur',
    description: 'Method of transition to use between placeholder and final image',
    table: {
      type: {
        summary: 'string'
      }
    }
  },
  isSEOBot: {
    control: 'boolean',
    defaultValue: false,
    description: 'If true, render high quality image for indexing robots',
    table: {
      type: {
        summary: 'boolean'
      }
    }
  },
  crop: {
    control: 'object',
    defaultValue: {
      x: null,
      y: null,
      width: null,
      height: null,
      svgId: null,
      flip: null,
      rotate: null
    },
    description: 'Image crop (x & y are coordinates of the pixel to start cropping from). Flip and rotate parameters are relevant only if svgId is provided.',
    table: {
      type: {
        summary: 'Crop'
      }
    }
  },
  focalPoint: {
    control: 'object',
    defaultValue: {
      x: null,
      y: null
    },
    description: 'Image focal point (0 - 100). Relevant only if displayMode is set to fill, actual_size and original_size.',
    table: {
      type: {
        summary: 'FocalPoint'
      }
    }
  }
};
const argTypesNG = exports.argTypesNG = {
  id: {
    description: 'rendered id on the root element',
    control: 'input',
    defaultValue: 'resp-img-comp',
    table: {
      type: {
        summary: 'string'
      }
    }
  },
  alt: {
    description: 'alt to render on the image (will not render if decorative=true)',
    control: 'text',
    defaultValue: '',
    table: {
      type: {
        summary: 'string'
      }
    }
  },
  priority: {
    description: 'loading priority',
    control: 'select',
    options: ['high', 'low'],
    defaultValue: 'low',
    table: {
      type: {
        summary: 'Priority'
      }
    }
  },
  decorative: {
    description: 'whether the image is decorative (renders empty alt and aria-hidden=true)',
    control: 'boolean',
    defaultValue: false,
    table: {
      type: {
        summary: 'boolean'
      }
    }
  },
  role: {
    description: 'role to render on the image',
    control: 'select',
    options: ['none', 'img', 'presentation'],
    defaultValue: 'none',
    table: {
      type: {
        summary: 'Role'
      }
    }
  },
  image: {
    control: 'select',
    options: Object.keys(CONTENT_OPTIONS),
    description: 'image content to display',
    defaultValue: Object.keys(CONTENT_OPTIONS)[0],
    table: {
      type: {
        summary: 'Image'
      }
    }
  },
  breakpoints: {
    description: 'viewport width breakpoints for responsive behavior',
    control: 'object',
    defaultValue: [],
    table: {
      type: {
        summary: 'number[]'
      }
    }
  },
  resolutions: {
    description: 'possible resolutions (given by width) for the image',
    control: 'object',
    defaultValue: [2000, 1750, 1500, 1250, 1000, 750, 500, 250],
    table: {
      type: {
        summary: 'number[]'
      }
    }
  },
  quality: {
    description: 'requested image quality in percentage',
    control: 'number',
    defaultValue: 85,
    min: 0,
    max: 100,
    table: {
      type: {
        summary: 'number'
      }
    }
  },
  crop: {
    description: 'crop in percentages with breakpoint overrides',
    control: 'object',
    defaultValue: [{
      x: 0,
      y: 0,
      width: 100,
      height: 100
    }],
    table: {
      type: {
        summary: 'Object[]'
      }
    }
  },
  focalPoint: {
    description: 'focal point in percentages with breakpoint overrides',
    control: 'object',
    defaultValue: [{
      x: 50,
      y: 50
    }],
    table: {
      type: {
        summary: 'Object[]'
      }
    }
  },
  objectFit: {
    description: 'object-fit with breakpoint overrides',
    control: 'object',
    defaultValue: ['cover'],
    table: {
      type: {
        summary: 'Object[]'
      }
    }
  }
  // TODO(ameerabuf) - do we need this?
  // unsharpMask: {
  //   description: 'unsharp mask option',
  //   control: 'select',
  //   options: [],
  //   defaultValue: '',
  //   table: {
  //     type: {
  //       summary: 'OptionUnsharpMask',
  //     },
  //   },
  // },
};
//# sourceMappingURL=args.js.map