@khanacademy/perseus-editor 28.13.0 → 28.14.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/dist/es/index.css +1 -1
  2. package/dist/es/index.css.map +1 -1
  3. package/dist/es/index.js +7 -5
  4. package/dist/es/index.js.map +1 -1
  5. package/dist/index.css +1 -1
  6. package/dist/index.css.map +1 -1
  7. package/dist/index.js +6 -4
  8. package/dist/index.js.map +1 -1
  9. package/dist/preview/message-types.d.ts +0 -40
  10. package/dist/testing/feature-flags-util.d.ts +2 -0
  11. package/dist/widgets/image-editor/components/image-scale-input.d.ts +10 -0
  12. package/dist/widgets/image-editor/components/image-settings.d.ts +1 -1
  13. package/dist/widgets/interactive-graph-editor/interactive-graph-editor.d.ts +65 -65
  14. package/package.json +42 -42
package/dist/es/index.css CHANGED
@@ -2,7 +2,7 @@ code{font-family:Courier,monospace}.pod-title{background-color:#eee;border:1px s
2
2
  --wb-semanticColor-core-background-neutral-subtle
3
3
  )!important;border-color:var(--wb-semanticColor-core-border-neutral-subtle)!important;cursor:not-allowed!important;opacity:.6!important}.perseus-single-editor.perseus-editor-disabled button{cursor:not-allowed!important;opacity:.6!important}.perseus-editor-disabled .perseus-widget-plotter{pointer-events:none}.perseus_gWNmMo2D{margin-block-end:var(--wb-sizing-size_080)}.perseus_IFt-b1c6{align-items:center;display:flex;gap:var(--wb-sizing-size_040)}.perseus_4qo24hC2{align-items:start;background-color:var(
4
4
  --wb-semanticColor-core-background-instructive-subtle
5
- );border:1px solid var(--wb-semanticColor-core-border-base-subtle);border-radius:var(--wb-sizing-size_080);display:flex;flex-direction:column;margin-block-end:var(--wb-sizing-size_120);margin-block-start:var(--wb-sizing-size_080);padding:var(--wb-sizing-size_080)}.perseus_BMTr3h5s{align-items:center;display:flex;flex-direction:row}.perseus_4OCWnpA9{display:block;margin-inline:var(--wb-sizing-size_080)}.perseus_wAZzFxEx{height:26px!important}.perseus_6FquBkGo{align-items:center!important;display:flex!important;flex-direction:row!important;margin-top:8px!important}.perseus_vQVrIBvm{color:#626569;font-family:inherit;font-size:15px;font-weight:700;line-height:var(--wb-font-body-lineHeight-large);margin-bottom:var(--wb-sizing-size_060)}.perseus_uz5HIc6B{display:flex;padding:var(--wb-sizing-size_060) var(--wb-sizing-size_0)}.perseus_nqkpIulz{color:#626569;font-family:inherit;font-size:15px;line-height:1.25;margin-left:var(--wb-sizing-size_160)}.perseus_aAJcd7Pn{margin-right:var(--wb-sizing-size_080)}.perseus_fAVMAcnB{background-color:var(
5
+ );border:1px solid var(--wb-semanticColor-core-border-base-subtle);border-radius:var(--wb-sizing-size_080);display:flex;flex-direction:column;margin-block-end:var(--wb-sizing-size_120);margin-block-start:var(--wb-sizing-size_080);padding:var(--wb-sizing-size_080)}.perseus_BMTr3h5s{align-items:center;display:flex;flex-direction:row}.perseus_4OCWnpA9{display:block;margin-inline:var(--wb-sizing-size_080)}.perseus_SKDkfpcb{background-color:var(--wb-semanticColor-core-background-neutral-default);height:1px;margin-block:var(--wb-sizing-size_080);width:100%}.perseus_wAZzFxEx{height:26px!important}.perseus_6FquBkGo{align-items:center!important;display:flex!important;flex-direction:row!important;margin-top:8px!important}.perseus_vQVrIBvm{color:#626569;font-family:inherit;font-size:15px;font-weight:700;line-height:var(--wb-font-body-lineHeight-large);margin-bottom:var(--wb-sizing-size_060)}.perseus_uz5HIc6B{display:flex;padding:var(--wb-sizing-size_060) var(--wb-sizing-size_0)}.perseus_nqkpIulz{color:#626569;font-family:inherit;font-size:15px;line-height:1.25;margin-left:var(--wb-sizing-size_160)}.perseus_aAJcd7Pn{margin-right:var(--wb-sizing-size_080)}.perseus_fAVMAcnB{background-color:var(
6
6
  --wb-semanticColor-core-background-instructive-subtle
7
7
  );border:1px solid var(--wb-semanticColor-core-border-neutral-subtle);border-radius:12px;display:flex;flex-direction:column;margin-block-end:12px;padding-block:4px;padding-inline:12px}.perseus_FUUSHyqm,.perseus_qMTuHJ53{align-items:center;display:flex;flex-direction:row;margin-block-start:8px}.perseus_JUItwJjV{background-color:var(--wb-semanticColor-core-background-base-default);border:1px solid var(--wb-semanticColor-core-border-neutral-default);border-radius:8px;display:flex;flex-direction:column;margin-block-start:8px;padding:8px;padding-block-start:24px;position:relative}
8
8
  /*# sourceMappingURL=index.css.map */
