當前位置: 首頁>>代碼示例>>TypeScript>>正文


TypeScript merge-styles.Stylesheet類代碼示例

本文整理匯總了TypeScript中@uifabric/merge-styles.Stylesheet的典型用法代碼示例。如果您正苦於以下問題:TypeScript Stylesheet類的具體用法?TypeScript Stylesheet怎麽用?TypeScript Stylesheet使用的例子?那麽, 這裏精選的類代碼示例或許可以為您提供幫助。


在下文中一共展示了Stylesheet類的8個代碼示例,這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚,您的評價將有助於係統推薦出更棒的TypeScript代碼示例。

示例1: print

export function print(
  val: string,
  serialize: () => string,
  indent: (val: string) => string
): string {
  const classNames = [];
  const rules = [];
  const parts = val.split(' ');

  for (const part of parts) {
    const ruleSet = Stylesheet.getInstance().insertedRulesFromClassName(part);

    if (ruleSet) {
      rules.push(_serializeRules(ruleSet, indent));
    } else {
      classNames.push(part);
    }
  }

  return (
    [
      ``,
      `${classNames.map((cn: string) => indent(cn)).join('\n')}`,
      `${rules.join('\n')}`
    ].join('\n')
  );
}
開發者ID:zoarif,項目名稱:office-ui-fabric-react,代碼行數:27,代碼來源:index.ts

示例2: _serializeRules

/**
 * Given a ruleSet (an array of doubles (selector and insertedRules string)), and an indent,
 * produce a serialized version of the rules.
 */
function _serializeRules(rules: string[], indent: (val: string) => string): string {
  const ruleStrings: string[] = [];
  const stylesheet = Stylesheet.getInstance();

  for (let i = 0; i < rules.length; i += 2) {
    const selector = rules[i];
    const insertedRules = rules[i + 1];

    if (insertedRules) {
      // Keyframes should not be parsed like other selector/rule mappings.
      if (selector !== 'keyframes') {
        ruleStrings.push(indent((i === 0 ? '' : selector + ' ') + `{`));
        insertedRules
          .split(';')
          .sort()
          .forEach((rule: string) => {
            if (rule) {
              const [name, value] = rule.split(':');
              let delimiter: string | RegExp = ' ';

              if (name === 'animation-name') {
                delimiter = /[ ,]+/;
              }

              let result: string[] = [];

              if (value) {
                const valueParts = value.split(delimiter);

                for (const part of valueParts) {
                  const ruleSet = stylesheet.insertedRulesFromClassName(part);

                  if (ruleSet) {
                    result = result.concat(ruleSet);
                  } else {
                    result.push(part);
                  }
                }
              }

              ruleStrings.push(indent(`  ${name}: ${result.join(' ')};`));
            }
          });

        ruleStrings.push(indent('}'));
      }
    }
  }

  return ruleStrings.join('\n');
}
開發者ID:OfficeDev,項目名稱:office-ui-fabric-react,代碼行數:55,代碼來源:index.ts

示例3:

  <T>(classNames: GlobalClassNames<T>, disableGlobalClassNames?: boolean): Partial<GlobalClassNames<T>> => {
    const styleSheet = Stylesheet.getInstance();

    if (disableGlobalClassNames) {
      // disable global classnames
      return Object.keys(classNames).reduce((acc: {}, className: string) => {
        acc[className] = styleSheet.getClassName(classNames[className]);
        return acc;
      }, {});
    }

    // use global classnames
    return classNames;
  }
開發者ID:OfficeDev,項目名稱:office-ui-fabric-react,代碼行數:14,代碼來源:getGlobalClassNames.ts

示例4: print

export function print(val: string, serialize: () => string, indent: (val: string) => string): string {
  const classNames = [];
  const rules = [];
  const parts = val.split(' ');

  // Iterate through all class names in the value, and for each, determine if merge-styles
  // has a ruleset registered for the class. If so, serialize it to an expanded string. If not
  // add it to the static classNames array, as it's likely a global class name.
  for (const part of parts) {
    const ruleSet = Stylesheet.getInstance().insertedRulesFromClassName(part);

    if (ruleSet) {
      rules.push(_serializeRules(ruleSet, indent));
    } else {
      classNames.push(part);
    }
  }

  return [``, `${classNames.map((cn: string) => indent(cn)).join('\n')}`, `${rules.join('\n')}`].join('\n');
}
開發者ID:OfficeDev,項目名稱:office-ui-fabric-react,代碼行數:20,代碼來源:index.ts

