@sanity/language-filter 0.147.10-next.22 → 1.0.0-firstpass-v3-impl.1

package/lib/SelectLanguageProvider.js

@@ -1,52 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _datastore = require("./datastore");
-
-var _SelectLanguage = _interopRequireDefault(require("./SelectLanguage"));
-
-var _config = _interopRequireDefault(require("part:@sanity/language-filter/config"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-class SelectLanguageProvider extends _react.default.Component {
-  constructor() {
-    super(...arguments);
-
-    _defineProperty(this, "state", {
-      selected: []
-    });
-  }
-
-  componentDidMount(props) {
-    this.subscription = _datastore.selectedLanguages$.subscribe(selected => {
-      this.setState({
-        selected: selected
-      });
-    });
-  }
-
-  componentWillUnmount(props) {
-    this.subscription.unsubscribe();
-  }
-
-  render() {
-    var selected = this.state.selected;
-    return _react.default.createElement(_SelectLanguage.default, {
-      languages: _config.default.supportedLanguages,
-      selected: selected,
-      onChange: _datastore.setLangs
-    });
-  }
-
-}
-
-exports.default = SelectLanguageProvider;

package/lib/datastore.js

@@ -1,48 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.filterFn$ = exports.selectedLanguages$ = exports.setLangs = void 0;
-
-var _intersection2 = _interopRequireDefault(require("lodash/intersection"));
-
-var _rxjs = require("rxjs");
-
-var _operators = require("rxjs/operators");
-
-var _config = _interopRequireDefault(require("part:@sanity/language-filter/config"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var onSelect$ = new _rxjs.Subject();
-
-var setLangs = langs => onSelect$.next(langs);
-
-exports.setLangs = setLangs;
-
-var persistOn = (key, defaultValue) => input$ => {
-  var persisted;
-
-  try {
-    persisted = JSON.parse(window.localStorage.getItem(key));
-  } catch (err) {} // eslint-disable-line no-empty
-
-
-  return input$.pipe((0, _operators.startWith)(persisted || defaultValue), (0, _operators.tap)(value => {
-    window.localStorage.setItem(key, JSON.stringify(value));
-  }));
-};
-
-var SUPPORTED_LANG_IDS = _config.default.supportedLanguages.map(lang => lang.id);
-
-var selectedLanguages$ = onSelect$.pipe((0, _operators.map)(selectedLangs => (0, _intersection2.default)(selectedLangs, SUPPORTED_LANG_IDS)), (0, _operators.publishReplay)(1), (0, _operators.refCount)(), persistOn('@sanity/plugin/language-filter/selected-languages', SUPPORTED_LANG_IDS));
-exports.selectedLanguages$ = selectedLanguages$;
-
-var defaultFilterField = (enclosingType, field, selectedLanguages) => !enclosingType.name.startsWith('locale') || selectedLanguages.includes(field.name);
-
-var filterField = _config.default.filterField || defaultFilterField;
-var filterFn$ = selectedLanguages$.pipe((0, _operators.map)(langs => {
-  return (enclosingType, field) => filterField(enclosingType, field, langs);
-}));
-exports.filterFn$ = filterFn$;

package/lib/filter-fields.js

@@ -1,13 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return _datastore.filterFn$;
-  }
-});
-
-var _datastore = require("./datastore");

package/lib/styles/SelectLanguage.css

@@ -1,50 +0,0 @@
-@import 'part:@sanity/base/theme/variables-style';
-
-.target {
-  display: flex;
-  align-items: center;
-  color: var(--text-color);
-  opacity: 1;
-  min-width: 4rem;
-  font-size: var(--font-size-xsmall);
-  white-space: nowrap;
-  height: 2.5rem;
-  align-self: center;
-  margin-right: 1em;
-}
-
-.arrow {
-  margin-left: 0.4em;
-}
-
-.root {
-  padding: 0.5em;
-  background-color: var(--component-bg);
-  color: var(--text-color);
-  composes: shadow-6dp from 'part:@sanity/base/theme/shadows-style';
-  user-select: none;
-  text-align: left;
-  overflow: auto;
-  overflow-x: hidden;
-}
-
-.list {
-  composes: resetList from 'part:@sanity/base/theme/layout/helpers';
-}
-
-.functions {
-  padding: 0.5em;
-  text-align: center;
-}
-
-.selectedNumFilter {
-  color: var(--state-danger-color);
-  font-weight: bold;
-}
-
-.item {
-  padding: 0.5em;
-  composes: resetListItem from 'part:@sanity/base/theme/layout/helpers';
-  composes: item from 'part:@sanity/base/theme/layout/selectable-style';
-  white-space: nowrap;
-}

package/src/SelectLanguage.js

@@ -1,106 +0,0 @@
-/* eslint-disable complexity */
-import React, {Fragment} from 'react'
-import PropTypes from 'prop-types'
-import Poppable from 'part:@sanity/components/utilities/poppable'
-import Checkbox from 'part:@sanity/components/toggles/checkbox'
-import Button from 'part:@sanity/components/buttons/default'
-import styles from './styles/SelectLanguage.css'
-import AngleDown from 'part:@sanity/base/angle-down-icon'
-import AngleUp from 'part:@sanity/base/angle-up-icon'
-
-const LanguagePropType = PropTypes.shape({id: PropTypes.string, title: PropTypes.string})
-export default class SelectLanguage extends React.Component {
-  static propTypes = {
-    languages: PropTypes.arrayOf(LanguagePropType),
-    selected: PropTypes.arrayOf(LanguagePropType),
-    onChange: PropTypes.func
-  }
-
-  state = {isOpen: false}
-  refElement = React.createRef()
-
-  handleToggle = () => this.setState(prevState => ({isOpen: !prevState.isOpen}))
-  handleOpen = () => this.setState({isOpen: true})
-  handleClose = () => {
-    this.setState({isOpen: false})
-  }
-
-  selectLang = langId => {
-    const {selected, onChange} = this.props
-    onChange(selected.concat(langId))
-  }
-
-  unselectLang = langId => {
-    const {selected, onChange} = this.props
-    onChange(selected.filter(id => id !== langId))
-  }
-
-  handleSelectAll = event => {
-    const {languages, onChange} = this.props
-    onChange(languages.map(l => l.id))
-  }
-  handleSelectNone = event => {
-    const {onChange} = this.props
-    onChange([])
-  }
-  handleLangCheckboxChange = event => {
-    const id = event.target.getAttribute('data-lang-id')
-    const checked = event.target.checked
-    this[checked ? 'selectLang' : 'unselectLang'](id)
-  }
-
-  render() {
-    const {isOpen} = this.state
-    const {languages, selected} = this.props
-    const allIsSelected = languages.length === selected.length
-    const refElement =
-      this.refElement && this.refElement.current && this.refElement.current._element
-
-    return (
-      <Fragment>
-        <span
-          className={styles.target}
-          onClick={this.handleToggle}
-          ref={this.refElement}
-          title={
-            allIsSelected
-              ? 'Filter language fields'
-              : 'Displaying only fields for selected languages'
-          }
-        >
-          Filter languages{allIsSelected ? '…' : ` (${selected.length}/${languages.length})`}
-          <span className={styles.arrow}>{isOpen ? <AngleUp /> : <AngleDown />}</span>
-        </span>
-        <Poppable
-          onEscape={this.handleClose}
-          onClickOutside={this.handleClose}
-          placement="bottom-end"
-          referenceElement={refElement}
-        >
-          {isOpen && (
-            <div className={styles.root}>
-              <div className={styles.functions}>
-                <Button onClick={allIsSelected ? this.handleSelectNone : this.handleSelectAll}>
-                  Select {allIsSelected ? 'none' : 'all'}
-                </Button>
-              </div>
-              <ul className={styles.list}>
-                {languages.map(lang => (
-                  <li className={styles.item} key={lang.id}>
-                    <Checkbox
-                      onChange={this.handleLangCheckboxChange}
-                      data-lang-id={lang.id}
-                      checked={selected.includes(lang.id)}
-                    >
-                      {lang.title}
-                    </Checkbox>
-                  </li>
-                ))}
-              </ul>
-            </div>
-          )}
-        </Poppable>
-      </Fragment>
-    )
-  }
-}

package/src/SelectLanguageProvider.js

@@ -1,28 +0,0 @@
-import React from 'react'
-import {selectedLanguages$, setLangs} from './datastore'
-import SelectLanguage from './SelectLanguage'
-import config from 'part:@sanity/language-filter/config'
-
-export default class SelectLanguageProvider extends React.Component {
-  state = {selected: []}
-
-  componentDidMount(props) {
-    this.subscription = selectedLanguages$.subscribe(selected => {
-      this.setState({selected: selected})
-    })
-  }
-  componentWillUnmount(props) {
-    this.subscription.unsubscribe()
-  }
-
-  render() {
-    const {selected} = this.state
-    return (
-      <SelectLanguage
-        languages={config.supportedLanguages}
-        selected={selected}
-        onChange={setLangs}
-      />
-    )
-  }
-}

package/src/datastore.js

@@ -1,42 +0,0 @@
-import {Subject} from 'rxjs'
-import {map, publishReplay, refCount, startWith, tap} from 'rxjs/operators'
-import config from 'part:@sanity/language-filter/config'
-import {intersection} from 'lodash'
-
-const onSelect$ = new Subject()
-
-export const setLangs = langs => onSelect$.next(langs)
-
-const persistOn = (key, defaultValue) => input$ => {
-  let persisted
-  try {
-    persisted = JSON.parse(window.localStorage.getItem(key))
-  } catch (err) {} // eslint-disable-line no-empty
-
-  return input$.pipe(
-    startWith(persisted || defaultValue),
-    tap(value => {
-      window.localStorage.setItem(key, JSON.stringify(value))
-    })
-  )
-}
-
-const SUPPORTED_LANG_IDS = config.supportedLanguages.map(lang => lang.id)
-
-export const selectedLanguages$ = onSelect$.pipe(
-  map(selectedLangs => intersection(selectedLangs, SUPPORTED_LANG_IDS)),
-  publishReplay(1),
-  refCount(),
-  persistOn('@sanity/plugin/language-filter/selected-languages', SUPPORTED_LANG_IDS)
-)
-
-const defaultFilterField = (enclosingType, field, selectedLanguages) =>
-  !enclosingType.name.startsWith('locale') || selectedLanguages.includes(field.name)
-
-const filterField = config.filterField || defaultFilterField
-
-export const filterFn$ = selectedLanguages$.pipe(
-  map(langs => {
-    return (enclosingType, field) => filterField(enclosingType, field, langs)
-  })
-)

package/src/filter-fields.js

@@ -1 +0,0 @@
-export {filterFn$ as default} from './datastore'

package/src/styles/SelectLanguage.css

@@ -1,50 +0,0 @@
-@import 'part:@sanity/base/theme/variables-style';
-
-.target {
-  display: flex;
-  align-items: center;
-  color: var(--text-color);
-  opacity: 1;
-  min-width: 4rem;
-  font-size: var(--font-size-xsmall);
-  white-space: nowrap;
-  height: 2.5rem;
-  align-self: center;
-  margin-right: 1em;
-}
-
-.arrow {
-  margin-left: 0.4em;
-}
-
-.root {
-  padding: 0.5em;
-  background-color: var(--component-bg);
-  color: var(--text-color);
-  composes: shadow-6dp from 'part:@sanity/base/theme/shadows-style';
-  user-select: none;
-  text-align: left;
-  overflow: auto;
-  overflow-x: hidden;
-}
-
-.list {
-  composes: resetList from 'part:@sanity/base/theme/layout/helpers';
-}
-
-.functions {
-  padding: 0.5em;
-  text-align: center;
-}
-
-.selectedNumFilter {
-  color: var(--state-danger-color);
-  font-weight: bold;
-}
-
-.item {
-  padding: 0.5em;
-  composes: resetListItem from 'part:@sanity/base/theme/layout/helpers';
-  composes: item from 'part:@sanity/base/theme/layout/selectable-style';
-  white-space: nowrap;
-}