package/dist/es/index.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["perseus-editor.css","decorative-toggle.module.css","image-editor.module.css","interactive-graph-editor.module.css","label-image-editor.module.css","radio-editor.module.css"],"names":[],"mappings":"AAAA,KACI,6BACJ,CACA,WACI,qBAAsB,CACtB,qBAAsB,CACtB,eAAgB,CAGhB,yBAA0B,CAF1B,gBAAiB,CACjB,gBAEJ,CACA,kBACI,iBACJ,CACA,QAEI,MAAS,CADT,iBAAkB,CAElB,OACJ,CACA,uBACI,qBAAsB,CACtB,UACJ,CACA,qBAEI,qBAAsB,CACtB,YAAa,CAFb,UAGJ,CACA,6BACI,wBACJ,CACA,uBACI,qBAAsB,CACtB,cAAe,CACf,eAAgB,CAChB,iBACJ,CACA,kDAKI,oBAAqB,CAJrB,iBAAkB,CAClB,kBAAmB,CACnB,YAAa,CACb,oBAEJ,CACA,oDAEI,qBAAsB,CADtB,eAEJ,CACA,6DACI,qBACJ,CACA,0DACI,qBACJ,CACA,gCACI,sBAAuB,CACvB,QAAS,CACT,qBAAsB,CACtB,YAAa,CACb,WAAY,CACZ,MAAO,CACP,eAAgB,CAChB,YAAa,CACb,iBAAkB,CAClB,WAAY,CACZ,KAAM,CACN,UACJ,CACA,oBACI,YAAa,CACb,UACJ,CACA,2FAEI,oBAAqB,CACrB,SACJ,CACA,qHAEI,WAAY,CACZ,gBACJ,CACA,iCACI,gBACJ,CACA,wBACI,qBAAsB,CACtB,YACJ,CACA,0BACI,iBACJ,CACA,uBACI,qBAAsB,CACtB,yBAA0B,CAC1B,YACJ,CACA,qBACI,4BACJ,CACA,yBACI,YACJ,CACA,uBACI,qBAAsB,CACtB,iBAAkB,CAClB,eACJ,CACA,oDASI,kBAAmB,CARnB,qBAAsB,CAMtB,QAAS,CADT,yBAA0B,CAK1B,cAAe,CAHf,YAAa,CAJb,gBAAiB,CACjB,gBAAiB,CAKjB,iBAEJ,CACA,2DACI,iBACJ,CACA,iEACI,WACJ,CACA,sDACI,aAAc,CACd,oBACJ,CACA,+DACI,gBACJ,CACA,mEACI,cAAe,CACf,cACJ,CACA,sDACI,yBAA0B,CAC1B,yBAA0B,CAC1B,YAAa,CACb,iBACJ,CACA,4DACI,YACJ,CACA,sEACI,kBAAmB,CAEnB,gBAAiB,CAEjB,uBACJ,CACA,0EACI,oBAAqB,CACrB,gBACJ,CACA,8CACI,iBACJ,CACA,0CACI,YAAa,CACb,kBACJ,CACA,2CACI,iBAAkB,CAClB,kBACJ,CACA,gCAEI,kBAAmB,CADnB,mBAEJ,CACA,oCACI,UAAW,CACX,cAAe,CACf,iBACJ,CACA,oCACI,mBAAoB,CACpB,UACJ,CACA,8CACI,sBAAuB,CACvB,YAAa,CAEb,oDAE4B,CAH5B,iBAIJ,CACA,6CACI,sBAAuB,CACvB,eAAgB,CAEhB,iCAAmC,CADnC,kBAEJ,CACA,sEAEI,aAAc,CADd,eAAgB,CAGhB,aACJ,CACA,kCACI,qBAAsB,CACtB,qBAAsB,CAEtB,yBAA0B,CAD1B,YAAa,CAEb,YAAa,CACb,cAAe,CACf,cACJ,CACA,yCACI,UACJ,CACA,4CACI,qBACJ,CACA,iCACI,qBAAyB,CAEzB,UAAW,CADX,WAEJ,CACA,2BACI,WAAY,CACZ,MAAO,CACP,WAAY,CACZ,gBAAiB,CACjB,cAAe,CACf,gBACJ,CACA,eACI,aACJ,CACA,SACI,WAAY,CACZ,wBAAyB,CACzB,UACJ,CACA,gCACI,QACJ,CACA,uDACI,eACJ,CACA,gFAEI,mBACJ,CACA,4DAEI,YAAa,CACb,kBAAmB,CACnB,kBAAmB,CACnB,eACJ,CACA,aAGI,UAAW,CAFX,cAAe,CAGf,mBAAoB,CAFpB,iBAGJ,CACA,8EAKI,iBAAkB,CAClB,SAEJ,CACA,sBACI,UAAW,CACX,aAAc,CACd,kBACJ,CACA,oBACI,iBACJ,CACA,0BACI,kBAAmB,CAInB,eAAgB,CAChB,eAAgB,CAJhB,kBAAmB,CAKnB,iBAAkB,CAJlB,kBAAmB,CACnB,WAAY,CAIZ,UACJ,CACA,2BACI,qBAAsB,CACtB,kBAAmB,CAEnB,qBAAgB,CAChB,kBACJ,CACA,qBACI,mBACJ,CACA,4CACI,iBACJ,CACA,2CACI,cACJ,CACA,mGAEI,UAAW,CACX,oBACJ,CACA,kDACI,iBACJ,CACA,kCACI,WAAY,CACZ,cAAe,CACf,cACJ,CACA,gCACI,cACJ,CACA,iFAGI,YACJ,CACA,gDACI,UACJ,CACA,8DACI,eACJ,CACA,wBACI,kBAAmB,CACnB,eACJ,CACA,8CACI,gBAAiB,CACjB,iBACJ,CACA,+CACI,kBACJ,CACA,6FAEI,cAAe,CAEf,YAAa,CADb,gBAEJ,CACA,kDACI,eACJ,CACA,qKAII,qBACJ,CACA,wCACI,gCAAqC,CAErC,sCAA2C,CAD3C,eAAgB,CAEhB,iBACJ,CACA,yCACI,4BAA6B,CAC7B,iBACJ,CACA,wCACI,kBACJ,CACA,mDACI,UACJ,CACA,yDACI,gCAAqC,CACrC,sCAA2C,CAC3C,UACJ,CACA,yHAEI,gBAAiB,CACjB,iBACJ,CACA,qCACI,WAAY,CACZ,eACJ,CACA,6CACI,aAAc,CACd,gBAAiB,CACjB,iBACJ,CACA,6CACI,kBAAmB,CACnB,iBACJ,CACA,2DACI,qBACJ,CACA,6DACI,kBACJ,CACA,6DACI,eACJ,CACA,0CACI,qBAAsB,CACtB,iBAAkB,CAClB,WACJ,CAEA,2CACI,aACJ,CACA,4DAGI,kBAAmB,CAFnB,YAAa,CACb,kBAAmB,CAEnB,QAAS,CACT,kBACJ,CAEA,wCACI,mBAAoB,CACpB,kBACJ,CACA,yCAGI,kBAAmB,CAFnB,YAAa,CACb,kBAAmB,CAGnB,kBAAmB,CADnB,WAEJ,CACA,wCACI,kBACJ,CACA,6BACI,qCAA0C,CAE1C,cAAe,CADf,eAAgB,CAEhB,gBACJ,CACA,kEACI,eACJ,CACA,oDACI,cACJ,CACA,+EACI,kBACJ,CACA,6DACI,qBAAyB,CACzB,kCAAuC,CACvC,iBACJ,CACA,kHAEI,oBACJ,CACA,kEACI,aACJ,CACA,wEACI,eAAmB,CACnB,kCAAuC,CACvC,iBAAkB,CAClB,aAAc,CACd,qCAA0C,CAE1C,cAAe,CADf,eAAgB,CAEhB,gBAAiB,CACjB,mBACJ,CACA,uFAGI,eAAgB,CAChB,SACJ,CACA,yFAGI,YAAa,CACb,SACJ,CACA,oFAGI,cAAe,CACf,YAAa,CACb,WAAY,CACZ,eAAgB,CAChB,iBAAkB,CAClB,kBAAmB,CACnB,SACJ,CACA,0MAQI,4BAA6B,CAF7B,iBAAkB,CAClB,yBAEJ,CACA,8MAQI,2BAA4B,CAF5B,gBAAiB,CACjB,wBAAyB,CAEzB,oBACJ,CACA,oMAOI,yCAA8C,CAD9C,sCAA2C,CAE3C,oBACJ,CACA,oIAGI,WAAY,CACZ,gBAAiB,CACjB,mBAAoB,CACpB,qBACJ,CACA,4CACI,yBACJ,CACA,wFAEI,0BAA2B,CAC3B,qBAAsB,CACtB,cAAe,CACf,oBAAqB,CACrB,iBAAkB,CAClB,oBAAqB,CACrB,SACJ,CACA,6CACI,qBAAsB,CACtB,UACJ,CACA,mDACI,qBACJ,CACA,2CACI,wBAAyB,CACzB,wDAA8D,CAC9D,UACJ,CACA,iDAEI,wDAA8D,CAD9D,UAEJ,CACA,kDACI,wBAAyB,CACzB,4BAA6B,CAG7B,cAAe,CAEf,WAAY,CADZ,gBAAiB,CAKjB,KAMJ,CACA,mGAfI,2BAA4B,CAU5B,WAAY,CATZ,cAAe,CAUf,MAAO,CAJP,iBAAkB,CAElB,UAAW,CAHX,iBAAkB,CAMlB,wBAAyB,CACzB,gBAAiB,CARjB,UA0BJ,CAhBA,iDACI,yBAA0B,CAG1B,cAAe,CAEf,WAAY,CADZ,gBAAiB,CAKjB,QAMJ,CACA,0DACI,qBACJ,CACA,0DACI,qBACJ,CACA,4CACI,aAAc,CACd,oBAAqB,CACrB,iBAAkB,CAClB,oBAAqB,CAErB,wBAAyB,CACzB,gBAAiB,CAFjB,SAGJ,CACA,kDACI,qBACJ,CACA,oDACI,qBACJ,CACA,qDACI,wBACJ,CACA,0DACI,eACJ,CACA,iFAGI,yBAA4B,CAC5B,WACJ,CACA,6NASI,WACJ,CACA,wGAII,iBAAkB,CAClB,iBAAkB,CAClB,eACJ,CACA,4GAII,eACJ,CACA,sBACI,kBACJ,CACA,4DACI,eACJ,CACA,sDACI,eACJ,CACA,wDACI,eACJ,CACA,4CACI,UACJ,CACA,+DACI,YACJ,CACA,6HAGI,oBAAqB,CACrB,UACJ,CACA,6CACI,QAAS,CACT,oBAAqB,CACrB,cAAe,CACf,kBACJ,CACA,+CACI,QACJ,CACA,8FAII,aAAc,CADd,sBAEJ,CACA,8HAEI,WACJ,CACA,oEACI,iBACJ,CACA,qDACI,eACJ,CACA,+DACI,iBAAkB,CAClB,SACJ,CACA,0EACI,2BAA4B,CAC5B,aAAc,CACd,iBAAkB,CAClB,eACJ,CACA,4FAGI,UACJ,CACA,uCACI,aACJ,CACA,kFAKI,iBAAkB,CADlB,UAEJ,CACA,oKAQI,WACJ,CACA,0DAEI,mBAAoB,CADpB,WAEJ,CACA,sEAGI,aAAc,CADd,cAAe,CADf,uBAAwB,CAGxB,SACJ,CACA,oEACI,UAAW,CACX,WAAY,CACZ,WACJ,CACA,sEACI,WACJ,CACA,qFAEI,eACJ,CACA,oEACI,UAAW,CACX,cAAe,CAEf,UAAW,CACX,cAAe,CAFf,aAGJ,CACA,kEACI,iBACJ,CACA,wEACI,aAAc,CACd,iBAAkB,CAClB,SACJ,CACA,0EAQI,UAAW,CACX,cAAe,CALf,WAAY,CAEZ,WAAY,CAHZ,SAAU,CAIV,WAAY,CANZ,iBAAkB,CAClB,SAAU,CAGV,UAKJ,CACA,gFAGI,UACJ,CACA,4EAOI,sBAAuB,CAFvB,aAAc,CAGd,UAAW,CAEX,cAAe,CAPf,WAAY,CAGZ,SAAU,CAFV,gBAAiB,CAHjB,iBAAkB,CAQlB,iBAAkB,CAPlB,WASJ,CACA,mFAEI,iBAAmB,CACnB,UACJ,CACA,gEAEI,SAAU,CADV,WAEJ,CACA,mFAGI,eACJ,CACA,4BACI,WACJ,CACA,sCACI,UAAW,CACX,gBACJ,CACA,0CACI,iBACJ,CACA,kCACI,aACJ,CACA,2FAEI,SACJ,CACA,2CAEI,gBAAiB,CAEjB,eAAgB,CADhB,cAAe,CAFf,WAIJ,CACA,6DACI,UACJ,CACA,kDACI,UAAW,CACX,aACJ,CACA,mEACI,aACJ,CACA,yCACI,SACJ,CACA,0DACI,cACJ,CACA,UACI,oBACJ,CACA,8BACI,cAAe,CACf,eAAgB,CAChB,QACJ,CACA,gCACI,eACJ,CACA,qFAEI,qBAAsB,CACtB,qBAAsB,CAEtB,yBAA0B,CAD1B,YAAa,CAGb,uBAA8B,CAD9B,gBAEJ,CACA,uDACI,iBAAkB,CAElB,WAAY,CAEZ,QAAS,CADT,iBAAkB,CAElB,OAAQ,CAJR,UAKJ,CACA,6BACI,qBAAsB,CACtB,iBACJ,CACA,gEACI,qBAAsB,CAMtB,QAAS,CADT,yBAA0B,CAE1B,aAAc,CACd,aAAc,CALd,gBAAiB,CAQjB,aAAc,CACd,eAAgB,CARhB,gBAAiB,CAKjB,oBAAqB,CACrB,kBAGJ,CACA,uEACI,iBACJ,CACA,oEACI,UAAW,CACX,cAAe,CACf,iBACJ,CACA,kEACI,yBAA0B,CAC1B,yBAA0B,CAC1B,YACJ,CACA,iFAII,gBAAiB,CADjB,gBAEJ,CACA,wFAII,eAAgB,CAChB,QAAS,CAKT,UAAW,CAJX,cAAe,CAGf,cAAe,CADf,eAAgB,CADhB,SAIJ,CACA,wEACI,YACJ,CACA,sBACI,aACJ,CACA,mCACI,UAAY,CACZ,oBACJ,CACA,uBACI,SACJ,CACA,mBACI,WACJ,CACA,mBACI,WACJ,CACA,oCACI,SACJ,CACA,cACI,aACJ,CACA,2BAII,oBAAqB,CAHrB,cAAe,CACf,cAAe,CACf,SAEJ,CACA,qCACI,cAAe,CACf,SACJ,CACA,yBAEI,+BAAgC,CADhC,4BAEJ,CACA,wBAGI,qBAAsB,CACtB,cAAe,CAGf,eAAgB,CADhB,iBAAkB,CADlB,kBAAmB,CAHnB,oBAAqB,CADrB,SAOJ,CACA,kCACI,UAAW,CACX,cACJ,CACA,wCACI,UACJ,CACA,yCACI,UACJ,CACA,mCACI,kBACJ,CACA,sBAEI,6BAA8B,CAD9B,UAEJ,CACA,qBAGI,6BAA8B,CAD9B,8BAA+B,CAD/B,WAGJ,CACA,2BACI,WAAY,CACZ,WACJ,CACA,2BACI,YACJ,CACA,2BACI,iBACJ,CACA,qBACI,qBACJ,CACA,0BACI,qBACJ,CACA,uBACI,qBACJ,CACA,4BACI,qBACJ,CACA,qBACI,oBAAqB,CAErB,kBAAmB,CADnB,gBAEJ,CACA,uEAGI,gBAAiB,CACjB,cACJ,CACA,+BACI,qBACJ,CACA,2BACI,qBACJ,CACA,6BACI,qBACJ,CACA,8BACI,6BAA8B,CAC9B,kBACJ,CAIA,+BACI,iBAAkB,CAClB,WACJ,CASA,2VAOI;;eAEY,CAEZ,yEAA2E,CAD3E,4BAA8B,CAJ9B,oBAMJ,CAGA,sDAEI,4BAA8B,CAD9B,oBAEJ,CAGA,iDACI,mBACJ,CCpkCA,kBACI,0CACJ,CAEA,kBAEI,kBAAmB,CADnB,YAAa,CAEb,6BACJ,CCRA,kBAGI,iBAAkB,CAClB;;KAEC,CACD,gEAAiE,CACjE,uCAAwC,CAPxC,YAAa,CACb,qBAAsB,CAQtB,0CAA2C,CAD3C,4CAA6C,CAE7C,iCACJ,CAEA,kBAGI,kBAAmB,CAFnB,YAAa,CACb,kBAEJ,CAEA,kBACI,aAAc,CACd,uCACJ,CCrBA,kBAGI,qBACJ,CAEA,kBAII,4BAA8B,CAH9B,sBAAwB,CACxB,4BAA8B,CAC9B,wBAEJ,CCbA,kBAMI,aAAc,CALd,mBAAoB,CACpB,cAAe,CACf,eAAiB,CACjB,gDAAiD,CACjD,uCAEJ,CAEA,kBACI,YAAa,CACb,yDACJ,CAEA,kBAMI,aAAc,CAJd,mBAAoB,CACpB,cAAe,CACf,gBAAiB,CACjB,qCAEJ,CAEA,kBACI,sCACJ,CCzBA,kBAGI;;KAEC,CACD,mEAAoE,CACpE,kBAAmB,CANnB,YAAa,CACb,qBAAsB,CAQtB,qBAAsB,CADtB,iBAAkB,CADlB,mBAGJ,CASA,oCAJI,kBAAmB,CAFnB,YAAa,CACb,kBAAmB,CAEnB,sBAQJ,CAEA,kBASI,qEAAsE,CAHtE,oEAAqE,CACrE,iBAAkB,CANlB,YAAa,CACb,qBAAsB,CAMtB,sBAAuB,CAJvB,WAAY,CACZ,wBAAyB,CAFzB,iBAOJ","file":"index.css","sourcesContent":["code {\n font-family: Courier, monospace;\n}\n.pod-title {\n background-color: #eee;\n border: 1px solid #ddd;\n border-bottom: 0;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n}\n.pod-title.closed {\n border-radius: 3px;\n}\n.smiley {\n position: absolute;\n left: 0px;\n top: 4px;\n}\n.perseus-single-editor {\n box-sizing: border-box;\n width: 100%;\n}\n.perseus-json-editor {\n width: 100%;\n font-family: monospace;\n height: 500px;\n}\n.perseus-json-editor.invalid {\n background-color: #ffe6e6;\n}\n.perseus-textarea-pair {\n border: 1px solid #ddd;\n font-size: 12px;\n line-height: 1.6;\n position: relative;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay {\n color: transparent;\n margin-bottom: 12px;\n padding: 10px;\n white-space: pre-wrap;\n word-wrap: break-word;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b {\n font-weight: normal;\n background-color: #dfd;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b.selected {\n background-color: #ddf;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b.error {\n background-color: #fcc;\n}\n.perseus-textarea-pair > textarea {\n background: transparent;\n border: 0;\n box-sizing: border-box;\n font: inherit;\n height: 100%;\n left: 0;\n overflow: hidden;\n padding: 10px;\n position: absolute;\n resize: none;\n top: 0;\n width: 100%;\n}\n.perseus-widget-row {\n margin: 7px 0;\n width: 100%;\n}\n.perseus-widget-row .perseus-widget-left-col,\n.perseus-widget-row .perseus-widget-right-col {\n display: inline-block;\n width: 50%;\n}\n.perseus-widget-row .perseus-widget-left-col .range-input,\n.perseus-widget-row .perseus-widget-right-col .range-input {\n float: right;\n margin-right: 5px;\n}\n.perseus-widget-row > .range-input {\n margin-left: 10px;\n}\n.perseus-answer-options {\n border: 1px solid #ddd;\n padding: 10px;\n}\n.perseus-answer-options * {\n margin-bottom: 4px;\n}\n.perseus-answer-widget {\n border: 1px solid #ddd;\n border-radius: 0 0 3px 3px;\n padding: 10px;\n}\n.perseus-answer-none {\n border-bottom: 1px solid #ddd;\n}\n.perseus-answer-none > div {\n display: none;\n}\n.perseus-widget-editor {\n border: 1px solid #ddd;\n border-radius: 3px;\n margin-top: 10px;\n}\n.perseus-widget-editor .perseus-widget-editor-title {\n background-color: #eee;\n border: 1px solid #ddd;\n border-bottom: 0;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n border: 0;\n display: flex;\n align-items: center;\n position: relative;\n cursor: pointer;\n}\n.perseus-widget-editor .perseus-widget-editor-title.closed {\n border-radius: 3px;\n}\n.perseus-widget-editor .perseus-widget-editor-title :first-child {\n flex-grow: 1;\n}\n.perseus-widget-editor .perseus-widget-editor-title > a {\n color: inherit;\n text-decoration: none;\n}\n.perseus-widget-editor .perseus-widget-editor-title .alignment {\n margin-right: 5px;\n}\n.perseus-widget-editor .perseus-widget-editor-title .simple-button {\n font-size: 13px;\n padding: 0 10px;\n}\n.perseus-widget-editor .perseus-widget-editor-content {\n border-radius: 0 0 3px 3px;\n border-top: 1px solid #ddd;\n padding: 10px;\n transition: all 0s;\n}\n.perseus-widget-editor .perseus-widget-editor-content.leave {\n display: none;\n}\n.perseus-widget-editor .perseus-widget-editor-content .inline-options {\n float: inline-start;\n /* flexbox and inline-block don't work on <legend> elements, so going old-school here */\n line-height: 24px;\n /* for alignment with items in same line (like pills or buttons) */\n padding-inline-end: 0.5em;\n}\n.perseus-widget-editor .perseus-widget-editor-content .tooltip-for-legend {\n display: inline-block;\n line-height: 24px;\n}\n.perseus-widget-editor .categorizer-container {\n overflow-x: scroll;\n}\n.perseus-widget-editor .section-accordion {\n display: flex;\n flex-direction: row;\n}\n.perseus-widget-editor .delete-item-button {\n align-self: center;\n padding-right: 0.5em;\n}\n.perseus-widget-editor-title-id {\n display: inline-flex;\n align-items: center;\n}\n.perseus-widget-editor-title-id > svg {\n float: left;\n font-size: 14px;\n margin-right: 10px;\n}\n.perseus-editor-accordion-container {\n display: inline-grid;\n width: 100%;\n}\n.perseus-editor-accordion-container.collapsed {\n grid-template-rows: 0fr;\n min-height: 0;\n visibility: hidden;\n transition:\n all 0.25s step-end,\n grid-template-rows 0.25s;\n}\n.perseus-editor-accordion-container.expanded {\n grid-template-rows: 1fr;\n min-height: 100%;\n visibility: visible;\n transition: grid-template-rows 0.5s;\n}\n.perseus-editor-accordion-container .perseus-editor-accordion-content {\n overflow: hidden;\n margin: 0 -1px;\n /* allows focus ring on accordion to show */\n padding: 0 1px;\n}\n.perseus-editor-widgets-selectors {\n background-color: #eee;\n border: 1px solid #ddd;\n border-top: 0;\n border-radius: 0 0 3px 3px;\n display: flex;\n flex-wrap: wrap;\n padding: 10px / 2;\n}\n.perseus-editor-widgets-selectors select {\n margin: 2px;\n}\n.perseus-editor-widgets > div.selected > strong {\n background-color: #ddf;\n}\n.perseus-editor-widgets .warning {\n background-color: #ffcccc;\n padding: 4px;\n margin: 4px;\n}\n.perseus-editor-word-count {\n cursor: help;\n flex: 1;\n float: right;\n margin-right: 3px;\n margin-top: 2px;\n text-align: right;\n}\n.MathJax .math {\n color: inherit;\n}\n#perseus {\n margin: 20px;\n width: calc(100% - 500px);\n z-index: 10;\n}\n#perseus #problemarea #workarea {\n margin: 0;\n}\n#perseus #problemarea #workarea .perseus-image-caption {\n top: 0px !important;\n}\n#perseus .perseus-question-container > div,\n#perseus .perseus-answer-container > div {\n padding-bottom: 25px;\n}\n#perseus .add-choice-container,\n#perseus .add-hint-container {\n display: flex;\n flex-direction: row;\n margin-bottom: 20px;\n text-align: left;\n}\n#problemarea {\n font-size: 14px;\n position: relative;\n float: left;\n padding-bottom: 38px;\n}\n#problemarea a:link,\n#problemarea input,\n#problemarea label,\n#problemarea select {\n /* for dropdowns */\n position: relative;\n z-index: 3;\n /* interactive-content */\n}\n.perseus-editor-table {\n clear: both;\n display: table;\n table-layout: fixed;\n}\n.perseus-editor-row {\n display: table-row;\n}\n.perseus-editor-left-cell {\n display: table-cell;\n padding-right: 30px;\n vertical-align: top;\n width: 360px;\n max-width: 360px;\n min-width: 360px;\n position: relative;\n z-index: 10;\n}\n.perseus-editor-right-cell {\n box-sizing: border-box;\n display: table-cell;\n padding: 30px;\n padding-top: 5px;\n vertical-align: top;\n}\n.perseus-hint-editor {\n padding-bottom: 20px;\n}\n.perseus-hint-editor .perseus-single-editor {\n margin-bottom: 5px;\n}\n.perseus-hint-editor .reorder-hints button {\n font-size: 16px;\n}\n.perseus-hint-editor .reorder-hints button:hover,\n.perseus-hint-editor .reorder-hints button:active {\n color: #000;\n text-decoration: none;\n}\n.perseus-hint-editor .reorder-hints button.hidden {\n visibility: hidden;\n}\n.perseus-hint-editor .remove-hint {\n float: right;\n font-size: 13px;\n padding: 0 10px;\n}\n.perseus-hints-editor .add-hint {\n font-size: 13px;\n}\n.perseus-hints-editor\n .perseus-editor-row:first-child\n .perseus-editor-right-cell {\n border-top: 0;\n}\n.perseus-hint-editor + div .perseus-hint-renderer {\n width: 100%;\n}\n.perseus-hint-editor + div .perseus-hint-renderer div.paragraph {\n margin: 0px 0px 22px 0px;\n}\n.perseus-article-editor {\n margin-bottom: 20px;\n margin-top: 20px;\n}\n.perseus-article-editor .perseus-editor-table {\n margin-left: auto;\n margin-right: auto;\n}\n.perseus-article-editor .perseus-single-editor {\n margin-bottom: 10px;\n}\n.perseus-article-editor .section-control-button,\n.perseus-article-editor .step-control-button {\n font-size: 13px;\n padding: 2px 10px;\n margin: 0 2px;\n}\n.perseus-article-editor .perseus-editor-left-cell {\n min-width: 360px;\n}\n.perseus-article-editor .mobile-preview,\n.perseus-article-editor .desktop-preview,\n.perseus-article-editor .editor-preview,\n.perseus-article-editor .standalone-preview {\n box-sizing: border-box;\n}\n.perseus-article-editor .mobile-preview {\n border: 1px solid rgba(0, 0, 0, 0.29);\n max-width: 322px;\n box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.29);\n padding: 32px 16px;\n}\n.perseus-article-editor .desktop-preview {\n border: 1px solid transparent;\n padding: 32px 20px;\n}\n.perseus-article-editor .editor-preview {\n display: table-cell;\n}\n.perseus-article-editor .editor-preview.full-width {\n width: 100%;\n}\n.perseus-article-editor .editor-preview .desktop-preview {\n border: 1px solid rgba(0, 0, 0, 0.29);\n box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.29);\n width: 100%;\n}\n.perseus-article-editor .standalone-preview .mobile-preview,\n.perseus-article-editor .standalone-preview .desktop-preview {\n margin-left: auto;\n margin-right: auto;\n}\n.perseus-article-editor .json-editor {\n margin: auto;\n max-width: 688px;\n}\n.perseus-article-editor .perseus-json-editor {\n display: block;\n margin-left: auto;\n margin-right: auto;\n}\n.perseus-article-editor .json-editor-warning {\n margin-bottom: 10px;\n text-align: center;\n}\n.perseus-article-editor .framework-perseus.perseus-article {\n box-sizing: border-box;\n}\n.perseus-article-editor .framework-perseus.perseus-article * {\n box-sizing: inherit;\n}\n.perseus-article-editor .perseus-editor-left-cell > .pod-title {\n padding: 4px 9px;\n}\n.perseus-widget-dropdown input[type=\"text\"] {\n border: 1px solid #ccc;\n border-radius: 5px;\n padding: 5px;\n}\n\n.perseus-widget-dropdown .dropdown-choices {\n margin: 20px 0;\n}\n.perseus-widget-dropdown .dropdown-choices .dropdown-choice {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 10px;\n margin-bottom: 10px;\n}\n\n.perseus-widget-dropdown .dropdown-info {\n display: inline-flex;\n margin-bottom: 16px;\n}\n.perseus-widget-dropdown .dropdown-field {\n display: flex;\n flex-direction: row;\n align-items: center;\n min-width: 0;\n margin-bottom: 16px;\n}\n.perseus-widget-dropdown .remove-choice {\n margin-bottom: 10px;\n}\n.perseus-input-number-editor {\n font-family: Lato, \"Noto Sans\", sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n}\n.perseus-input-number-editor .answer-option .unsimplified-options {\n min-height: 48px;\n}\n.perseus-input-number-editor .perseus-textarea-pair {\n font-size: 16px;\n}\n.perseus-input-number-editor .perseus-textarea-pair .perseus-textarea-underlay {\n margin-bottom: 26px;\n}\n.perseus-input-number-editor .perseus-textarea-pair textarea {\n background-color: #ffffff;\n border: 1px solid rgba(33, 36, 44, 0.5);\n border-radius: 4px;\n}\n.perseus-input-number-editor .input-answer-editor-value,\n.perseus-input-number-editor .input-answer-editor-message {\n display: inline-block;\n}\n.perseus-input-number-editor .input-answer-editor-value-container {\n display: block;\n}\n.perseus-input-number-editor .input-answer-editor-value-container input {\n background: #ffffff;\n border: 1px solid rgba(33, 36, 44, 0.5);\n border-radius: 4px;\n color: #21242c;\n font-family: Lato, \"Noto Sans\", sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n outline-offset: -2px;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .numeric-input-value {\n margin-left: 8px;\n width: 6em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .max-error-input-value {\n display: none;\n width: 3em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .max-error-plusmn {\n cursor: default;\n display: none;\n height: 32px;\n padding-top: 4px;\n text-align: center;\n vertical-align: top;\n width: 1em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .numeric-input-value,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .numeric-input-value {\n border-right: none;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .max-error-input-value,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .max-error-input-value {\n border-left: none;\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n display: inline-block;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .max-error-plusmn,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .max-error-plusmn {\n border-top: 1px solid rgba(33, 36, 44, 0.5);\n border-bottom: 1px solid rgba(33, 36, 44, 0.5);\n display: inline-block;\n}\n.perseus-input-number-editor .options-toggle,\n.perseus-input-number-editor .answer-trash,\n.perseus-input-number-editor .answer-status {\n height: 26px;\n line-height: 26px;\n outline-offset: -3px;\n vertical-align: middle;\n}\n.perseus-input-number-editor .value-divider {\n border-top: 1px solid #ccc;\n}\n.perseus-input-number-editor .options-toggle,\n.perseus-input-number-editor .answer-trash {\n border-left: 1px solid #ccc;\n box-sizing: border-box;\n cursor: pointer;\n display: inline-block;\n text-align: center;\n text-decoration: none;\n width: 20%;\n}\n.perseus-input-number-editor .options-toggle {\n background-color: #eee;\n color: #444;\n}\n.perseus-input-number-editor .options-toggle:hover {\n background-color: #ccc;\n}\n.perseus-input-number-editor .answer-trash {\n background-color: #c04f03;\n background-image: linear-gradient(to bottom, #e35d04, #c04f03);\n color: #fff;\n}\n.perseus-input-number-editor .answer-trash:hover {\n color: #fff;\n background-image: linear-gradient(to bottom, #f46e15, #d16014);\n}\n.perseus-input-number-editor .is-strict-indicator {\n background-color: #d9edf7;\n border-bottom: 1px solid #ccc;\n border-right: 1px solid #ccc;\n cursor: default;\n font-size: 16px;\n line-height: 12px;\n height: 12px;\n width: 12px;\n text-align: center;\n position: absolute;\n top: 0;\n right: auto;\n bottom: auto;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .simplify-indicator {\n border-top: 1px solid #ccc;\n border-right: 1px solid #ccc;\n cursor: default;\n font-size: 10px;\n line-height: 13px;\n height: 13px;\n width: 12px;\n text-align: center;\n position: absolute;\n top: 12px;\n right: auto;\n bottom: auto;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .simplify-indicator.optional {\n background-color: #aaffaa;\n}\n.perseus-input-number-editor .simplify-indicator.enforced {\n background-color: #ffcccc;\n}\n.perseus-input-number-editor .answer-status {\n color: inherit;\n display: inline-block;\n text-align: center;\n text-decoration: none;\n width: 60%;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .answer-status.wrong {\n background-color: #ffcccc;\n}\n.perseus-input-number-editor .answer-status.correct {\n background-color: #aaffaa;\n}\n.perseus-input-number-editor .answer-status.ungraded {\n background-color: #d9edf7;\n}\n.perseus-input-number-editor .input-answer-editor-message {\n margin-left: 5px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor {\n font-family: \"Lucida Grande\";\n width: 230px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-pair\n > textarea,\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-underlay {\n padding: 5px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-pair {\n border-color: #ccc;\n border-radius: 3px;\n min-height: 53px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-underlay {\n margin-bottom: 0;\n}\n.perseus-widget-radio {\n margin-bottom: 10px;\n}\n.perseus-widget-radio .choice-editor .perseus-single-editor {\n margin-bottom: 0;\n}\n.perseus-widget-radio .choice-editor.correct textarea {\n background: #aaffaa;\n}\n.perseus-widget-radio .choice-editor.incorrect textarea {\n background: #ffcccc;\n}\n.perseus-widget-radio textarea::placeholder {\n color: #777;\n}\n.perseus-widget-radio .rationale-editor .perseus-textarea-pair {\n border-top: 0;\n}\n.perseus-widget-radio .choice-rationale-editors,\n.perseus-widget-radio .choice-editor,\n.perseus-widget-radio .rationale-editor {\n display: inline-block;\n width: 100%;\n}\n.perseus-widget-radio .perseus-single-editor {\n border: 0;\n display: inline-block;\n margin: 0 0 5px;\n vertical-align: top;\n}\n.perseus-widget-radio .perseus-single-editor p {\n margin: 0;\n}\n.perseus-widget-radio .perseus-textarea-pair,\n.perseus-widget-radio .perseus-textarea-underlay {\n /* Wrap when text area has a long image link that overflows. */\n overflow-wrap: anywhere;\n display: block;\n}\n.perseus-widget-radio .perseus-textarea-pair > textarea,\n.perseus-widget-radio .perseus-textarea-pair > .perseus-textarea-underlay {\n padding: 5px;\n}\n.perseus-widget-editor-content .add-choice-container .simple-button {\n margin-right: 10px;\n}\n.perseus-widget-editor-content .perseus-widget-radio {\n position: static;\n}\n.perseus-widget-editor-content .perseus-widget-radio .checkbox {\n position: relative;\n top: -10px;\n}\n.perseus-widget-editor-content .perseus-radio-option.none-of-above:before {\n content: \"None of the above\";\n display: block;\n font-style: italic;\n font-weight: bold;\n}\n.perseus-widget-editor-content\n .perseus-radio-option.none-of-above\n .choice-editor.incorrect {\n opacity: 0.5;\n}\n#solutionarea .perseus-widget-radio li {\n padding: 7px 0;\n}\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-single-editor {\n width: 80px;\n margin-bottom: 6px;\n}\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-textarea-pair,\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-single-editor {\n height: 50px;\n}\n.categorization-container.categorization-container-editor {\n width: 350px;\n margin-bottom: 160px;\n}\n.categorization-container.categorization-container-editor .card input {\n margin: 7px 3px 7px 13px;\n font-size: 12px;\n display: block;\n width: 81%;\n}\n.categorization-container.categorization-container-editor .category {\n float: left;\n padding: 5px;\n width: 160px;\n}\n.categorization-container.categorization-container-editor .categories {\n width: 176px;\n}\n.categorization-container.categorization-container-editor\n .perseus-textarea-underlay {\n margin-bottom: 0;\n}\n.categorization-container.categorization-container-editor .drag-bar {\n float: left;\n font-size: 10px;\n padding: 2px 0;\n height: 70%;\n margin-top: 3px;\n}\n.categorization-container.categorization-container-editor .header {\n margin-bottom: 8px;\n}\n.categorization-container.categorization-container-editor .header input {\n display: block;\n margin-right: 24px;\n width: 76%;\n}\n.categorization-container.categorization-container-editor .header .remove {\n position: relative;\n top: -14px;\n left: 12px;\n float: right;\n width: 20px;\n height: 20px;\n padding: 2px;\n color: #666;\n cursor: pointer;\n}\n.categorization-container.categorization-container-editor\n .header\n .remove:hover {\n color: #333;\n}\n.categorization-container.categorization-container-editor .delete-item-area {\n position: absolute;\n width: 150px;\n height: 60px;\n padding-top: 40px;\n bottom: -150px;\n left: 10px;\n border: dashed 2px #888;\n color: #888;\n text-align: center;\n font-size: 20px;\n}\n.categorization-container.categorization-container-editor\n .delete-item-area.target {\n border-color: black;\n color: #333;\n}\n.categorization-container.categorization-container-editor .card {\n width: 130px;\n padding: 0;\n}\n.categorization-container.categorization-container-editor\n .card.dragging\n .drag-bar {\n margin-left: 2px;\n}\n.categorization-editor-area {\n height: 30px;\n}\n.categorization-editor-area .add-item {\n float: left;\n margin-left: 17px;\n}\n.categorization-editor-area .add-category {\n margin-left: 173px;\n}\n.perseus-widget-interactive-graph {\n display: block;\n}\n.perseus-widget-plotter-editor .plotter-categories,\n.perseus-widget-plotter-editor .pic-url {\n width: 70%;\n}\n.perseus-text-list-editor input[type=\"text\"] {\n padding: 3px;\n margin-right: 5px;\n min-width: 20px;\n max-width: 340px;\n}\n.perseus-text-list-editor.layout-horizontal input[type=\"text\"] {\n float: left;\n}\n.perseus-matcher-editor .perseus-text-list-editor {\n float: left;\n max-width: 50%;\n}\n.perseus-matcher-editor .perseus-text-list-editor input[type=\"text\"] {\n max-width: 90%;\n}\n.perseus-matcher-editor input[type=\"text\"] {\n width: 46%;\n}\n.perseus-matcher-editor input[type=\"text\"] + input[type=\"text\"] {\n margin-left: 2%;\n}\n.info-tip {\n display: inline-block;\n}\n.info-tip-content-container p {\n font-size: 12px;\n line-height: 1.4;\n margin: 0;\n}\n.info-tip-content-container p + p {\n margin-top: 22px;\n}\n.perseus-widget-interaction-editor\n .perseus-widget-interaction-editor-select-element {\n background-color: #eee;\n border: 1px solid #ddd;\n border-top: 0;\n border-radius: 0 0 3px 3px;\n padding: 5px 10px;\n margin: 20px -11px -11px -11px;\n}\n.perseus-widget-interaction-editor .colorpicker-circle {\n border-radius: 50%;\n width: 14px;\n height: 14px;\n position: absolute;\n left: 5px;\n top: 5px;\n}\n.perseus-interaction-element {\n border: 1px solid #ddd;\n border-radius: 3px;\n}\n.perseus-interaction-element .perseus-interaction-element-title {\n background-color: #eee;\n border: 1px solid #ddd;\n border-bottom: 0;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n border: 0;\n color: inherit;\n display: block;\n text-decoration: none;\n white-space: nowrap;\n font-size: 1em;\n overflow: hidden;\n}\n.perseus-interaction-element .perseus-interaction-element-title.closed {\n border-radius: 3px;\n}\n.perseus-interaction-element .perseus-interaction-element-title > svg {\n float: left;\n font-size: 14px;\n margin-right: 10px;\n}\n.perseus-interaction-element .perseus-interaction-element-content {\n border-radius: 0 0 3px 3px;\n border-top: 1px solid #ddd;\n padding: 10px;\n}\n.perseus-interaction-element\n .perseus-interaction-element-content\n .edit-controls {\n text-align: right;\n margin-top: -30px;\n}\n.perseus-interaction-element\n .perseus-interaction-element-content\n .edit-controls\n > button {\n background: #fff;\n border: 0;\n cursor: pointer;\n padding: 0;\n margin-left: 7px;\n font-size: 18px;\n color: #555;\n}\n.perseus-interaction-element .perseus-interaction-element-content.leave {\n display: none;\n}\n.button-set-separator {\n margin: 10px 0;\n}\n.perseus-widget-editor .unit-radio {\n color: black;\n text-decoration: none;\n}\n.unit-example-not-okay {\n color: red;\n}\n.unit-example-okay {\n color: green;\n}\n.pair-editor input {\n width: 120px;\n}\n.marvel-device.iphone6.silver:after {\n z-index: 1;\n}\n.perseus-diff {\n margin: 0 10px;\n}\n.perseus-diff .diff-header {\n font-size: 18px;\n padding: 10px 0;\n width: 50%;\n display: inline-block;\n}\n.perseus-diff .diff-header.collapsed {\n font-size: 14px;\n padding: 0px;\n}\n.perseus-diff .diff-body {\n border-top: 1px solid #e4e4e4;\n border-bottom: 1px solid #e4e4e4;\n}\n.perseus-diff .diff-row {\n width: 50%;\n white-space: pre-wrap;\n box-sizing: border-box;\n font-size: 14px;\n padding-right: 20px;\n padding-left: 10px;\n overflow: hidden;\n}\n.perseus-diff .diff-row.collapsed {\n color: #888;\n cursor: pointer;\n}\n.perseus-diff .diff-row.collapsed:hover {\n color: #666;\n}\n.perseus-diff .diff-row.collapsed:active {\n color: #444;\n}\n.perseus-diff .diff-row .diff-line {\n margin-bottom: 20px;\n}\n.perseus-diff .before {\n float: left;\n border-left: 1px solid #e4e4e4;\n}\n.perseus-diff .after {\n float: right;\n border-right: 1px solid #e4e4e4;\n border-left: 1px solid #e4e4e4;\n}\n.perseus-diff .inner-value {\n height: 100%;\n padding: 3px;\n}\n.perseus-diff .not-present {\n display: none;\n}\n.perseus-diff .blank-space {\n visibility: hidden;\n}\n.perseus-diff .added {\n background-color: #eeffee;\n}\n.perseus-diff .added.dark {\n background-color: #aaffaa;\n}\n.perseus-diff .removed {\n background-color: #ffeeee;\n}\n.perseus-diff .removed.dark {\n background-color: #ffaaaa;\n}\n.perseus-diff .image {\n display: inline-block;\n margin-left: 20px;\n margin-bottom: 10px;\n}\n.perseus-diff .image,\n.perseus-diff .image > div,\n.perseus-diff .image > img {\n max-height: 300px;\n max-width: 100%;\n}\n.perseus-diff .image-unchanged {\n border: 1px solid #aaaaaa;\n}\n.perseus-diff .image-added {\n border: 2px solid #aaffaa;\n}\n.perseus-diff .image-removed {\n border: 2px solid #ffaaaa;\n}\n.perseus-diff .diff-separator {\n border-bottom: 1px dashed #444;\n margin: 30px 0 10px 0;\n}\n/* Reset fieldset min-width as our editors include a fieldset element\nnested within a table cell, which results in native browser styling that\nbreaks the layout depending on the widget editors used.*/\n.perseus-editor-table fieldset {\n min-inline-size: 0;\n min-width: 0;\n}\n/**\n * Disabled Editing Mode Styles\n *\n * Applied when editingDisabled=true to prevent content creators from making\n * changes while still allowing them to view the editor interface.\n *\n * Targets all form controls and interactive elements within disabled editors.\n */\n.perseus-single-editor.perseus-editor-disabled input,\n.perseus-single-editor.perseus-editor-disabled textarea,\n.perseus-single-editor.perseus-editor-disabled select,\n.perseus-single-editor.perseus-editor-disabled checkbox,\n.perseus-single-editor.perseus-editor-disabled .perseus-math-input,\n.perseus-single-editor.perseus-editor-disabled .keypad-input {\n opacity: 0.6 !important;\n background-color: var(\n --wb-semanticColor-core-background-neutral-subtle\n ) !important;\n cursor: not-allowed !important;\n border-color: var(--wb-semanticColor-core-border-neutral-subtle) !important;\n}\n\n/* We want to keep the button colors as it often helps denote correctness. */\n.perseus-single-editor.perseus-editor-disabled button {\n opacity: 0.6 !important;\n cursor: not-allowed !important;\n}\n\n/* Plotter is a special case due to the archaic graphie implementation. */\n.perseus-editor-disabled .perseus-widget-plotter {\n pointer-events: none;\n}\n",".decorativeToggleContainer {\n margin-block-end: var(--wb-sizing-size_080);\n}\n\n.flexRow {\n display: flex;\n align-items: center;\n gap: var(--wb-sizing-size_040);\n}\n",".dimensions-container {\n display: flex;\n flex-direction: column;\n align-items: start;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n );\n border: 1px solid var(--wb-semanticColor-core-border-base-subtle);\n border-radius: var(--wb-sizing-size_080);\n margin-block-start: var(--wb-sizing-size_080);\n margin-block-end: var(--wb-sizing-size_120);\n padding: var(--wb-sizing-size_080);\n}\n\n.dimensions-field-container {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n\n.x-span {\n display: block;\n margin-inline: var(--wb-sizing-size_080);\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.single-select-short {\n /* Non-standard spacing, but it's the smallest we can go\n without running into styling issues with the dropdown. */\n height: 26px !important;\n}\n\n.row {\n display: flex !important;\n flex-direction: row !important;\n margin-top: 8px !important;\n align-items: center !important;\n}\n",".title {\n font-family: inherit;\n font-size: 15px;\n font-weight: bold;\n line-height: var(--wb-font-body-lineHeight-large);\n margin-bottom: var(--wb-sizing-size_060);\n color: #626569; /* gray17 */\n}\n\n.option {\n display: flex;\n padding: var(--wb-sizing-size_060) var(--wb-sizing-size_0);\n}\n\n.label {\n /* TODO: could we use WB typography? */\n font-family: inherit;\n font-size: 15px;\n line-height: 1.25;\n margin-left: var(--wb-sizing-size_160);\n color: #626569; /* gray17 */\n}\n\n.selectLabel {\n margin-right: var(--wb-sizing-size_080);\n}\n",".tile {\n display: flex;\n flex-direction: column;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n );\n border: 1px solid var(--wb-semanticColor-core-border-neutral-subtle);\n border-radius: 12px;\n padding-inline: 12px;\n padding-block: 4px;\n margin-block-end: 12px;\n}\n\n.radio-option-actions-container {\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-block-start: 8px;\n}\n\n.button-row {\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-block-start: 8px;\n}\n\n.image-editor-container {\n display: flex;\n flex-direction: column;\n position: relative;\n padding: 8px;\n padding-block-start: 24px;\n border: 1px solid var(--wb-semanticColor-core-border-neutral-default);\n border-radius: 8px;\n margin-block-start: 8px;\n background-color: var(--wb-semanticColor-core-background-base-default);\n}\n"]}
1
+ {"version":3,"sources":["perseus-editor.css","decorative-toggle.module.css","image-editor.module.css","interactive-graph-editor.module.css","label-image-editor.module.css","radio-editor.module.css"],"names":[],"mappings":"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","file":"index.css","sourcesContent":["code {\n font-family: Courier, monospace;\n}\n.pod-title {\n background-color: #eee;\n border: 1px solid #ddd;\n border-bottom: 0;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n}\n.pod-title.closed {\n border-radius: 3px;\n}\n.smiley {\n position: absolute;\n left: 0px;\n top: 4px;\n}\n.perseus-single-editor {\n box-sizing: border-box;\n width: 100%;\n}\n.perseus-json-editor {\n width: 100%;\n font-family: monospace;\n height: 500px;\n}\n.perseus-json-editor.invalid {\n background-color: #ffe6e6;\n}\n.perseus-textarea-pair {\n border: 1px solid #ddd;\n font-size: 12px;\n line-height: 1.6;\n position: relative;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay {\n color: transparent;\n margin-bottom: 12px;\n padding: 10px;\n white-space: pre-wrap;\n word-wrap: break-word;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b {\n font-weight: normal;\n background-color: #dfd;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b.selected {\n background-color: #ddf;\n}\n.perseus-textarea-pair > .perseus-textarea-underlay b.error {\n background-color: #fcc;\n}\n.perseus-textarea-pair > textarea {\n background: transparent;\n border: 0;\n box-sizing: border-box;\n font: inherit;\n height: 100%;\n left: 0;\n overflow: hidden;\n padding: 10px;\n position: absolute;\n resize: none;\n top: 0;\n width: 100%;\n}\n.perseus-widget-row {\n margin: 7px 0;\n width: 100%;\n}\n.perseus-widget-row .perseus-widget-left-col,\n.perseus-widget-row .perseus-widget-right-col {\n display: inline-block;\n width: 50%;\n}\n.perseus-widget-row .perseus-widget-left-col .range-input,\n.perseus-widget-row .perseus-widget-right-col .range-input {\n float: right;\n margin-right: 5px;\n}\n.perseus-widget-row > .range-input {\n margin-left: 10px;\n}\n.perseus-answer-options {\n border: 1px solid #ddd;\n padding: 10px;\n}\n.perseus-answer-options * {\n margin-bottom: 4px;\n}\n.perseus-answer-widget {\n border: 1px solid #ddd;\n border-radius: 0 0 3px 3px;\n padding: 10px;\n}\n.perseus-answer-none {\n border-bottom: 1px solid #ddd;\n}\n.perseus-answer-none > div {\n display: none;\n}\n.perseus-widget-editor {\n border: 1px solid #ddd;\n border-radius: 3px;\n margin-top: 10px;\n}\n.perseus-widget-editor .perseus-widget-editor-title {\n background-color: #eee;\n border: 1px solid #ddd;\n border-bottom: 0;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n border: 0;\n display: flex;\n align-items: center;\n position: relative;\n cursor: pointer;\n}\n.perseus-widget-editor .perseus-widget-editor-title.closed {\n border-radius: 3px;\n}\n.perseus-widget-editor .perseus-widget-editor-title :first-child {\n flex-grow: 1;\n}\n.perseus-widget-editor .perseus-widget-editor-title > a {\n color: inherit;\n text-decoration: none;\n}\n.perseus-widget-editor .perseus-widget-editor-title .alignment {\n margin-right: 5px;\n}\n.perseus-widget-editor .perseus-widget-editor-title .simple-button {\n font-size: 13px;\n padding: 0 10px;\n}\n.perseus-widget-editor .perseus-widget-editor-content {\n border-radius: 0 0 3px 3px;\n border-top: 1px solid #ddd;\n padding: 10px;\n transition: all 0s;\n}\n.perseus-widget-editor .perseus-widget-editor-content.leave {\n display: none;\n}\n.perseus-widget-editor .perseus-widget-editor-content .inline-options {\n float: inline-start;\n /* flexbox and inline-block don't work on <legend> elements, so going old-school here */\n line-height: 24px;\n /* for alignment with items in same line (like pills or buttons) */\n padding-inline-end: 0.5em;\n}\n.perseus-widget-editor .perseus-widget-editor-content .tooltip-for-legend {\n display: inline-block;\n line-height: 24px;\n}\n.perseus-widget-editor .categorizer-container {\n overflow-x: scroll;\n}\n.perseus-widget-editor .section-accordion {\n display: flex;\n flex-direction: row;\n}\n.perseus-widget-editor .delete-item-button {\n align-self: center;\n padding-right: 0.5em;\n}\n.perseus-widget-editor-title-id {\n display: inline-flex;\n align-items: center;\n}\n.perseus-widget-editor-title-id > svg {\n float: left;\n font-size: 14px;\n margin-right: 10px;\n}\n.perseus-editor-accordion-container {\n display: inline-grid;\n width: 100%;\n}\n.perseus-editor-accordion-container.collapsed {\n grid-template-rows: 0fr;\n min-height: 0;\n visibility: hidden;\n transition:\n all 0.25s step-end,\n grid-template-rows 0.25s;\n}\n.perseus-editor-accordion-container.expanded {\n grid-template-rows: 1fr;\n min-height: 100%;\n visibility: visible;\n transition: grid-template-rows 0.5s;\n}\n.perseus-editor-accordion-container .perseus-editor-accordion-content {\n overflow: hidden;\n margin: 0 -1px;\n /* allows focus ring on accordion to show */\n padding: 0 1px;\n}\n.perseus-editor-widgets-selectors {\n background-color: #eee;\n border: 1px solid #ddd;\n border-top: 0;\n border-radius: 0 0 3px 3px;\n display: flex;\n flex-wrap: wrap;\n padding: 10px / 2;\n}\n.perseus-editor-widgets-selectors select {\n margin: 2px;\n}\n.perseus-editor-widgets > div.selected > strong {\n background-color: #ddf;\n}\n.perseus-editor-widgets .warning {\n background-color: #ffcccc;\n padding: 4px;\n margin: 4px;\n}\n.perseus-editor-word-count {\n cursor: help;\n flex: 1;\n float: right;\n margin-right: 3px;\n margin-top: 2px;\n text-align: right;\n}\n.MathJax .math {\n color: inherit;\n}\n#perseus {\n margin: 20px;\n width: calc(100% - 500px);\n z-index: 10;\n}\n#perseus #problemarea #workarea {\n margin: 0;\n}\n#perseus #problemarea #workarea .perseus-image-caption {\n top: 0px !important;\n}\n#perseus .perseus-question-container > div,\n#perseus .perseus-answer-container > div {\n padding-bottom: 25px;\n}\n#perseus .add-choice-container,\n#perseus .add-hint-container {\n display: flex;\n flex-direction: row;\n margin-bottom: 20px;\n text-align: left;\n}\n#problemarea {\n font-size: 14px;\n position: relative;\n float: left;\n padding-bottom: 38px;\n}\n#problemarea a:link,\n#problemarea input,\n#problemarea label,\n#problemarea select {\n /* for dropdowns */\n position: relative;\n z-index: 3;\n /* interactive-content */\n}\n.perseus-editor-table {\n clear: both;\n display: table;\n table-layout: fixed;\n}\n.perseus-editor-row {\n display: table-row;\n}\n.perseus-editor-left-cell {\n display: table-cell;\n padding-right: 30px;\n vertical-align: top;\n width: 360px;\n max-width: 360px;\n min-width: 360px;\n position: relative;\n z-index: 10;\n}\n.perseus-editor-right-cell {\n box-sizing: border-box;\n display: table-cell;\n padding: 30px;\n padding-top: 5px;\n vertical-align: top;\n}\n.perseus-hint-editor {\n padding-bottom: 20px;\n}\n.perseus-hint-editor .perseus-single-editor {\n margin-bottom: 5px;\n}\n.perseus-hint-editor .reorder-hints button {\n font-size: 16px;\n}\n.perseus-hint-editor .reorder-hints button:hover,\n.perseus-hint-editor .reorder-hints button:active {\n color: #000;\n text-decoration: none;\n}\n.perseus-hint-editor .reorder-hints button.hidden {\n visibility: hidden;\n}\n.perseus-hint-editor .remove-hint {\n float: right;\n font-size: 13px;\n padding: 0 10px;\n}\n.perseus-hints-editor .add-hint {\n font-size: 13px;\n}\n.perseus-hints-editor\n .perseus-editor-row:first-child\n .perseus-editor-right-cell {\n border-top: 0;\n}\n.perseus-hint-editor + div .perseus-hint-renderer {\n width: 100%;\n}\n.perseus-hint-editor + div .perseus-hint-renderer div.paragraph {\n margin: 0px 0px 22px 0px;\n}\n.perseus-article-editor {\n margin-bottom: 20px;\n margin-top: 20px;\n}\n.perseus-article-editor .perseus-editor-table {\n margin-left: auto;\n margin-right: auto;\n}\n.perseus-article-editor .perseus-single-editor {\n margin-bottom: 10px;\n}\n.perseus-article-editor .section-control-button,\n.perseus-article-editor .step-control-button {\n font-size: 13px;\n padding: 2px 10px;\n margin: 0 2px;\n}\n.perseus-article-editor .perseus-editor-left-cell {\n min-width: 360px;\n}\n.perseus-article-editor .mobile-preview,\n.perseus-article-editor .desktop-preview,\n.perseus-article-editor .editor-preview,\n.perseus-article-editor .standalone-preview {\n box-sizing: border-box;\n}\n.perseus-article-editor .mobile-preview {\n border: 1px solid rgba(0, 0, 0, 0.29);\n max-width: 322px;\n box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.29);\n padding: 32px 16px;\n}\n.perseus-article-editor .desktop-preview {\n border: 1px solid transparent;\n padding: 32px 20px;\n}\n.perseus-article-editor .editor-preview {\n display: table-cell;\n}\n.perseus-article-editor .editor-preview.full-width {\n width: 100%;\n}\n.perseus-article-editor .editor-preview .desktop-preview {\n border: 1px solid rgba(0, 0, 0, 0.29);\n box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.29);\n width: 100%;\n}\n.perseus-article-editor .standalone-preview .mobile-preview,\n.perseus-article-editor .standalone-preview .desktop-preview {\n margin-left: auto;\n margin-right: auto;\n}\n.perseus-article-editor .json-editor {\n margin: auto;\n max-width: 688px;\n}\n.perseus-article-editor .perseus-json-editor {\n display: block;\n margin-left: auto;\n margin-right: auto;\n}\n.perseus-article-editor .json-editor-warning {\n margin-bottom: 10px;\n text-align: center;\n}\n.perseus-article-editor .framework-perseus.perseus-article {\n box-sizing: border-box;\n}\n.perseus-article-editor .framework-perseus.perseus-article * {\n box-sizing: inherit;\n}\n.perseus-article-editor .perseus-editor-left-cell > .pod-title {\n padding: 4px 9px;\n}\n.perseus-widget-dropdown input[type=\"text\"] {\n border: 1px solid #ccc;\n border-radius: 5px;\n padding: 5px;\n}\n\n.perseus-widget-dropdown .dropdown-choices {\n margin: 20px 0;\n}\n.perseus-widget-dropdown .dropdown-choices .dropdown-choice {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 10px;\n margin-bottom: 10px;\n}\n\n.perseus-widget-dropdown .dropdown-info {\n display: inline-flex;\n margin-bottom: 16px;\n}\n.perseus-widget-dropdown .dropdown-field {\n display: flex;\n flex-direction: row;\n align-items: center;\n min-width: 0;\n margin-bottom: 16px;\n}\n.perseus-widget-dropdown .remove-choice {\n margin-bottom: 10px;\n}\n.perseus-input-number-editor {\n font-family: Lato, \"Noto Sans\", sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n}\n.perseus-input-number-editor .answer-option .unsimplified-options {\n min-height: 48px;\n}\n.perseus-input-number-editor .perseus-textarea-pair {\n font-size: 16px;\n}\n.perseus-input-number-editor .perseus-textarea-pair .perseus-textarea-underlay {\n margin-bottom: 26px;\n}\n.perseus-input-number-editor .perseus-textarea-pair textarea {\n background-color: #ffffff;\n border: 1px solid rgba(33, 36, 44, 0.5);\n border-radius: 4px;\n}\n.perseus-input-number-editor .input-answer-editor-value,\n.perseus-input-number-editor .input-answer-editor-message {\n display: inline-block;\n}\n.perseus-input-number-editor .input-answer-editor-value-container {\n display: block;\n}\n.perseus-input-number-editor .input-answer-editor-value-container input {\n background: #ffffff;\n border: 1px solid rgba(33, 36, 44, 0.5);\n border-radius: 4px;\n color: #21242c;\n font-family: Lato, \"Noto Sans\", sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n outline-offset: -2px;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .numeric-input-value {\n margin-left: 8px;\n width: 6em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .max-error-input-value {\n display: none;\n width: 3em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container\n .max-error-plusmn {\n cursor: default;\n display: none;\n height: 32px;\n padding-top: 4px;\n text-align: center;\n vertical-align: top;\n width: 1em;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .numeric-input-value,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .numeric-input-value {\n border-right: none;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .max-error-input-value,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .max-error-input-value {\n border-left: none;\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n display: inline-block;\n}\n.perseus-input-number-editor\n .input-answer-editor-value-container.with-max-error\n .max-error-plusmn,\n.perseus-input-number-editor\n .input-answer-editor-value-container:focus-within\n .max-error-plusmn {\n border-top: 1px solid rgba(33, 36, 44, 0.5);\n border-bottom: 1px solid rgba(33, 36, 44, 0.5);\n display: inline-block;\n}\n.perseus-input-number-editor .options-toggle,\n.perseus-input-number-editor .answer-trash,\n.perseus-input-number-editor .answer-status {\n height: 26px;\n line-height: 26px;\n outline-offset: -3px;\n vertical-align: middle;\n}\n.perseus-input-number-editor .value-divider {\n border-top: 1px solid #ccc;\n}\n.perseus-input-number-editor .options-toggle,\n.perseus-input-number-editor .answer-trash {\n border-left: 1px solid #ccc;\n box-sizing: border-box;\n cursor: pointer;\n display: inline-block;\n text-align: center;\n text-decoration: none;\n width: 20%;\n}\n.perseus-input-number-editor .options-toggle {\n background-color: #eee;\n color: #444;\n}\n.perseus-input-number-editor .options-toggle:hover {\n background-color: #ccc;\n}\n.perseus-input-number-editor .answer-trash {\n background-color: #c04f03;\n background-image: linear-gradient(to bottom, #e35d04, #c04f03);\n color: #fff;\n}\n.perseus-input-number-editor .answer-trash:hover {\n color: #fff;\n background-image: linear-gradient(to bottom, #f46e15, #d16014);\n}\n.perseus-input-number-editor .is-strict-indicator {\n background-color: #d9edf7;\n border-bottom: 1px solid #ccc;\n border-right: 1px solid #ccc;\n cursor: default;\n font-size: 16px;\n line-height: 12px;\n height: 12px;\n width: 12px;\n text-align: center;\n position: absolute;\n top: 0;\n right: auto;\n bottom: auto;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .simplify-indicator {\n border-top: 1px solid #ccc;\n border-right: 1px solid #ccc;\n cursor: default;\n font-size: 10px;\n line-height: 13px;\n height: 13px;\n width: 12px;\n text-align: center;\n position: absolute;\n top: 12px;\n right: auto;\n bottom: auto;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .simplify-indicator.optional {\n background-color: #aaffaa;\n}\n.perseus-input-number-editor .simplify-indicator.enforced {\n background-color: #ffcccc;\n}\n.perseus-input-number-editor .answer-status {\n color: inherit;\n display: inline-block;\n text-align: center;\n text-decoration: none;\n width: 60%;\n -webkit-user-select: none;\n user-select: none;\n}\n.perseus-input-number-editor .answer-status.wrong {\n background-color: #ffcccc;\n}\n.perseus-input-number-editor .answer-status.correct {\n background-color: #aaffaa;\n}\n.perseus-input-number-editor .answer-status.ungraded {\n background-color: #d9edf7;\n}\n.perseus-input-number-editor .input-answer-editor-message {\n margin-left: 5px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor {\n font-family: \"Lucida Grande\";\n width: 230px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-pair\n > textarea,\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-underlay {\n padding: 5px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-pair {\n border-color: #ccc;\n border-radius: 3px;\n min-height: 53px;\n}\n.perseus-input-number-editor\n .input-answer-editor-message\n .perseus-single-editor\n .perseus-textarea-underlay {\n margin-bottom: 0;\n}\n.perseus-widget-radio {\n margin-bottom: 10px;\n}\n.perseus-widget-radio .choice-editor .perseus-single-editor {\n margin-bottom: 0;\n}\n.perseus-widget-radio .choice-editor.correct textarea {\n background: #aaffaa;\n}\n.perseus-widget-radio .choice-editor.incorrect textarea {\n background: #ffcccc;\n}\n.perseus-widget-radio textarea::placeholder {\n color: #777;\n}\n.perseus-widget-radio .rationale-editor .perseus-textarea-pair {\n border-top: 0;\n}\n.perseus-widget-radio .choice-rationale-editors,\n.perseus-widget-radio .choice-editor,\n.perseus-widget-radio .rationale-editor {\n display: inline-block;\n width: 100%;\n}\n.perseus-widget-radio .perseus-single-editor {\n border: 0;\n display: inline-block;\n margin: 0 0 5px;\n vertical-align: top;\n}\n.perseus-widget-radio .perseus-single-editor p {\n margin: 0;\n}\n.perseus-widget-radio .perseus-textarea-pair,\n.perseus-widget-radio .perseus-textarea-underlay {\n /* Wrap when text area has a long image link that overflows. */\n overflow-wrap: anywhere;\n display: block;\n}\n.perseus-widget-radio .perseus-textarea-pair > textarea,\n.perseus-widget-radio .perseus-textarea-pair > .perseus-textarea-underlay {\n padding: 5px;\n}\n.perseus-widget-editor-content .add-choice-container .simple-button {\n margin-right: 10px;\n}\n.perseus-widget-editor-content .perseus-widget-radio {\n position: static;\n}\n.perseus-widget-editor-content .perseus-widget-radio .checkbox {\n position: relative;\n top: -10px;\n}\n.perseus-widget-editor-content .perseus-radio-option.none-of-above:before {\n content: \"None of the above\";\n display: block;\n font-style: italic;\n font-weight: bold;\n}\n.perseus-widget-editor-content\n .perseus-radio-option.none-of-above\n .choice-editor.incorrect {\n opacity: 0.5;\n}\n#solutionarea .perseus-widget-radio li {\n padding: 7px 0;\n}\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-single-editor {\n width: 80px;\n margin-bottom: 6px;\n}\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-textarea-pair,\n.framework-perseus\n table.perseus-widget-table-of-values\n th\n .perseus-single-editor {\n height: 50px;\n}\n.categorization-container.categorization-container-editor {\n width: 350px;\n margin-bottom: 160px;\n}\n.categorization-container.categorization-container-editor .card input {\n margin: 7px 3px 7px 13px;\n font-size: 12px;\n display: block;\n width: 81%;\n}\n.categorization-container.categorization-container-editor .category {\n float: left;\n padding: 5px;\n width: 160px;\n}\n.categorization-container.categorization-container-editor .categories {\n width: 176px;\n}\n.categorization-container.categorization-container-editor\n .perseus-textarea-underlay {\n margin-bottom: 0;\n}\n.categorization-container.categorization-container-editor .drag-bar {\n float: left;\n font-size: 10px;\n padding: 2px 0;\n height: 70%;\n margin-top: 3px;\n}\n.categorization-container.categorization-container-editor .header {\n margin-bottom: 8px;\n}\n.categorization-container.categorization-container-editor .header input {\n display: block;\n margin-right: 24px;\n width: 76%;\n}\n.categorization-container.categorization-container-editor .header .remove {\n position: relative;\n top: -14px;\n left: 12px;\n float: right;\n width: 20px;\n height: 20px;\n padding: 2px;\n color: #666;\n cursor: pointer;\n}\n.categorization-container.categorization-container-editor\n .header\n .remove:hover {\n color: #333;\n}\n.categorization-container.categorization-container-editor .delete-item-area {\n position: absolute;\n width: 150px;\n height: 60px;\n padding-top: 40px;\n bottom: -150px;\n left: 10px;\n border: dashed 2px #888;\n color: #888;\n text-align: center;\n font-size: 20px;\n}\n.categorization-container.categorization-container-editor\n .delete-item-area.target {\n border-color: black;\n color: #333;\n}\n.categorization-container.categorization-container-editor .card {\n width: 130px;\n padding: 0;\n}\n.categorization-container.categorization-container-editor\n .card.dragging\n .drag-bar {\n margin-left: 2px;\n}\n.categorization-editor-area {\n height: 30px;\n}\n.categorization-editor-area .add-item {\n float: left;\n margin-left: 17px;\n}\n.categorization-editor-area .add-category {\n margin-left: 173px;\n}\n.perseus-widget-interactive-graph {\n display: block;\n}\n.perseus-widget-plotter-editor .plotter-categories,\n.perseus-widget-plotter-editor .pic-url {\n width: 70%;\n}\n.perseus-text-list-editor input[type=\"text\"] {\n padding: 3px;\n margin-right: 5px;\n min-width: 20px;\n max-width: 340px;\n}\n.perseus-text-list-editor.layout-horizontal input[type=\"text\"] {\n float: left;\n}\n.perseus-matcher-editor .perseus-text-list-editor {\n float: left;\n max-width: 50%;\n}\n.perseus-matcher-editor .perseus-text-list-editor input[type=\"text\"] {\n max-width: 90%;\n}\n.perseus-matcher-editor input[type=\"text\"] {\n width: 46%;\n}\n.perseus-matcher-editor input[type=\"text\"] + input[type=\"text\"] {\n margin-left: 2%;\n}\n.info-tip {\n display: inline-block;\n}\n.info-tip-content-container p {\n font-size: 12px;\n line-height: 1.4;\n margin: 0;\n}\n.info-tip-content-container p + p {\n margin-top: 22px;\n}\n.perseus-widget-interaction-editor\n .perseus-widget-interaction-editor-select-element {\n background-color: #eee;\n border: 1px solid #ddd;\n border-top: 0;\n border-radius: 0 0 3px 3px;\n padding: 5px 10px;\n margin: 20px -11px -11px -11px;\n}\n.perseus-widget-interaction-editor .colorpicker-circle {\n border-radius: 50%;\n width: 14px;\n height: 14px;\n position: absolute;\n left: 5px;\n top: 5px;\n}\n.perseus-interaction-element {\n border: 1px solid #ddd;\n border-radius: 3px;\n}\n.perseus-interaction-element .perseus-interaction-element-title {\n background-color: #eee;\n border: 1px solid #ddd;\n border-bottom: 0;\n font-size: 1.25em;\n padding: 4px 10px;\n border-radius: 3px 3px 0 0;\n border: 0;\n color: inherit;\n display: block;\n text-decoration: none;\n white-space: nowrap;\n font-size: 1em;\n overflow: hidden;\n}\n.perseus-interaction-element .perseus-interaction-element-title.closed {\n border-radius: 3px;\n}\n.perseus-interaction-element .perseus-interaction-element-title > svg {\n float: left;\n font-size: 14px;\n margin-right: 10px;\n}\n.perseus-interaction-element .perseus-interaction-element-content {\n border-radius: 0 0 3px 3px;\n border-top: 1px solid #ddd;\n padding: 10px;\n}\n.perseus-interaction-element\n .perseus-interaction-element-content\n .edit-controls {\n text-align: right;\n margin-top: -30px;\n}\n.perseus-interaction-element\n .perseus-interaction-element-content\n .edit-controls\n > button {\n background: #fff;\n border: 0;\n cursor: pointer;\n padding: 0;\n margin-left: 7px;\n font-size: 18px;\n color: #555;\n}\n.perseus-interaction-element .perseus-interaction-element-content.leave {\n display: none;\n}\n.button-set-separator {\n margin: 10px 0;\n}\n.perseus-widget-editor .unit-radio {\n color: black;\n text-decoration: none;\n}\n.unit-example-not-okay {\n color: red;\n}\n.unit-example-okay {\n color: green;\n}\n.pair-editor input {\n width: 120px;\n}\n.marvel-device.iphone6.silver:after {\n z-index: 1;\n}\n.perseus-diff {\n margin: 0 10px;\n}\n.perseus-diff .diff-header {\n font-size: 18px;\n padding: 10px 0;\n width: 50%;\n display: inline-block;\n}\n.perseus-diff .diff-header.collapsed {\n font-size: 14px;\n padding: 0px;\n}\n.perseus-diff .diff-body {\n border-top: 1px solid #e4e4e4;\n border-bottom: 1px solid #e4e4e4;\n}\n.perseus-diff .diff-row {\n width: 50%;\n white-space: pre-wrap;\n box-sizing: border-box;\n font-size: 14px;\n padding-right: 20px;\n padding-left: 10px;\n overflow: hidden;\n}\n.perseus-diff .diff-row.collapsed {\n color: #888;\n cursor: pointer;\n}\n.perseus-diff .diff-row.collapsed:hover {\n color: #666;\n}\n.perseus-diff .diff-row.collapsed:active {\n color: #444;\n}\n.perseus-diff .diff-row .diff-line {\n margin-bottom: 20px;\n}\n.perseus-diff .before {\n float: left;\n border-left: 1px solid #e4e4e4;\n}\n.perseus-diff .after {\n float: right;\n border-right: 1px solid #e4e4e4;\n border-left: 1px solid #e4e4e4;\n}\n.perseus-diff .inner-value {\n height: 100%;\n padding: 3px;\n}\n.perseus-diff .not-present {\n display: none;\n}\n.perseus-diff .blank-space {\n visibility: hidden;\n}\n.perseus-diff .added {\n background-color: #eeffee;\n}\n.perseus-diff .added.dark {\n background-color: #aaffaa;\n}\n.perseus-diff .removed {\n background-color: #ffeeee;\n}\n.perseus-diff .removed.dark {\n background-color: #ffaaaa;\n}\n.perseus-diff .image {\n display: inline-block;\n margin-left: 20px;\n margin-bottom: 10px;\n}\n.perseus-diff .image,\n.perseus-diff .image > div,\n.perseus-diff .image > img {\n max-height: 300px;\n max-width: 100%;\n}\n.perseus-diff .image-unchanged {\n border: 1px solid #aaaaaa;\n}\n.perseus-diff .image-added {\n border: 2px solid #aaffaa;\n}\n.perseus-diff .image-removed {\n border: 2px solid #ffaaaa;\n}\n.perseus-diff .diff-separator {\n border-bottom: 1px dashed #444;\n margin: 30px 0 10px 0;\n}\n/* Reset fieldset min-width as our editors include a fieldset element\nnested within a table cell, which results in native browser styling that\nbreaks the layout depending on the widget editors used.*/\n.perseus-editor-table fieldset {\n min-inline-size: 0;\n min-width: 0;\n}\n/**\n * Disabled Editing Mode Styles\n *\n * Applied when editingDisabled=true to prevent content creators from making\n * changes while still allowing them to view the editor interface.\n *\n * Targets all form controls and interactive elements within disabled editors.\n */\n.perseus-single-editor.perseus-editor-disabled input,\n.perseus-single-editor.perseus-editor-disabled textarea,\n.perseus-single-editor.perseus-editor-disabled select,\n.perseus-single-editor.perseus-editor-disabled checkbox,\n.perseus-single-editor.perseus-editor-disabled .perseus-math-input,\n.perseus-single-editor.perseus-editor-disabled .keypad-input {\n opacity: 0.6 !important;\n background-color: var(\n --wb-semanticColor-core-background-neutral-subtle\n ) !important;\n cursor: not-allowed !important;\n border-color: var(--wb-semanticColor-core-border-neutral-subtle) !important;\n}\n\n/* We want to keep the button colors as it often helps denote correctness. */\n.perseus-single-editor.perseus-editor-disabled button {\n opacity: 0.6 !important;\n cursor: not-allowed !important;\n}\n\n/* Plotter is a special case due to the archaic graphie implementation. */\n.perseus-editor-disabled .perseus-widget-plotter {\n pointer-events: none;\n}\n",".decorativeToggleContainer {\n margin-block-end: var(--wb-sizing-size_080);\n}\n\n.flexRow {\n display: flex;\n align-items: center;\n gap: var(--wb-sizing-size_040);\n}\n",".dimensions-container {\n display: flex;\n flex-direction: column;\n align-items: start;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n );\n border: 1px solid var(--wb-semanticColor-core-border-base-subtle);\n border-radius: var(--wb-sizing-size_080);\n margin-block-start: var(--wb-sizing-size_080);\n margin-block-end: var(--wb-sizing-size_120);\n padding: var(--wb-sizing-size_080);\n}\n\n.dimensions-field-container {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n\n.x-span {\n display: block;\n margin-inline: var(--wb-sizing-size_080);\n}\n\n.horizontal-line {\n width: 100%;\n height: 1px;\n background-color: var(--wb-semanticColor-core-background-neutral-default);\n margin-block: var(--wb-sizing-size_080);\n}\n","/* We have to use !important until wonder blocks is in the shared layer. */\n/* TODO(LEMS-3686): Remove the !important once we don't need it anymore. */\n.single-select-short {\n /* Non-standard spacing, but it's the smallest we can go\n without running into styling issues with the dropdown. */\n height: 26px !important;\n}\n\n.row {\n display: flex !important;\n flex-direction: row !important;\n margin-top: 8px !important;\n align-items: center !important;\n}\n",".title {\n font-family: inherit;\n font-size: 15px;\n font-weight: bold;\n line-height: var(--wb-font-body-lineHeight-large);\n margin-bottom: var(--wb-sizing-size_060);\n color: #626569; /* gray17 */\n}\n\n.option {\n display: flex;\n padding: var(--wb-sizing-size_060) var(--wb-sizing-size_0);\n}\n\n.label {\n /* TODO: could we use WB typography? */\n font-family: inherit;\n font-size: 15px;\n line-height: 1.25;\n margin-left: var(--wb-sizing-size_160);\n color: #626569; /* gray17 */\n}\n\n.selectLabel {\n margin-right: var(--wb-sizing-size_080);\n}\n",".tile {\n display: flex;\n flex-direction: column;\n background-color: var(\n --wb-semanticColor-core-background-instructive-subtle\n );\n border: 1px solid var(--wb-semanticColor-core-border-neutral-subtle);\n border-radius: 12px;\n padding-inline: 12px;\n padding-block: 4px;\n margin-block-end: 12px;\n}\n\n.radio-option-actions-container {\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-block-start: 8px;\n}\n\n.button-row {\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-block-start: 8px;\n}\n\n.image-editor-container {\n display: flex;\n flex-direction: column;\n position: relative;\n padding: 8px;\n padding-block-start: 24px;\n border: 1px solid var(--wb-semanticColor-core-border-neutral-default);\n border-radius: 8px;\n margin-block-start: 8px;\n background-color: var(--wb-semanticColor-core-background-base-default);\n}\n"]}
package/dist/es/index.js CHANGED
@@ -17,7 +17,7 @@ import { sizing, spacing, semanticColor, font, border } from '@khanacademy/wonde
17
17
  import iconPass from '@phosphor-icons/core/fill/check-circle-fill.svg';