示例5: _serializeRules

function _serializeRules(rules: string[], indent: (val: string) => string): string {
  const ruleStrings: string[] = [];
  const stylesheet = Stylesheet.getInstance();

  for (let i = 0; i < rules.length; i += 2) {
    const selector = rules[i];
    const insertedRules = rules[i + 1];

    if (insertedRules) {
      ruleStrings.push(indent((i === 0 ? '' : selector + ' ') + `{`));

      insertedRules.split(';').sort().forEach((rule: string) => {
        if (rule) {
          const [name, value] = rule.split(':');
          const valueParts = value.split(' ');
          let result: string[] = [];

          for (const part of valueParts) {
            const ruleSet = stylesheet.insertedRulesFromClassName(part);

            if (ruleSet) {
              result = result.concat(ruleSet);
            } else {
              result.push(part);
            }
          }

          ruleStrings.push(indent(`  ${name}: ${result.join(' ')};`));
        }
      });

      ruleStrings.push(indent('}'));
    }
  }

  return ruleStrings.join('\n');
}
開發者ID:zoarif,項目名稱:office-ui-fabric-react,代碼行數:37,代碼來源:index.ts

示例6:

  __remapped: { [key: string]: string };
  [key: string]: IIconRecord | {};
}

const ICON_SETTING_NAME = 'icons';

const _iconSettings = GlobalSettings.getValue<IIconRecords>(ICON_SETTING_NAME, {
  __options: {
    disableWarnings: false,
    warnOnMissingIcons: true
  },
  __remapped: {}
});

// Reset icon registration on stylesheet resets.
const stylesheet = Stylesheet.getInstance();

if (stylesheet && stylesheet.onReset) {
  stylesheet.onReset(() => {
    for (const name in _iconSettings) {
      if (_iconSettings.hasOwnProperty(name) && !!(_iconSettings[name] as IIconRecord).subset) {
        (_iconSettings[name] as IIconRecord).subset.className = undefined;
      }
    }
  });
}

/**
 * Registers a given subset of icons.
 *
 * @param iconSubset - the icon subset definition.
開發者ID:mikewheaton,項目名稱:office-ui-fabric-react,代碼行數:31,代碼來源:icons.ts

示例7:

 return parts.some((part: string): boolean => !!Stylesheet.getInstance().insertedRulesFromClassName(part));
開發者ID:zoarif,項目名稱:office-ui-fabric-react,代碼行數:1,代碼來源:index.ts

示例8: get

import { Stylesheet } from '@uifabric/merge-styles';

const stylesheet = Stylesheet.getInstance();

if (stylesheet && stylesheet.onReset) {
  Stylesheet.getInstance().onReset(resetMemoizations);
}

// tslint:disable:no-any
declare class WeakMap {
  public get(key: any): any;
  public set(key: any, value: any): void;
  public has(key: any): boolean;
}

let _resetCounter = 0;
const _emptyObject = { empty: true };
const _dictionary: any = {};
let _weakMap = typeof WeakMap === 'undefined' ? null : WeakMap;

interface IMemoizeNode {
  map: WeakMap | null;
  value?: any;
}

/**
 *  Test utility for providing a custom weakmap.
 *
 * @internal
 * */
export function setMemoizeWeakMap(weakMap: any): void {
開發者ID:magellantoo,項目名稱:office-ui-fabric-react,代碼行數:31,代碼來源:memoize.ts


注:本文中的@uifabric/merge-styles.Stylesheet類示例由純淨天空整理自Github/MSDocs等開源代碼及文檔管理平台,相關代碼片段篩選自各路編程大神貢獻的開源項目,源碼版權歸原作者所有,傳播和使用請參考對應項目的License;未經允許,請勿轉載。