1 line
9.1 KiB
Plaintext
1 line
9.1 KiB
Plaintext
{"version":3,"file":"nanopop.min.mjs","sources":["../src/NanoPop.ts"],"sourcesContent":["export type NanoPopOptions = {\n forceApplyOnFailure?: boolean;\n container?: DOMRect;\n position?: NanoPopPositionCombination;\n margin?: number;\n variantFlipOrder?: VariantFlipOrder;\n positionFlipOrder?: PositionFlipOrder;\n};\n\nexport type VariantFlipOrder = {\n start: string;\n middle: string;\n end: string;\n};\n\nexport type PositionFlipOrder = {\n top: string;\n right: string;\n bottom: string;\n left: string;\n};\n\nexport type NanoPopPosition = 'top' | 'left' | 'bottom' | 'right';\n\nexport type NanoPopPositionCombination =\n 'top-start' | 'top-middle' | 'top-end' |\n 'left-start' | 'left-middle' | 'left-end' |\n 'right-start' | 'right-middle' | 'right-end' |\n 'bottom-start' | 'bottom-middle' | 'bottom-end' | NanoPopPosition;\n\ntype PositionPairs = [NanoPopPosition, NanoPopPosition];\n\ntype InternalSettings = {\n forceApplyOnFailure: boolean;\n container: DOMRect;\n position: NanoPopPositionCombination;\n margin: number;\n variantFlipOrder: VariantFlipOrder;\n positionFlipOrder: PositionFlipOrder;\n reference: HTMLElement;\n popper: HTMLElement;\n};\n\ntype AvailablePositions = {\n t: number;\n b: number;\n l: number;\n r: number;\n};\n\ntype AvailableVariants = {\n vs: number;\n vm: number;\n ve: number;\n hs: number;\n hm: number;\n he: number;\n};\n\nexport class NanoPop {\n\n // Public version\n public static readonly version = VERSION;\n\n // Defaults\n public static defaultVariantFlipOrder = {start: 'sme', middle: 'mse', end: 'ems'};\n public static defaultPositionFlipOrder = {top: 'tbrl', right: 'rltb', bottom: 'btrl', left: 'lrbt'};\n\n private _config: InternalSettings;\n\n constructor(\n reference: HTMLElement,\n popper: HTMLElement, {\n positionFlipOrder = NanoPop.defaultPositionFlipOrder,\n variantFlipOrder = NanoPop.defaultVariantFlipOrder,\n container = document.documentElement.getBoundingClientRect(),\n forceApplyOnFailure = false,\n margin = 8,\n position = 'bottom-start'\n }: NanoPopOptions = {}\n ) {\n this._config = {\n positionFlipOrder,\n variantFlipOrder,\n reference,\n popper,\n position,\n container,\n forceApplyOnFailure,\n margin\n };\n }\n\n /**\n * Re-aligns the element\n * @param opt Optional, updated settings\n */\n update(opt: Partial<InternalSettings> = this._config, _force = false): string | null {\n const {\n container,\n reference,\n popper,\n margin,\n position,\n forceApplyOnFailure,\n variantFlipOrder,\n positionFlipOrder\n } = this._config = {...this._config, ...opt};\n\n /**\n * Reset position to resolve viewport\n * See https://developer.mozilla.org/en-US/docs/Web/CSS/position#fixed\n */\n popper.style.left = '0';\n popper.style.top = '0';\n\n const refBox = reference.getBoundingClientRect();\n const popBox = popper.getBoundingClientRect();\n\n /**\n * Holds coordinates of top, left, bottom and right alignment\n */\n const positionStore: AvailablePositions = {\n t: refBox.top - popBox.height - margin,\n b: refBox.bottom + margin,\n r: refBox.right + margin,\n l: refBox.left - popBox.width - margin\n };\n\n /**\n * Holds corresponding variants (start, middle, end).\n * The values depend on horizontal / vertical orientation\n */\n const variantStore: AvailableVariants = {\n vm: (-popBox.width / 2) + (refBox.left + refBox.width / 2),\n vs: refBox.left,\n ve: refBox.left + refBox.width - popBox.width,\n hs: refBox.bottom - refBox.height,\n he: refBox.bottom - popBox.height,\n hm: refBox.bottom - refBox.height / 2 - popBox.height / 2\n };\n\n // Extract position and variant\n // Top-start -> top is \"position\" and \"start\" is the variant\n const [posKey, varKey = 'middle'] = position.split('-');\n const positions = positionFlipOrder[posKey as keyof PositionFlipOrder];\n const variants = variantFlipOrder[varKey as keyof VariantFlipOrder];\n\n // Try out all possible combinations, starting with the preferred one.\n const {top, left, bottom, right} = container;\n\n for (const p of positions) {\n const vertical = (p === 't' || p === 'b');\n\n // The position/variant-value, the related size value of the popper and the limit\n const mainVal = positionStore[p as keyof AvailablePositions];\n\n // Which property has to be changes.\n const [positionKey, variantKey] = (vertical ? ['top', 'left'] : ['left', 'top']) as PositionPairs;\n\n /**\n * box refers to the size of the popper element. Depending on the orientation this is width or height.\n * The limit is the corresponding, maximum value for this position.\n */\n const [positionBox, variantBox] = vertical ? [popBox.height, popBox.width] : [popBox.width, popBox.height];\n const [positionMaximum, variantMaximum] = vertical ? [bottom, right] : [right, bottom];\n const [positionMinimum, variantMinimum] = vertical ? [top, left] : [left, top];\n\n // Skip pre-clipped values\n if (!_force && (mainVal < (positionMinimum) || (mainVal + positionBox) > (positionMaximum))) {\n continue;\n }\n\n for (const v of variants) {\n\n // The position-value, the related size value of the popper and the limit\n const variantVal = variantStore[((vertical ? 'v' : 'h') + v) as keyof AvailableVariants];\n\n if (!_force && (variantVal < (variantMinimum) || (variantVal + variantBox) > (variantMaximum))) {\n continue;\n }\n\n // Apply styles and normalize viewport\n popper.style[variantKey] = `${variantVal - popBox[variantKey]}px`;\n popper.style[positionKey] = `${mainVal - popBox[positionKey]}px`;\n return p + v;\n }\n }\n\n if (forceApplyOnFailure) {\n return this.update(undefined, true);\n }\n\n return null;\n }\n}\n"],"names":["NanoPop","[object Object]","reference","popper","positionFlipOrder","defaultPositionFlipOrder","variantFlipOrder","defaultVariantFlipOrder","container","document","documentElement","getBoundingClientRect","forceApplyOnFailure","margin","position","this","_config","opt","_force","style","left","top","refBox","popBox","positionStore","t","height","b","bottom","r","right","l","width","variantStore","vm","vs","ve","hs","he","hm","posKey","varKey","split","positions","variants","p","vertical","mainVal","positionKey","variantKey","positionBox","variantBox","positionMaximum","variantMaximum","positionMinimum","variantMinimum","v","variantVal","update","undefined","start","middle","end"],"mappings":";YA8CA,MAAaA,QAOTC,YAAYC,EAAwBC,GAAqBC,kBAAEA,EAAoBJ,QAAQK,yBAAwBC,iBAAEA,EAAmBN,QAAQO,wBAAuBC,UAAEA,EAAYC,SAASC,gBAAgBC,wBAAuBC,oBAAEA,GAAsB,EAAKC,OAAEA,EAAS,EAACC,SAAEA,EAAW,gBAAmC,IACtTC,KAAKC,EAAU,CACXZ,kBAAAA,EACAE,iBAAAA,EACAJ,UAAAA,EACAC,OAAAA,EACAW,SAAAA,EACAN,UAAAA,EACAI,oBAAAA,EACAC,OAAAA,GAORZ,OAAOgB,EAAiCF,KAAKC,EAASE,GAAS,GAC3D,MAAMV,UAAEA,EAASN,UAAEA,EAASC,OAAEA,EAAMU,OAAEA,EAAMC,SAAEA,EAAQF,oBAAEA,EAAmBN,iBAAEA,EAAgBF,kBAAEA,GAAsBW,KAAKC,EAAU,IAAKD,KAAKC,KAAYC,GAK1Jd,EAAOgB,MAAMC,KAAO,IACpBjB,EAAOgB,MAAME,IAAM,IACnB,MAAMC,EAASpB,EAAUS,wBACnBY,EAASpB,EAAOQ,wBAIhBa,EAAoC,CACtCC,EAAGH,EAAOD,IAAME,EAAOG,OAASb,EAChCc,EAAGL,EAAOM,OAASf,EACnBgB,EAAGP,EAAOQ,MAAQjB,EAClBkB,EAAGT,EAAOF,KAAOG,EAAOS,MAAQnB,GAM9BoB,EAAkC,CACpCC,IAAMX,EAAOS,MAAQ,GAAMV,EAAOF,KAAOE,EAAOU,MAAQ,GACxDG,GAAIb,EAAOF,KACXgB,GAAId,EAAOF,KAAOE,EAAOU,MAAQT,EAAOS,MACxCK,GAAIf,EAAOM,OAASN,EAAOI,OAC3BY,GAAIhB,EAAOM,OAASL,EAAOG,OAC3Ba,GAAIjB,EAAOM,OAASN,EAAOI,OAAS,EAAIH,EAAOG,OAAS,IAIrDc,EAAQC,EAAS,UAAY3B,EAAS4B,MAAM,KAC7CC,EAAYvC,EAAkBoC,GAC9BI,EAAWtC,EAAiBmC,IAE5BpB,IAAEA,EAAGD,KAAEA,EAAIQ,OAAEA,EAAME,MAAEA,GAAUtB,EACrC,IAAK,MAAMqC,KAAKF,EAAW,CACvB,MAAMG,EAAkB,MAAND,GAAmB,MAANA,EAEzBE,EAAUvB,EAAcqB,IAEvBG,EAAaC,GAAeH,EAAW,CAAC,MAAO,QAAU,CAAC,OAAQ,QAKlEI,EAAaC,GAAcL,EAAW,CAACvB,EAAOG,OAAQH,EAAOS,OAAS,CAACT,EAAOS,MAAOT,EAAOG,SAC5F0B,EAAiBC,GAAkBP,EAAW,CAAClB,EAAQE,GAAS,CAACA,EAAOF,IACxE0B,EAAiBC,GAAkBT,EAAW,CAACzB,EAAKD,GAAQ,CAACA,EAAMC,GAE1E,GAAKH,KAAW6B,KAAgCA,EAAUG,KAG1D,IAAK,MAAMM,KAAKZ,EAAU,CAEtB,MAAMa,EAAaxB,GAAea,EAAW,IAAM,KAAOU,GAC1D,GAAKtC,KAAWuC,KAAkCA,EAAaN,KAM/D,OAFAhD,EAAOgB,MAAM8B,GAAiBQ,EAAalC,EAAO0B,GAAvB,KAC3B9C,EAAOgB,MAAM6B,GAAkBD,EAAUxB,EAAOyB,GAApB,KACrBH,EAAIW,GAGnB,OAAI5C,EACOG,KAAK2C,YAAOC,GAAW,GAE3B,MAEf,OA7F2B3D,gBAAU,QAEnBA,gCAA0B,CAAE4D,MAAO,MAAOC,OAAQ,MAAOC,IAAK,OAC9D9D,iCAA2B,CAAEqB,IAAK,OAAQS,MAAO,OAAQF,OAAQ,OAAQR,KAAM"} |