18
18
  import iconWarning from '@phosphor-icons/core/fill/warning-fill.svg';
19
19
  import iconAlert from '@phosphor-icons/core/fill/warning-octagon-fill.svg';
20
- import { LabelSmall, LabelLarge, LabelMedium, HeadingSmall, HeadingXSmall, Caption, LabelXSmall, BodyMonospace, Footnote } from '@khanacademy/wonder-blocks-typography';
20
+ import { LabelSmall, LabelLarge, LabelMedium, HeadingSmall, HeadingXSmall, Caption, BodyMonospace, LabelXSmall, Footnote } from '@khanacademy/wonder-blocks-typography';
21
21
  import { AccordionSection } from '@khanacademy/wonder-blocks-accordion';
22
22
  import { StyleSheet, css } from 'aphrodite';
23
23
  import Switch from '@khanacademy/wonder-blocks-switch';
@@ -65,7 +65,7 @@ import xIcon from '@phosphor-icons/core/regular/x.svg';
65
65
  import checkIcon from '@phosphor-icons/core/bold/check-bold.svg';
66
66
  import minusCircleIcon from '@phosphor-icons/core/bold/minus-circle-bold.svg';
67
67
 
68
- const libName="@khanacademy/perseus-editor";const libVersion="28.13.0";addLibraryVersionToPerseusDebug(libName,libVersion);
68
+ const libName="@khanacademy/perseus-editor";const libVersion="28.14.1";addLibraryVersionToPerseusDebug(libName,libVersion);
69
69
 
