/** * @license * Copyright (c) 2018 The Polymer Project Authors. All rights reserved. * This code may only be used under the BSD style license found at * http://polymer.github.io/LICENSE.txt * The complete set of authors may be found at * http://polymer.github.io/AUTHORS.txt * The complete set of contributors may be found at * http://polymer.github.io/CONTRIBUTORS.txt * Code distributed by Google as part of the polymer project is also * subject to an additional IP rights grant found at * http://polymer.github.io/PATENTS.txt */ import { AttributePart, directive, PropertyPart } from '../lit-html.js'; /** * Stores the ClassInfo object applied to a given AttributePart. * Used to unset existing values when a new ClassInfo object is applied. */ const classMapCache = new WeakMap(); /** * A directive that applies CSS classes. This must be used in the `class` * attribute and must be the only part used in the attribute. It takes each * property in the `classInfo` argument and adds the property name to the * element's `classList` if the property value is truthy; if the property value * is falsey, the property name is removed from the element's `classList`. For * example * `{foo: bar}` applies the class `foo` if the value of `bar` is truthy. * @param classInfo {ClassInfo} */ export const classMap = directive((classInfo) => (part) => { if (!(part instanceof AttributePart) || (part instanceof PropertyPart) || part.committer.name !== 'class' || part.committer.parts.length > 1) { throw new Error('The `classMap` directive must be used in the `class` attribute ' + 'and must be the only part in the attribute.'); } const { committer } = part; const { element } = committer; // handle static classes if (!classMapCache.has(part)) { element.className = committer.strings.join(' '); } const { classList } = element; // remove old classes that no longer apply const oldInfo = classMapCache.get(part); for (const name in oldInfo) { if (!(name in classInfo)) { classList.remove(name); } } // add new classes for (const name in classInfo) { const value = classInfo[name]; if (!oldInfo || value !== oldInfo[name]) { // We explicitly want a loose truthy check here because // it seems more convenient that '' and 0 are skipped. const method = value ? 'add' : 'remove'; classList[method](name); } } classMapCache.set(part, classInfo); }); //# sourceMappingURL=class-map.js.map