@codecademy/brand 4.0.0 → 5.0.0-alpha.19accb830.0

package/dist/DropdownButton/index.js

@@ -1,169 +1,136 @@
-import _styled from "@emotion/styled/base";
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import { FillButton, IconButton, Popover, StrokeButton, TextButton } from '@codecademy/gamut';
-import { ArrowChevronDownFilledIcon, MiniKebabMenuIcon } from '@codecademy/gamut-icons';
-import { css, pxRem, styledOptions } from '@codecademy/gamut-styles';
-import { forwardRef, useId, useImperativeHandle, useRef, useState } from 'react';
-import * as React from 'react';
-import { DropdownList } from './DropdownList';
-import { useDynamicPopoverPosition } from './useDynamicPopoverPosition';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const DownArrow = /*#__PURE__*/_styled(ArrowChevronDownFilledIcon, _extends({}, {
-  target: "e1mfstzo1",
-  label: "DownArrow"
-}, styledOptions))("margin-left:", pxRem(8), ";transition:transform 0.35s ease-out;", ({
-  isOpen
-}) => isOpen && 'transform: rotate(-180deg)', ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9Ecm9wZG93bkJ1dHRvbi9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBK0JFIiwiZmlsZSI6Ii4uLy4uL3NyYy9Ecm9wZG93bkJ1dHRvbi9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBCdXR0b25Qcm9wcyxcbiAgRmlsbEJ1dHRvbixcbiAgSWNvbkJ1dHRvbixcbiAgUG9wb3ZlcixcbiAgUG9wb3ZlclByb3BzLFxuICBQb3BvdmVyWVBvc2l0aW9uVHlwZSxcbiAgU3Ryb2tlQnV0dG9uLFxuICBUZXh0QnV0dG9uLFxufSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XG5pbXBvcnQge1xuICBBcnJvd0NoZXZyb25Eb3duRmlsbGVkSWNvbixcbiAgTWluaUtlYmFiTWVudUljb24sXG59IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LWljb25zJztcbmltcG9ydCB7IGNzcywgcHhSZW0sIHN0eWxlZE9wdGlvbnMgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHtcbiAgZm9yd2FyZFJlZixcbiAgUHJvcHNXaXRoQ2hpbGRyZW4sXG4gIHVzZUlkLFxuICB1c2VJbXBlcmF0aXZlSGFuZGxlLFxuICB1c2VSZWYsXG4gIHVzZVN0YXRlLFxufSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgKiBhcyBSZWFjdCBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IERyb3Bkb3duTGlzdCwgRHJvcGRvd25MaXN0UHJvcHMgfSBmcm9tICcuL0Ryb3Bkb3duTGlzdCc7XG5pbXBvcnQgeyB1c2VEeW5hbWljUG9wb3ZlclBvc2l0aW9uIH0gZnJvbSAnLi91c2VEeW5hbWljUG9wb3ZlclBvc2l0aW9uJztcblxuY29uc3QgRG93bkFycm93ID0gc3R5bGVkKEFycm93Q2hldnJvbkRvd25GaWxsZWRJY29uLCBzdHlsZWRPcHRpb25zKTx7XG4gIGlzT3Blbj86IGJvb2xlYW47XG59PmBcbiAgbWFyZ2luLWxlZnQ6ICR7cHhSZW0oOCl9O1xuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4zNXMgZWFzZS1vdXQ7XG4gICR7KHsgaXNPcGVuIH0pID0+IGlzT3BlbiAmJiAndHJhbnNmb3JtOiByb3RhdGUoLTE4MGRlZyknfTtcbmA7XG5cbmNvbnN0IEhvcml6b250YWxLZWJhYkljb24gPSBzdHlsZWQoTWluaUtlYmFiTWVudUljb24pKFxuICBjc3Moe1xuICAgIHRyYW5zZm9ybTogJ3JvdGF0ZSg5MGRlZyknLFxuICB9KVxuKTtcblxuZXhwb3J0IHR5cGUgRHJvcGRvd25CdXR0b25SZWZUeXBlID0ge1xuICBmb2N1czogSFRNTEJ1dHRvbkVsZW1lbnRbJ2ZvY3VzJ107XG59O1xuXG5leHBvcnQgdHlwZSBEcm9wZG93bkJ1dHRvblByb3BzID0gUHJvcHNXaXRoQ2hpbGRyZW48XG4gIHtcbiAgICBhbGlnbj86IFBvcG92ZXJQcm9wc1snYWxpZ24nXTtcbiAgICBidXR0b25UeXBlPzogJ2ZpbGwnIHwgJ3N0cm9rZScgfCAndGV4dCcgfCAna2ViYWInIHwgJ2hvcml6b250YWxLZWJhYic7XG4gICAgZGVmYXVsdFBvc2l0aW9uPzogUG9wb3ZlcllQb3NpdGlvblR5cGVbJ3Bvc2l0aW9uJ107XG4gICAgZHJvcGRvd25JdGVtczogRHJvcGRvd25MaXN0UHJvcHNbJ2Ryb3Bkb3duSXRlbXMnXTtcbiAgICBob3Jpem9udGFsT2Zmc2V0PzogbnVtYmVyO1xuICAgIC8qKlxuICAgICAqIFNldHMgdGhlIHNpemUgb2YgdGhlIGRvd24gYXJyb3cgaWNvbiBpbiB0aGUgYnV0dG9ucyB0aGF0IGhhdmUgdGV4dCBvciB0aGUga2ViYWIgYW5kIGhvcml6b250YWwga2ViYWIgaWNvbnMuXG4gICAgICovXG4gICAgaWNvblNpemU/OiBudW1iZXI7XG4gICAgLyoqXG4gICAgICogSWYgdGhlIGRyb3Bkb3duIHNob3VsZCBzZW1hbnRpY2FsbHkgYmUgYSBtZW51XG4gICAgICovXG4gICAgaXNNZW51PzogYm9vbGVhbjtcbiAgICBvbkNsaWNrPzogKGV2ZW50OiBSZWFjdC5Nb3VzZUV2ZW50KSA9PiB2b2lkO1xuICAgIHRpcFByb3BzPzogUmVhY3QuQ29tcG9uZW50UHJvcHM8dHlwZW9mIEljb25CdXR0b24+Wyd0aXBQcm9wcyddO1xuICAgIHZlcnRpY2FsT2Zmc2V0PzogbnVtYmVyO1xuICB9ICYgQnV0dG9uUHJvcHNcbj47XG5cbmV4cG9ydCBjb25zdCBEcm9wZG93bkJ1dHRvbiA9IGZvcndhcmRSZWY8XG4gIERyb3Bkb3duQnV0dG9uUmVmVHlwZSxcbiAgRHJvcGRvd25CdXR0b25Qcm9wc1xuPihcbiAgKFxuICAgIHtcbiAgICAgIGFsaWduID0gJ2xlZnQnLFxuICAgICAgYnV0dG9uVHlwZSA9ICdmaWxsJyxcbiAgICAgIGNoaWxkcmVuLFxuICAgICAgZGVmYXVsdFBvc2l0aW9uID0gJ2JlbG93JyxcbiAgICAgIGRyb3Bkb3duSXRlbXMsXG4gICAgICBob3Jpem9udGFsT2Zmc2V0LFxuICAgICAgaWNvblNpemUsXG4gICAgICBpc01lbnUsXG4gICAgICBvbkNsaWNrLFxuICAgICAgdGlwUHJvcHMsXG4gICAgICB2ZXJ0aWNhbE9mZnNldCA9IDAsXG4gICAgICBzaXplLFxuICAgICAgdmFyaWFudCA9ICdwcmltYXJ5JyxcbiAgICAgIC4uLmJ1dHRvblN0eWxlUHJvcHNcbiAgICB9LFxuICAgIHJlZlxuICApID0+IHtcbiAgICBjb25zdCBidXR0b25JZCA9IHVzZUlkKCk7XG4gICAgY29uc3QgdGFyZ2V0UmVmID0gdXNlUmVmPEhUTUxBbmNob3JFbGVtZW50IHwgSFRNTEJ1dHRvbkVsZW1lbnQ+KG51bGwpO1xuICAgIGNvbnN0IHsgcG9zaXRpb24sIHBvcG92ZXJDb250YWluZXJSZWZDYWxsYmFjayB9ID0gdXNlRHluYW1pY1BvcG92ZXJQb3NpdGlvbihcbiAgICAgIHtcbiAgICAgICAgdGFyZ2V0UmVmLFxuICAgICAgICB2ZXJ0aWNhbE9mZnNldCxcbiAgICAgICAgZGVmYXVsdFBvc2l0aW9uLFxuICAgICAgfVxuICAgICk7XG5cbiAgICBjb25zdCBbaXNPcGVuLCBzZXRJc09wZW5dID0gdXNlU3RhdGUoZmFsc2UpO1xuXG4gICAgdXNlSW1wZXJhdGl2ZUhhbmRsZShyZWYsICgpID0+ICh7XG4gICAgICBmb2N1czogKCkgPT4gdGFyZ2V0UmVmLmN1cnJlbnQ/LmZvY3VzKCksXG4gICAgfSkpO1xuXG4gICAgY29uc3QgaGFuZGxlQ2xpY2sgPSAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQpID0+IHtcbiAgICAgIGlmICghaXNPcGVuKSB7XG4gICAgICAgIG9uQ2xpY2s/LihldmVudCk7XG4gICAgICB9XG4gICAgICBzZXRJc09wZW4oIWlzT3Blbik7XG4gICAgfTtcbiAgICBjb25zdCBoYW5kbGVSZXF1ZXN0Q2xvc2VkID0gKCkgPT4ge1xuICAgICAgc2V0SXNPcGVuKGZhbHNlKTtcbiAgICB9O1xuXG4gICAgY29uc3QgdGV4dEJ1dHRvbkRlZmF1bHRTaXplID0gJ25vcm1hbCc7XG4gICAgY29uc3QgaWNvbkJ1dHRvbkRlZmF1bHRTaXplID0gJ3NtYWxsJztcblxuICAgIGxldCBjbGlja1RhcmdldDogUmVhY3QuUmVhY3ROb2RlO1xuICAgIHN3aXRjaCAoYnV0dG9uVHlwZSkge1xuICAgICAgY2FzZSAnZmlsbCc6XG4gICAgICAgIGNsaWNrVGFyZ2V0ID0gKFxuICAgICAgICAgIDxGaWxsQnV0dG9uXG4gICAgICAgICAgICByZWY9e3RhcmdldFJlZn1cbiAgICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9e2lzT3Blbn1cbiAgICAgICAgICAgIGlkPXtidXR0b25JZH1cbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1maWxsLWJ1dHRvblwiXG4gICAgICAgICAgICBzaXplPXtzaXplIHx8IHRleHRCdXR0b25EZWZhdWx0U2l6ZX1cbiAgICAgICAgICAgIHZhcmlhbnQ9e3ZhcmlhbnR9XG4gICAgICAgICAgICB7Li4uKGJ1dHRvblN0eWxlUHJvcHMgPz8ge30pfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgICAgIDxEb3duQXJyb3cgaXNPcGVuPXtpc09wZW59IHNpemU9e2ljb25TaXplIHx8IDEyfSAvPlxuICAgICAgICAgIDwvRmlsbEJ1dHRvbj5cbiAgICAgICAgKTtcbiAgICAgICAgYnJlYWs7XG4gICAgICBjYXNlICdzdHJva2UnOlxuICAgICAgICBjbGlja1RhcmdldCA9IChcbiAgICAgICAgICA8U3Ryb2tlQnV0dG9uXG4gICAgICAgICAgICByZWY9e3RhcmdldFJlZn1cbiAgICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9e2lzT3Blbn1cbiAgICAgICAgICAgIGlkPXtidXR0b25JZH1cbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1zdHJva2UtYnV0dG9uXCJcbiAgICAgICAgICAgIHNpemU9e3NpemUgfHwgdGV4dEJ1dHRvbkRlZmF1bHRTaXplfVxuICAgICAgICAgICAgdmFyaWFudD17dmFyaWFudH1cbiAgICAgICAgICAgIHsuLi4oYnV0dG9uU3R5bGVQcm9wcyA/PyB7fSl9XG4gICAgICAgICAgPlxuICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICAgICAgPERvd25BcnJvdyBpc09wZW49e2lzT3Blbn0gc2l6ZT17aWNvblNpemUgfHwgMTJ9IC8+XG4gICAgICAgICAgPC9TdHJva2VCdXR0b24+XG4gICAgICAgICk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAndGV4dCc6XG4gICAgICAgIGNsaWNrVGFyZ2V0ID0gKFxuICAgICAgICAgIDxUZXh0QnV0dG9uXG4gICAgICAgICAgICByZWY9e3RhcmdldFJlZn1cbiAgICAgICAgICAgIGlkPXtidXR0b25JZH1cbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1zdHJva2UtYnV0dG9uXCJcbiAgICAgICAgICAgIHNpemU9e3NpemUgfHwgdGV4dEJ1dHRvbkRlZmF1bHRTaXplfVxuICAgICAgICAgICAgdmFyaWFudD17dmFyaWFudH1cbiAgICAgICAgICAgIHsuLi4oYnV0dG9uU3R5bGVQcm9wcyA/PyB7fSl9XG4gICAgICAgICAgPlxuICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICAgICAgPERvd25BcnJvdyBpc09wZW49e2lzT3Blbn0gc2l6ZT17MTJ9IC8+XG4gICAgICAgICAgPC9UZXh0QnV0dG9uPlxuICAgICAgICApO1xuICAgICAgICBicmVhaztcbiAgICAgIGNhc2UgJ2tlYmFiJzpcbiAgICAgICAgY2xpY2tUYXJnZXQgPSAoXG4gICAgICAgICAgPEljb25CdXR0b25cbiAgICAgICAgICAgIHJlZj17dGFyZ2V0UmVmfVxuICAgICAgICAgICAgYXJpYS1leHBhbmRlZD17aXNPcGVufVxuICAgICAgICAgICAgYXJpYS1oYXNwb3B1cD1cIm1lbnVcIlxuICAgICAgICAgICAgaWQ9e2J1dHRvbklkfVxuICAgICAgICAgICAgaWNvbj17KCkgPT4gPE1pbmlLZWJhYk1lbnVJY29uIHNpemU9e2ljb25TaXplfSAvPn1cbiAgICAgICAgICAgIHNpemU9e3NpemUgfHwgaWNvbkJ1dHRvbkRlZmF1bHRTaXplfVxuICAgICAgICAgICAgdmFyaWFudD1cInNlY29uZGFyeVwiXG4gICAgICAgICAgICBvbkNsaWNrPXtoYW5kbGVDbGlja31cbiAgICAgICAgICAgIGRhdGEtdGVzdGlkPVwiZHJvcGRvd24ta2ViYWItYnV0dG9uXCJcbiAgICAgICAgICAgIHRpcD1cIlNob3cgb3B0aW9uc1wiXG4gICAgICAgICAgICB0aXBQcm9wcz17dGlwUHJvcHN9XG4gICAgICAgICAgICB7Li4uKGJ1dHRvblN0eWxlUHJvcHMgPz8ge30pfVxuICAgICAgICAgIC8+XG4gICAgICAgICk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAnaG9yaXpvbnRhbEtlYmFiJzpcbiAgICAgICAgY2xpY2tUYXJnZXQgPSAoXG4gICAgICAgICAgPEljb25CdXR0b25cbiAgICAgICAgICAgIGFyaWEtbGFiZWw9XCJPcHRpb25zXCJcbiAgICAgICAgICAgIHJlZj17dGFyZ2V0UmVmfVxuICAgICAgICAgICAgYXJpYS1leHBhbmRlZD17aXNPcGVufVxuICAgICAgICAgICAgYXJpYS1oYXNwb3B1cD1cIm1lbnVcIlxuICAgICAgICAgICAgaWQ9e2J1dHRvbklkfVxuICAgICAgICAgICAgaWNvbj17KCkgPT4gPEhvcml6b250YWxLZWJhYkljb24gc2l6ZT17aWNvblNpemV9IC8+fVxuICAgICAgICAgICAgc2l6ZT17c2l6ZSB8fCBpY29uQnV0dG9uRGVmYXVsdFNpemV9XG4gICAgICAgICAgICB2YXJpYW50PVwic2Vjb25kYXJ5XCJcbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1ob3Jpem9udGFsLWtlYmFiLWJ1dHRvblwiXG4gICAgICAgICAgICB0aXBQcm9wcz17dGlwUHJvcHN9XG4gICAgICAgICAgICB0aXA9XCJTaG93IG1vcmUgb3B0aW9uc1wiXG4gICAgICAgICAgICB7Li4uKGJ1dHRvblN0eWxlUHJvcHMgPz8ge30pfVxuICAgICAgICAgIC8+XG4gICAgICAgICk7XG4gICAgfVxuXG4gICAgcmV0dXJuIChcbiAgICAgIDw+XG4gICAgICAgIHtjbGlja1RhcmdldH1cbiAgICAgICAge2Ryb3Bkb3duSXRlbXMubGVuZ3RoICE9PSAwICYmIChcbiAgICAgICAgICA8UG9wb3ZlclxuICAgICAgICAgICAgcG9wb3ZlckNvbnRhaW5lclJlZj17cG9wb3ZlckNvbnRhaW5lclJlZkNhbGxiYWNrfVxuICAgICAgICAgICAgdGFyZ2V0UmVmPXt0YXJnZXRSZWZ9XG4gICAgICAgICAgICBpc09wZW49e2lzT3Blbn1cbiAgICAgICAgICAgIG9uUmVxdWVzdENsb3NlPXtoYW5kbGVSZXF1ZXN0Q2xvc2VkfVxuICAgICAgICAgICAgYWxpZ249e2FsaWdufVxuICAgICAgICAgICAgdmVydGljYWxPZmZzZXQ9e3ZlcnRpY2FsT2Zmc2V0fVxuICAgICAgICAgICAgaG9yaXpvbnRhbE9mZnNldD17aG9yaXpvbnRhbE9mZnNldH1cbiAgICAgICAgICAgIHBvc2l0aW9uPXtwb3NpdGlvbn1cbiAgICAgICAgICAgIG91dGxpbmVcbiAgICAgICAgICA+XG4gICAgICAgICAgICA8RHJvcGRvd25MaXN0XG4gICAgICAgICAgICAgIGRyb3Bkb3duSXRlbXM9e2Ryb3Bkb3duSXRlbXN9XG4gICAgICAgICAgICAgIGlzTWVudT17aXNNZW51fVxuICAgICAgICAgICAgICBtZW51QnV0dG9uSWQ9e2J1dHRvbklkfVxuICAgICAgICAgICAgICBvbkNsb3NlPXtoYW5kbGVSZXF1ZXN0Q2xvc2VkfVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICA8L1BvcG92ZXI+XG4gICAgICAgICl9XG4gICAgICA8Lz5cbiAgICApO1xuICB9XG4pO1xuIl19 */"));
-const HorizontalKebabIcon = /*#__PURE__*/_styled(MiniKebabMenuIcon, {
-  target: "e1mfstzo0",
-  label: "HorizontalKebabIcon"
-})(css({
-  transform: 'rotate(90deg)'
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9Ecm9wZG93bkJ1dHRvbi9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBcUM0QiIsImZpbGUiOiIuLi8uLi9zcmMvRHJvcGRvd25CdXR0b24vaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQnV0dG9uUHJvcHMsXG4gIEZpbGxCdXR0b24sXG4gIEljb25CdXR0b24sXG4gIFBvcG92ZXIsXG4gIFBvcG92ZXJQcm9wcyxcbiAgUG9wb3ZlcllQb3NpdGlvblR5cGUsXG4gIFN0cm9rZUJ1dHRvbixcbiAgVGV4dEJ1dHRvbixcbn0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQnO1xuaW1wb3J0IHtcbiAgQXJyb3dDaGV2cm9uRG93bkZpbGxlZEljb24sXG4gIE1pbmlLZWJhYk1lbnVJY29uLFxufSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgeyBjc3MsIHB4UmVtLCBzdHlsZWRPcHRpb25zIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7XG4gIGZvcndhcmRSZWYsXG4gIFByb3BzV2l0aENoaWxkcmVuLFxuICB1c2VJZCxcbiAgdXNlSW1wZXJhdGl2ZUhhbmRsZSxcbiAgdXNlUmVmLFxuICB1c2VTdGF0ZSxcbn0gZnJvbSAncmVhY3QnO1xuaW1wb3J0ICogYXMgUmVhY3QgZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBEcm9wZG93bkxpc3QsIERyb3Bkb3duTGlzdFByb3BzIH0gZnJvbSAnLi9Ecm9wZG93bkxpc3QnO1xuaW1wb3J0IHsgdXNlRHluYW1pY1BvcG92ZXJQb3NpdGlvbiB9IGZyb20gJy4vdXNlRHluYW1pY1BvcG92ZXJQb3NpdGlvbic7XG5cbmNvbnN0IERvd25BcnJvdyA9IHN0eWxlZChBcnJvd0NoZXZyb25Eb3duRmlsbGVkSWNvbiwgc3R5bGVkT3B0aW9ucyk8e1xuICBpc09wZW4/OiBib29sZWFuO1xufT5gXG4gIG1hcmdpbi1sZWZ0OiAke3B4UmVtKDgpfTtcbiAgdHJhbnNpdGlvbjogdHJhbnNmb3JtIDAuMzVzIGVhc2Utb3V0O1xuICAkeyh7IGlzT3BlbiB9KSA9PiBpc09wZW4gJiYgJ3RyYW5zZm9ybTogcm90YXRlKC0xODBkZWcpJ307XG5gO1xuXG5jb25zdCBIb3Jpem9udGFsS2ViYWJJY29uID0gc3R5bGVkKE1pbmlLZWJhYk1lbnVJY29uKShcbiAgY3NzKHtcbiAgICB0cmFuc2Zvcm06ICdyb3RhdGUoOTBkZWcpJyxcbiAgfSlcbik7XG5cbmV4cG9ydCB0eXBlIERyb3Bkb3duQnV0dG9uUmVmVHlwZSA9IHtcbiAgZm9jdXM6IEhUTUxCdXR0b25FbGVtZW50Wydmb2N1cyddO1xufTtcblxuZXhwb3J0IHR5cGUgRHJvcGRvd25CdXR0b25Qcm9wcyA9IFByb3BzV2l0aENoaWxkcmVuPFxuICB7XG4gICAgYWxpZ24/OiBQb3BvdmVyUHJvcHNbJ2FsaWduJ107XG4gICAgYnV0dG9uVHlwZT86ICdmaWxsJyB8ICdzdHJva2UnIHwgJ3RleHQnIHwgJ2tlYmFiJyB8ICdob3Jpem9udGFsS2ViYWInO1xuICAgIGRlZmF1bHRQb3NpdGlvbj86IFBvcG92ZXJZUG9zaXRpb25UeXBlWydwb3NpdGlvbiddO1xuICAgIGRyb3Bkb3duSXRlbXM6IERyb3Bkb3duTGlzdFByb3BzWydkcm9wZG93bkl0ZW1zJ107XG4gICAgaG9yaXpvbnRhbE9mZnNldD86IG51bWJlcjtcbiAgICAvKipcbiAgICAgKiBTZXRzIHRoZSBzaXplIG9mIHRoZSBkb3duIGFycm93IGljb24gaW4gdGhlIGJ1dHRvbnMgdGhhdCBoYXZlIHRleHQgb3IgdGhlIGtlYmFiIGFuZCBob3Jpem9udGFsIGtlYmFiIGljb25zLlxuICAgICAqL1xuICAgIGljb25TaXplPzogbnVtYmVyO1xuICAgIC8qKlxuICAgICAqIElmIHRoZSBkcm9wZG93biBzaG91bGQgc2VtYW50aWNhbGx5IGJlIGEgbWVudVxuICAgICAqL1xuICAgIGlzTWVudT86IGJvb2xlYW47XG4gICAgb25DbGljaz86IChldmVudDogUmVhY3QuTW91c2VFdmVudCkgPT4gdm9pZDtcbiAgICB0aXBQcm9wcz86IFJlYWN0LkNvbXBvbmVudFByb3BzPHR5cGVvZiBJY29uQnV0dG9uPlsndGlwUHJvcHMnXTtcbiAgICB2ZXJ0aWNhbE9mZnNldD86IG51bWJlcjtcbiAgfSAmIEJ1dHRvblByb3BzXG4+O1xuXG5leHBvcnQgY29uc3QgRHJvcGRvd25CdXR0b24gPSBmb3J3YXJkUmVmPFxuICBEcm9wZG93bkJ1dHRvblJlZlR5cGUsXG4gIERyb3Bkb3duQnV0dG9uUHJvcHNcbj4oXG4gIChcbiAgICB7XG4gICAgICBhbGlnbiA9ICdsZWZ0JyxcbiAgICAgIGJ1dHRvblR5cGUgPSAnZmlsbCcsXG4gICAgICBjaGlsZHJlbixcbiAgICAgIGRlZmF1bHRQb3NpdGlvbiA9ICdiZWxvdycsXG4gICAgICBkcm9wZG93bkl0ZW1zLFxuICAgICAgaG9yaXpvbnRhbE9mZnNldCxcbiAgICAgIGljb25TaXplLFxuICAgICAgaXNNZW51LFxuICAgICAgb25DbGljayxcbiAgICAgIHRpcFByb3BzLFxuICAgICAgdmVydGljYWxPZmZzZXQgPSAwLFxuICAgICAgc2l6ZSxcbiAgICAgIHZhcmlhbnQgPSAncHJpbWFyeScsXG4gICAgICAuLi5idXR0b25TdHlsZVByb3BzXG4gICAgfSxcbiAgICByZWZcbiAgKSA9PiB7XG4gICAgY29uc3QgYnV0dG9uSWQgPSB1c2VJZCgpO1xuICAgIGNvbnN0IHRhcmdldFJlZiA9IHVzZVJlZjxIVE1MQW5jaG9yRWxlbWVudCB8IEhUTUxCdXR0b25FbGVtZW50PihudWxsKTtcbiAgICBjb25zdCB7IHBvc2l0aW9uLCBwb3BvdmVyQ29udGFpbmVyUmVmQ2FsbGJhY2sgfSA9IHVzZUR5bmFtaWNQb3BvdmVyUG9zaXRpb24oXG4gICAgICB7XG4gICAgICAgIHRhcmdldFJlZixcbiAgICAgICAgdmVydGljYWxPZmZzZXQsXG4gICAgICAgIGRlZmF1bHRQb3NpdGlvbixcbiAgICAgIH1cbiAgICApO1xuXG4gICAgY29uc3QgW2lzT3Blbiwgc2V0SXNPcGVuXSA9IHVzZVN0YXRlKGZhbHNlKTtcblxuICAgIHVzZUltcGVyYXRpdmVIYW5kbGUocmVmLCAoKSA9PiAoe1xuICAgICAgZm9jdXM6ICgpID0+IHRhcmdldFJlZi5jdXJyZW50Py5mb2N1cygpLFxuICAgIH0pKTtcblxuICAgIGNvbnN0IGhhbmRsZUNsaWNrID0gKGV2ZW50OiBSZWFjdC5Nb3VzZUV2ZW50KSA9PiB7XG4gICAgICBpZiAoIWlzT3Blbikge1xuICAgICAgICBvbkNsaWNrPy4oZXZlbnQpO1xuICAgICAgfVxuICAgICAgc2V0SXNPcGVuKCFpc09wZW4pO1xuICAgIH07XG4gICAgY29uc3QgaGFuZGxlUmVxdWVzdENsb3NlZCA9ICgpID0+IHtcbiAgICAgIHNldElzT3BlbihmYWxzZSk7XG4gICAgfTtcblxuICAgIGNvbnN0IHRleHRCdXR0b25EZWZhdWx0U2l6ZSA9ICdub3JtYWwnO1xuICAgIGNvbnN0IGljb25CdXR0b25EZWZhdWx0U2l6ZSA9ICdzbWFsbCc7XG5cbiAgICBsZXQgY2xpY2tUYXJnZXQ6IFJlYWN0LlJlYWN0Tm9kZTtcbiAgICBzd2l0Y2ggKGJ1dHRvblR5cGUpIHtcbiAgICAgIGNhc2UgJ2ZpbGwnOlxuICAgICAgICBjbGlja1RhcmdldCA9IChcbiAgICAgICAgICA8RmlsbEJ1dHRvblxuICAgICAgICAgICAgcmVmPXt0YXJnZXRSZWZ9XG4gICAgICAgICAgICBhcmlhLWV4cGFuZGVkPXtpc09wZW59XG4gICAgICAgICAgICBpZD17YnV0dG9uSWR9XG4gICAgICAgICAgICBvbkNsaWNrPXtoYW5kbGVDbGlja31cbiAgICAgICAgICAgIGRhdGEtdGVzdGlkPVwiZHJvcGRvd24tZmlsbC1idXR0b25cIlxuICAgICAgICAgICAgc2l6ZT17c2l6ZSB8fCB0ZXh0QnV0dG9uRGVmYXVsdFNpemV9XG4gICAgICAgICAgICB2YXJpYW50PXt2YXJpYW50fVxuICAgICAgICAgICAgey4uLihidXR0b25TdHlsZVByb3BzID8/IHt9KX1cbiAgICAgICAgICA+XG4gICAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgICAgICA8RG93bkFycm93IGlzT3Blbj17aXNPcGVufSBzaXplPXtpY29uU2l6ZSB8fCAxMn0gLz5cbiAgICAgICAgICA8L0ZpbGxCdXR0b24+XG4gICAgICAgICk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAnc3Ryb2tlJzpcbiAgICAgICAgY2xpY2tUYXJnZXQgPSAoXG4gICAgICAgICAgPFN0cm9rZUJ1dHRvblxuICAgICAgICAgICAgcmVmPXt0YXJnZXRSZWZ9XG4gICAgICAgICAgICBhcmlhLWV4cGFuZGVkPXtpc09wZW59XG4gICAgICAgICAgICBpZD17YnV0dG9uSWR9XG4gICAgICAgICAgICBvbkNsaWNrPXtoYW5kbGVDbGlja31cbiAgICAgICAgICAgIGRhdGEtdGVzdGlkPVwiZHJvcGRvd24tc3Ryb2tlLWJ1dHRvblwiXG4gICAgICAgICAgICBzaXplPXtzaXplIHx8IHRleHRCdXR0b25EZWZhdWx0U2l6ZX1cbiAgICAgICAgICAgIHZhcmlhbnQ9e3ZhcmlhbnR9XG4gICAgICAgICAgICB7Li4uKGJ1dHRvblN0eWxlUHJvcHMgPz8ge30pfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgICAgIDxEb3duQXJyb3cgaXNPcGVuPXtpc09wZW59IHNpemU9e2ljb25TaXplIHx8IDEyfSAvPlxuICAgICAgICAgIDwvU3Ryb2tlQnV0dG9uPlxuICAgICAgICApO1xuICAgICAgICBicmVhaztcbiAgICAgIGNhc2UgJ3RleHQnOlxuICAgICAgICBjbGlja1RhcmdldCA9IChcbiAgICAgICAgICA8VGV4dEJ1dHRvblxuICAgICAgICAgICAgcmVmPXt0YXJnZXRSZWZ9XG4gICAgICAgICAgICBpZD17YnV0dG9uSWR9XG4gICAgICAgICAgICBvbkNsaWNrPXtoYW5kbGVDbGlja31cbiAgICAgICAgICAgIGRhdGEtdGVzdGlkPVwiZHJvcGRvd24tc3Ryb2tlLWJ1dHRvblwiXG4gICAgICAgICAgICBzaXplPXtzaXplIHx8IHRleHRCdXR0b25EZWZhdWx0U2l6ZX1cbiAgICAgICAgICAgIHZhcmlhbnQ9e3ZhcmlhbnR9XG4gICAgICAgICAgICB7Li4uKGJ1dHRvblN0eWxlUHJvcHMgPz8ge30pfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgICAgIDxEb3duQXJyb3cgaXNPcGVuPXtpc09wZW59IHNpemU9ezEyfSAvPlxuICAgICAgICAgIDwvVGV4dEJ1dHRvbj5cbiAgICAgICAgKTtcbiAgICAgICAgYnJlYWs7XG4gICAgICBjYXNlICdrZWJhYic6XG4gICAgICAgIGNsaWNrVGFyZ2V0ID0gKFxuICAgICAgICAgIDxJY29uQnV0dG9uXG4gICAgICAgICAgICByZWY9e3RhcmdldFJlZn1cbiAgICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9e2lzT3Blbn1cbiAgICAgICAgICAgIGFyaWEtaGFzcG9wdXA9XCJtZW51XCJcbiAgICAgICAgICAgIGlkPXtidXR0b25JZH1cbiAgICAgICAgICAgIGljb249eygpID0+IDxNaW5pS2ViYWJNZW51SWNvbiBzaXplPXtpY29uU2l6ZX0gLz59XG4gICAgICAgICAgICBzaXplPXtzaXplIHx8IGljb25CdXR0b25EZWZhdWx0U2l6ZX1cbiAgICAgICAgICAgIHZhcmlhbnQ9XCJzZWNvbmRhcnlcIlxuICAgICAgICAgICAgb25DbGljaz17aGFuZGxlQ2xpY2t9XG4gICAgICAgICAgICBkYXRhLXRlc3RpZD1cImRyb3Bkb3duLWtlYmFiLWJ1dHRvblwiXG4gICAgICAgICAgICB0aXA9XCJTaG93IG9wdGlvbnNcIlxuICAgICAgICAgICAgdGlwUHJvcHM9e3RpcFByb3BzfVxuICAgICAgICAgICAgey4uLihidXR0b25TdHlsZVByb3BzID8/IHt9KX1cbiAgICAgICAgICAvPlxuICAgICAgICApO1xuICAgICAgICBicmVhaztcbiAgICAgIGNhc2UgJ2hvcml6b250YWxLZWJhYic6XG4gICAgICAgIGNsaWNrVGFyZ2V0ID0gKFxuICAgICAgICAgIDxJY29uQnV0dG9uXG4gICAgICAgICAgICBhcmlhLWxhYmVsPVwiT3B0aW9uc1wiXG4gICAgICAgICAgICByZWY9e3RhcmdldFJlZn1cbiAgICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9e2lzT3Blbn1cbiAgICAgICAgICAgIGFyaWEtaGFzcG9wdXA9XCJtZW51XCJcbiAgICAgICAgICAgIGlkPXtidXR0b25JZH1cbiAgICAgICAgICAgIGljb249eygpID0+IDxIb3Jpem9udGFsS2ViYWJJY29uIHNpemU9e2ljb25TaXplfSAvPn1cbiAgICAgICAgICAgIHNpemU9e3NpemUgfHwgaWNvbkJ1dHRvbkRlZmF1bHRTaXplfVxuICAgICAgICAgICAgdmFyaWFudD1cInNlY29uZGFyeVwiXG4gICAgICAgICAgICBvbkNsaWNrPXtoYW5kbGVDbGlja31cbiAgICAgICAgICAgIGRhdGEtdGVzdGlkPVwiZHJvcGRvd24taG9yaXpvbnRhbC1rZWJhYi1idXR0b25cIlxuICAgICAgICAgICAgdGlwUHJvcHM9e3RpcFByb3BzfVxuICAgICAgICAgICAgdGlwPVwiU2hvdyBtb3JlIG9wdGlvbnNcIlxuICAgICAgICAgICAgey4uLihidXR0b25TdHlsZVByb3BzID8/IHt9KX1cbiAgICAgICAgICAvPlxuICAgICAgICApO1xuICAgIH1cblxuICAgIHJldHVybiAoXG4gICAgICA8PlxuICAgICAgICB7Y2xpY2tUYXJnZXR9XG4gICAgICAgIHtkcm9wZG93bkl0ZW1zLmxlbmd0aCAhPT0gMCAmJiAoXG4gICAgICAgICAgPFBvcG92ZXJcbiAgICAgICAgICAgIHBvcG92ZXJDb250YWluZXJSZWY9e3BvcG92ZXJDb250YWluZXJSZWZDYWxsYmFja31cbiAgICAgICAgICAgIHRhcmdldFJlZj17dGFyZ2V0UmVmfVxuICAgICAgICAgICAgaXNPcGVuPXtpc09wZW59XG4gICAgICAgICAgICBvblJlcXVlc3RDbG9zZT17aGFuZGxlUmVxdWVzdENsb3NlZH1cbiAgICAgICAgICAgIGFsaWduPXthbGlnbn1cbiAgICAgICAgICAgIHZlcnRpY2FsT2Zmc2V0PXt2ZXJ0aWNhbE9mZnNldH1cbiAgICAgICAgICAgIGhvcml6b250YWxPZmZzZXQ9e2hvcml6b250YWxPZmZzZXR9XG4gICAgICAgICAgICBwb3NpdGlvbj17cG9zaXRpb259XG4gICAgICAgICAgICBvdXRsaW5lXG4gICAgICAgICAgPlxuICAgICAgICAgICAgPERyb3Bkb3duTGlzdFxuICAgICAgICAgICAgICBkcm9wZG93bkl0ZW1zPXtkcm9wZG93bkl0ZW1zfVxuICAgICAgICAgICAgICBpc01lbnU9e2lzTWVudX1cbiAgICAgICAgICAgICAgbWVudUJ1dHRvbklkPXtidXR0b25JZH1cbiAgICAgICAgICAgICAgb25DbG9zZT17aGFuZGxlUmVxdWVzdENsb3NlZH1cbiAgICAgICAgICAgIC8+XG4gICAgICAgICAgPC9Qb3BvdmVyPlxuICAgICAgICApfVxuICAgICAgPC8+XG4gICAgKTtcbiAgfVxuKTtcbiJdfQ== */");
-export const DropdownButton = /*#__PURE__*/forwardRef(({
-  align = 'left',
-  buttonType = 'fill',
-  children,
-  defaultPosition = 'below',
-  dropdownItems,
-  horizontalOffset,
-  iconSize,
-  isMenu,
-  onClick,
-  tipProps,
-  verticalOffset = 0,
-  size,
-  variant = 'primary',
-  ...buttonStyleProps
-}, ref) => {
-  const buttonId = useId();
-  const targetRef = useRef(null);
-  const {
-    position,
-    popoverContainerRefCallback
-  } = useDynamicPopoverPosition({
-    targetRef,
-    verticalOffset,
-    defaultPosition
-  });
-  const [isOpen, setIsOpen] = useState(false);
-  useImperativeHandle(ref, () => ({
-    focus: () => targetRef.current?.focus()
-  }));
-  const handleClick = event => {
-    if (!isOpen) {
-      onClick?.(event);
-    }
-    setIsOpen(!isOpen);
-  };
-  const handleRequestClosed = () => {
-    setIsOpen(false);
-  };
-  const textButtonDefaultSize = 'normal';
-  const iconButtonDefaultSize = 'small';
-  let clickTarget;
-  switch (buttonType) {
-    case 'fill':
-      clickTarget = /*#__PURE__*/_jsxs(FillButton, {
-        ref: targetRef,
-        "aria-expanded": isOpen,
-        id: buttonId,
-        onClick: handleClick,
-        "data-testid": "dropdown-fill-button",
-        size: size || textButtonDefaultSize,
-        variant: variant,
-        ...(buttonStyleProps ?? {}),
-        children: [children, /*#__PURE__*/_jsx(DownArrow, {
-          isOpen: isOpen,
-          size: iconSize || 12
-        })]
-      });
-      break;
-    case 'stroke':
-      clickTarget = /*#__PURE__*/_jsxs(StrokeButton, {
-        ref: targetRef,
-        "aria-expanded": isOpen,
-        id: buttonId,
-        onClick: handleClick,
-        "data-testid": "dropdown-stroke-button",
-        size: size || textButtonDefaultSize,
-        variant: variant,
-        ...(buttonStyleProps ?? {}),
-        children: [children, /*#__PURE__*/_jsx(DownArrow, {
-          isOpen: isOpen,
-          size: iconSize || 12
-        })]
-      });
-      break;
-    case 'text':
-      clickTarget = /*#__PURE__*/_jsxs(TextButton, {
-        ref: targetRef,
-        id: buttonId,
-        onClick: handleClick,
-        "data-testid": "dropdown-stroke-button",
-        size: size || textButtonDefaultSize,
-        variant: variant,
-        ...(buttonStyleProps ?? {}),
-        children: [children, /*#__PURE__*/_jsx(DownArrow, {
-          isOpen: isOpen,
-          size: 12
-        })]
-      });
-      break;
-    case 'kebab':
-      clickTarget = /*#__PURE__*/_jsx(IconButton, {
-        ref: targetRef,
-        "aria-expanded": isOpen,
-        "aria-haspopup": "menu",
-        id: buttonId,
-        icon: () => /*#__PURE__*/_jsx(MiniKebabMenuIcon, {
-          size: iconSize
-        }),
-        size: size || iconButtonDefaultSize,
-        variant: "secondary",
-        onClick: handleClick,
-        "data-testid": "dropdown-kebab-button",
-        tip: "Show options",
-        tipProps: tipProps,
-        ...(buttonStyleProps ?? {})
-      });
-      break;
-    case 'horizontalKebab':
-      clickTarget = /*#__PURE__*/_jsx(IconButton, {
-        "aria-label": "Options",
-        ref: targetRef,
-        "aria-expanded": isOpen,
-        "aria-haspopup": "menu",
-        id: buttonId,
-        icon: () => /*#__PURE__*/_jsx(HorizontalKebabIcon, {
-          size: iconSize
-        }),
-        size: size || iconButtonDefaultSize,
-        variant: "secondary",
-        onClick: handleClick,
-        "data-testid": "dropdown-horizontal-kebab-button",
-        tipProps: tipProps,
-        tip: "Show more options",
-        ...(buttonStyleProps ?? {})
-      });
-  }
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [clickTarget, dropdownItems.length !== 0 && /*#__PURE__*/_jsx(Popover, {
-      popoverContainerRef: popoverContainerRefCallback,
-      targetRef: targetRef,
-      isOpen: isOpen,
-      onRequestClose: handleRequestClosed,
-      align: align,
-      verticalOffset: verticalOffset,
-      horizontalOffset: horizontalOffset,
-      position: position,
-      outline: true,
-      children: /*#__PURE__*/_jsx(DropdownList, {
-        dropdownItems: dropdownItems,
-        isMenu: isMenu,
-        menuButtonId: buttonId,
-        onClose: handleRequestClosed
-      })
-    })]
-  });
-});
+import { DropdownList } from "./DropdownList.js";
+import { useDynamicPopoverPosition } from "./useDynamicPopoverPosition.js";
+import { FillButton, IconButton, Popover, StrokeButton, TextButton } from "@codecademy/gamut";
+import { css, pxRem, styledOptions } from "@codecademy/gamut-styles";
+import styled from "@emotion/styled";
+import * as React$1 from "react";
+import { forwardRef, useId, useImperativeHandle, useRef, useState } from "react";
+import { ArrowChevronDownFilledIcon, MiniKebabMenuIcon } from "@codecademy/gamut-icons";
+
+//#region src/DropdownButton/index.tsx
+const DownArrow = /* @__PURE__ */ styled(ArrowChevronDownFilledIcon, styledOptions, {
+	target: "e11oyi20",
+	label: "brand-DownArrow"
+})("margin-left:", pxRem(8), ";transition:transform 0.35s ease-out;", ({ isOpen }) => isOpen && "transform: rotate(-180deg)", ";", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL0Ryb3Bkb3duQnV0dG9uL2luZGV4LnRzeCIsInNvdXJjZXMiOlsiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL0Ryb3Bkb3duQnV0dG9uL2luZGV4LnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBCdXR0b25Qcm9wcyxcbiAgRmlsbEJ1dHRvbixcbiAgSWNvbkJ1dHRvbixcbiAgUG9wb3ZlcixcbiAgUG9wb3ZlclByb3BzLFxuICBQb3BvdmVyWVBvc2l0aW9uVHlwZSxcbiAgU3Ryb2tlQnV0dG9uLFxuICBUZXh0QnV0dG9uLFxufSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XG5pbXBvcnQge1xuICBBcnJvd0NoZXZyb25Eb3duRmlsbGVkSWNvbixcbiAgTWluaUtlYmFiTWVudUljb24sXG59IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LWljb25zJztcbmltcG9ydCB7IGNzcywgcHhSZW0sIHN0eWxlZE9wdGlvbnMgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHtcbiAgZm9yd2FyZFJlZixcbiAgUHJvcHNXaXRoQ2hpbGRyZW4sXG4gIHVzZUlkLFxuICB1c2VJbXBlcmF0aXZlSGFuZGxlLFxuICB1c2VSZWYsXG4gIHVzZVN0YXRlLFxufSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgKiBhcyBSZWFjdCBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IERyb3Bkb3duTGlzdCwgRHJvcGRvd25MaXN0UHJvcHMgfSBmcm9tICcuL0Ryb3Bkb3duTGlzdCc7XG5pbXBvcnQgeyB1c2VEeW5hbWljUG9wb3ZlclBvc2l0aW9uIH0gZnJvbSAnLi91c2VEeW5hbWljUG9wb3ZlclBvc2l0aW9uJztcblxuY29uc3QgRG93bkFycm93ID0gc3R5bGVkKEFycm93Q2hldnJvbkRvd25GaWxsZWRJY29uLCBzdHlsZWRPcHRpb25zKTx7XG4gIGlzT3Blbj86IGJvb2xlYW47XG59PmBcbiAgbWFyZ2luLWxlZnQ6ICR7cHhSZW0oOCl9O1xuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4zNXMgZWFzZS1vdXQ7XG4gICR7KHsgaXNPcGVuIH0pID0+IGlzT3BlbiAmJiAndHJhbnNmb3JtOiByb3RhdGUoLTE4MGRlZyknfTtcbmA7XG5cbmNvbnN0IEhvcml6b250YWxLZWJhYkljb24gPSBzdHlsZWQoTWluaUtlYmFiTWVudUljb24pKFxuICBjc3Moe1xuICAgIHRyYW5zZm9ybTogJ3JvdGF0ZSg5MGRlZyknLFxuICB9KVxuKTtcblxuZXhwb3J0IHR5cGUgRHJvcGRvd25CdXR0b25SZWZUeXBlID0ge1xuICBmb2N1czogSFRNTEJ1dHRvbkVsZW1lbnRbJ2ZvY3VzJ107XG59O1xuXG5leHBvcnQgdHlwZSBEcm9wZG93bkJ1dHRvblByb3BzID0gUHJvcHNXaXRoQ2hpbGRyZW48XG4gIHtcbiAgICBhbGlnbj86IFBvcG92ZXJQcm9wc1snYWxpZ24nXTtcbiAgICBidXR0b25UeXBlPzogJ2ZpbGwnIHwgJ3N0cm9rZScgfCAndGV4dCcgfCAna2ViYWInIHwgJ2hvcml6b250YWxLZWJhYic7XG4gICAgZGVmYXVsdFBvc2l0aW9uPzogUG9wb3ZlcllQb3NpdGlvblR5cGVbJ3Bvc2l0aW9uJ107XG4gICAgZHJvcGRvd25JdGVtczogRHJvcGRvd25MaXN0UHJvcHNbJ2Ryb3Bkb3duSXRlbXMnXTtcbiAgICBob3Jpem9udGFsT2Zmc2V0PzogbnVtYmVyO1xuICAgIC8qKlxuICAgICAqIFNldHMgdGhlIHNpemUgb2YgdGhlIGRvd24gYXJyb3cgaWNvbiBpbiB0aGUgYnV0dG9ucyB0aGF0IGhhdmUgdGV4dCBvciB0aGUga2ViYWIgYW5kIGhvcml6b250YWwga2ViYWIgaWNvbnMuXG4gICAgICovXG4gICAgaWNvblNpemU/OiBudW1iZXI7XG4gICAgLyoqXG4gICAgICogSWYgdGhlIGRyb3Bkb3duIHNob3VsZCBzZW1hbnRpY2FsbHkgYmUgYSBtZW51XG4gICAgICovXG4gICAgaXNNZW51PzogYm9vbGVhbjtcbiAgICBvbkNsaWNrPzogKGV2ZW50OiBSZWFjdC5Nb3VzZUV2ZW50KSA9PiB2b2lkO1xuICAgIHRpcFByb3BzPzogUmVhY3QuQ29tcG9uZW50UHJvcHM8dHlwZW9mIEljb25CdXR0b24+Wyd0aXBQcm9wcyddO1xuICAgIHZlcnRpY2FsT2Zmc2V0PzogbnVtYmVyO1xuICB9ICYgQnV0dG9uUHJvcHNcbj47XG5cbmV4cG9ydCBjb25zdCBEcm9wZG93bkJ1dHRvbiA9IGZvcndhcmRSZWY8XG4gIERyb3Bkb3duQnV0dG9uUmVmVHlwZSxcbiAgRHJvcGRvd25CdXR0b25Qcm9wc1xuPihcbiAgKFxuICAgIHtcbiAgICAgIGFsaWduID0gJ2xlZnQnLFxuICAgICAgYnV0dG9uVHlwZSA9ICdmaWxsJyxcbiAgICAgIGNoaWxkcmVuLFxuICAgICAgZGVmYXVsdFBvc2l0aW9uID0gJ2JlbG93JyxcbiAgICAgIGRyb3Bkb3duSXRlbXMsXG4gICAgICBob3Jpem9udGFsT2Zmc2V0LFxuICAgICAgaWNvblNpemUsXG4gICAgICBpc01lbnUsXG4gICAgICBvbkNsaWNrLFxuICAgICAgdGlwUHJvcHMsXG4gICAgICB2ZXJ0aWNhbE9mZnNldCA9IDAsXG4gICAgICBzaXplLFxuICAgICAgdmFyaWFudCA9ICdwcmltYXJ5JyxcbiAgICAgIC4uLmJ1dHRvblN0eWxlUHJvcHNcbiAgICB9LFxuICAgIHJlZlxuICApID0+IHtcbiAgICBjb25zdCBidXR0b25JZCA9IHVzZUlkKCk7XG4gICAgY29uc3QgdGFyZ2V0UmVmID0gdXNlUmVmPEhUTUxBbmNob3JFbGVtZW50IHwgSFRNTEJ1dHRvbkVsZW1lbnQ+KG51bGwpO1xuICAgIGNvbnN0IHsgcG9zaXRpb24sIHBvcG92ZXJDb250YWluZXJSZWZDYWxsYmFjayB9ID0gdXNlRHluYW1pY1BvcG92ZXJQb3NpdGlvbihcbiAgICAgIHtcbiAgICAgICAgdGFyZ2V0UmVmLFxuICAgICAgICB2ZXJ0aWNhbE9mZnNldCxcbiAgICAgICAgZGVmYXVsdFBvc2l0aW9uLFxuICAgICAgfVxuICAgICk7XG5cbiAgICBjb25zdCBbaXNPcGVuLCBzZXRJc09wZW5dID0gdXNlU3RhdGUoZmFsc2UpO1xuXG4gICAgdXNlSW1wZXJhdGl2ZUhhbmRsZShyZWYsICgpID0+ICh7XG4gICAgICBmb2N1czogKCkgPT4gdGFyZ2V0UmVmLmN1cnJlbnQ/LmZvY3VzKCksXG4gICAgfSkpO1xuXG4gICAgY29uc3QgaGFuZGxlQ2xpY2sgPSAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQpID0+IHtcbiAgICAgIGlmICghaXNPcGVuKSB7XG4gICAgICAgIG9uQ2xpY2s/LihldmVudCk7XG4gICAgICB9XG4gICAgICBzZXRJc09wZW4oIWlzT3Blbik7XG4gICAgfTtcbiAgICBjb25zdCBoYW5kbGVSZXF1ZXN0Q2xvc2VkID0gKCkgPT4ge1xuICAgICAgc2V0SXNPcGVuKGZhbHNlKTtcbiAgICB9O1xuXG4gICAgY29uc3QgdGV4dEJ1dHRvbkRlZmF1bHRTaXplID0gJ25vcm1hbCc7XG4gICAgY29uc3QgaWNvbkJ1dHRvbkRlZmF1bHRTaXplID0gJ3NtYWxsJztcblxuICAgIGxldCBjbGlja1RhcmdldDogUmVhY3QuUmVhY3ROb2RlO1xuICAgIHN3aXRjaCAoYnV0dG9uVHlwZSkge1xuICAgICAgY2FzZSAnZmlsbCc6XG4gICAgICAgIGNsaWNrVGFyZ2V0ID0gKFxuICAgICAgICAgIDxGaWxsQnV0dG9uXG4gICAgICAgICAgICByZWY9e3RhcmdldFJlZn1cbiAgICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9e2lzT3Blbn1cbiAgICAgICAgICAgIGlkPXtidXR0b25JZH1cbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1maWxsLWJ1dHRvblwiXG4gICAgICAgICAgICBzaXplPXtzaXplIHx8IHRleHRCdXR0b25EZWZhdWx0U2l6ZX1cbiAgICAgICAgICAgIHZhcmlhbnQ9e3ZhcmlhbnR9XG4gICAgICAgICAgICB7Li4uKGJ1dHRvblN0eWxlUHJvcHMgPz8ge30pfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgICAgIDxEb3duQXJyb3cgaXNPcGVuPXtpc09wZW59IHNpemU9e2ljb25TaXplIHx8IDEyfSAvPlxuICAgICAgICAgIDwvRmlsbEJ1dHRvbj5cbiAgICAgICAgKTtcbiAgICAgICAgYnJlYWs7XG4gICAgICBjYXNlICdzdHJva2UnOlxuICAgICAgICBjbGlja1RhcmdldCA9IChcbiAgICAgICAgICA8U3Ryb2tlQnV0dG9uXG4gICAgICAgICAgICByZWY9e3RhcmdldFJlZn1cbiAgICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9e2lzT3Blbn1cbiAgICAgICAgICAgIGlkPXtidXR0b25JZH1cbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1zdHJva2UtYnV0dG9uXCJcbiAgICAgICAgICAgIHNpemU9e3NpemUgfHwgdGV4dEJ1dHRvbkRlZmF1bHRTaXplfVxuICAgICAgICAgICAgdmFyaWFudD17dmFyaWFudH1cbiAgICAgICAgICAgIHsuLi4oYnV0dG9uU3R5bGVQcm9wcyA/PyB7fSl9XG4gICAgICAgICAgPlxuICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICAgICAgPERvd25BcnJvdyBpc09wZW49e2lzT3Blbn0gc2l6ZT17aWNvblNpemUgfHwgMTJ9IC8+XG4gICAgICAgICAgPC9TdHJva2VCdXR0b24+XG4gICAgICAgICk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAndGV4dCc6XG4gICAgICAgIGNsaWNrVGFyZ2V0ID0gKFxuICAgICAgICAgIDxUZXh0QnV0dG9uXG4gICAgICAgICAgICByZWY9e3RhcmdldFJlZn1cbiAgICAgICAgICAgIGlkPXtidXR0b25JZH1cbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1zdHJva2UtYnV0dG9uXCJcbiAgICAgICAgICAgIHNpemU9e3NpemUgfHwgdGV4dEJ1dHRvbkRlZmF1bHRTaXplfVxuICAgICAgICAgICAgdmFyaWFudD17dmFyaWFudH1cbiAgICAgICAgICAgIHsuLi4oYnV0dG9uU3R5bGVQcm9wcyA/PyB7fSl9XG4gICAgICAgICAgPlxuICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICAgICAgPERvd25BcnJvdyBpc09wZW49e2lzT3Blbn0gc2l6ZT17MTJ9IC8+XG4gICAgICAgICAgPC9UZXh0QnV0dG9uPlxuICAgICAgICApO1xuICAgICAgICBicmVhaztcbiAgICAgIGNhc2UgJ2tlYmFiJzpcbiAgICAgICAgY2xpY2tUYXJnZXQgPSAoXG4gICAgICAgICAgPEljb25CdXR0b25cbiAgICAgICAgICAgIHJlZj17dGFyZ2V0UmVmfVxuICAgICAgICAgICAgYXJpYS1leHBhbmRlZD17aXNPcGVufVxuICAgICAgICAgICAgYXJpYS1oYXNwb3B1cD1cIm1lbnVcIlxuICAgICAgICAgICAgaWQ9e2J1dHRvbklkfVxuICAgICAgICAgICAgaWNvbj17KCkgPT4gPE1pbmlLZWJhYk1lbnVJY29uIHNpemU9e2ljb25TaXplfSAvPn1cbiAgICAgICAgICAgIHNpemU9e3NpemUgfHwgaWNvbkJ1dHRvbkRlZmF1bHRTaXplfVxuICAgICAgICAgICAgdmFyaWFudD1cInNlY29uZGFyeVwiXG4gICAgICAgICAgICBvbkNsaWNrPXtoYW5kbGVDbGlja31cbiAgICAgICAgICAgIGRhdGEtdGVzdGlkPVwiZHJvcGRvd24ta2ViYWItYnV0dG9uXCJcbiAgICAgICAgICAgIHRpcD1cIlNob3cgb3B0aW9uc1wiXG4gICAgICAgICAgICB0aXBQcm9wcz17dGlwUHJvcHN9XG4gICAgICAgICAgICB7Li4uKGJ1dHRvblN0eWxlUHJvcHMgPz8ge30pfVxuICAgICAgICAgIC8+XG4gICAgICAgICk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAnaG9yaXpvbnRhbEtlYmFiJzpcbiAgICAgICAgY2xpY2tUYXJnZXQgPSAoXG4gICAgICAgICAgPEljb25CdXR0b25cbiAgICAgICAgICAgIGFyaWEtbGFiZWw9XCJPcHRpb25zXCJcbiAgICAgICAgICAgIHJlZj17dGFyZ2V0UmVmfVxuICAgICAgICAgICAgYXJpYS1leHBhbmRlZD17aXNPcGVufVxuICAgICAgICAgICAgYXJpYS1oYXNwb3B1cD1cIm1lbnVcIlxuICAgICAgICAgICAgaWQ9e2J1dHRvbklkfVxuICAgICAgICAgICAgaWNvbj17KCkgPT4gPEhvcml6b250YWxLZWJhYkljb24gc2l6ZT17aWNvblNpemV9IC8+fVxuICAgICAgICAgICAgc2l6ZT17c2l6ZSB8fCBpY29uQnV0dG9uRGVmYXVsdFNpemV9XG4gICAgICAgICAgICB2YXJpYW50PVwic2Vjb25kYXJ5XCJcbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1ob3Jpem9udGFsLWtlYmFiLWJ1dHRvblwiXG4gICAgICAgICAgICB0aXBQcm9wcz17dGlwUHJvcHN9XG4gICAgICAgICAgICB0aXA9XCJTaG93IG1vcmUgb3B0aW9uc1wiXG4gICAgICAgICAgICB7Li4uKGJ1dHRvblN0eWxlUHJvcHMgPz8ge30pfVxuICAgICAgICAgIC8+XG4gICAgICAgICk7XG4gICAgfVxuXG4gICAgcmV0dXJuIChcbiAgICAgIDw+XG4gICAgICAgIHtjbGlja1RhcmdldH1cbiAgICAgICAge2Ryb3Bkb3duSXRlbXMubGVuZ3RoICE9PSAwICYmIChcbiAgICAgICAgICA8UG9wb3ZlclxuICAgICAgICAgICAgcG9wb3ZlckNvbnRhaW5lclJlZj17cG9wb3ZlckNvbnRhaW5lclJlZkNhbGxiYWNrfVxuICAgICAgICAgICAgdGFyZ2V0UmVmPXt0YXJnZXRSZWZ9XG4gICAgICAgICAgICBpc09wZW49e2lzT3Blbn1cbiAgICAgICAgICAgIG9uUmVxdWVzdENsb3NlPXtoYW5kbGVSZXF1ZXN0Q2xvc2VkfVxuICAgICAgICAgICAgYWxpZ249e2FsaWdufVxuICAgICAgICAgICAgdmVydGljYWxPZmZzZXQ9e3ZlcnRpY2FsT2Zmc2V0fVxuICAgICAgICAgICAgaG9yaXpvbnRhbE9mZnNldD17aG9yaXpvbnRhbE9mZnNldH1cbiAgICAgICAgICAgIHBvc2l0aW9uPXtwb3NpdGlvbn1cbiAgICAgICAgICAgIG91dGxpbmVcbiAgICAgICAgICA+XG4gICAgICAgICAgICA8RHJvcGRvd25MaXN0XG4gICAgICAgICAgICAgIGRyb3Bkb3duSXRlbXM9e2Ryb3Bkb3duSXRlbXN9XG4gICAgICAgICAgICAgIGlzTWVudT17aXNNZW51fVxuICAgICAgICAgICAgICBtZW51QnV0dG9uSWQ9e2J1dHRvbklkfVxuICAgICAgICAgICAgICBvbkNsb3NlPXtoYW5kbGVSZXF1ZXN0Q2xvc2VkfVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICA8L1BvcG92ZXI+XG4gICAgICAgICl9XG4gICAgICA8Lz5cbiAgICApO1xuICB9XG4pO1xuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTZCa0IifQ== */");
+const HorizontalKebabIcon = /* @__PURE__ */ styled(MiniKebabMenuIcon, {
+	target: "e11oyi21",
+	label: "brand-HorizontalKebabIcon"
+})(css({ transform: "rotate(90deg)" }), "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL0Ryb3Bkb3duQnV0dG9uL2luZGV4LnRzeCIsInNvdXJjZXMiOlsiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL0Ryb3Bkb3duQnV0dG9uL2luZGV4LnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBCdXR0b25Qcm9wcyxcbiAgRmlsbEJ1dHRvbixcbiAgSWNvbkJ1dHRvbixcbiAgUG9wb3ZlcixcbiAgUG9wb3ZlclByb3BzLFxuICBQb3BvdmVyWVBvc2l0aW9uVHlwZSxcbiAgU3Ryb2tlQnV0dG9uLFxuICBUZXh0QnV0dG9uLFxufSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XG5pbXBvcnQge1xuICBBcnJvd0NoZXZyb25Eb3duRmlsbGVkSWNvbixcbiAgTWluaUtlYmFiTWVudUljb24sXG59IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LWljb25zJztcbmltcG9ydCB7IGNzcywgcHhSZW0sIHN0eWxlZE9wdGlvbnMgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHtcbiAgZm9yd2FyZFJlZixcbiAgUHJvcHNXaXRoQ2hpbGRyZW4sXG4gIHVzZUlkLFxuICB1c2VJbXBlcmF0aXZlSGFuZGxlLFxuICB1c2VSZWYsXG4gIHVzZVN0YXRlLFxufSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgKiBhcyBSZWFjdCBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IERyb3Bkb3duTGlzdCwgRHJvcGRvd25MaXN0UHJvcHMgfSBmcm9tICcuL0Ryb3Bkb3duTGlzdCc7XG5pbXBvcnQgeyB1c2VEeW5hbWljUG9wb3ZlclBvc2l0aW9uIH0gZnJvbSAnLi91c2VEeW5hbWljUG9wb3ZlclBvc2l0aW9uJztcblxuY29uc3QgRG93bkFycm93ID0gc3R5bGVkKEFycm93Q2hldnJvbkRvd25GaWxsZWRJY29uLCBzdHlsZWRPcHRpb25zKTx7XG4gIGlzT3Blbj86IGJvb2xlYW47XG59PmBcbiAgbWFyZ2luLWxlZnQ6ICR7cHhSZW0oOCl9O1xuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4zNXMgZWFzZS1vdXQ7XG4gICR7KHsgaXNPcGVuIH0pID0+IGlzT3BlbiAmJiAndHJhbnNmb3JtOiByb3RhdGUoLTE4MGRlZyknfTtcbmA7XG5cbmNvbnN0IEhvcml6b250YWxLZWJhYkljb24gPSBzdHlsZWQoTWluaUtlYmFiTWVudUljb24pKFxuICBjc3Moe1xuICAgIHRyYW5zZm9ybTogJ3JvdGF0ZSg5MGRlZyknLFxuICB9KVxuKTtcblxuZXhwb3J0IHR5cGUgRHJvcGRvd25CdXR0b25SZWZUeXBlID0ge1xuICBmb2N1czogSFRNTEJ1dHRvbkVsZW1lbnRbJ2ZvY3VzJ107XG59O1xuXG5leHBvcnQgdHlwZSBEcm9wZG93bkJ1dHRvblByb3BzID0gUHJvcHNXaXRoQ2hpbGRyZW48XG4gIHtcbiAgICBhbGlnbj86IFBvcG92ZXJQcm9wc1snYWxpZ24nXTtcbiAgICBidXR0b25UeXBlPzogJ2ZpbGwnIHwgJ3N0cm9rZScgfCAndGV4dCcgfCAna2ViYWInIHwgJ2hvcml6b250YWxLZWJhYic7XG4gICAgZGVmYXVsdFBvc2l0aW9uPzogUG9wb3ZlcllQb3NpdGlvblR5cGVbJ3Bvc2l0aW9uJ107XG4gICAgZHJvcGRvd25JdGVtczogRHJvcGRvd25MaXN0UHJvcHNbJ2Ryb3Bkb3duSXRlbXMnXTtcbiAgICBob3Jpem9udGFsT2Zmc2V0PzogbnVtYmVyO1xuICAgIC8qKlxuICAgICAqIFNldHMgdGhlIHNpemUgb2YgdGhlIGRvd24gYXJyb3cgaWNvbiBpbiB0aGUgYnV0dG9ucyB0aGF0IGhhdmUgdGV4dCBvciB0aGUga2ViYWIgYW5kIGhvcml6b250YWwga2ViYWIgaWNvbnMuXG4gICAgICovXG4gICAgaWNvblNpemU/OiBudW1iZXI7XG4gICAgLyoqXG4gICAgICogSWYgdGhlIGRyb3Bkb3duIHNob3VsZCBzZW1hbnRpY2FsbHkgYmUgYSBtZW51XG4gICAgICovXG4gICAgaXNNZW51PzogYm9vbGVhbjtcbiAgICBvbkNsaWNrPzogKGV2ZW50OiBSZWFjdC5Nb3VzZUV2ZW50KSA9PiB2b2lkO1xuICAgIHRpcFByb3BzPzogUmVhY3QuQ29tcG9uZW50UHJvcHM8dHlwZW9mIEljb25CdXR0b24+Wyd0aXBQcm9wcyddO1xuICAgIHZlcnRpY2FsT2Zmc2V0PzogbnVtYmVyO1xuICB9ICYgQnV0dG9uUHJvcHNcbj47XG5cbmV4cG9ydCBjb25zdCBEcm9wZG93bkJ1dHRvbiA9IGZvcndhcmRSZWY8XG4gIERyb3Bkb3duQnV0dG9uUmVmVHlwZSxcbiAgRHJvcGRvd25CdXR0b25Qcm9wc1xuPihcbiAgKFxuICAgIHtcbiAgICAgIGFsaWduID0gJ2xlZnQnLFxuICAgICAgYnV0dG9uVHlwZSA9ICdmaWxsJyxcbiAgICAgIGNoaWxkcmVuLFxuICAgICAgZGVmYXVsdFBvc2l0aW9uID0gJ2JlbG93JyxcbiAgICAgIGRyb3Bkb3duSXRlbXMsXG4gICAgICBob3Jpem9udGFsT2Zmc2V0LFxuICAgICAgaWNvblNpemUsXG4gICAgICBpc01lbnUsXG4gICAgICBvbkNsaWNrLFxuICAgICAgdGlwUHJvcHMsXG4gICAgICB2ZXJ0aWNhbE9mZnNldCA9IDAsXG4gICAgICBzaXplLFxuICAgICAgdmFyaWFudCA9ICdwcmltYXJ5JyxcbiAgICAgIC4uLmJ1dHRvblN0eWxlUHJvcHNcbiAgICB9LFxuICAgIHJlZlxuICApID0+IHtcbiAgICBjb25zdCBidXR0b25JZCA9IHVzZUlkKCk7XG4gICAgY29uc3QgdGFyZ2V0UmVmID0gdXNlUmVmPEhUTUxBbmNob3JFbGVtZW50IHwgSFRNTEJ1dHRvbkVsZW1lbnQ+KG51bGwpO1xuICAgIGNvbnN0IHsgcG9zaXRpb24sIHBvcG92ZXJDb250YWluZXJSZWZDYWxsYmFjayB9ID0gdXNlRHluYW1pY1BvcG92ZXJQb3NpdGlvbihcbiAgICAgIHtcbiAgICAgICAgdGFyZ2V0UmVmLFxuICAgICAgICB2ZXJ0aWNhbE9mZnNldCxcbiAgICAgICAgZGVmYXVsdFBvc2l0aW9uLFxuICAgICAgfVxuICAgICk7XG5cbiAgICBjb25zdCBbaXNPcGVuLCBzZXRJc09wZW5dID0gdXNlU3RhdGUoZmFsc2UpO1xuXG4gICAgdXNlSW1wZXJhdGl2ZUhhbmRsZShyZWYsICgpID0+ICh7XG4gICAgICBmb2N1czogKCkgPT4gdGFyZ2V0UmVmLmN1cnJlbnQ/LmZvY3VzKCksXG4gICAgfSkpO1xuXG4gICAgY29uc3QgaGFuZGxlQ2xpY2sgPSAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQpID0+IHtcbiAgICAgIGlmICghaXNPcGVuKSB7XG4gICAgICAgIG9uQ2xpY2s/LihldmVudCk7XG4gICAgICB9XG4gICAgICBzZXRJc09wZW4oIWlzT3Blbik7XG4gICAgfTtcbiAgICBjb25zdCBoYW5kbGVSZXF1ZXN0Q2xvc2VkID0gKCkgPT4ge1xuICAgICAgc2V0SXNPcGVuKGZhbHNlKTtcbiAgICB9O1xuXG4gICAgY29uc3QgdGV4dEJ1dHRvbkRlZmF1bHRTaXplID0gJ25vcm1hbCc7XG4gICAgY29uc3QgaWNvbkJ1dHRvbkRlZmF1bHRTaXplID0gJ3NtYWxsJztcblxuICAgIGxldCBjbGlja1RhcmdldDogUmVhY3QuUmVhY3ROb2RlO1xuICAgIHN3aXRjaCAoYnV0dG9uVHlwZSkge1xuICAgICAgY2FzZSAnZmlsbCc6XG4gICAgICAgIGNsaWNrVGFyZ2V0ID0gKFxuICAgICAgICAgIDxGaWxsQnV0dG9uXG4gICAgICAgICAgICByZWY9e3RhcmdldFJlZn1cbiAgICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9e2lzT3Blbn1cbiAgICAgICAgICAgIGlkPXtidXR0b25JZH1cbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1maWxsLWJ1dHRvblwiXG4gICAgICAgICAgICBzaXplPXtzaXplIHx8IHRleHRCdXR0b25EZWZhdWx0U2l6ZX1cbiAgICAgICAgICAgIHZhcmlhbnQ9e3ZhcmlhbnR9XG4gICAgICAgICAgICB7Li4uKGJ1dHRvblN0eWxlUHJvcHMgPz8ge30pfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgICAgIDxEb3duQXJyb3cgaXNPcGVuPXtpc09wZW59IHNpemU9e2ljb25TaXplIHx8IDEyfSAvPlxuICAgICAgICAgIDwvRmlsbEJ1dHRvbj5cbiAgICAgICAgKTtcbiAgICAgICAgYnJlYWs7XG4gICAgICBjYXNlICdzdHJva2UnOlxuICAgICAgICBjbGlja1RhcmdldCA9IChcbiAgICAgICAgICA8U3Ryb2tlQnV0dG9uXG4gICAgICAgICAgICByZWY9e3RhcmdldFJlZn1cbiAgICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9e2lzT3Blbn1cbiAgICAgICAgICAgIGlkPXtidXR0b25JZH1cbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1zdHJva2UtYnV0dG9uXCJcbiAgICAgICAgICAgIHNpemU9e3NpemUgfHwgdGV4dEJ1dHRvbkRlZmF1bHRTaXplfVxuICAgICAgICAgICAgdmFyaWFudD17dmFyaWFudH1cbiAgICAgICAgICAgIHsuLi4oYnV0dG9uU3R5bGVQcm9wcyA/PyB7fSl9XG4gICAgICAgICAgPlxuICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICAgICAgPERvd25BcnJvdyBpc09wZW49e2lzT3Blbn0gc2l6ZT17aWNvblNpemUgfHwgMTJ9IC8+XG4gICAgICAgICAgPC9TdHJva2VCdXR0b24+XG4gICAgICAgICk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAndGV4dCc6XG4gICAgICAgIGNsaWNrVGFyZ2V0ID0gKFxuICAgICAgICAgIDxUZXh0QnV0dG9uXG4gICAgICAgICAgICByZWY9e3RhcmdldFJlZn1cbiAgICAgICAgICAgIGlkPXtidXR0b25JZH1cbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1zdHJva2UtYnV0dG9uXCJcbiAgICAgICAgICAgIHNpemU9e3NpemUgfHwgdGV4dEJ1dHRvbkRlZmF1bHRTaXplfVxuICAgICAgICAgICAgdmFyaWFudD17dmFyaWFudH1cbiAgICAgICAgICAgIHsuLi4oYnV0dG9uU3R5bGVQcm9wcyA/PyB7fSl9XG4gICAgICAgICAgPlxuICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICAgICAgPERvd25BcnJvdyBpc09wZW49e2lzT3Blbn0gc2l6ZT17MTJ9IC8+XG4gICAgICAgICAgPC9UZXh0QnV0dG9uPlxuICAgICAgICApO1xuICAgICAgICBicmVhaztcbiAgICAgIGNhc2UgJ2tlYmFiJzpcbiAgICAgICAgY2xpY2tUYXJnZXQgPSAoXG4gICAgICAgICAgPEljb25CdXR0b25cbiAgICAgICAgICAgIHJlZj17dGFyZ2V0UmVmfVxuICAgICAgICAgICAgYXJpYS1leHBhbmRlZD17aXNPcGVufVxuICAgICAgICAgICAgYXJpYS1oYXNwb3B1cD1cIm1lbnVcIlxuICAgICAgICAgICAgaWQ9e2J1dHRvbklkfVxuICAgICAgICAgICAgaWNvbj17KCkgPT4gPE1pbmlLZWJhYk1lbnVJY29uIHNpemU9e2ljb25TaXplfSAvPn1cbiAgICAgICAgICAgIHNpemU9e3NpemUgfHwgaWNvbkJ1dHRvbkRlZmF1bHRTaXplfVxuICAgICAgICAgICAgdmFyaWFudD1cInNlY29uZGFyeVwiXG4gICAgICAgICAgICBvbkNsaWNrPXtoYW5kbGVDbGlja31cbiAgICAgICAgICAgIGRhdGEtdGVzdGlkPVwiZHJvcGRvd24ta2ViYWItYnV0dG9uXCJcbiAgICAgICAgICAgIHRpcD1cIlNob3cgb3B0aW9uc1wiXG4gICAgICAgICAgICB0aXBQcm9wcz17dGlwUHJvcHN9XG4gICAgICAgICAgICB7Li4uKGJ1dHRvblN0eWxlUHJvcHMgPz8ge30pfVxuICAgICAgICAgIC8+XG4gICAgICAgICk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAnaG9yaXpvbnRhbEtlYmFiJzpcbiAgICAgICAgY2xpY2tUYXJnZXQgPSAoXG4gICAgICAgICAgPEljb25CdXR0b25cbiAgICAgICAgICAgIGFyaWEtbGFiZWw9XCJPcHRpb25zXCJcbiAgICAgICAgICAgIHJlZj17dGFyZ2V0UmVmfVxuICAgICAgICAgICAgYXJpYS1leHBhbmRlZD17aXNPcGVufVxuICAgICAgICAgICAgYXJpYS1oYXNwb3B1cD1cIm1lbnVcIlxuICAgICAgICAgICAgaWQ9e2J1dHRvbklkfVxuICAgICAgICAgICAgaWNvbj17KCkgPT4gPEhvcml6b250YWxLZWJhYkljb24gc2l6ZT17aWNvblNpemV9IC8+fVxuICAgICAgICAgICAgc2l6ZT17c2l6ZSB8fCBpY29uQnV0dG9uRGVmYXVsdFNpemV9XG4gICAgICAgICAgICB2YXJpYW50PVwic2Vjb25kYXJ5XCJcbiAgICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZUNsaWNrfVxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJkcm9wZG93bi1ob3Jpem9udGFsLWtlYmFiLWJ1dHRvblwiXG4gICAgICAgICAgICB0aXBQcm9wcz17dGlwUHJvcHN9XG4gICAgICAgICAgICB0aXA9XCJTaG93IG1vcmUgb3B0aW9uc1wiXG4gICAgICAgICAgICB7Li4uKGJ1dHRvblN0eWxlUHJvcHMgPz8ge30pfVxuICAgICAgICAgIC8+XG4gICAgICAgICk7XG4gICAgfVxuXG4gICAgcmV0dXJuIChcbiAgICAgIDw+XG4gICAgICAgIHtjbGlja1RhcmdldH1cbiAgICAgICAge2Ryb3Bkb3duSXRlbXMubGVuZ3RoICE9PSAwICYmIChcbiAgICAgICAgICA8UG9wb3ZlclxuICAgICAgICAgICAgcG9wb3ZlckNvbnRhaW5lclJlZj17cG9wb3ZlckNvbnRhaW5lclJlZkNhbGxiYWNrfVxuICAgICAgICAgICAgdGFyZ2V0UmVmPXt0YXJnZXRSZWZ9XG4gICAgICAgICAgICBpc09wZW49e2lzT3Blbn1cbiAgICAgICAgICAgIG9uUmVxdWVzdENsb3NlPXtoYW5kbGVSZXF1ZXN0Q2xvc2VkfVxuICAgICAgICAgICAgYWxpZ249e2FsaWdufVxuICAgICAgICAgICAgdmVydGljYWxPZmZzZXQ9e3ZlcnRpY2FsT2Zmc2V0fVxuICAgICAgICAgICAgaG9yaXpvbnRhbE9mZnNldD17aG9yaXpvbnRhbE9mZnNldH1cbiAgICAgICAgICAgIHBvc2l0aW9uPXtwb3NpdGlvbn1cbiAgICAgICAgICAgIG91dGxpbmVcbiAgICAgICAgICA+XG4gICAgICAgICAgICA8RHJvcGRvd25MaXN0XG4gICAgICAgICAgICAgIGRyb3Bkb3duSXRlbXM9e2Ryb3Bkb3duSXRlbXN9XG4gICAgICAgICAgICAgIGlzTWVudT17aXNNZW51fVxuICAgICAgICAgICAgICBtZW51QnV0dG9uSWQ9e2J1dHRvbklkfVxuICAgICAgICAgICAgICBvbkNsb3NlPXtoYW5kbGVSZXF1ZXN0Q2xvc2VkfVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICA8L1BvcG92ZXI+XG4gICAgICAgICl9XG4gICAgICA8Lz5cbiAgICApO1xuICB9XG4pO1xuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXFDNEIifQ== */");
+const DropdownButton = /* @__PURE__ */ forwardRef(({ align = "left", buttonType = "fill", children, defaultPosition = "below", dropdownItems, horizontalOffset, iconSize, isMenu, onClick, tipProps, verticalOffset = 0, size, variant = "primary", ...buttonStyleProps }, ref) => {
+	const buttonId = useId();
+	const targetRef = useRef(null);
+	const { position, popoverContainerRefCallback } = useDynamicPopoverPosition({
+		targetRef,
+		verticalOffset,
+		defaultPosition
+	});
+	const [isOpen, setIsOpen] = useState(false);
+	useImperativeHandle(ref, () => ({ focus: () => targetRef.current?.focus() }));
+	const handleClick = (event) => {
+		if (!isOpen) onClick?.(event);
+		setIsOpen(!isOpen);
+	};
+	const handleRequestClosed = () => {
+		setIsOpen(false);
+	};
+	const textButtonDefaultSize = "normal";
+	const iconButtonDefaultSize = "small";
+	let clickTarget;
+	switch (buttonType) {
+		case "fill":
+			clickTarget = /* @__PURE__ */ React$1.createElement(FillButton, {
+				ref: targetRef,
+				"aria-expanded": isOpen,
+				id: buttonId,
+				onClick: handleClick,
+				"data-testid": "dropdown-fill-button",
+				size: size || textButtonDefaultSize,
+				variant,
+				...buttonStyleProps ?? {}
+			}, children, /* @__PURE__ */ React$1.createElement(DownArrow, {
+				isOpen,
+				size: iconSize || 12
+			}));
+			break;
+		case "stroke":
+			clickTarget = /* @__PURE__ */ React$1.createElement(StrokeButton, {
+				ref: targetRef,
+				"aria-expanded": isOpen,
+				id: buttonId,
+				onClick: handleClick,
+				"data-testid": "dropdown-stroke-button",
+				size: size || textButtonDefaultSize,
+				variant,
+				...buttonStyleProps ?? {}
+			}, children, /* @__PURE__ */ React$1.createElement(DownArrow, {
+				isOpen,
+				size: iconSize || 12
+			}));
+			break;
+		case "text":
+			clickTarget = /* @__PURE__ */ React$1.createElement(TextButton, {
+				ref: targetRef,
+				id: buttonId,
+				onClick: handleClick,
+				"data-testid": "dropdown-stroke-button",
+				size: size || textButtonDefaultSize,
+				variant,
+				...buttonStyleProps ?? {}
+			}, children, /* @__PURE__ */ React$1.createElement(DownArrow, {
+				isOpen,
+				size: 12
+			}));
+			break;
+		case "kebab":
+			clickTarget = /* @__PURE__ */ React$1.createElement(IconButton, {
+				ref: targetRef,
+				"aria-expanded": isOpen,
+				"aria-haspopup": "menu",
+				id: buttonId,
+				icon: () => /* @__PURE__ */ React$1.createElement(MiniKebabMenuIcon, { size: iconSize }),
+				size: size || iconButtonDefaultSize,
+				variant: "secondary",
+				onClick: handleClick,
+				"data-testid": "dropdown-kebab-button",
+				tip: "Show options",
+				tipProps,
+				...buttonStyleProps ?? {}
+			});
+			break;
+		case "horizontalKebab": clickTarget = /* @__PURE__ */ React$1.createElement(IconButton, {
+			"aria-label": "Options",
+			ref: targetRef,
+			"aria-expanded": isOpen,
+			"aria-haspopup": "menu",
+			id: buttonId,
+			icon: () => /* @__PURE__ */ React$1.createElement(HorizontalKebabIcon, { size: iconSize }),
+			size: size || iconButtonDefaultSize,
+			variant: "secondary",
+			onClick: handleClick,
+			"data-testid": "dropdown-horizontal-kebab-button",
+			tipProps,
+			tip: "Show more options",
+			...buttonStyleProps ?? {}
+		});
+	}
+	return /* @__PURE__ */ React$1.createElement(React$1.Fragment, null, clickTarget, dropdownItems.length !== 0 && /* @__PURE__ */ React$1.createElement(Popover, {
+		popoverContainerRef: popoverContainerRefCallback,
+		targetRef,
+		isOpen,
+		onRequestClose: handleRequestClosed,
+		align,
+		verticalOffset,
+		horizontalOffset,
+		position,
+		outline: true
+	}, /* @__PURE__ */ React$1.createElement(DropdownList, {
+		dropdownItems,
+		isMenu,
+		menuButtonId: buttonId,
+		onClose: handleRequestClosed
+	})));
+});
+
+//#endregion
+export { DropdownButton };
+//# sourceMappingURL=index.js.map

package/dist/DropdownButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["FillButton","IconButton","Popover","StrokeButton","TextButton","ArrowChevronDownFilledIcon","MiniKebabMenuIcon","css","pxRem","styledOptions","styled","forwardRef","useId","useImperativeHandle","useRef","useState","React","DropdownList","useDynamicPopoverPosition","DownArrow","isOpen","HorizontalKebabIcon","transform","DropdownButton","align","buttonType","children","defaultPosition","dropdownItems","horizontalOffset","iconSize","isMenu","onClick","tipProps","verticalOffset","size","variant","buttonStyleProps","ref","buttonId","targetRef","position","popoverContainerRefCallback","setIsOpen","focus","current","handleClick","event","handleRequestClosed","textButtonDefaultSize","iconButtonDefaultSize","clickTarget","aria-expanded","id","data-testid","aria-haspopup","icon","tip","aria-label","length","popoverContainerRef","onRequestClose","outline","menuButtonId","onClose"],"sources":["../../src/DropdownButton/index.tsx"],"sourcesContent":["import {\n  ButtonProps,\n  FillButton,\n  IconButton,\n  Popover,\n  PopoverProps,\n  PopoverYPositionType,\n  StrokeButton,\n  TextButton,\n} from '@codecademy/gamut';\nimport {\n  ArrowChevronDownFilledIcon,\n  MiniKebabMenuIcon,\n} from '@codecademy/gamut-icons';\nimport { css, pxRem, styledOptions } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport {\n  forwardRef,\n  PropsWithChildren,\n  useId,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport * as React from 'react';\n\nimport { DropdownList, DropdownListProps } from './DropdownList';\nimport { useDynamicPopoverPosition } from './useDynamicPopoverPosition';\n\nconst DownArrow = styled(ArrowChevronDownFilledIcon, styledOptions)<{\n  isOpen?: boolean;\n}>`\n  margin-left: ${pxRem(8)};\n  transition: transform 0.35s ease-out;\n  ${({ isOpen }) => isOpen && 'transform: rotate(-180deg)'};\n`;\n\nconst HorizontalKebabIcon = styled(MiniKebabMenuIcon)(\n  css({\n    transform: 'rotate(90deg)',\n  })\n);\n\nexport type DropdownButtonRefType = {\n  focus: HTMLButtonElement['focus'];\n};\n\nexport type DropdownButtonProps = PropsWithChildren<\n  {\n    align?: PopoverProps['align'];\n    buttonType?: 'fill' | 'stroke' | 'text' | 'kebab' | 'horizontalKebab';\n    defaultPosition?: PopoverYPositionType['position'];\n    dropdownItems: DropdownListProps['dropdownItems'];\n    horizontalOffset?: number;\n    /**\n     * Sets the size of the down arrow icon in the buttons that have text or the kebab and horizontal kebab icons.\n     */\n    iconSize?: number;\n    /**\n     * If the dropdown should semantically be a menu\n     */\n    isMenu?: boolean;\n    onClick?: (event: React.MouseEvent) => void;\n    tipProps?: React.ComponentProps<typeof IconButton>['tipProps'];\n    verticalOffset?: number;\n  } & ButtonProps\n>;\n\nexport const DropdownButton = forwardRef<\n  DropdownButtonRefType,\n  DropdownButtonProps\n>(\n  (\n    {\n      align = 'left',\n      buttonType = 'fill',\n      children,\n      defaultPosition = 'below',\n      dropdownItems,\n      horizontalOffset,\n      iconSize,\n      isMenu,\n      onClick,\n      tipProps,\n      verticalOffset = 0,\n      size,\n      variant = 'primary',\n      ...buttonStyleProps\n    },\n    ref\n  ) => {\n    const buttonId = useId();\n    const targetRef = useRef<HTMLAnchorElement | HTMLButtonElement>(null);\n    const { position, popoverContainerRefCallback } = useDynamicPopoverPosition(\n      {\n        targetRef,\n        verticalOffset,\n        defaultPosition,\n      }\n    );\n\n    const [isOpen, setIsOpen] = useState(false);\n\n    useImperativeHandle(ref, () => ({\n      focus: () => targetRef.current?.focus(),\n    }));\n\n    const handleClick = (event: React.MouseEvent) => {\n      if (!isOpen) {\n        onClick?.(event);\n      }\n      setIsOpen(!isOpen);\n    };\n    const handleRequestClosed = () => {\n      setIsOpen(false);\n    };\n\n    const textButtonDefaultSize = 'normal';\n    const iconButtonDefaultSize = 'small';\n\n    let clickTarget: React.ReactNode;\n    switch (buttonType) {\n      case 'fill':\n        clickTarget = (\n          <FillButton\n            ref={targetRef}\n            aria-expanded={isOpen}\n            id={buttonId}\n            onClick={handleClick}\n            data-testid=\"dropdown-fill-button\"\n            size={size || textButtonDefaultSize}\n            variant={variant}\n            {...(buttonStyleProps ?? {})}\n          >\n            {children}\n            <DownArrow isOpen={isOpen} size={iconSize || 12} />\n          </FillButton>\n        );\n        break;\n      case 'stroke':\n        clickTarget = (\n          <StrokeButton\n            ref={targetRef}\n            aria-expanded={isOpen}\n            id={buttonId}\n            onClick={handleClick}\n            data-testid=\"dropdown-stroke-button\"\n            size={size || textButtonDefaultSize}\n            variant={variant}\n            {...(buttonStyleProps ?? {})}\n          >\n            {children}\n            <DownArrow isOpen={isOpen} size={iconSize || 12} />\n          </StrokeButton>\n        );\n        break;\n      case 'text':\n        clickTarget = (\n          <TextButton\n            ref={targetRef}\n            id={buttonId}\n            onClick={handleClick}\n            data-testid=\"dropdown-stroke-button\"\n            size={size || textButtonDefaultSize}\n            variant={variant}\n            {...(buttonStyleProps ?? {})}\n          >\n            {children}\n            <DownArrow isOpen={isOpen} size={12} />\n          </TextButton>\n        );\n        break;\n      case 'kebab':\n        clickTarget = (\n          <IconButton\n            ref={targetRef}\n            aria-expanded={isOpen}\n            aria-haspopup=\"menu\"\n            id={buttonId}\n            icon={() => <MiniKebabMenuIcon size={iconSize} />}\n            size={size || iconButtonDefaultSize}\n            variant=\"secondary\"\n            onClick={handleClick}\n            data-testid=\"dropdown-kebab-button\"\n            tip=\"Show options\"\n            tipProps={tipProps}\n            {...(buttonStyleProps ?? {})}\n          />\n        );\n        break;\n      case 'horizontalKebab':\n        clickTarget = (\n          <IconButton\n            aria-label=\"Options\"\n            ref={targetRef}\n            aria-expanded={isOpen}\n            aria-haspopup=\"menu\"\n            id={buttonId}\n            icon={() => <HorizontalKebabIcon size={iconSize} />}\n            size={size || iconButtonDefaultSize}\n            variant=\"secondary\"\n            onClick={handleClick}\n            data-testid=\"dropdown-horizontal-kebab-button\"\n            tipProps={tipProps}\n            tip=\"Show more options\"\n            {...(buttonStyleProps ?? {})}\n          />\n        );\n    }\n\n    return (\n      <>\n        {clickTarget}\n        {dropdownItems.length !== 0 && (\n          <Popover\n            popoverContainerRef={popoverContainerRefCallback}\n            targetRef={targetRef}\n            isOpen={isOpen}\n            onRequestClose={handleRequestClosed}\n            align={align}\n            verticalOffset={verticalOffset}\n            horizontalOffset={horizontalOffset}\n            position={position}\n            outline\n          >\n            <DropdownList\n              dropdownItems={dropdownItems}\n              isMenu={isMenu}\n              menuButtonId={buttonId}\n              onClose={handleRequestClosed}\n            />\n          </Popover>\n        )}\n      </>\n    );\n  }\n);\n"],"mappings":";;;;;;;;;;AA6BA,MAAMmB,YAAYT,uBAAOL,4BAA4BI,eAAAA;;;mBAGpCD,MAAM,EAAA,EAAA,0CAElB,EAAEY,aAAaA,UAAU,8BAAA,KAAA,8+RAAA;AAG9B,MAAMC,sBAAsBX,uBAAOJ,mBAAAA;;;GACjCC,IAAI,EACFe,WAAW,iBACb,CAAA,EAAA,8+RAAA;AA4BF,MAAaC,iBAAiBZ,4BAK1B,EACEa,QAAQ,QACRC,aAAa,QACbC,UACAC,kBAAkB,SAClBC,eACAC,kBACAC,UACAC,QACAC,SACAC,UACAC,iBAAiB,GACjBC,MACAC,UAAU,WACV,GAAGC,oBAELC,QAAAA;CAEA,MAAMC,WAAW3B,OAAAA;CACjB,MAAM4B,YAAY1B,OAA8C,KAAA;CAChE,MAAM,EAAE2B,UAAUC,gCAAgCxB,0BAChD;EACEsB;EACAN;EACAP;EACF,CAAA;CAGF,MAAM,CAACP,QAAQuB,aAAa5B,SAAS,MAAA;AAErCF,qBAAoByB,YAAY,EAC9BM,aAAaJ,UAAUK,SAASD,OAAAA,EAClC,EAAA;CAEA,MAAME,eAAeC,UAAAA;AACnB,MAAI,CAAC3B,OACHY,WAAUe,MAAAA;AAEZJ,YAAU,CAACvB,OAAAA;;CAEb,MAAM4B,4BAAsB;AAC1BL,YAAU,MAAA;;CAGZ,MAAMM,wBAAwB;CAC9B,MAAMC,wBAAwB;CAE9B,IAAIC;AACJ,SAAQ1B,YAAR;EACE,KAAK;AACH0B,iBACE,wBAAA,cAACnD,YAAAA;IACCsC,KAAKE;IACLY,iBAAehC;IACfiC,IAAId;IACJP,SAASc;IACTQ,eAAY;IACZnB,MAAMA,QAAQc;IACLb;IACR,GAAIC,oBAAoB,EAAE;MAE1BX,UACD,wBAAA,cAACP,WAAAA;IAAkBC;IAAQe,MAAML,YAAY;;AAGjD;EACF,KAAK;AACHqB,iBACE,wBAAA,cAAChD,cAAAA;IACCmC,KAAKE;IACLY,iBAAehC;IACfiC,IAAId;IACJP,SAASc;IACTQ,eAAY;IACZnB,MAAMA,QAAQc;IACLb;IACR,GAAIC,oBAAoB,EAAE;MAE1BX,UACD,wBAAA,cAACP,WAAAA;IAAkBC;IAAQe,MAAML,YAAY;;AAGjD;EACF,KAAK;AACHqB,iBACE,wBAAA,cAAC/C,YAAAA;IACCkC,KAAKE;IACLa,IAAId;IACJP,SAASc;IACTQ,eAAY;IACZnB,MAAMA,QAAQc;IACLb;IACR,GAAIC,oBAAoB,EAAE;MAE1BX,UACD,wBAAA,cAACP,WAAAA;IAAkBC;IAAQe,MAAM;;AAGrC;EACF,KAAK;AACHgB,iBACE,wBAAA,cAAClD,YAAAA;IACCqC,KAAKE;IACLY,iBAAehC;IACfmC,iBAAc;IACdF,IAAId;IACJiB,YAAY,wBAAA,cAAClD,mBAAAA,EAAkB6B,MAAML;IACrCK,MAAMA,QAAQe;IACdd,SAAQ;IACRJ,SAASc;IACTQ,eAAY;IACZG,KAAI;IACMxB;IACT,GAAII,oBAAoB,EAAE;;AAG/B;EACF,KAAK,kBACHc,eACE,wBAAA,cAAClD,YAAAA;GACCyD,cAAW;GACXpB,KAAKE;GACLY,iBAAehC;GACfmC,iBAAc;GACdF,IAAId;GACJiB,YAAY,wBAAA,cAACnC,qBAAAA,EAAoBc,MAAML;GACvCK,MAAMA,QAAQe;GACdd,SAAQ;GACRJ,SAASc;GACTQ,eAAY;GACFrB;GACVwB,KAAI;GACH,GAAIpB,oBAAoB,EAAE;;;AAKnC,QACE,wBAAA,cAAA,QAAA,UAAA,MACGc,aACAvB,cAAc+B,WAAW,KACxB,wBAAA,cAACzD,SAAAA;EACC0D,qBAAqBlB;EACVF;EACHpB;EACRyC,gBAAgBb;EACTxB;EACSU;EACEL;EACRY;EACVqB,SAAAA;IAEA,wBAAA,cAAC7C,cAAAA;EACgBW;EACPG;EACRgC,cAAcxB;EACdyB,SAAShB;;EAMrB"}

package/dist/DropdownButton/useDynamicPopoverPosition.cjs

@@ -0,0 +1,42 @@
+const require_runtime = require('../_virtual/_rolldown/runtime.cjs');
+let react = require("react");
+let react_use = require("react-use");
+
+//#region src/DropdownButton/useDynamicPopoverPosition.ts
+const getClearance = (targetEl, winHeight) => {
+	const { top, bottom } = targetEl.getBoundingClientRect();
+	return {
+		above: top,
+		below: winHeight - bottom
+	};
+};
+const getClearanceNeeded = (popoverContainerEl, verticalOffset) => {
+	const { height } = popoverContainerEl.getBoundingClientRect();
+	return verticalOffset + height;
+};
+const useDynamicPopoverPosition = ({ targetRef, verticalOffset, defaultPosition }) => {
+	const [popoverContainerEl, setPopoverContainerEl] = (0, react.useState)(null);
+	const popoverContainerRefCallback = (0, react.useCallback)((instance) => {
+		setPopoverContainerEl(instance);
+	}, []);
+	const { height: winHeight } = (0, react_use.useWindowSize)();
+	(0, react_use.useWindowScroll)();
+	if (targetRef?.current && popoverContainerEl) {
+		const clearance = getClearance(targetRef.current, winHeight);
+		const clearanceNeeded = getClearanceNeeded(popoverContainerEl, verticalOffset);
+		const clearedAbove = clearance.above >= clearanceNeeded;
+		const clearedBelow = clearance.below >= clearanceNeeded;
+		if (!(clearance.above === clearance.below) && (!clearedAbove || !clearedBelow)) return {
+			position: clearance.above > clearance.below ? "above" : "below",
+			popoverContainerRefCallback
+		};
+	}
+	return {
+		position: defaultPosition,
+		popoverContainerRefCallback
+	};
+};
+
+//#endregion
+exports.useDynamicPopoverPosition = useDynamicPopoverPosition;
+//# sourceMappingURL=useDynamicPopoverPosition.cjs.map

package/dist/DropdownButton/useDynamicPopoverPosition.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDynamicPopoverPosition.cjs","names":["useCallback","useState","useWindowScroll","useWindowSize","getClearance","targetEl","winHeight","top","bottom","getBoundingClientRect","above","below","getClearanceNeeded","popoverContainerEl","verticalOffset","height","useDynamicPopoverPosition","targetRef","defaultPosition","setPopoverContainerEl","popoverContainerRefCallback","instance","current","clearance","clearanceNeeded","clearedAbove","clearedBelow","verticallyCentered","position"],"sources":["../../src/DropdownButton/useDynamicPopoverPosition.ts"],"sourcesContent":["import { PopoverYPositionType } from '@codecademy/gamut';\nimport { RefCallback, RefObject, useCallback, useState } from 'react';\nimport { useWindowScroll, useWindowSize } from 'react-use';\n\n// space between target and edge of window\ntype Clearance = {\n  above: number;\n  below: number;\n};\n\nconst getClearance = (targetEl: HTMLElement, winHeight: number): Clearance => {\n  const { top, bottom } = targetEl.getBoundingClientRect();\n  return {\n    above: top,\n    below: winHeight - bottom,\n  };\n};\n\nconst getClearanceNeeded = (\n  popoverContainerEl: HTMLElement,\n  verticalOffset: number\n): number => {\n  const { height } = popoverContainerEl.getBoundingClientRect();\n  return verticalOffset + height;\n};\n\ntype Position = Required<PopoverYPositionType>['position'];\n\nexport type UseDynamicPopoverPositionProps = {\n  targetRef: RefObject<HTMLElement>;\n  verticalOffset: number;\n  defaultPosition: Position;\n};\n\nexport type UseDynamicPopoverPositionReturn = {\n  position: Position;\n  popoverContainerRefCallback: RefCallback<HTMLElement | null>;\n};\n\nexport const useDynamicPopoverPosition = ({\n  targetRef,\n  verticalOffset,\n  defaultPosition,\n}: UseDynamicPopoverPositionProps): UseDynamicPopoverPositionReturn => {\n  const [popoverContainerEl, setPopoverContainerEl] =\n    useState<HTMLElement | null>(null);\n\n  // called when the popover container is renderd or removed\n  const popoverContainerRefCallback: RefCallback<HTMLElement | null> =\n    useCallback((instance: HTMLElement | null) => {\n      setPopoverContainerEl(instance);\n    }, []);\n\n  const { height: winHeight } = useWindowSize(); // re-calc on window resize\n  useWindowScroll(); // re-calc on scroll\n\n  if (targetRef?.current && popoverContainerEl) {\n    const clearance = getClearance(targetRef.current, winHeight);\n    const clearanceNeeded = getClearanceNeeded(\n      popoverContainerEl,\n      verticalOffset\n    );\n    const clearedAbove = clearance.above >= clearanceNeeded;\n    const clearedBelow = clearance.below >= clearanceNeeded;\n    const verticallyCentered = clearance.above === clearance.below;\n\n    if (!verticallyCentered && (!clearedAbove || !clearedBelow)) {\n      return {\n        position: clearance.above > clearance.below ? 'above' : 'below',\n        popoverContainerRefCallback,\n      };\n    }\n  }\n\n  return {\n    position: defaultPosition,\n    popoverContainerRefCallback,\n  };\n};\n"],"mappings":";;;;;AAUA,MAAMI,gBAAgBC,UAAuBC,cAAAA;CAC3C,MAAM,EAAEC,KAAKC,WAAWH,SAASI,uBAAqB;AACtD,QAAO;EACLC,OAAOH;EACPI,OAAOL,YAAYE;EACrB;;AAGF,MAAMI,sBACJC,oBACAC,mBAAAA;CAEA,MAAM,EAAEC,WAAWF,mBAAmBJ,uBAAqB;AAC3D,QAAOK,iBAAiBC;;AAgB1B,MAAaC,6BAA6B,EACxCC,WACAH,gBACAI,sBAC+B;CAC/B,MAAM,CAACL,oBAAoBM,6CACI,KAAA;CAG/B,MAAMC,sDACSC,aAAAA;AACXF,wBAAsBE,SAAAA;IACrB,EAAE,CAAA;CAEP,MAAM,EAAEN,QAAQT,4CAAcH;AAC9BD,iCAAAA;AAEA,KAAIe,WAAWK,WAAWT,oBAAoB;EAC5C,MAAMU,YAAYnB,aAAaa,UAAUK,SAAShB,UAAAA;EAClD,MAAMkB,kBAAkBZ,mBACtBC,oBACAC,eAAAA;EAEF,MAAMW,eAAeF,UAAUb,SAASc;EACxC,MAAME,eAAeH,UAAUZ,SAASa;AAGxC,MAAI,EAFuBD,UAAUb,UAAUa,UAAUZ,WAE7B,CAACc,gBAAgB,CAACC,cAC5C,QAAO;GACLE,UAAUL,UAAUb,QAAQa,UAAUZ,QAAQ,UAAU;GACxDS;GACF;;AAIJ,QAAO;EACLQ,UAAUV;EACVE;EACF"}

package/dist/DropdownButton/useDynamicPopoverPosition.js

@@ -1,55 +1,41 @@
-import { useCallback, useState } from 'react';
-import { useWindowScroll, useWindowSize } from 'react-use';
-
-// space between target and edge of window
+import { useCallback, useState } from "react";
+import { useWindowScroll, useWindowSize } from "react-use";
 
+//#region src/DropdownButton/useDynamicPopoverPosition.ts
 const getClearance = (targetEl, winHeight) => {
-  const {
-    top,
-    bottom
-  } = targetEl.getBoundingClientRect();
-  return {
-    above: top,
-    below: winHeight - bottom
-  };
+	const { top, bottom } = targetEl.getBoundingClientRect();
+	return {
+		above: top,
+		below: winHeight - bottom
+	};
 };
 const getClearanceNeeded = (popoverContainerEl, verticalOffset) => {
-  const {
-    height
-  } = popoverContainerEl.getBoundingClientRect();
-  return verticalOffset + height;
+	const { height } = popoverContainerEl.getBoundingClientRect();
+	return verticalOffset + height;
+};
+const useDynamicPopoverPosition = ({ targetRef, verticalOffset, defaultPosition }) => {
+	const [popoverContainerEl, setPopoverContainerEl] = useState(null);
+	const popoverContainerRefCallback = useCallback((instance) => {
+		setPopoverContainerEl(instance);
+	}, []);
+	const { height: winHeight } = useWindowSize();
+	useWindowScroll();
+	if (targetRef?.current && popoverContainerEl) {
+		const clearance = getClearance(targetRef.current, winHeight);
+		const clearanceNeeded = getClearanceNeeded(popoverContainerEl, verticalOffset);
+		const clearedAbove = clearance.above >= clearanceNeeded;
+		const clearedBelow = clearance.below >= clearanceNeeded;
+		if (!(clearance.above === clearance.below) && (!clearedAbove || !clearedBelow)) return {
+			position: clearance.above > clearance.below ? "above" : "below",
+			popoverContainerRefCallback
+		};
+	}
+	return {
+		position: defaultPosition,
+		popoverContainerRefCallback
+	};
 };
-export const useDynamicPopoverPosition = ({
-  targetRef,
-  verticalOffset,
-  defaultPosition
-}) => {
-  const [popoverContainerEl, setPopoverContainerEl] = useState(null);
-
-  // called when the popover container is renderd or removed
-  const popoverContainerRefCallback = useCallback(instance => {
-    setPopoverContainerEl(instance);
-  }, []);
-  const {
-    height: winHeight
-  } = useWindowSize(); // re-calc on window resize
-  useWindowScroll(); // re-calc on scroll
 
-  if (targetRef?.current && popoverContainerEl) {
-    const clearance = getClearance(targetRef.current, winHeight);
-    const clearanceNeeded = getClearanceNeeded(popoverContainerEl, verticalOffset);
-    const clearedAbove = clearance.above >= clearanceNeeded;
-    const clearedBelow = clearance.below >= clearanceNeeded;
-    const verticallyCentered = clearance.above === clearance.below;
-    if (!verticallyCentered && (!clearedAbove || !clearedBelow)) {
-      return {
-        position: clearance.above > clearance.below ? 'above' : 'below',
-        popoverContainerRefCallback
-      };
-    }
-  }
-  return {
-    position: defaultPosition,
-    popoverContainerRefCallback
-  };
-};
+//#endregion
+export { useDynamicPopoverPosition };
+//# sourceMappingURL=useDynamicPopoverPosition.js.map

package/dist/DropdownButton/useDynamicPopoverPosition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDynamicPopoverPosition.js","names":["useCallback","useState","useWindowScroll","useWindowSize","getClearance","targetEl","winHeight","top","bottom","getBoundingClientRect","above","below","getClearanceNeeded","popoverContainerEl","verticalOffset","height","useDynamicPopoverPosition","targetRef","defaultPosition","setPopoverContainerEl","popoverContainerRefCallback","instance","current","clearance","clearanceNeeded","clearedAbove","clearedBelow","verticallyCentered","position"],"sources":["../../src/DropdownButton/useDynamicPopoverPosition.ts"],"sourcesContent":["import { PopoverYPositionType } from '@codecademy/gamut';\nimport { RefCallback, RefObject, useCallback, useState } from 'react';\nimport { useWindowScroll, useWindowSize } from 'react-use';\n\n// space between target and edge of window\ntype Clearance = {\n  above: number;\n  below: number;\n};\n\nconst getClearance = (targetEl: HTMLElement, winHeight: number): Clearance => {\n  const { top, bottom } = targetEl.getBoundingClientRect();\n  return {\n    above: top,\n    below: winHeight - bottom,\n  };\n};\n\nconst getClearanceNeeded = (\n  popoverContainerEl: HTMLElement,\n  verticalOffset: number\n): number => {\n  const { height } = popoverContainerEl.getBoundingClientRect();\n  return verticalOffset + height;\n};\n\ntype Position = Required<PopoverYPositionType>['position'];\n\nexport type UseDynamicPopoverPositionProps = {\n  targetRef: RefObject<HTMLElement>;\n  verticalOffset: number;\n  defaultPosition: Position;\n};\n\nexport type UseDynamicPopoverPositionReturn = {\n  position: Position;\n  popoverContainerRefCallback: RefCallback<HTMLElement | null>;\n};\n\nexport const useDynamicPopoverPosition = ({\n  targetRef,\n  verticalOffset,\n  defaultPosition,\n}: UseDynamicPopoverPositionProps): UseDynamicPopoverPositionReturn => {\n  const [popoverContainerEl, setPopoverContainerEl] =\n    useState<HTMLElement | null>(null);\n\n  // called when the popover container is renderd or removed\n  const popoverContainerRefCallback: RefCallback<HTMLElement | null> =\n    useCallback((instance: HTMLElement | null) => {\n      setPopoverContainerEl(instance);\n    }, []);\n\n  const { height: winHeight } = useWindowSize(); // re-calc on window resize\n  useWindowScroll(); // re-calc on scroll\n\n  if (targetRef?.current && popoverContainerEl) {\n    const clearance = getClearance(targetRef.current, winHeight);\n    const clearanceNeeded = getClearanceNeeded(\n      popoverContainerEl,\n      verticalOffset\n    );\n    const clearedAbove = clearance.above >= clearanceNeeded;\n    const clearedBelow = clearance.below >= clearanceNeeded;\n    const verticallyCentered = clearance.above === clearance.below;\n\n    if (!verticallyCentered && (!clearedAbove || !clearedBelow)) {\n      return {\n        position: clearance.above > clearance.below ? 'above' : 'below',\n        popoverContainerRefCallback,\n      };\n    }\n  }\n\n  return {\n    position: defaultPosition,\n    popoverContainerRefCallback,\n  };\n};\n"],"mappings":";;;;AAUA,MAAMI,gBAAgBC,UAAuBC,cAAAA;CAC3C,MAAM,EAAEC,KAAKC,WAAWH,SAASI,uBAAqB;AACtD,QAAO;EACLC,OAAOH;EACPI,OAAOL,YAAYE;EACrB;;AAGF,MAAMI,sBACJC,oBACAC,mBAAAA;CAEA,MAAM,EAAEC,WAAWF,mBAAmBJ,uBAAqB;AAC3D,QAAOK,iBAAiBC;;AAgB1B,MAAaC,6BAA6B,EACxCC,WACAH,gBACAI,sBAC+B;CAC/B,MAAM,CAACL,oBAAoBM,yBACzBlB,SAA6B,KAAA;CAG/B,MAAMmB,8BACJpB,aAAaqB,aAAAA;AACXF,wBAAsBE,SAAAA;IACrB,EAAE,CAAA;CAEP,MAAM,EAAEN,QAAQT,cAAcH,eAAAA;AAC9BD,kBAAAA;AAEA,KAAIe,WAAWK,WAAWT,oBAAoB;EAC5C,MAAMU,YAAYnB,aAAaa,UAAUK,SAAShB,UAAAA;EAClD,MAAMkB,kBAAkBZ,mBACtBC,oBACAC,eAAAA;EAEF,MAAMW,eAAeF,UAAUb,SAASc;EACxC,MAAME,eAAeH,UAAUZ,SAASa;AAGxC,MAAI,EAFuBD,UAAUb,UAAUa,UAAUZ,WAE7B,CAACc,gBAAgB,CAACC,cAC5C,QAAO;GACLE,UAAUL,UAAUb,QAAQa,UAAUZ,QAAQ,UAAU;GACxDS;GACF;;AAIJ,QAAO;EACLQ,UAAUV;EACVE;EACF"}