70
70
  var jsxRuntime = {exports: {}};
71
71
 
@@ -1425,7 +1425,7 @@ const PerseusEditorAccordion=props=>{const{animated,children,header,expanded,con
1425
1425
 
1426
1426
  const ShowMe=({elements})=>{const[showMe,setShowMe]=useState(false);if(!elements||elements.length===0){return null}const getIssueBoundary=element=>{const iframeBoundary=element.ownerDocument.defaultView?.frameElement?.getBoundingClientRect();const elementBoundary=element.getBoundingClientRect();return {top:elementBoundary.top+(iframeBoundary?.top||0),left:elementBoundary.left+(iframeBoundary?.left||0),height:elementBoundary.height,width:elementBoundary.width}};const showMeStyle={marginTop:"1em",fontWeight:"bold",display:"flex",alignItems:"center"};const getOutlineStyle=issueBoundary=>showMe&&issueBoundary.width!==0?{display:"block",border:"2px solid red",borderRadius:"4px",position:"fixed",height:issueBoundary.height+8,width:issueBoundary.width+8,top:issueBoundary.top-4,left:issueBoundary.left-4}:{display:"none"};const elementOutlines=elements?.map((element,index)=>{const issueBoundary=getIssueBoundary(element);const outlineStyle=getOutlineStyle(issueBoundary);return jsxRuntimeExports.jsx("div",{style:outlineStyle},index)});const showMeToggle=jsxRuntimeExports.jsxs(LabelSmall,{style:showMeStyle,children:[jsxRuntimeExports.jsx("span",{style:{marginInlineEnd:"1em"},children:"Show Me"}),jsxRuntimeExports.jsx(Switch,{checked:showMe,onChange:setShowMe}),elementOutlines]});const showMeUnavailable=jsxRuntimeExports.jsx("div",{children:"Unable to find the offending element. Please ask a developer for help fixing this."});return Array.isArray(elementOutlines)&&elementOutlines.length>0?showMeToggle:showMeUnavailable};
1427
1427
 
1428
- const impactStringMap={high:"Error",medium:"Warning",low:"Guideline"};const IssueDetails=({issue})=>{const[expanded,setExpanded]=React.useState(false);const toggleVisibility=()=>setExpanded(!expanded);const accordionColor=issue.impact==="high"?semanticColor.feedback.critical.subtle.background:semanticColor.feedback.warning.subtle.background;const messageStyling={whiteSpace:"pre-line",color:semanticColor.core.foreground.critical.subtle};return jsxRuntimeExports.jsxs(PerseusEditorAccordion,{animated:true,expanded:expanded,onToggle:toggleVisibility,containerStyle:{backgroundColor:accordionColor},panelStyle:{backgroundColor:"white"},header:jsxRuntimeExports.jsx(LabelLarge,{style:{textOverflow:"ellipsis",maxWidth:"100%",overflow:"hidden",whiteSpace:"nowrap"},children:`${impactStringMap[issue.impact]}: ${issue.id}`}),children:[jsxRuntimeExports.jsx(LabelSmall,{style:{fontWeight:"bold"},children:"Description:"}),jsxRuntimeExports.jsx("span",{children:issue.description}),jsxRuntimeExports.jsx("a",{href:issue.helpUrl,target:"_blank",rel:"noreferrer",children:issue.help}),jsxRuntimeExports.jsx(LabelSmall,{style:{marginTop:"1em",fontWeight:"bold"},children:"Impact:"}),jsxRuntimeExports.jsxs("span",{style:{fontWeight:"initial"},children:[" ",issue.impact]}),jsxRuntimeExports.jsx(LabelSmall,{style:{marginTop:"1em",fontWeight:"bold"},children:"Issue:"}),jsxRuntimeExports.jsx("span",{style:messageStyling,children:issue.message}),jsxRuntimeExports.jsx(ShowMe,{elements:issue.elements}),jsxRuntimeExports.jsx(IssueCta,{issue:issue})]})};
1428
+ const impactStringMap={high:"Error",medium:"Warning",low:"Guideline"};const IssueDetails=({issue})=>{const[expanded,setExpanded]=React.useState(false);const toggleVisibility=()=>setExpanded(!expanded);const accordionColor=issue.impact==="high"?semanticColor.feedback.critical.subtle.background:semanticColor.feedback.warning.subtle.background;const messageStyling={whiteSpace:"pre-line",color:semanticColor.core.foreground.critical.default};return jsxRuntimeExports.jsxs(PerseusEditorAccordion,{animated:true,expanded:expanded,onToggle:toggleVisibility,containerStyle:{backgroundColor:accordionColor},panelStyle:{backgroundColor:"white"},header:jsxRuntimeExports.jsx(LabelLarge,{style:{textOverflow:"ellipsis",maxWidth:"100%",overflow:"hidden",whiteSpace:"nowrap"},children:`${impactStringMap[issue.impact]}: ${issue.id}`}),children:[jsxRuntimeExports.jsx(LabelSmall,{style:{fontWeight:"bold"},children:"Description:"}),jsxRuntimeExports.jsx("span",{children:issue.description}),jsxRuntimeExports.jsx("a",{href:issue.helpUrl,target:"_blank",rel:"noreferrer",children:issue.help}),jsxRuntimeExports.jsx(LabelSmall,{style:{marginTop:"1em",fontWeight:"bold"},children:"Impact:"}),jsxRuntimeExports.jsxs("span",{style:{fontWeight:"initial"},children:[" ",issue.impact]}),jsxRuntimeExports.jsx(LabelSmall,{style:{marginTop:"1em",fontWeight:"bold"},children:"Issue:"}),jsxRuntimeExports.jsx("span",{style:messageStyling,children:issue.message}),jsxRuntimeExports.jsx(ShowMe,{elements:issue.elements}),jsxRuntimeExports.jsx(IssueCta,{issue:issue})]})};
1429
1429
 
1430
1430
  const typographyMap={small:LabelSmall,medium:LabelMedium};const LabeledSwitch$1=props=>{const{checked,label,labelSide="end",size="medium",style,disabled=false,onChange}=props;const Typography=typographyMap[size];const switchId=useId();const labelElement=jsxRuntimeExports.jsx(Typography,{tag:"label",htmlFor:switchId,children:label});const strut=jsxRuntimeExports.jsx(Strut,{size:spacing.xSmall_8});return jsxRuntimeExports.jsxs(View,{style:[styles$S.row,style],children:[labelSide==="start"&&jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[labelElement,strut]}),jsxRuntimeExports.jsx(Switch,{id:switchId,checked:checked,disabled:disabled,onChange:onChange}),labelSide==="end"&&jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[strut,labelElement]})]})};const styles$S=StyleSheet.create({row:{flexDirection:"row",alignItems:"center"}});
1431
1431
 
@@ -1542,11 +1542,13 @@ const{InfoTip: InfoTip$g}=components;function DecorativeToggle({decorative,hasPo
1542
1542
 
1543
1543
  const ScrolllessNumberTextField=props=>{const{value,onChange,...restOfProps}=props;const[focused,setFocused]=React.useState(false);const[wipValue,setWipValue]=React.useState("");const inputRef=React.useRef(null);React.useEffect(()=>{const ref=inputRef.current;const ignoreScroll=e=>{e.stopPropagation();};ref?.addEventListener("wheel",ignoreScroll);return ()=>{ref?.removeEventListener("wheel",ignoreScroll);}},[inputRef]);return jsxRuntimeExports.jsx(TextField,{...restOfProps,type:"number",value:focused?wipValue:value,onChange:newValue=>{setWipValue(newValue);onChange(newValue);},onFocus:e=>{setWipValue(value);setFocused(true);props.onFocus?.(e);},onBlur:e=>{setFocused(false);props.onBlur?.(e);},ref:inputRef})};
1544
1544
 
1545
- var styles$J = {"dimensionsContainer":"perseus_4qo24hC2","dimensionsFieldContainer":"perseus_BMTr3h5s","xSpan":"perseus_4OCWnpA9"};
1545
+ var styles$J = {"dimensionsContainer":"perseus_4qo24hC2","dimensionsFieldContainer":"perseus_BMTr3h5s","xSpan":"perseus_4OCWnpA9","horizontalLine":"perseus_SKDkfpcb"};
1546
1546
 
1547
1547
  function ImageDimensionsInput({backgroundImage,onChange}){function handleWidthChange(newWidth){const newHeight=getOtherSideLengthWithPreservedAspectRatio(backgroundImage.width,backgroundImage.height,Number(newWidth));if(isNaN(newHeight)){return}const newWidthNumber=Number(newWidth);if(newWidthNumber===backgroundImage.width&&newHeight===backgroundImage.height){return}onChange({backgroundImage:{...backgroundImage,width:newWidthNumber,height:newHeight}});}function handleHeightChange(newHeight){const newWidth=getOtherSideLengthWithPreservedAspectRatio(backgroundImage.height,backgroundImage.width,Number(newHeight));if(isNaN(newWidth)){return}const newHeightNumber=Number(newHeight);if(newWidth===backgroundImage.width&&newHeightNumber===backgroundImage.height){return}onChange({backgroundImage:{...backgroundImage,height:newHeightNumber,width:newWidth}});}async function handleResetToOriginalSize(){const naturalSize=await Util.getImageSizeModern(backgroundImage.url);const[naturalWidth,naturalHeight]=naturalSize;if(naturalWidth===backgroundImage.width&&naturalHeight===backgroundImage.height){return}onChange({backgroundImage:{...backgroundImage,width:naturalWidth,height:naturalHeight}});}return jsxRuntimeExports.jsxs("div",{className:styles$J.dimensionsContainer,children:[jsxRuntimeExports.jsxs("div",{className:styles$J.dimensionsFieldContainer,children:[jsxRuntimeExports.jsx(LabeledField,{label:"Width",field:jsxRuntimeExports.jsx(ScrolllessNumberTextField,{value:backgroundImage.width?.toString()??"",onChange:handleWidthChange}),styles:wbFieldStyles}),jsxRuntimeExports.jsx("span",{className:styles$J.xSpan,children:"x"}),jsxRuntimeExports.jsx(LabeledField,{label:"Height",field:jsxRuntimeExports.jsx(ScrolllessNumberTextField,{value:backgroundImage.height?.toString()??"",onChange:handleHeightChange}),styles:wbFieldStyles})]}),jsxRuntimeExports.jsx(Button,{kind:"tertiary",size:"small",startIcon:arrowCounterClockwise,onClick:handleResetToOriginalSize,children:"Reset to original size"})]})}
1548
1548
 
1549
- const MIN_ALT_TEXT_LENGTH=8;const MAX_ALT_TEXT_LENGTH=150;const altTextTooLongError="Alt text should not exceed 150 characters. Please pair your alt with a long description below if you need significantly more text to sufficiently describe the image.";const altTextTooShortError="Add more detail to describe your image. While alt text should be brief, it must also describe the image well.";function ImageSettings({alt,backgroundImage,apiOptions,caption,decorative,longDescription,title,onChange}){const[altFieldError,setAltFieldError]=React.useState(null);if(!backgroundImage.url){return null}const hasPopulatedFields=Boolean(alt||caption||title||longDescription);function handleAltFieldChange(value){if(value.length===0){setAltFieldError(null);}else if(value.length>MAX_ALT_TEXT_LENGTH){setAltFieldError(altTextTooLongError);}else if(value.length>=MIN_ALT_TEXT_LENGTH){setAltFieldError(null);}onChange({alt:value});}function handleAltFieldBlur(value){if(value.length>0&&value.length<MIN_ALT_TEXT_LENGTH){setAltFieldError(altTextTooShortError);}}return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[jsxRuntimeExports.jsx(LabeledField,{label:"Preview",field:jsxRuntimeExports.jsx(ImagePreview,{src:backgroundImage.url,alt:`Preview: ${alt||"No alt text"}`,width:backgroundImage.width,height:backgroundImage.height}),styles:wbFieldStyles}),jsxRuntimeExports.jsx(ImageDimensionsInput,{backgroundImage:backgroundImage,onChange:onChange}),jsxRuntimeExports.jsx(DecorativeToggle,{decorative:decorative,hasPopulatedFields:hasPopulatedFields,onChange:onChange}),jsxRuntimeExports.jsx(LabeledField,{label:"Title",field:jsxRuntimeExports.jsx(TextArea,{value:title??"",onChange:value=>onChange({title:value}),disabled:decorative,autoResize:true}),styles:wbFieldStyles}),jsxRuntimeExports.jsx(LabeledField,{label:"Alt text",description:"Summarize the image using up to 150 characters.",field:jsxRuntimeExports.jsx(TextArea,{value:alt??"",onBlur:e=>handleAltFieldBlur(e.target.value),onChange:handleAltFieldChange,disabled:decorative,autoResize:true}),errorMessage:altFieldError,styles:wbFieldStylesWithDescription}),jsxRuntimeExports.jsx(LabeledField,{label:"Long description",field:jsxRuntimeExports.jsx(TextArea,{value:longDescription??"",onChange:value=>onChange({longDescription:value}),disabled:decorative,autoResize:true}),styles:wbFieldStyles}),jsxRuntimeExports.jsx(LabeledField,{label:"Caption",field:jsxRuntimeExports.jsx(TextArea,{value:caption??"",onChange:value=>onChange({caption:value}),disabled:decorative,autoResize:true}),styles:wbFieldStyles})]})}
1549
+ function ImageScaleInput({backgroundImage,scale,onChange}){const width=backgroundImage.width??0;const height=backgroundImage.height??0;function handleScaleChange(newScale){const scaleNum=Number(newScale);if(isNaN(scaleNum)||scaleNum<=0){return}onChange({scale:scaleNum});}function handleScaledWidthChange(newScaledWidth){const newScaledWidthNum=Number(newScaledWidth);if(isNaN(newScaledWidthNum)||newScaledWidthNum<=0){return}const newScale=newScaledWidthNum/width;onChange({scale:newScale});}function handleScaledHeightChange(newScaledHeight){const newScaledHeightNum=Number(newScaledHeight);if(isNaN(newScaledHeightNum)||newScaledHeightNum<=0){return}const newScale=newScaledHeightNum/height;onChange({scale:newScale});}async function handleResetToOriginalSize(){if(!backgroundImage.url){return}const naturalSize=await Util.getImageSizeModern(backgroundImage.url);const[naturalWidth,naturalHeight]=naturalSize;if(naturalWidth===backgroundImage.width&&naturalHeight===backgroundImage.height){return}onChange({backgroundImage:{...backgroundImage,width:naturalWidth,height:naturalHeight}});}return jsxRuntimeExports.jsxs("div",{className:styles$J.dimensionsContainer,children:[jsxRuntimeExports.jsxs(BodyMonospace,{children:["Dimensions: ",width," x ",height]}),jsxRuntimeExports.jsx(Button,{kind:"tertiary",size:"small",startIcon:arrowCounterClockwise,onClick:handleResetToOriginalSize,children:"Recalculate original size"}),jsxRuntimeExports.jsx("div",{className:styles$J.horizontalLine}),jsxRuntimeExports.jsx(LabeledField,{label:"Scale",description:"Use 1 to display image at original size.",field:jsxRuntimeExports.jsx(ScrolllessNumberTextField,{value:scale.toString(),min:0,onChange:handleScaleChange}),styles:wbFieldStyles}),jsxRuntimeExports.jsxs("div",{className:styles$J.dimensionsFieldContainer,children:[jsxRuntimeExports.jsx(LabeledField,{label:"Scaled Width",field:jsxRuntimeExports.jsx(ScrolllessNumberTextField,{value:(width*scale).toString(),min:0,onChange:handleScaledWidthChange}),styles:wbFieldStyles}),jsxRuntimeExports.jsx("span",{className:styles$J.xSpan,children:"x"}),jsxRuntimeExports.jsx(LabeledField,{label:"Scaled Height",field:jsxRuntimeExports.jsx(ScrolllessNumberTextField,{value:(height*scale).toString(),min:0,onChange:handleScaledHeightChange}),styles:wbFieldStyles})]})]})}
1550
+
1551
+ const MIN_ALT_TEXT_LENGTH=8;const MAX_ALT_TEXT_LENGTH=150;const altTextTooLongError="Alt text should not exceed 150 characters. Please pair your alt with a long description below if you need significantly more text to sufficiently describe the image.";const altTextTooShortError="Add more detail to describe your image. While alt text should be brief, it must also describe the image well.";function ImageSettings({alt,backgroundImage,scale=1,apiOptions,caption,decorative,longDescription,title,onChange}){const[altFieldError,setAltFieldError]=React.useState(null);const scaleFF=isFeatureOn({apiOptions},"image-widget-upgrade-scale");if(!backgroundImage.url){return null}const hasPopulatedFields=Boolean(alt||caption||title||longDescription);function handleAltFieldChange(value){if(value.length===0){setAltFieldError(null);}else if(value.length>MAX_ALT_TEXT_LENGTH){setAltFieldError(altTextTooLongError);}else if(value.length>=MIN_ALT_TEXT_LENGTH){setAltFieldError(null);}onChange({alt:value});}function handleAltFieldBlur(value){if(value.length>0&&value.length<MIN_ALT_TEXT_LENGTH){setAltFieldError(altTextTooShortError);}}return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[jsxRuntimeExports.jsx(LabeledField,{label:"Preview",field:jsxRuntimeExports.jsx(ImagePreview,{src:backgroundImage.url,alt:`Preview: ${alt||"No alt text"}`,width:backgroundImage.width,height:backgroundImage.height}),styles:wbFieldStyles}),scaleFF?jsxRuntimeExports.jsx(ImageScaleInput,{backgroundImage:backgroundImage,scale:scale,onChange:onChange}):jsxRuntimeExports.jsx(ImageDimensionsInput,{backgroundImage:backgroundImage,onChange:onChange}),jsxRuntimeExports.jsx(DecorativeToggle,{decorative:decorative,hasPopulatedFields:hasPopulatedFields,onChange:onChange}),jsxRuntimeExports.jsx(LabeledField,{label:"Title",field:jsxRuntimeExports.jsx(TextArea,{value:title??"",onChange:value=>onChange({title:value}),disabled:decorative,autoResize:true}),styles:wbFieldStyles}),jsxRuntimeExports.jsx(LabeledField,{label:"Alt text",description:"Summarize the image using up to 150 characters.",field:jsxRuntimeExports.jsx(TextArea,{value:alt??"",onBlur:e=>handleAltFieldBlur(e.target.value),onChange:handleAltFieldChange,disabled:decorative,autoResize:true}),errorMessage:altFieldError,styles:wbFieldStylesWithDescription}),jsxRuntimeExports.jsx(LabeledField,{label:"Long description",field:jsxRuntimeExports.jsx(TextArea,{value:longDescription??"",onChange:value=>onChange({longDescription:value}),disabled:decorative,autoResize:true}),styles:wbFieldStyles}),jsxRuntimeExports.jsx(LabeledField,{label:"Caption",field:jsxRuntimeExports.jsx(TextArea,{value:caption??"",onChange:value=>onChange({caption:value}),disabled:decorative,autoResize:true}),styles:wbFieldStyles})]})}
1550
1552
 
1551
1553
  const INTERNALLY_HOSTED_DOMAINS="("+"ka-.*.s3.amazonaws.com|"+"(fastly|cdn).kastatic.org|"+"khanacademy.org|"+"kasandbox.org"+")";const INTERNALLY_HOSTED_URL_RE=new RegExp("^(https?|web\\+graphie)://[^/]*"+INTERNALLY_HOSTED_DOMAINS);function ImageUrlInput({backgroundImage,onChange}){const uniqueId=React__default.useId();const urlId=`${uniqueId}-url`;const[urlFieldValue,setUrlFieldValue]=React__default.useState(backgroundImage.url||"");const[backgroundImageError,setBackgroundImageError]=React__default.useState(null);React__default.useEffect(()=>{setUrlFieldValue(backgroundImage.url||"");},[backgroundImage.url]);function setUrl(url,width,height){const image={...backgroundImage};image.url=url;image.width=width;image.height=height;const box=[image.width,image.height];onChange({backgroundImage:image,box:box});}async function onUrlChange(url){setBackgroundImageError(null);if(!url){setUrl(url,0,0);return}if(url===backgroundImage.url){return}if(url&&!INTERNALLY_HOSTED_URL_RE.test(url)){setBackgroundImageError("Images must be from sites hosted by Khan Academy. "+"Please input a Khan Academy-owned address, or use the "+"Add Image tool to rehost an existing image");return}try{const size=await Util.getImageSizeModern(url);setUrl(url,size[0],size[1]);}catch(error){setBackgroundImageError(`There was an error loading the image URL: ${JSON.stringify(error,null,2)}`);}}return jsxRuntimeExports.jsx(LabeledField,{label:"Image URL",description:"Paste an image or graphie image URL.",field:jsxRuntimeExports.jsx(TextField,{id:urlId,value:urlFieldValue,onBlur:e=>onUrlChange(e.target.value),onChange:value=>setUrlFieldValue(value)}),errorMessage:backgroundImageError,styles:wbFieldStylesWithDescription})}
1552
1554